# Denserbot Embed

Javascript library to display denserbot on your website

## Run locally

### Install

```bash
pnpm install
```

### Develop

```bash
pnpm dev
```

### Build

```bash
pnpm build
```

## Embed in your HTML

Add the following code to your HTML file:

```html
<script type="module">
  import Chatbot from 'https://cdn.jsdelivr.net/npm/@denserai/embed-chat@1/dist/web.min.js';
  Chatbot.init({
    chatbotId: '<chatbotId>',
    initMessages: ['Hello', 'How can I help you?'],
  });
</script>
```

Replace `<chatbotId>` with your chatbot id.

## Options

### Here are the options you can pass to the `init` function:

- `chatbotId`: The chatbot id
- `apiHost`: The API host (default: `https://denser.ai`)
- `theme`: theme object
  - `theme.darkMode`: The dark mode (default: `false`)
  - `theme.button.size`: The button size `medium` or `large` (default: `medium`)
  - `theme.button.backgroundColor`: The button color (default: `white`)
  - `theme.button.color`: The button text color (default: `black`)
  - `theme.button.bottom`: The button bottom position (default: `20px`)
  - `theme.button.right`: The button right position (default: `20px`)
  - `theme.chatWindow.backgroundColor`: The chat window background color (default: `white`)
  - `theme.chatWindow.width`: The chat window width (default: `undefined`)
  - `theme.chatWindow.height`: The chat window height (default: `calc(100% - 100px)`)
- `initMessages`: The initial messages to display when the chatbot is opened (eg: `['Hello', 'How can I help you?']`)

### Example:

```html
<script type="module">
  import Chatbot from 'https://cdn.jsdelivr.net/npm/@denserai/embed-chat@1/dist/web.min.js';
  Chatbot.init({
    chatbotId: '<chatbotId>',
    theme: {
      button: {
        size: 'large',
        backgroundColor: 'black',
        color: 'white',
        bottom: '20px',
        right: '20px',
      },
      chatWindow: {
        backgroundColor: 'white',
        width: '400px',
        height: 'calc(100% - 100px)',
      },
    },
    initMessages: ['Hello', 'How can I help you?'],
  });
</script>
```

## How to Release

First, update the version:

```bash
npm version patch
```

Then, create a new tag and push it:

```bash
git tag v1.x.x
git push origin v1.x.x
```

Finally, create a new [release](https://github.com/denser-org/embed-chat/releases) on GitHub and the publish will be done automatically.

## How to purge the CDN

### Purge with API (make sure your have access to the API)

```bash
curl -X PURGE https://purge.jsdelivr.net/npm/@denserai/embed-chat@1/dist/web.min.js
```

### Purge with the web interface

Go to the following link and purge the file:

[https://www.jsdelivr.com/tools/purge](https://www.jsdelivr.com/tools/purge)