pantoken / components

components ​

Beta

@pantoken/components — sebuah pustaka komponen CSS bergaya InstUI, dibina daripada token --instui-*.

Fail helaian gaya yang dihantar:

  • Asas (baseCss) — lalai dokumen global pilihan daripada token (box-sizing, tetapan semula badan, permukaan halaman, warna/jenis huruf teks asas, color-scheme). Ia juga membawa cincin fokus-outline, jadi setiap elemen boleh-fokus mendapat garis panduan :focus-visible yang boleh diakses terus. Muatkan ia apabila pantoken memiliki halaman.
  • Prosa (proseCss) — gaya untuk HTML markdown/prosa yang dirender (jadual, pengepala, pautan, senarai, kod) yang dihadkan kepada akar kandungan, supaya halaman dokumentasi atau kawasan kandungan kelihatan seperti InstUI tanpa menukar DOM kepada komponen. Inilah yang dipakejkan oleh renderer tapak sebagai components.css mereka.
  • Komponen (buttonCss, alertCss, badgeCss, diagregasi oleh componentsCss) — gaya komponen berasaskan kelas yang anda pakai pada tanda anda sendiri (<button class="instui-button">), untuk rupa InstUI di luar rangka kerja komponen. Skala bayang --instui-elevation-* (elevationCss) memimpin helaian ini, kerana cukup banyak komponen terapung sehingga bayang menjadi atribut reka bentuk intrinsik dan bukan tambahan.
  • Utiliti (viewCss, spacingUtilitiesCss, gapCss, layoutUtilitiesCss, serta satu set token/warna semantik terpilih) — lapisan pilihan kelas silang. Penjana token→kelas generik (colorUtilitiesCss, tokenUtilitiesCss) tinggal di @pantoken/utils; pakej ini memberi mereka nama semantik yang terpilih, manakala @pantoken/plugin-primitives membekalkan palet mentah.
  • Fon (pilihan fonts.css) — peraturan @font-face untuk fon jenama Instructure. Asas menggunakan fon; fonts.css memuatkan woff2, jadi teks merosot dengan anggun tanpa fon itu.

Semua adalah CSS tulen yang diturunkan daripada token IR, jadi ia menjejak InstUI melalui token tanpa bergantung pada pakej React InstUI. Untuk komponen interaktif sebenar, gunakan @pantoken/react-markdown (kandungan) atau @instructure/ui-* (aplikasi).

Modul ini adalah sebuah barrel: setiap rekod yang didokumentasikan hidup dalam failnya sendiri di bawah components//utilities//rules//declarations/, ditulis menggunakan API komposisi lib/. Pendaftar (COMPONENTS/UTILITIES/RULES/DECLARATIONS) menggerakkan pengagregatan + ujian pariti.

Antaramuka ​

Pembolehubah ​

Fungsi ​