ToolLine

Jeden krok, który agent wykonał między wiadomościami, na przykład odczyt pliku albo uruchomienie polecenia. Dodaj detail, aby pozwolić otworzyć wyjście.

ToolLine

PodglądLink do sekcji Podgląd

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

Dzień, podgląd: ToolLine

Read src/content/Markdown.tsx

Runningnpm run build

SkippedLint, because no config was found

Exit code 1

Error: EACCES: permission denied, open '/etc/hosts'

Noc, podgląd: ToolLine

Read src/content/Markdown.tsx

Runningnpm run build

SkippedLint, because no config was found

Exit code 1

Error: EACCES: permission denied, open '/etc/hosts'

Wysoki kontrast, podgląd: ToolLine

Read src/content/Markdown.tsx

Runningnpm run build

SkippedLint, because no config was found

Exit code 1

Error: EACCES: permission denied, open '/etc/hosts'

UżycieLink do sekcji Użycie

tsx

import { ToolLine } from '@skribly/ui/conversation'

tsx

<ToolLine status={{ tone: 'danger', label: 'Failed' }} detail={<OutputBox label="Output" text={log} />}>
  Run npm test
</ToolLine>

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 statusu stoi przed krokiem, z ikoną i kolorową krawędzią, więc nigdy nie opiera się na samym kolorze.
Z detail linia jest przyciskiem rozwijania z aria-expanded, otwieranym klawiszem Enter lub Spacją.

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