Collector Portal Framework

!GitHub Workflow Status
!GitHub Workflow Status
!npm

A collection of UI components and helper functions used in a couple of our internal and external web applications at Collector Bank.
Documentation and an interactive test area can be found here.

This package contains

* UI components
* Formatter functions
* HTTP module for doing API requests
* Brand colors and fonts

Technologies used

* React
* TypeScript
* ~~Glamorous~~ emotion

Install

``
$ npm install --save collector-portal-framework
`

How to use

`jsx
import React from 'react';
import ReactDOM from 'react-dom';
import { CollectorPortalFramework } from 'collector-portal-framework';
import { YourApp } from './App';

ReactDOM.render(


,
document.getElementById('root')
);
`

Available components

You can see a demo of the UI components here. If you want your own local copy you can clone this repo and do npm install followed by npm start` to start a local instance of Storybook.

$3

| Component | Source |
| ----------------------------------------------------------------- | ---------------------------------------------------------------- |
| Alert | Source |
| Amount selector | Source |
| Badge | Source |
| Button | Source |
| Button group | Source |
| Card | Source |
| Checkbox | Source |
| Checkbox group | Source |
| Date picker | Source |
| Date picker group | Source |
| Input | Source |
| Paginator | Source |
| Radio button | Source |
| Radio button group | Source |
| Select | Source |
| Slider | Source |
| Spinner | Source |
| Tags Input | Source |

$3

| Component | Source |
| --------- | -------------------------------------------- |
| H1 | Source |
| H2 | Source |
| H3 | Source |
| Text | Source |
| TextLink | Source |

$3

| Component | Source |
| ------------- | -------------------------------------------- |
| Togglable | Source |
| Fieldset | Source |
| Logo | Source |
| MainContainer | Source |
| MainMenu | Source |
| Modal | Source |
| PageHeader | Source |
| Tabs | Source |
| ValueList | Source |