TerminalBar

Pasek pod panelem terminala z narzędziami, które wpisują do sesji, i liczbami o niej. Wybierz go dla każdej sesji agenta na żywo; wyłącz go, gdy agent czeka na odpowiedź.

TerminalBar

PodglądLink do sekcji Podgląd

Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.

Dzień, podgląd: TerminalBar

Noc, podgląd: TerminalBar

Wysoki kontrast, podgląd: TerminalBar

UżycieLink do sekcji Użycie

tsx

import { TerminalBar } from '@skribly/ui/agents'

tsx

<TerminalBar label={t('sessionTools')} isDisabled={blocked} disabledReason={t('answerFirst')} stats={<SessionClock label={t('time')} since={start} />}>
  <ToolbarButton label={t('attach')} icon={<Paperclip />} />
</TerminalBar>

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ść

Pasek narzędzi React Aria: jeden przystanek Tab, klawisze strzałek przesuwają między kontrolkami, a Tab go opuszcza.
Gdy ustawiono isDisabled, każdy przycisk jest wyłączony, a disabledReason mówi słowami obok nich dlaczego.
Liczby zawijają się do własnej linii w wąskim panelu.

Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.