Spesifikasi untuk komponen UI fungsional
https://standard-pomponents.com
Pustaka komponen UI datang dalam segala bentuk dan ukuran. Spesifikasi ini dimaksudkan sebagai cara untuk membakukan konvensi penamaan dan alat peraga API untuk membuat ekosistem komponen UI yang dapat dipertukarkan dan mendorong penggunaan kembali kode yang lebih besar.
Untuk membuat perpustakaan komponen UI yang dapat dipertukarkan, konvensi penamaan berikut harus digunakan. Daftar ini sengaja terbatas dan dimaksudkan untuk menjadi titik awal untuk demonstrasi. Lebih banyak komponen kemungkinan akan ditambahkan dari waktu ke waktu.
Komponen kotak adalah komponen tata letak model kotak primitif yang menangani margin, bantalan, lebar, dan gaya tata letak lainnya.
Komponen Flex adalah ekstensi komponen kotak dengan properti spesifik flexbox.
Komponen teks adalah komponen tipografi primitif yang menangani ukuran font, berat, setinggi garis, penyelarasan, dan gaya tipografi lainnya.
Komponen heading adalah ekstensi komponen teks yang dimaksudkan untuk judul.
Komponen gambar adalah komponen konten yang menampilkan gambar.
Latar Belakang adalah ekstensi komponen kotak dengan alat peraga untuk menampilkan gambar latar belakang.
Komponen tombol adalah komponen interaktif dengan gaya yang terlihat seperti tombol.
Komponen tautan adalah komponen interaktif yang dimaksudkan untuk navigasi.
Alat peraga gaya adalah abstraksi tingkat yang lebih tinggi di atas CSS yang dimaksudkan untuk fleksibilitas dan untuk membantu mengatasi masalah penataan gaya per instansi. Alat peraga gaya sebagian besar didasarkan pada properti CSS, dengan alat peraga steno untuk margin dan padding.
Beberapa komponen, seperti tombol, menggunakan varian gaya untuk membuat versi yang berbeda, seperti gaya tombol primary dan secondary . Varian harus ditangani dengan prop variant , dengan alat boolean steno untuk varian primary dan secondary .
Lihat alat peraga untuk lebih.
Tema adalah objek yang menentukan nilai -nilai yang digunakan oleh alat peraga gaya. Tema memastikan margin yang konsisten, bantalan, warna, ukuran font, dan konstanta UI lainnya.
Lihat tema untuk lebih.
Dengan mematuhi struktur jenis komponen yang ketat, komponen dalam suatu sistem dapat mementingkan tujuan tunggal dan memungkinkan pertukaran yang lebih besar di seluruh perpustakaan.
Komponen tata letak Kontrol lebar, tinggi, dan jarak. Mereka tidak berusaha mengendalikan tipografi atau pertimbangan lainnya.
Komponen tipografi berkaitan dengan keluarga font, ukuran, bobot, memimpin, pelacakan, dan properti lainnya. Komponen tipografi tidak peduli dengan tata letak.
Komponen konten menampilkan hal -hal seperti gambar, video, dan diagram tanpa mempengaruhi tata letak, tipografi, atau masalah gaya lainnya.
Elemen interaktif, seperti tautan, tombol, dan elemen formulir, memerlukan input pengguna dan umumnya tidak menangani tata letak atau masalah tipografi.
Komponen gaya menangani gaya UI lainnya, seperti perbatasan, jari -jari, bayangan, dan gradien tanpa mempengaruhi tata letak atau tipografi.
Komponen posisi menghilangkan anak -anak mereka dari aliran dokumen normal dan harus digunakan dengan hemat.
Dibuat oleh Kompositor | GitHub | Lisensi MIT