SessionStateChip
Stan jednej sesji agenta: uruchamianie, praca, czekanie na ciebie, gotowe, gotowość albo zakończenie. Wybierz go wszędzie, gdzie sesja jest wymieniona; zrób z niego przycisk, gdy aplikacja może wyjaśnić, jak wykryto stan.
- SessionStateChip
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: SessionStateChip
StartingWorkingWaiting for youDoneReadyExited
StartingWorkingWaiting for youDoneReadyExitedWaiting for you
Noc, podgląd: SessionStateChip
StartingWorkingWaiting for youDoneReadyExited
StartingWorkingWaiting for youDoneReadyExitedWaiting for you
Wysoki kontrast, podgląd: SessionStateChip
StartingWorkingWaiting for youDoneReadyExited
StartingWorkingWaiting for youDoneReadyExitedWaiting for you
UżycieLink do sekcji Użycie
import { SessionStateChip } from '@skribly/ui/agents'<SessionStateChip state="blocked" label={t('state.blocked')} />
<SessionStateChip state="done" label={t('state.done')} onPress={explain} actionLabel={t('state.why')} />Każda etykieta jest propem, więc aplikacja przekazuje własne słowa we własnym języku. Zobacz zasadę brak wbudowanego tekstu.
DostępnośćLink do sekcji Dostępność
- Słowo jest zawsze na stronie; hideLabel zachowuje je tylko dla czytników ekranu.
- Każdy stan ma też własny znak (pierścień, tarcza, romb, ptaszek, pusta tarcza, kwadrat), więc da się go odczytać bez koloru, a znak w trybie wymuszonych kolorów przyjmuje CanvasText.
- Pulsowanie zatrzymuje się przy ograniczonym ruchu. live robi z jednego chipa status typu polite, więc zmiana na „Waiting for you” jest odczytywana.
- Jako przycisk odczytuje stan, potem actionLabel, i pokazuje actionLabel jako dymek podpowiedzi.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.