open-index/open-npm huggingface dataset:
npm package: @frollo/frollo-web-sdk
Description: Frollo's SDK for the web
Latest version: 12.0.1

## Frollo Web SDK

![CircleCI](https://dl.circleci.com/status-badge/img/gh/frollous/frollo-web-sdk/tree/develop.svg?style=svg&circle-token=842b6c5344debd3509ed2f80ea1d823edcf70017) ![npm bundle size](https://img.shields.io/bundlephobia/minzip/@frollo/frollo-web-sdk) [![npm](https://img.shields.io/npm/v/@frollo/frollo-web-sdk)](https://www.npmjs.com/package/@frollo/frollo-web-sdk/v/latest)

A JavaScript and TypeScript SDK for [Frollo API](https://frollo.stoplight.io/docs/frollo-api/ZG9jOjI0NTc0MDEy-introduction)

#### Note
For compatability with the different Frollo Server versions please use the web-sdk versions below:
###### v10.x.x -> Frollo Server v2.30
###### v9.x.x -> Frollo Server v2.28
###### v7.x.x -> Frollo Server v2.23
###### v4.x.x -> Frollo Server v2.21
###### v3.x.x -> Frollo Server v2.20
###### v2.x.x -> Frollo Server v2.20
###### v1.x.x -> Frollo Server v2.19
###### v0.2.x -> Frollo Server v2.18
###### v0.1.5 -> Frollo Server v2.17

Management API is supported from **v3.x.x** onwards.

### Installation
```bash
npm i @frollo/frollo-web-sdk
```
or
```bash
yarn add @frollo/frollo-web-sdk
```
Note: For local development please refer to the [general development readme](https://github.com/frollous/frollo-web-sdk/blob/develop/development.md).

### Usage
Initialise the client by providing the api base url as a parameter.
```ts
import { FrolloSDK } from '@frollo/frollo-web-sdk'

FrolloSDK().init('api-base.url')
```

Once initialised and authorised (Cookie/Header), services will be available. Types can also be imported.
E.g.

```ts
import { userService, UserDetailsResponse, UserAccountPayload } from '@frollo/frollo-web-sdk'

const { getUserDetails, updateUserAccount } = userService();

const userDetails: UserDetailsResponse = (await getUserDetails()).data;

const userAccountPayload: UserAccountPayload = {...}
await updateUserAccount(userAccountPayload);
```

#### Interceptors

[Axios interceptors](https://axios-http.com/docs/interceptors) can be added by hooking onto the global `FrolloClient` after initialisation.
```ts
// Add a request interceptor
globalThis.FrolloClient.interceptors.request.use(
  (config: AxiosRequestConfig) => {
    // Do something before request is sent
    return config;
  },
  (error) => {
    // Do something with request error
    return Promise.reject(error);
  }
);

// Add a response interceptor
globalThis.FrolloClient.interceptors.response.use(
  (response: AxiosResponse) => {
    // Any status code that lie within the range of 2xx cause this function to trigger
    // Do something with response data
    return response;
  },
  (error: AxiosError) => {
    // Any status codes that falls outside the range of 2xx cause this function to trigger
    // Do something with response error
    return Promise.reject(error);
  }
);
```

If you need to remove an interceptor later you can.
```ts
const myInterceptor = globalThis.FrolloClient.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);
```
npm package: @frollo/frollo-web-ui
Description: Frollo's UI library for components, utilities and configs
Latest version: 9.0.8

## Frollo Web UI

![npm bundle size](https://img.shields.io/bundlephobia/minzip/@frollo/frollo-web-ui) [![npm](https://img.shields.io/npm/v/@frollo/frollo-web-ui)](https://www.npmjs.com/package/@frollo/frollo-web-ui/v/latest)

### Usage

#### Installation
```bash
npm i @frollo/frollo-web-ui
or
yarn add @frollo/frollo-web-ui
```

#### Import entire library globally
```ts
import { createApp } from 'vue'
import App from './App.vue'
import FrolloWebUI from '@frollo/frollo-web-ui';

const app = createApp(App)
app.use(FrolloWebUI)
app.mount('#app')
```

#### Import components from the esm folder to enable tree-shaking
```ts
import { FwCard } from '@frollo/frollo-web-ui/esm';
```

Note: For local development please refer to the [general development readme](https://github.com/frollous/frollo-web-ui/blob/develop/development.md).