npm package: @interopio/fdc3
Description: IO Connect implementation of the FDC3 standard
Author: Interop.IO
Latest version: 2.9.0

# @interopio/fdc3

## Overview

The [`@interopio/fdc3`](https://www.npmjs.com/package/@interopio/fdc3) library is a JavaScript implementation of the [FDC3](https://fdc3.finos.org/docs/fdc3-intro) standard that is designed to be used by client apps running in **io.Connect Desktop** and **io.Connect Browser Platform**/**io.Connect Browser Client** projects.

## Installation

To install the library, execute the following command:

```cmd
npm install @interopio/fdc3
```

## Usage

The following examples demonstrate how to initialize the `@interopio/fdc3` library in **io.Connect Desktop** and **io.Connect Browser** projects.

> ℹ️ *For more details on the specifics of using the `@interopio/fdc3` library in your interop-enabled apps, see the **io.Connect Desktop** [official documentation](https://docs.interop.io/desktop/getting-started/fdc3-compliance/index.html) and the **io.Connect Browser** [official documentation](https://docs.interop.io/browser/getting-started/fdc3-compliance/index.html).*

> ℹ️ *For more details on the FDC3 standard and using the FDC3 API, see the [official FDC3 documentation](https://fdc3.finos.org/docs/fdc3-intro).*

### io.Connect Desktop

Initializing the `@interopio/fdc3` library in a client app of an **io.Connect Desktop** project:

```javascript
import IODesktop from "@interopio/desktop";
import "@interopio/fdc3";

const config = {
    // This is necessary in order to use the FDC3 User Channels.
    channels: true
};

const io = await IODesktop(config);
```

### io.Connect Browser

Initializing the `@interopio/fdc3` library of an **io.Connect Browser Platform** project:

```javascript
import IOBrowserPlatform from "@interopio/browser-platform";
import "@interopio/fdc3";

// Defining io.Connect Channels and mapping them to the FDC3 User Channels.
// You can define as many io.Connect Channels as you need and map them
// to the default FDC3 User Channels if you want to use them as such.
const channels = {
    definitions: [
        {
            name: "Red",
            meta: {
                color: "red",
                fdc3: {
                    id: "fdc3.channel.1",
                    displayMetadata: {
                      name: "Channel 1",
                      glyph: "1"
                    }
                }
            }
        }
    ]
};

const config = {
    licenseKey: "my-license-key",
    channels
};

const { io } = await IOBrowserPlatform(config);

// The FDC3 API will now be available as an `fdc3` object injected in the global `window` object.
const info = await fdc3.getInfo();

console.log(`FDC3 provider: ${info.provider}, FDC3 version: ${info.fdc3Version}`);
```

Initializing the `@interopio/fdc3` library in a Browser Client app of an **io.Connect Browser** project:

```javascript
import IOBrowser from "@interopio/browser";
import "@interopio/fdc3";

const io = await IOBrowser();

// The FDC3 API will now be available as an `fdc3` object injected in the global `window` object.
const info = await fdc3.getInfo();

console.log(`FDC3 provider: ${info.provider}, FDC3 version: ${info.fdc3Version}`);
```