Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mustafaer/angular-twitter-timeline
Angular Public Twitter Timeline Widget
https://github.com/mustafaer/angular-twitter-timeline
angular angular13 angular2 timeline twitter typescript widget
Last synced: about 2 months ago
JSON representation
Angular Public Twitter Timeline Widget
- Host: GitHub
- URL: https://github.com/mustafaer/angular-twitter-timeline
- Owner: mustafaer
- License: mit
- Created: 2022-06-03T15:45:35.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-05-02T16:55:44.000Z (8 months ago)
- Last Synced: 2024-09-19T15:48:03.462Z (4 months ago)
- Topics: angular, angular13, angular2, timeline, twitter, typescript, widget
- Language: TypeScript
- Homepage: https://angular-twitter-timeline.stackblitz.io/
- Size: 4.49 MB
- Stars: 3
- Watchers: 2
- Forks: 2
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-angular - angular-twitter-timeline - Angular Public Twitter Timeline Widget. (Table of contents / Third Party Components)
- fucking-awesome-angular - angular-twitter-timeline - Angular Public Twitter Timeline Widget. (Table of contents / Third Party Components)
README
# Angular Twitter Timeline
Embed Twitter Timeline in Angular application.
Supported version:
```
Angular 18
```
## Demo
[Demo](https://angular-twitter-timeline.stackblitz.io)
## Editor
[Editor](https://stackblitz.com/edit/angular-twitter-timeline?file=src/app/app.component.ts)
## Installation
To install this library, run:
```bash
$ npm i angular-twitter-timeline
```
## Usage
Import in your Angular app:
```typescript
// Import angular-twitter-timeline
import { AngularTwitterTimelineModule } from "angular-twitter-timeline";
@NgModule({
...
imports: [
...,
AngularTwitterTimelineModule
],
...
})
export class AppModule { }
```
Once the library is imported, you can use its component in your Angular application:
```xml
```
## Data
Data can take value of `url` or `profile`.
If `url` is set, you have to provide a valid Twitter URL;
If `profile` is set, you have to set `screenName` as a valid Twitter screen name. E.g. `@mustafaer_dev`.
`url` and `screenName` are mutually exclusive.
```ts
AngularTwitterTimelineDataInterface {
/**
* profile or URL
*/
sourceType: string;
/**
* Valid Twitter username
*/
screenName?: string;
/**
* Absolute URL of a Twitter profile, likes, list, or collection
*/
url: string;
}
```
## Options
```ts
AngularTwitterTimelineOptionsInterface {
/**
* Render a timeline statically, displaying only n number of Tweets.
*/
tweetLimit?: number;
/**
* Set a fixed height of the embedded widget
* Positive integer
*/
height?: number;
/**
* Adjust the color of borders inside the widget.
* Hexadecimal color
*/
borderColor?: string;
/**
* Sets the theme of the widget. Default = 'light'.
* 'light' or 'dark'
*/
theme?: string;
/**
* Toggle the display of design elements in the widget. This parameter is a space-separated list of values
* Values: noheader, nofooter, noborders, transparent, noscrollbar
*/
chrome?: string[];
/**
* Apply the specified aria-polite behavior to the rendered timeline.
* New Tweets may be added to the top of a timeline, affecting screen readers
* Values: polite, assertive, rude
*/
ariaPolite?: string[];
}
```