insightful-ir-angular-lib v2.0.1

Insightful Ir Angular Library

This library was generated with Angular CLI version 9.1.13.

Installation

Install using the command:

npm install insightful-ir-angular-lib

Peer Dependencies

Insightful IR Angular library depends on ng2-charts version 2.3.3

Install ng2-charts using the command npm install ng2-charts@2.3.3 chart.js@2.7.3

Update instructions

Update using the command:

npm install insightful-ir-angular-lib@latest

Usage Instructions

In the main application module, import the library using: import { InsightfulIrAngularLibModule } from 'insightful-ir-angular-lib';

Then add InsightfulIrAngularLibModule to the imports of the main Module.

Example, app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { InsightfulIrAngularLibModule } from 'insightful-ir-angular-lib';

import { AppComponent } from './app.component';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    InsightfulIrAngularLibModule,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Components

This library contains two components for use: ir-main-panel and ir-side-panel.

ir-main-panel

This component takes the following inputs:

stockData

format:

{
  description: string;
  dividendYield: number;
  exchange: string;
  industry: string;
  logoUrl: string;
  marketCap: number;
  name: string;
  peRatio: number;
  sector: string;
  sharesOutstanding: number;
  symbol: string;
  ttmDividendRate: number;
  ttmEps: number;
  week52High: number;
  week52Low: number;
  [key: string]: any;
};

stockQuote

format:

{
  latestPrice: number;
  changePercent: number;
  marketCap: number;
  peRatio: number;
  week52High: number;
  week52Low: number;
  [key: string]: any;
};

historicalData

format:

{
  close: number;
  date: string; // format yyyy-mm-dd
  high: number;
  low: number;
  open: number;
  [key: string]: any;
} [];

financials

format:

{
  date: string; // format yyyy-mm-dd
  fiscalQuarter: number;
  fiscalYear: number;
  netIncome: number;
  revenue: number;
  [key: string]: any;
} [];

ir-side-panel

This component takes the following input:

newsArticles

format:

{
  timestamp?: number;
  headline: string;
  summary?: string;
  url: string;
  source: string;
  [key: string]: any;
} [];

Example:

app.component.ts

import { Component } from '@angular/core';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  stockData = {
    beta: 1.27138786605425,
    day50MovingAvg: 438.08,
    day200MovingAvg: 275.62,
    deltaPerShare: 6.76,
    deltaPercent: 0.0078194584,
    description: "Tesla, Inc. engages in the design, development, manufacture, and   sale of fully electric vehicles, energy generation and storage systems.",
    dividendYield: 0,
    exchange: "NASDAQ",
    float: 758180511,
    id: 119,
    industry: "Motor Vehicles",
    logoUrl: "https://storage.googleapis.com/iexcloud-hl37opg/api/logos/TSLA.png",
    marketCap: 555242489760,
    name: "Tesla, Inc.",
    peRatio: 1034.55,
    sector: "Consumer Durables",
    sharesOutstanding: 947901000,
    symbol: "TSLA",
    ttmDividendRate: 0,
    ttmEps: 0.5662,
    value: 925.9,
    week52High: 598.78,
    week52Low: 65.45,
  };

  quote = {
    change: 3.41,
    changePercent: 0.00374,
    close: 0,
    createdUtcTimestamp: "2022-08-18T15:43:51.8416306Z",
    high: 919.46,
    latestPrice: 915.4,
    latestUpdate: 1660837418872,
    latestVolume: 8560506,
    low: 0,
    marketCap: 956126159731,
    open: 0,
    peRatio: 110.02,
    stockId: 119,
    week52High: 1243.49,
    week52Low: 620.57,
    ytdChange: -0.1259842567043282,
  };

  historicalData = [
    {
        "date": "2019-08-20",
        "open": 45.524,
        "high": 45.818,
        "low": 44.908,
        "close": 45.172,
    },
    ...
  ];

  newsArticles = [
    {
      "timestamp": 1660985290000,
      "headline": "Tesla: High Growth, High Beta Stock You Need For A Rally (TSLA)",
      "summary": "Tesla''s strong fundamentals remain the core driver of long-term investment returns. See why TSLA is the stock you need ahead of an anticipated rally.",
      "url": "https://cloud.iexapis.com/v1/news/article/2QV0niDo4QviR3XLX880P32SEtoqWMuenBjWEE9gEbbU",
      "source": "Seeking Alpha"
    },
    ...
  ];

  financials = [
    {
      "date": "2021-09-30",
      "fiscalQuarter": 2,
      "fiscalYear": 2021,
      "netIncome": 1618000000,
      "revenue": 13757000000,
    },
    ...
  ];
}

app.component.html

<div class="main-panel">
  <ir-main-panel
    [stockData]="stockData"
    [stockQuote]="quote"
    [historicalData]="historicalData"
    [financials]="financials">
  </ir-main-panel>
</div>
<div class="side-panel">
  <ir-side-panel [newsArticles]="newsArticles"></ir-side-panel>
</div>