# Widget API

**1. Відкриття віджету:**&#x20;

```
JediDesk("openWidget")
```

Використовуйте цю функцію, щоб відкривати вікно віджета в потрібний момент.

***

**2. Закриття віджету:**&#x20;

```
JediDesk("closeWidget") 
```

Використовуйте цю функцію, щоб закривати вікно віджета в потрібний момент.

***

**3. Передача даних користувача:**&#x20;

```
JediDesk("customerData", {
    name: "Max",
    phone: "+380990000000",
    email: "max@gmail.com",
    note: "VIP",
    language: "en",
    custom_fields: [{
            "id": 1,
            "value": "123"
        },
        {
            "id": 2,
            "value": "test"
        },
        {
            "id": 551,
            "value": "test321"
        }
    ]
})
```

Використовуйте цю функцію, щоб заповнювати та передавати дані про користувача віджету в потрібний момент.

***

**Дозволені поля для передачі:**

| **Параметр**   | **Тип**                | **Опис**                                                                                                                                                                                                                     |
| -------------- | ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| name           | string                 | Імʼя користувача                                                                                                                                                                                                             |
| phone          | string                 | Номер телефону користувача                                                                                                                                                                                                   |
| email          | string                 | Email користувача                                                                                                                                                                                                            |
| note           | string                 | Додатковий опис користувача, нотатки                                                                                                                                                                                         |
| language       | enum('uk', 'en', 'ru') | Мова користувача                                                                                                                                                                                                             |
| custom\_fields | array                  | <p>Поля, що налаштовуються. Масив об'єктів. <br><br>Параметри об'єктів: </p><p><strong>id</strong> - унікальний id поля (призначається при створення поля в адмін-панелі).</p><p><strong>value</strong> - значення поля.</p> |

**4.AI Page Context — передача даних сторінки для AI асистента**

````
Дані передаються через метод `JediDesk('pageContext', data)` або через поле `page_context` у виклику `JediDesk('customerData', data)`.

Варіант 1: окремий виклик `pageContext`

```js
JediDesk('pageContext', {
  product_name: 'iPhone 16 128GB',
  price: '29999',
  currency: 'UAH',
  category: 'Смартфони',
  availability: 'В наявності'
});
```
Варіант 2: разом із даними клієнта

js
JediDesk('customerData', {
  name: 'Іван',
  page_context: {
    product_name: 'iPhone 16 128GB',
    price: '29999',
    currency: 'UAH'
  }
});
````

Коли клієнт відкриває чат на сторінці конкретного товару або послуги, AI асистент може не знати, що саме переглядає клієнт. Це призводить до зайвих уточнюючих питань замість конкретної відповіді.

Передаючи дані сторінки через Widget API, ви дозволяєте AI одразу розуміти контекст звернення і відповідати точніше.

Повний приклад інтеграції

```html
<script>
  // 1. Ініціалізація JediDesk Widget
  !function(e,t){ /* embed code */ }(window, document);

  // 2. Функція збору даних поточної сторінки
  function getJediDeskPageContext() {
    return {
      product_name: document.querySelector('[data-product-name]')?.dataset.productName || '',
      price:        document.querySelector('[data-product-price]')?.dataset.productPrice || '',
      currency:     'UAH',
      category:     document.querySelector('[data-product-category]')?.dataset.productCategory || '',
      availability: document.querySelector('[data-product-available]')?.dataset.productAvailable || '',
      sku:          document.querySelector('[data-product-sku]')?.dataset.productSku || ''
    };
  }

  // 3. Передача при завантаженні
  JediDesk('pageContext', getJediDeskPageContext());
</script>
```

**5. Підписатись на подію віджета:**&#x20;

```
window.addEventListener("JediDeskFullyLoaded", (e) => {
    // Тут можна розмістити JS-код, який оброблює подію 
});
```

Використовуйте цю функцію, щоб отримувати сповіщення про різні події, які звʼязані із віджетом.

**Можливі події:**

<table data-header-hidden><thead><tr><th></th><th></th><th data-hidden></th><th data-hidden></th><th data-hidden></th><th data-hidden></th></tr></thead><tbody><tr><td><strong>Подія</strong></td><td><strong>Опис</strong></td><td><strong>Опис</strong></td><td><strong>Опис</strong></td><td><strong>Опис</strong></td><td></td></tr><tr><td>JediDeskFullyLoaded</td><td>Ініціалізація віджету повністю завершена</td><td>string</td><td>Імʼя користувача</td><td>Ініціалізація віджету повністю завершена</td><td></td></tr><tr><td>JediDeskOpenedWidget</td><td>Було відкрито віджет</td><td>string</td><td>Номер телефону користувача</td><td>Було відкрито віджет</td><td></td></tr><tr><td>JediDeskClosedWidget</td><td>Було закрито віджет</td><td></td><td></td><td>Було закрито віджет</td><td></td></tr><tr><td>JediDeskClientSendMessage</td><td>Користувач відправив повідомлення менеджеру.<br><br>Вміст параметра detail (e.detail):<br><strong>text</strong> <em>(string)</em> - текст повідомлення<br><strong>firstMessage</strong> <em>(boolean) -</em> чи є це повідомлення першим у діалозі</td><td>string</td><td>Email користувача</td><td>Було закрито віджет</td><td></td></tr><tr><td>JediDeskManagerSendMessage</td><td>Менеджер відправив повідомлення користувачу.<br><br>Вміст параметра detail (e.detail):<br><strong>text</strong> <em>(string)</em> - текст повідомлення<br><strong>hasAI</strong> <em>(boolean)</em> - текст згенеровано і відправлено автоматично за допомогою ШІ</td><td></td><td></td><td></td><td></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jedidesk.com/api-documentation/widget-api.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
