Corefinancialwidgets NPM

Financial Solutions

Render different type of graphics or items

WARNING: You need to have previously the node_modules folder before install the modules

( if you dont have the node_modules folder make a npm install)

Step 1. Installation of module

npm i corefinancialwidgets

Setep 2. Aditional (required)

npm i react-native-charts-wrapper

Usage

import * as React from 'react';
import {ParentComponent} from 'corefinancialwidgets';

export default function Widget1() {
  const rics = ['AMXL.MX', 'BIMBOA.MX', 'AAPL.MX', 'WALMEX.MX'];

  return (
    <ParentComponent
      type={'issuerParent'}
      rics={rics}
      onPress={item => {
        console.log(item.last);
        Alert.alert(
          'Event',
          `${
            item.last.commonName !== undefined
              ? `${item.last.commonName}`
              : item.last.cfname
          }`,
        );
      }}
      onBuy={item => {
        console.log(item.last);
        Alert.alert(
          'Buy event',
          `${
            item.last.commonName !== undefined
              ? `${item.last.commonName}`
              : item.last.cfname
          }`,
        );
      }}
      onSell={item => {
        console.log(item.last);
        Alert.alert(
          'SellEvent',
          `${
            item.last.commonName !== undefined
              ? `${item.last.commonName}`
              : item.last.cfname
          }`,
        );
      }}
      period={'intraday'}
    />
  );
}

Props

name	type	values	description	required
type	string	"minichart", "issuerParent", "watchlist	render the different graphics	Yes
rics	arraystring	"AMXL.MX", "BIMBOA.MX", "AAPL.MX" (example values)	rics in the array will use to render the components	Yes

Props Watchlist

name	type	values	description	required
onPress	Func event	Function Event	Event for redirect activity	No
onBuy	Func event	Function Event	anonymous function for Buy Button	No
onSell	Func event	Function Event	anonymous function for Sell Button	No
positions	Boolean	true or false	render titles in watchlist component	No
titles	int	number	Numbers of titles to render in watchlist	No
configuration	array object	{ symbol : 'ALFAA.MX', positions : true , titles : 1}	json object contains the configuration for every node	No

Examples

Issuer charts

Line chart

Candles chart

Watchlist

Watchlist Items

SETUP

iOS

( use cocoapods (suggested) )

Install the react-native-charts-wrapper

In <your_project>/ios/podfile file, add this line pod 'RNCharts', :path => '../node_modules/react-native-charts-wrapper'

cd ios && pod install

open <project_name>.xcworkspace

create a empty swift file, the xcode will prompt a message 'Would you like to configure an Objective-C bridging header?' to Create Bridging Header, accept it.