open-index/open-npm huggingface dataset:
npm package: @interopio/components-react
Description: React components for the interop.io platform.
Author: interop.io
Latest version: 4.3.0

# @interopio/components-react

## Overview

The [`@interopio/components-react`](https://www.npmjs.com/package/@interopio/components-react) library provides React components and hooks for customizing the system apps of the io.Connect platforms (Channel Selector, dialogs, notifications, and more).

## Installation

To install the library, execute the following command:

```cmd
npm install @interopio/components-react
```

## Usage

Storybook is integrated into the project and the currently supported components are added to it. You can use it during development to test components and visualize states more easily.

To build Storybook:

```cmd
npm run build-storybook
```

To run Storybook:

```cmd
npm run storybook
```
npm package: @interopio/desktop-cli
Description: CLI tool for setting up, building and packaging io.Connect Desktop projects
Author: Interop.io
Latest version: 0.0.1-alpha.6
Deprecated: This package is no longer maintained. Please use @interopio/iocd-cli

# @interopio/desktop-cli

CLI tool for setting up, building and packaging io.Connect Desktop projects.

## Requirements

- Node.js ≥18.0.0
- npm ≥8.0.0
- Windows 10+ or macOS 10.15+

## Usage

### Create a new project
```bash
npx @interopio/desktop-cli create
```

![Create Project](docs/assets/create.png)

### Setting up the repository
```bash
cd <proj_name>
npm install
npm run setup 
```

### Start io.cd
```bash
npm run start
```

### Start template apps in development mode
```bash
npm run start-apps
```

### Pacakge an installer
```bash
npm run make-installer
```
npm package: @interopio/fdc3-web-bridge
Description: IO Connect implementation of the FDC3 For Web
Author: Interop.IO
Latest version: 1.3.0

# @interopio/fdc3-web-bridge

io.Connect implementation of the [FDC3 Web Connection Protocol](https://fdc3.finos.org/docs/api/specs/webConnectionProtocol) used internally by the **io.Connect Browser** platform. Enables FDC3 client apps that use the `@finos/fdc3` library to acquire a `DesktopAgent` instance via the `getAgent()` method.

> ⚠️ *Note that the recommended method for acquiring access to the FDC3 API in your FDC3 apps that are part of an **io.Connect Browser** project is to use the `@interopio/fdc3` library instead.*
npm package: @interopio/gateway-auth-api
Description: [![npm version](https://img.shields.io/npm/v/@interopio/gateway-auth-api.svg)](https://www.npmjs.com/package/@interopio/gateway-auth-api)
Author: interop.io
Latest version: 0.3.0-beta
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm package: @interopio/gateway-metrics-api
Description: [![npm version](https://img.shields.io/npm/v/@interopio/gateway-metrics-api.svg)](https://www.npmjs.com/package/@interopio/gateway-metrics-api)
Author: interop.io
Latest version: 0.2.0-beta
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm package: @interopio/groups-ui-react
Description: React library for building a Web Group App for io.Connect Desktop.
Author: interop.io
Latest version: 4.3.0

## Overview

The `@interopio/groups-ui-react` library enables you to create your own Web Group App for [**io.Connect Desktop**](https://interop.io//). It provides all necessary functionalities as a single React component - `<Group />`. The library allows complete customization of the io.Connect Window group elements and the elements of the different types of io.Connect Windows (flat, tab and HTML) participating in the group. The provided default components can be replaced or extended with your custom ones.

## Install

To use the library in your project, execute the following command:

```cmd
npm install @interopio/groups-ui-react
```

## Usage

The following example demonstrates a basic usage of the `<Group />` component:

```javascript
import React from 'react'
import Group from "@interopio/groups-ui-react";
import "@interopio/groups-ui-react/dist/styles/groups.css";

const App = () => {
  return <Group />
};

export default App;
```
npm package: @interopio/home-ui-react
Description: React components for building a Home App for io.Connect Browser.
Author: Interop.IO
Latest version: 4.3.0

# @interopio/home-ui-react

## Overview

The [`@interopio/home-ui-react`](https://www.npmjs.com/package/@interopio/home-ui-react) library offers React components and hooks for building a [Home App](https://docs.interop.io/browser/capabilities/home-app/overview/index.html) for your **io.Connect Browser** project.

## Installation

To install the library, execute the following command:

```cmd
npm install @interopio/home-ui-react
```

## Usage

The following example demonstrates initializing the `@interopio/home-ui-react` library with basic configuration.

> ℹ️ *For more details on using the `@interopio/home-ui-react` library, see the **io.Connect Browser** [official documentation](https://docs.interop.io/browser/capabilities/home-app/overview/index.html).*

```javascript
import { IOConnectHome } from "@interopio/home-ui-react";
import IOBrowserPlatform from "@interopio/browser-platform";
import IOWorkspaces from "@interopio/workspaces-api";
import IOModals from "@interopio/modals-api";
import "@interopio/workspaces-ui-react/dist/styles/workspaces.css";
import "@interopio/home-ui-react/index.css";

const getConfig = () => {
    // Platform configuration.
    const platformConfig = {
        browserPlatform: {
            factory: IOBrowserPlatform,
            config: {
                // Required license key.
                licenseKey: "my-license-key",
                // Workspaces App configuration.
                workspaces: {
                    src: "/",
                    isFrame: true
                },
                // Modal windows are required for the Launchpad.
                modals: {
                    sources: {
                        bundle: "https://my-modals/modals-bundle.js",
                        styles: ["https://my-modals/styles.css", "https://example.com/custom-styles.css"],
                        fonts: ["https://my-modals/fonts.css"]
                    }
                },
                browser: {
                    // Enabling the Workspaces and Modals APIs.
                    libraries: [IOWorkspaces, IOModals],
                    // Enabling the Main app to use modal windows.
                    modals: {
                        alerts: {
                            enabled: true
                        },
                        dialogs: {
                            enabled: true
                        }
                    }
                }
            }
        }
    };

    return platformConfig;
};

// Configuration for the `<IOConnectHome />` component.
const config = {
    // Retrieve the platform configuration.
    getIOConnectConfig: getConfig
};

export function App() {
    return <IOConnectHome config={config} />
};

export default App;
```