pantoken / components

components ​

Beta

@pantoken/components — knjižnica CSS komponent z videzom InstUI, zgrajena iz tokenov --instui-*.

Dostavljene slogovne tabele:

  • Base (baseCss) — izbirne globalne privzete nastavitve dokumenta iz tokenov (box-sizing, ponastavitev telesa (body reset), površina strani, osnovna barva/pisava besedila, color-scheme). Prav tako nosi fokusni obroček (focus-outline), tako da ima vsako fokusabilno mesto dostopen :focus-visible obris takoj po vklopu. Naložite ga, ko pantoken upravlja stran.
  • Prose (proseCss) — slogi za upodobljeno markdown/proze HTML (tabele, naslovi, povezave, seznami, koda) omejeni na vsebinski koren, tako da dokumentacijska stran ali vsebinski razdelek izgleda kot InstUI brez zamenjave DOM‑a s komponentami. To je tisto, kar pošiljajo rendererji spletnega mesta kot svoj components.css.
  • Components (buttonCss, alertCss, badgeCss, združeno z componentsCss) — razredni (class-based) slogi komponent, ki jih uporabite na lastni označbi (<button class="instui-button">), za videz InstUI zunaj ogrodja komponent. Vodilni je --instui-elevation-* lestvica senc (elevationCss), saj dovolj komponent lebdi, da so sence notranja oblikovna lastnost, ne le dodatek.
  • Utilities (viewCss, spacingUtilitiesCss, gapCss, layoutUtilitiesCss, plus skrbno izbran nabor semantičnih barv/tokenov) — izbirna plast prečnopresečnih razredov. Generični token→class emitterji (colorUtilitiesCss, tokenUtilitiesCss) živijo v @pantoken/utils; ta paket jim napaja skrbno izbrane semantične nazive, medtem ko @pantoken/plugin-primitives zagotavlja surovo paleto.
  • Fonts (izbirno fonts.css) — @font-face pravila za pisave blagovne znamke Instructure. Base uporablja pisavo; fonts.css naloži woff2 datoteke, tako da se besedilo brez njih elegantno degradira.

Vse je čisti CSS, izpeljan iz token IR, zato sledi InstUI prek tokenov brez odvisnosti od InstUI React paketov. Za resnično, interaktivno komponentno izkušnjo uporabite @pantoken/react-markdown (content) ali @instructure/ui-* (apps).

Ta modul je sod: vsak dokumentiran zapis živi v svoji datoteki pod components//utilities//rules//declarations/, avtorsko napisan z lib/ compose API. Registri (COMPONENTS/UTILITIES/RULES/DECLARATIONS) poganjajo zbiranje in test paritete.

Vmesniki ​

Spremenljivke ​

Funkcije ​