Install
Instalacja albo logowanie do narzędzia jednym naciśnięciem: przycisk, postęp z ostatnią linią wyjścia i czasem oraz schowane polecenie. Wypróbuj drugi przycisk, aby zobaczyć niepowodzenie.
- InstallButton
- InstallDetails
- InstallProgress
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: Install
Noc, podgląd: Install
Wysoki kontrast, podgląd: Install
UżycieLink do sekcji Użycie
import { InstallButton, InstallDetails, InstallProgress } from '@skribly/ui/ops'<InstallButton isPending={running} pendingChildren={t('install.running')} pendingLabel={t('install.running')}
isInstalled={installed} installedLabel={t('install.done', { name })} onPress={install}>{t('install.do', { name })}</InstallButton>
<InstallProgress label={t('install.running')} state={state} line={lastLine} startedAt={started}
doneLabel={t('install.done', { name })} failedLabel={t('install.failed', { code })} />
<InstallDetails summary={t('common.details')} command={plan.command}
copy={{ label: t('common.copy'), copiedLabel: t('common.copied'), failedLabel: t('common.copyFailed') }} />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ść
- Przycisk zachowuje fokus w trakcie oczekiwania i o tym mówi; po zainstalowaniu zamienia się w znacznik i słowo.
- Pasek postępu ma nazwę, linia wyjścia i zegar nie są regionami na żywo, więc nigdy nie paplają, a wynik jest: sukces w trybie polite, niepowodzenie w trybie assertive, oba z ikoną i słowami, które zostają na ekranie.
- Przełącznik szczegółów mówi, czy jest otwarty, a polecenie zawija się w swoim polu.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.