corefinancialwidgets

Financial Solutions

Render different type of graphics or items

---

Installation

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	array[string]	"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 /ios/podfile file, add this line pod 'RNCharts', :path => '../node_modules/react-native-charts-wrapper'

• cd ios && pod install

• open .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.

---

Errors

If the installation of the modules are not correct you can find with some errors

• For the next error see the step 1