diff --git a/README.md b/README.md
index b380503..cb7dcc9 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,7 @@ Social media share buttons for your next React.js, Next.js apps.
- Refind
- Skype
- Telegram
+ - Threads
- Trello
- Tumblr
- Twitter
@@ -512,6 +513,28 @@ import { TrelloShareBtn } from 'dv-social-share'
---
+## ThreadsShare
+
+#### 👨💻 Code
+
+
+```js copy
+import { ThreadsShareBtn } from 'dv-social-share'
+
+
+```
+
+#### 📖 ThreadsShareBtn Props
+
+| Props | Type | Default | Description | Required |
+| :----------- | :------ | :------ | :---------------------------------------------------------------------------------------------------------------------------- | :------- |
+| url | string | | The URL of the to be page. | ✅ |
+| title | string | | Description of the shared page. | ❌ |
+| openInNewTab | boolean | false | Open share window in a new tab if set to `true`. | ❌ |
+| imgConfig | object | | A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image | ❌ |
+
+---
+
## TumblrShare
#### 👨💻 Code
diff --git a/package-lock.json b/package-lock.json
index 819059f..22bbb7b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "dv-social-share",
- "version": "0.0.5",
+ "version": "0.1.88",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "dv-social-share",
- "version": "0.0.5",
+ "version": "0.1.88",
"license": "MIT",
"devDependencies": {
"@babel/core": "^7.23.0",
@@ -41,7 +41,7 @@
"npm": ">=6"
},
"peerDependencies": {
- "react": ">=17.0.2"
+ "react": ">=16.0.0"
}
},
"node_modules/@aashutoshrathi/word-wrap": {
diff --git a/package.json b/package.json
index ee1bfed..cac99ea 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "dv-social-share",
- "version": "0.0.6-1",
+ "version": "0.0.7",
"description": "Social media share buttons for your next apps like React, Next.js in TypeScript.",
"author": "Dhaval Vira (https://github.com/dhavalveera)",
"license": "MIT",
diff --git a/rollup.config.mjs b/rollup.config.mjs
index 7c7ad95..3571fd0 100644
--- a/rollup.config.mjs
+++ b/rollup.config.mjs
@@ -19,7 +19,7 @@ export default {
},
],
// external: builtins,
- external: ['react'],
+ external: ['react', 'react-dom'],
plugins: [
resolve(),
babel({
@@ -35,7 +35,7 @@ export default {
// }),
// nodeResolve(),
commonjs({
- extensions: ['.js', '.ts', '.tsx'],
+ extensions: ['.js', '.jsx', '.ts', '.tsx'],
}),
terser(),
],
diff --git a/src/Buttons/ThreadsShare/index.ts b/src/Buttons/ThreadsShare/index.ts
new file mode 100644
index 0000000..7179f1b
--- /dev/null
+++ b/src/Buttons/ThreadsShare/index.ts
@@ -0,0 +1,35 @@
+// UTILS
+import { generateQueryParams } from '../../utils'
+
+// Make Share Button => Contains Main Logic
+import MakeShareButton from '../../ShareButton'
+
+// Icon
+import { ThreadsShareIcon } from '../../Icons'
+
+// CONSTANTS
+import { defaultImgConfig, dontOpenShareDialogOnClick, THREADS_NAME } from '../../constants'
+
+type GenerateThreadsLinkType = { title?: string; separator?: string }
+
+type ThreadsShareBtnTypes = {
+ url: string
+ title?: string
+ separator?: string
+ openInNewTab?: boolean
+ imgConfig?: {
+ width?: number
+ height?: number
+ bgColor?: string
+ }
+}
+
+const generateThreadsLink = (url: string, { title, separator = ' :: ' }: GenerateThreadsLinkType) => {
+ return `https://www.threads.net/intent/post${generateQueryParams({ text: title ? title + separator + url : url })}`
+}
+
+const ThreadsShareBtn = ({ url, title, separator, openInNewTab, imgConfig }: ThreadsShareBtnTypes) => {
+ return MakeShareButton(THREADS_NAME, generateThreadsLink(url, { title, separator }), ThreadsShareIcon, openInNewTab || dontOpenShareDialogOnClick, imgConfig || defaultImgConfig)
+}
+
+export default ThreadsShareBtn
diff --git a/src/Buttons/WhatsAppShare/index.ts b/src/Buttons/WhatsAppShare/index.ts
index 82bd734..9285134 100644
--- a/src/Buttons/WhatsAppShare/index.ts
+++ b/src/Buttons/WhatsAppShare/index.ts
@@ -1,5 +1,5 @@
// Utils
-import { generateQueryParams, isMobileOrTablet } from '../../utils'
+import { generateQueryParams } from '../../utils'
// Make Share Button => Contains Main logic
import MakeShareButton from '../../ShareButton'
@@ -25,7 +25,7 @@ type WhatsAppShareBtnTypes = {
}
const generateWhatsAppLink = (url: string, { title, separator = ' :: ' }: GenerateWhatsAppLinkTypes) => {
- return `https://${isMobileOrTablet() ? 'api' : 'web'}.whatsapp.com/send${generateQueryParams({ text: title ? title + separator + url : url })}`
+ return `https://api.whatsapp.com/send${generateQueryParams({ text: title ? title + separator + url : url })}`
}
const WhatsAppShareBtn = ({ url, title, separator, openInNewTab, imgConfig }: WhatsAppShareBtnTypes) => {
diff --git a/src/Icons/ThreadsShareIcon/index.ts b/src/Icons/ThreadsShareIcon/index.ts
new file mode 100644
index 0000000..5193198
--- /dev/null
+++ b/src/Icons/ThreadsShareIcon/index.ts
@@ -0,0 +1,3 @@
+const ThreadsShareIcon: string = 'data:image/webp;base64,UklGRlYKAABXRUJQVlA4WAoAAAAIAAAA9QAA9QAAVlA4INQJAABwPACdASr2APYAPpVGlUYjIqEWmoQcNAlE9Ldwty8Ae3ivlTdA6+Mv8J2k/4Tzbrvwl/yH7tfw/MnvH4AXrz/R70DZX0CO7/o/TUMgDgKaAH6F9BLPb9P+wz5WfsO/c72eSYO3PdIM28zWsQO3FIRpc5+Lc1rEDtzo1oDj/7+OFhWi/txvjCIY7nJuZomren2OIEgzburg198wW3fQO29a/Jl4VQJi2HLXkuOqihDx45rWDVwPEVmlGsx7ypzZjIJI1BPEw8kRvm8NHlwG+FU1Np/MHv3En0FNgUD8ozL7+CwqYldbw0Jcsrcx//N+blD1AydOlJwlrWEVC5nKe7FeZPKQoODkBtGcN64D6P9YZIs4INPR1zRro66Ddv26jAKbdoS4OwuNi+jWt41Ny/uHaNzJOqeTdgpRoZtoS+xGwaflkLBh454NTaOEvADgeTWbltL5a9zxZyGL2JofpXMCa53yDOOtYj1IdBtn2ZUMmJDYZWWko++RMW4Rm6nIuHbuT5dCM8EmNGjsaeDUgNHhA7F14QOS5wBT+xRG0FbB5XY1EwDAquXd29iB25zJaTBj9wy4UP7f4yAYxK9kf1kO5ozGeuSeQBXMym/oONMTXc4O0y/1FrTaQYSHCAK5mtYgdue6QZt5mtYgaAAA/ugLJGieWitNn/LOpV+uICsCtdJLA1B1rm9VmMRrI2Ja8BvYK2U2DZ3447Y7C2W8wW3wWUPe2j+VsFKWc3OfuJ7ETDqlk+75BE/XRWazeQGXCnFuHqj7PggQuqjTmn32WhK451DKKDATDscO9304xrVElZCQUrmk5uAejqWx1OdM6k9QtDbX5q0llXsq90V88dkSgWFQVT91NOPBEe9rNPpJe1So5mSeYftDSygf1mU4SNsDe76zXZcZ/QCnCM0xvwAHrOadOjOmrAK/oAwLPJpxqYbVqNESXZln127aoLXbQfzWEVrknJ3NA9DwRunhbL8es7ENKLcsBc9wCa3omY8xafCLcjZKhtbAi6zC8GM/Zk820Wrkan+8Erql2CqZ9S151hDeqh+MFGXK2V5edy0A+2BUY1940DRFKEkDXR23C0JII39UR0mTT9UgJM1cipCv4P8VAqrlw3Bxt7cWbasOk4skp0ek9ZyT1Li9OYsDR1HFCIEQ4YjVS5Qw4+qgb1oKPQKZ0ggPM/KNyPoHWGpirUGNd9Gnx/7IMFfLl4+/DGnnZNlVgSf1//FvGtpaSznsLxAAtCuenNskqOHXgXogeOlRMQSMlk3smjuTW9eaAmDHweLn9IQ8AaNg4GUu2aq5mxti8owWs3O/9hLUX+S20DTtN4Sf66KvGogi3yI5Tsqs2Xz/LPzoEk5Sc9seO6ZKZzjorIYcbN8hum9hHvjHa/IHgYskhVoRz2G8Ii442KIo8ukDQrpXofdTBvtBxREvusU3JN/eTmGN7yBENUrHhWimofMq59TCCfWtlAbRfWUbSF+ondB0Gn8o/OYp5OrTkoySJXM7DSOc+KIqWV6hvq6Q0yDzlLzfBC1ClIwMXyLa/v6EgXEKhQnoqhB/SvRxbU2AgfvIv0wLsybiq8R4omibLTPu/inBuFVCPZoAgIRfriHdjl2a217xSuJes2rWl5bO/nM56R7xgvriY6iH3YBhP+jEBsxb01yrHlLMMmYWTQtI4a72tsNUaeiRj/eqR0z0yQdv+DMQCLkZsNCfoBl13GMVvSzOvFm5LfbH/dz6XiaT3b+BdFJlaba0PbjpGFJ+rNDuLGYqCTbvzY69vtEinHlyEgYpVecbBMJljwq9dWgGg1R/ucFy0+jxq4pZJukg35huB3AcnDfIaWuUR0MWPSpuvSJDZwnEXhNoRfsbPgE9PJMYCDE35mPgIo9RdraC25WwLsYgrpSf4PYtzODxDGm2MfrKjSri2rbZF5f2Etk8D/HfQ1KvMoJB+szZL30mQZgQkQ61U8E7ueRHeavqwzgAOIdk9TNTBDGGX4IGmim/TOK7WGKnz8zGKoGgjcqIgZtPa3aHj+OR8nROlcFRVdr3VyJcHxphN3OqRt0HxTGuNe+Ezc5Wt621qF6vBUFKAIag2ErXS+fpAbfNCkLxL4CjRmj82v5Q9uA/ctZFVv77bhqI35u/Lfd0REx1Hgdkcf/o/bduPKxnYDnSJX5zw65GZHKv8I52xl8ImUpxNETIG0xwRF5G3uGurnvRUQC8/2/e2llfmk3WSK0a8n4dTBwwXD1tytP+9ZSJD9F3SZ+j4wc5o9lRZhs0dw6xmBuyish1Efy1NxAKNpXZRyqDjuLhLbmbzOmNtWq28YNm2jBsaEh4P3uhZ40QJ/rGLd54SjjCCKDFiWNNglOuftmsUulBw9hq8iVn6y/ysUZSm95NDw3dknDvC0TloUTo8nmGITvAPQSs1Ge9jDvU86MItpZifsDxxOjXLj6cv2PP0ZYi4OVJL/nBIh6/oEiR1M9OqcS/Zdpjj+IbKRIic/ggtYX0Q7+eYJEzpHnyNWF/n7pLq8G5dKvD/iMRLP4Rr+FsNsT2OWF3Z4ecjdO84QaRI6FJVUZqj2u4GaOmYZ1Zd3LSL9L+LnpLNhyL99rRSBZqiSl3Bq3AkN1v16q+gWeapUbw1nWeon5i+ZgBBJvTstCt4UclSsUdtHP114GCTJ9HgrT7k/XRNFPFZr5xY9d6Gv2N1kNu3kfJOG7ACd416FkTn4KERVNYOJe5YlJ2EXrs3lr7ANMg2btQEKMes9AtzomrQ+lSOtAV5+S3IvbieaN+oLMOx+WsJNJ0gDhPXsRS/xS6YgH7kEXxy4q84xOzq9zT8ZkuH2SIGzUm/ZOhb5fmP1KccDjYdAT+zVr4yOyPyY9+Ah2vwpnvNRFeK7gjKeEBoQwKt3BvoJxRvwg9R3bpifpWe7hFzDypH20dW7wSVUJFfEunAljj41I5NkJLUo8fArThHvtgeZTa7VHERgGsMal0F9uecJiz3Ja3nTmg2b0Y7U58ACMFx437B0BVUjeQ6IzatuH/TX7t7vpOuGTRZZOeE2zVGN1ww5WBT0OryjZ7BDqqphc5IO6YegYWymAR3hGkK5zwssMLGE7fZVQcvms/PyaO011H/Q+ewxWKTDeuJrbQ3IJciKVy3QMt+Z7GblGPfpbTXga5Xeza4VnUe99PrnvcRTYY+0E7ttVo2hm4IrUTa+qdTC4dsUULKkF7WiMjNVEsP4G2M6fvpknbqx9yjz+krK6rd4n35dX9e809v5iiCn1rmiYYoIe1byGPGdMxsJl1YMeIl4kXvRHB17YqXc8Pn1WkLzg5VQCJnxsP8N1nOrEtx77cteesutdlZULidFv9iG8Kxg40izQaImirA9UmniLl426HoAAAAEVYSUZbAAAASUkqAAgAAAABAGmHBAABAAAAGgAAAAAAAAABAIaSBwAyAAAALAAAAAAAAABBU0NJSQAAADEuODIuMC0yU1JOU0NaM1BLSjVGWUIzMkVPQ09LWDRYSS4wLjItMAA='
+
+export default ThreadsShareIcon
\ No newline at end of file
diff --git a/src/Icons/index.ts b/src/Icons/index.ts
index 46a82a4..f369c9a 100644
--- a/src/Icons/index.ts
+++ b/src/Icons/index.ts
@@ -17,6 +17,7 @@ export { default as RedditShareIcon } from './RedditShareIcon'
export { default as RefindShareIcon } from './RefindShareIcon'
export { default as SkypeShareIcon } from './SkypeShare'
export { default as TelegramShareIcon } from './TelegramShareIcon'
+export { default as ThreadsShareIcon } from './ThreadsShareIcon'
export { default as TrelloShareIcon } from './TrelloShareIcon'
export { default as TumblrShareIcon } from './TumblrShareIcon'
export { default as TwitterShareIcon } from './TwitterShareIcon'
diff --git a/src/ShareButton/index.ts b/src/ShareButton/index.ts
index 6864d18..074d404 100644
--- a/src/ShareButton/index.ts
+++ b/src/ShareButton/index.ts
@@ -21,8 +21,6 @@ const MakeShareButton = (name: string, url: string, Icon: string, openShareDialo
CustomWindow(url, windowConfig, openShareDialogOnClick)
}
- console.log({ name, url, Icon, imgConfig })
-
return createElement(
'button',
{ type: 'button', 'aria-label': `${name}-Share`, title: name, onClick: handleOnClick, className: ShareBtnCss },
diff --git a/src/constants/ButtonNames/index.ts b/src/constants/ButtonNames/index.ts
index c523629..0e93857 100644
--- a/src/constants/ButtonNames/index.ts
+++ b/src/constants/ButtonNames/index.ts
@@ -17,6 +17,7 @@ export const REDDIT_NAME: string = 'Reddit'
export const REFIND_NAME: string = 'Refind'
export const SKYPE_NAME: string = 'Skype'
export const TELEGRAM_NAME: string = 'Telegram'
+export const THREADS_NAME:string = 'Threads'
export const TRELLO_NAME: string = 'Trello'
export const TUMBLR_NAME: string = 'Tumblr'
export const TWITTER_NAME: string = 'Twitter'
diff --git a/src/index.ts b/src/index.ts
index f839278..08d92ef 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -17,6 +17,7 @@ export { default as RedditShareBtn } from './Buttons/RedditShare'
export { default as RefindShareBtn } from './Buttons/RefindShare'
export { default as SkypeShareBtn } from './Buttons/SkypeShare'
export { default as TelegramShareBtn } from './Buttons/TelegramShare'
+export { default as ThreadsShareBtn } from './Buttons/ThreadsShare'
export { default as TrelloShareBtn } from './Buttons/TrelloShare'
export { default as TumblrShareBtn } from './Buttons/TumblrShare'
export { default as TwitterShareBtn } from './Buttons/TwitterShare'