# Pomoc kontekstowa

Większość komponentów w Eximee Designer ma możliwość zdefiniowania pomocy kontekstowej. Wyjątkami są komponenty **Generator kodów QR** oraz **Strona**.

<figure><img src="/files/JnO1727H8iR1yy9qGu5k" alt=""><figcaption><p align="center"><em><strong>Ilustracja 1.</strong> Wygląd właściwości pozwalającej uzyskać dostęp do edytora pomocy kontekstowej</em></p></figcaption></figure>

Po wejściu do edytora pomocy kontekstowej wysuwana jest szuflada. Gdy komponent nie ma dodanej żadnej pomocy kontekstowej zawartość szuflady wygląda jak na ilustracji poniżej.

<figure><img src="/files/zkekxSCONFDkneSJ0ag1" alt=""><figcaption><p align="center"><em><strong>Ilustracja 2.</strong> Wygląd szuflady edytora bez dodanych pomocy kontekstowych</em></p></figcaption></figure>

Kliknięcie w znajdujący się u dołu szuflady przycisk **Dodaj pomoc kontekstową** powoduje dodanie elementu do szuflady. Reprezentuje on nową pomoc kontekstową.

<figure><img src="/files/duDw9uc6jdAsoGGciL6Q" alt=""><figcaption><p align="center"><em><strong>Ilustracja 3.</strong> Wygląd nowo dodanej i nieskonfigurowanej pomocy kontekstowej</em><br></p></figcaption></figure>

Podstawowymi właściwościami podlegającymi edycji jest nazwa klucza pomocy kontekstowej oraz warunek jej wyświetlania.

Przed dodaniem klucza z treścią pomocy kontekstowej, należy klucz i jego treść dodać w zakładce **Tłumaczenia**. Edycja przeprowadzana jest poprzez kliknięcie w polu **Podaj nazwę klucza**.

W polu **Dodaj warunek** można zdefiniować dynamiczną pomoc kontekstową z treścią zależną od warunków:

* wartości zmiennych sesyjnych,
* wartości innych komponentów.

Jeśli zdefiniowanych jest kilka pomocy kontekstowych, wyświetlona zostanie jedynie pierwsza pomoc kontekstowa, której warunek jest spełniony. W celu zmiany kolejności treści pomocy można posłużyć się funkcjonalnością drag & drop.

<figure><img src="/files/xszUvu0Zg6NclAkvnQZa" alt=""><figcaption><p align="center"><em><strong>Ilustracja 4.</strong> Przykład zdefiniowanych dwóch różnych pomocy kontekstowych wyświetlanych warunkowo</em></p></figcaption></figure>

Kliknięcie w **Pokaż szczegóły** rozszerza kafel i pozwala uzyskać dostęp do dodatkowych opcji, widocznych na ilustracji poniżej:

<figure><img src="/files/fTjahXFxCuph8BtrUn9i" alt=""><figcaption><p align="center"><em><strong>Ilustracja 5.</strong> Wygląd rozszerzonego okna edycji pomocy kontekstowej</em></p></figcaption></figure>

W widoku szczegółowym istnieje możliwość zdefiniowania następujących właściwości:

* **Nazwa stylu** - nazwa stylu do zaaplikowania na pomoc kontekstową,
* **Ikona pomocy** - ustalenie, czy powinna być wyświetlana ikona pomocy kontekstowej,
* **Widoczna na focus pola** - ustalenie, czy pomoc kontekstowa powinna być wyświetlana podczas zaznaczania,
* **Interaktywna pomoc kontekstowa** - ustalenie, czy będzie można wchodzić w interakcję z treścią pomocy kontekstowej,
* **Szerokość/Wysokość** dymka pomocy kontekstowej,
* **Pozycja** pomocy kontekstowej względem komponentu, którego dotyczy.

W szufladzie edytora pomocy kontekstowej można zdefiniować wiele tooltipów. Wówczas są one rozpatrywane w kolejności od góry do dołu. Każdy kafel pomocy kontekstowej posiada po lewej stronie uchwyt, który pozwala go chwycić, a następnie przesunąć na żądaną pozycję. W taki sposób można uszeregować całą listę i zmieniać kolejność elementów.

**Widoczność pomocy kontekstowej**

W widoku szczegółowym należy określić jeden z dwóch sposobów prezentacji pomocy kontekstowej:

* Ikona pomocy,
* Widoczna na focus pola.

Widoczność pomocy kontekstowej sterowana jest również opcjonalnym warunkiem.

<figure><img src="/files/qnB4pCZfRb5PkeWIi9uC" alt=""><figcaption><p align="center"><em><strong>Ilustracja 6.</strong> Przykładowy wygląd tooltipa na wniosku</em></p></figcaption></figure>

<figure><img src="/files/g9Too0nXjUng4Lcfgi8v" alt=""><figcaption><p align="center"><em><strong>Ilustracja 7.</strong> Przykładowy wygląd tooltipa na wniosku</em></p></figcaption></figure>

{% hint style="info" %}
Wniosek demo: demoTooltipy
{% endhint %}

{% hint style="info" %}
♿WCAG: [Dobre praktyki WCAG dla low-code dev](/budowanie-aplikacji/proces-biznesowy/tworzenie-procesu-biznesowego-w-bpmn-2.0/dobre-praktyki.md)
{% endhint %}


---

# 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.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/pomoc-kontekstowa.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.