@omnity/widget/README.md

The Omnity Widget is a simple way to embed Omnity into your website. It is a simple JavaScript file that you can include in your website to display Omnity content.

## Omnity Widget

The Omnity Widget is a simple way to embed Omnity into your website. It is a simple JavaScript file that you can include in your website to display Omnity content.

### Usage

To use the Omnity Widget, you need to include the following script tag in your website:

```
npm install @omnity/widget
```

Then, you can use the following code to display Omnity content:

```tsx
import { OmnityWidget, ChainID } from "@omnity/widget";

export default function MyComponent() {
  return (
    <OmnityWidget
      sourceChain={ChainID.Bitcoin}
      targetChain={ChainID.ICP}
      tokenIds={["Bitcoin-runes-PURPLE•MONKE•DISHWASHER"]}
      reversible
    />
  );
}
```

### Configuration

The Omnity Widget accepts the following props:

| Props       | Description                              | Type                              |
| ----------- | ---------------------------------------- | --------------------------------- |
| SourceChain | Source chain                             | `ChainID`, optional               |
| targetChain | Target chain                             | `ChainID`, optional               |
| tokenIds    | token ids to bridge                      | `string[]`, optional              |
| reversible  | bridge from target chain to source chain | `bool`, default `false`           |
| colorMode   | interface color mode                     | `system`, `light` or `dark`       |
| width       | widget width                             | `number`, optional, default `464` |

```ts
enum ChainID {
  ICP = "eICP",
  Bitcoin = "Bitcoin",
}
```