Sari la conținut

Proiect open-source independent. Domeniul oficial este sistem.digital.

Sistem DigitalCatalog versionatsistem.digital
Meniu

Catalog · Conținut și date

Text evidențiat

Evidențiază o notă fără a-i atribui o stare de sistem.

AlphaComponentăConținut și date

Prezentare

Evidențiază o notă sau o precizare fără să-i atribuie o stare de sistem (spre deosebire de `alert`).

Când se folosește

  • pentru o notă relevantă, fără conotație de eroare, succes sau avertisment.

Când nu se folosește

  • pentru mesaje cu stare reală — `inset-text` nu are variante de culoare; folosește `alert` pentru acelea.

Anatomie

Un `<div class="sd-inset-text">`, cu bordură laterală simplă, fără simbol decorativ.

Variante

  • implicit — o singură variantă

Stări

  • nu are stări interactive proprii

Comportament

Element static, fără JavaScript.

Reguli de conținut

  • nu simulează o stare prin conținut — dacă mesajul are o stare reală (eroare, succes), componenta corectă e `alert`, nu `inset-text`.

Cercetare

Istoric

Istoricul modificărilor relevante
VersiuneDatăModificare
0.1.0-alpha.0Publicare inițială în @sistem-digital/components, ca parte a componentelor de conținut și afișare a datelor (PR #51).

Structura completă a acestei secțiuni urmează șablonul canonic al paginii unei componente. Accesibilitatea (semantică, tastatură, focus) rămâne documentată separat, conform șablonului de accesibilitate.

Preview și markup canonic

Previzualizarea de mai jos redă exact șirul HTML afișat în exemplul de cod. Nu există o implementare paralelă pentru documentație.

Previzualizare din markup-ul canonic

Notă: instituția verifică informația direct la sursă.

Instalare și importuri

pnpm add @sistem-digital/tokens @sistem-digital/components
Import CSS
@import '@sistem-digital/components/content.css';
Markup canonic
<div class="sd-inset-text"><p><strong>Notă:</strong> instituția verifică informația direct la sursă.</p></div>

Contract și surse

Schimbarea claselor publice, a markup-ului canonic sau a comportamentului helperelor necesită versionare și instrucțiuni de migrare.

Matricea design–cod

Disponibilitatea reală a acestei componente, calculată din pachetele publicate, conform schemei matricei design–cod. Rândurile Figma, testare cu tastatura și testare cu cititor de ecran rămân „Indisponibil” până la dovezi publicate separat (kit Figma, respectiv auditul manual de accesibilitate).

Matricea design–cod pentru Text evidențiat
CanalDisponibilitate
FigmaIndisponibil
HTML/CSSDisponibil
Web ComponentsIndisponibil
ReactIndisponibil
DocumentațieDisponibil
Teste automateDisponibil
Testare cu tastaturaIndisponibil
Testare cu cititor de ecranIndisponibil

A fost utilă această pagină?

Linkul deschide un formular GitHub precompletat. Nu transmitem nimic până când alegi să publici feedback-ul și îți recomandăm să nu incluzi date personale.