InputWithIcon
Pole tekstowe z ikoną na początku i opcjonalnym tekstem na końcu, takim jak jednostka albo domena. Ikona jest wskazówką, nigdy etykietą.
- InputWithIcon
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: InputWithIcon
.skribly.pl
Use letters, digits and dashes.
Noc, podgląd: InputWithIcon
.skribly.pl
Use letters, digits and dashes.
Wysoki kontrast, podgląd: InputWithIcon
.skribly.pl
Use letters, digits and dashes.
UżycieLink do sekcji Użycie
import { InputWithIcon } from '@skribly/ui/forms'<InputWithIcon label="Website" icon={<Globe />} placeholder="example.com" />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ść
- Ikona jest ukryta przed czytnikami ekranu, a tekst na końcu to zwykły tekst po polu, więc etykieta musi powiedzieć wszystko.
- Długie wartości przewijają się wewnątrz pola.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.