PresetFields

Pola jednego presetu obrazu: nazwa, rozmiar, dopasowanie, format, jakość, limit wagi i reguły. Użyj ich w formularzu, który tworzy albo edytuje preset.

PresetFields

PodglądLink do sekcji Podgląd

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

Dzień, podgląd: PresetFields

Noc, podgląd: PresetFields

Wysoki kontrast, podgląd: PresetFields

UżycieLink do sekcji Użycie

tsx

import { PresetFields } from '@skribly/ui/media'

tsx

<PresetFields value={preset} onChange={setPreset} labels={labels}
  fitOptions={fits} formatOptions={formats}
  errors={{ name: 'Give the preset a name.' }}
  notes={{ keepTransparency: { tone: 'warn', message: 'JPEG has no transparency.' } }} />

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

Każde pole ma widoczną etykietę, a opcjonalne mówią o tym słowami.
Pola liczbowe zmieniają wartość klawiszami strzałek i odczytują ją w ustawieniach regionalnych czytelnika; jednostki są pokazane i nazwane w etykietach.
Błędy są powiązane przez aria-describedby i ustawiają aria-invalid; uwagi, które nie blokują, takie jak ostrzeżenie o JPEG, mają znak i słowa.
Siatka przechodzi z jednej kolumny na telefonie do czterech na szerokim ekranie.

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