Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-twitter-widgets

Package Overview
Dependencies
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-twitter-widgets - npm Package Compare versions

Comparing version 1.7.1 to 1.8.0

es/index.js

74

package.json
{
"name": "react-twitter-widgets",
"version": "1.7.1",
"version": "1.8.0",
"description": "Twitter widgets as React components",
"main": "dist/index.js",
"author": "Andrew Suzuki",
"license": "MIT",
"bugs": {
"url": "https://github.com/andrewsuzuki/react-twitter-widgets/issues"
},
"homepage": "https://github.com/andrewsuzuki/react-twitter-widgets",
"main": "lib/index.js",
"module": "es/index.js",
"types": "src/index.d.ts",
"files": [
"css",
"es",
"lib",
"umd"
],
"dependencies": {
"loadjs": "^4.2.0",
"lodash.clonedeep": "^4.5.0",
"lodash.isequal": "^4.5.0"
},
"devDependencies": {
"nwb": "0.25.x",
"react": "^16.13.1",
"react-dom": "^16.13.1"
},
"peerDependencies": {
"react": "^16.8.0"
},
"scripts": {
"clean": "rimraf dist",
"build": "npm run clean && babel src --out-dir dist",
"build": "nwb build-react-component",
"clean": "nwb clean-module && nwb clean-demo",
"prepublishOnly": "npm run build",
"test": "echo \"Error: no test specified\" && exit 1",
"lint": "eslint src"
"start": "nwb serve-react-demo",
"test": "nwb test-react",
"test:coverage": "nwb test-react --coverage",
"test:watch": "nwb test-react --server"
},

@@ -33,35 +61,3 @@ "repository": {

"mention"
],
"author": "Andrew Suzuki",
"license": "MIT",
"bugs": {
"url": "https://github.com/andrewsuzuki/react-twitter-widgets/issues"
},
"homepage": "https://github.com/andrewsuzuki/react-twitter-widgets#readme",
"devDependencies": {
"babel-cli": "^6.24.1",
"babel-core": "^6.24.1",
"babel-eslint": "^7.0.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-react": "^6.16.0",
"babel-preset-stage-0": "^6.16.0",
"eslint": "^3.19.0",
"eslint-config-airbnb": "^14.1.0",
"eslint-plugin-babel": "^4.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^4.0.0",
"eslint-plugin-react": "^6.10.3",
"react": "^15.3.0",
"rimraf": "^2.5.2",
"@types/react": "^16.0.5"
},
"dependencies": {
"exenv": "^1.2.1",
"lodash": "^4.17.4",
"prop-types": "^15.3.0",
"scriptjs": "^2.5.8"
},
"peerDependencies": {
"react": "^15.3.0 || ^16.0.0"
}
]
}
# react-twitter-widgets
Alleviates the need for Twitter's default 2008-style widget snippets.
Quick and easy Twitter widgets for React.

@@ -17,41 +17,54 @@ Available widgets: `Timeline`, `Share`, `Follow`, `Hashtag`, `Mention`, `Tweet`.

[Click here](./site/screenshot.png) for a preview of all available widgets with example code.
```javascript
import { Timeline } from 'react-twitter-widgets'
// var Timeline = require('react-twitter-widgets').Timeline
ReactDOM.render((
<Timeline
dataSource={{
sourceType: 'profile',
screenName: 'twitterdev'
}}
options={{
username: 'TwitterDev',
height: '400'
}}
onLoad={() => console.log('Timeline is loaded!')}
/>
), document.getElementById('root'))
// Timeline (with options)
<Timeline
dataSource={{
sourceType: 'profile',
screenName: 'TwitterDev'
}}
options={{
height: '400'
}}
// Optional
// onLoad={() => console.log('Timeline is loaded!')}
/>
// Tweet (without options)
<Tweet tweetId="841418541026877441" />
```
# Usage
## Usage
[**Official Twitter Documentation**](https://developer.twitter.com/en/docs/twitter-for-websites/javascript-api/guides/scripting-factory-functions)
Available widgets: `Timeline`, `Share`, `Follow`, `Hashtag`, `Mention`, `Tweet`
All widgets take an optional options object prop. To learn more about the available options (height, width, align, count, etc), see [this link](https://dev.twitter.com/web/javascript/creating-widgets).
**`Timeline`** requires a `dataSource` object prop.
The source type can be `profile`, `likes`, `list`, `collection`, or `url`.
They each require their own co-fields; see Twitter documentation.
`Timeline` requires a `dataSource` object prop, see [here](https://dev.twitter.com/web/javascript/creating-widgets#timelines) for info. The source type can be profile, likes, list, collection, URL, or legacy widget configuration.
**`Share`** requires a `url` prop.
`Share` requires a `url` prop.
**`Follow`** and **`Mention`** require a `username` prop. NOTE that the Twitter
documentation now refers to this as *screenName*.
`Follow` and `Mention` require a `username` prop.
**`Hashtag`** requires a `hashtag` prop.
`Hashtag` requires a `hashtag` prop.
**`Tweet`** requires a `tweetId` prop. Ex. `'511181794914627584'`
`Tweet` requires a `tweetId` prop. Ex. `'511181794914627584'`
All widgets accept an optional `options` object prop. To learn more about the
available options (height, width, align, count, etc), see the Twitter
documentation.
All widgets accept an optional `onLoad` callback, which is called every time the widget is loaded/reloaded (both on inital load and updates).
All widgets accept an optional `onLoad` callback, which is called every time
the widget is loaded/reloaded (both on inital load and updates).
## Further Information
* This library loads the remote *Twitter for Websites* script.
* Twitter widgets are only loaded in the browser. A blank div will be rendered during SSR.
* Unfortunately, widget errors cannot be handled by this library. Twitter catches and logs any errors before they can bubble up. Therefore, if the remote library can't be loaded or if a supplied screen name does not exist, the widget will render as a blank div.
## Contributing

@@ -58,0 +71,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc