UNPKG

@finapi/embeddable-web-form

Version:

A Javascript library for integrating the finAPI Embeddable Web Form

72 lines (57 loc) 2.33 kB
# General Information You can integrate the embeddable web-form by using our npm package. The package contains two entry points - the Javascript file, and the Typescript file. Which entry point to take is up to you - if your application supports the Typescript language then feel free to use the **finapi-embeddable-web-form.component.ts** file. If your application doesn't support the Typescript language - please use the **finapi-embeddable-web-form.js** file to import the library. In order to use the latest version of our package, please set the version value as **'latest'** in your main package.json file. # Integration Example - Please consider the following as an example of such integration between the embeddable web-form and an Angular app: ``` import {Component, OnInit} from '@angular/core'; import {WebFormBuilder} from "@finapi/embeddable-web-form/finapi-embeddable-web-form"; @Component({ selector: 'app-webform', templateUrl: '../../../node_modules/@finapi/embeddable-web-form/finapi-embeddable-web-form.component.html', }) export class WebformComponent implements OnInit { private webFormToken: string; constructor() { this.webFormToken = 'web-form-token was here'; } ngOnInit(): void { console.log('WebForm library has been imported'); var webFormComponents = new WebFormBuilder(this.webFormToken, 'http://kraken:8085') .withCallbackUrl('http://127.0.0.1/dummy') .withOwnerDocument(document) .build(); webFormComponents.startWebFormComponents(); } } ``` - Another example of integration between the embeddable web-form and a ReactJS application: ``` import React from 'react'; import {WebFormBuilder} from '@finapi/embeddable-web-form/finapi-embeddable-web-form' const serverUrl = 'http://kraken:8085'; const webFormToken = 'whatever'; function getWebForm() { let embeddableWebForm = new WebFormBuilder(webFormToken, serverUrl) .withOwnerDocument(document) .build(); embeddableWebForm.startWebFormComponents(); } const App = () => { return ( <div> <button onClick={() => getWebForm()}>Render finAPI Web Form</button> <web-form-element></web-form-element> </div> ); }; export default App; ```