Wszystkie komponenty

Poznaj wszystkie 308 komponentów Lyra UI. Filtruj według rodziny, szukaj po nazwie i wypróbuj działające podglądy lub otwórz udokumentowany przykład.

Rozmowy i czat

Przestrzeń robocza agenta — Responsywna przestrzeń rozmowy z transkrypcją, edytorem i opcjonalnym panelem przebiegu oraz kontekstu.
Wizualizacja dźwięku — Obraz aktywności głosowej agenta w stanie spoczynku, słuchania, myślenia lub mówienia.
Wybór wersji wiadomości — Kontrolowana nawigacja między poprawionymi lub ponownie wygenerowanymi wersjami wiadomości.
Edytor wiadomości czatu — Pole wiadomości automatycznie zmieniające rozmiar z przyciskami wysłania i zatrzymania.
Wiadomość czatu — Dymek według roli z awatarem, etykietami i stopką zależną od stanu.
Obszar transkrypcji czatu — Przewijana rozmowa ze śledzeniem końca, przejściem do najnowszej wiadomości i oznaczeniem nieprzeczytanych.
Punkt przywracania — Miejsce w rozmowie umożliwiające po potwierdzeniu powrót do wcześniejszego stanu.
Blok kodu — Wyświetla kod z opcjonalnym odroczonym podświetlaniem składni i kopiowaniem.
Podstawowy blok kodu — Lekki widok kodu podświetlający tylko gramatyki dostarczone podczas kompilacji.
Pozycja rozmowy — Wybieralny wiersz historii czatu z tytułem, podglądem i czasem sesji.
Metryki generowania — Podczas tworzenia odpowiedzi AI pokazuje czas, tokeny i przepustowość.
Separator przekazania — Oznaczony przedział w transkrypcji pokazujący przekazanie kontroli między agentami.
Markdown — Bezpiecznie renderuje Markdown jako HTML, w tym tabele GFM, kod i linki.
Podstawowy Markdown — Lekki renderer Markdown z podświetlaniem kodu tylko dla gramatyk dostarczonych podczas kompilacji.
Akcje wiadomości — Pasek kopiowania, ponownego generowania, edycji i oceniania pojedynczej wiadomości.
Ocena wiadomości — Ocena odpowiedzi asystenta kciukiem w górę lub w dół z opcjonalnym powodem i komentarzem.
Wybór modelu — Wybiera dostawcę i model z katalogu lub pozwala wpisać własną nazwę.
Ustawienia modelu — Łączy wybór modelu i suwak temperatury do konfiguracji agenta.
Naciśnij i mów — Przycisk mikrofonu zarządzający zgodą, nagrywaniem i zakończeniem przy trzymaniu lub przełączeniu.
Stan strumienia — Śledzi fazę połączenia i rozpoznaje zator na podstawie sygnałów podtrzymania.
Tekst strumieniowy — Stopniowo renderuje tekst asystenta, łącząc szybkie aktualizacje tokenów.
Podstawowy tekst strumieniowy — Lekki renderer strumienia z Markdownem i gramatykami kodu dostarczonymi podczas kompilacji.
Sugerowane polecenia — Przewijany rząd początkowych lub dalszych poleceń przekazuje wybrany tekst aplikacji.
Lista wątków — Grupowana, przeszukiwalna lista rozmów z przypinaniem, archiwizacją, usuwaniem i zmianą nazw.
Transkrypcja na żywo — Napisy sesji głosowej zastępujące wersje tymczasowe ostatecznymi i śledzące koniec rozmowy.
Wskaźnik pisania — Pokazuje, że asystent właśnie przygotowuje odpowiedź.
Znacznik wykorzystania — Zwięźle pokazuje tokeny, koszt i opóźnienie wiadomości lub przebiegu, z dodatkowymi szczegółami w dymku.
Wybór głosu — Wybiera głos syntezy mowy z katalogu z odsłuchem i obsługą nieaktualnej wartości.
Renderer widżetów — Wyświetla deklaratywne drzewo widżetów JSON agenta wyłącznie z dozwolonych typów komponentów.
Części wiadomości — Wyświetla uporządkowane części wiadomości AI: tekst, rozumowanie, narzędzia, cytaty, załączniki i media.
Pole promptu — Łączy pisanie promptu z załącznikami, modelem, głosem, źródłami, wzmiankami i kolejką.
Kolejka promptów — Zarządza kolejnymi promptami, które można edytować, przenosić, usuwać lub od razu wysłać.
Sesja głosowa na żywo — Środowisko niezależne od dostawcy do połączenia, transkrypcji, nagrywania, wyciszenia i przerwania.
Pasek zaznaczenia — Przy zaznaczonym tekście oferuje pytanie, cytowanie i kopiowanie z zachowaniem miejsca w dokumencie.

Narzędzia agentów i obserwowalność

Kanał aktywności — Strumieniowy dziennik działań agenta, który po zakończeniu staje się podsumowaniem kroków.
Pulpit ocen agenta — Kontrolowany przegląd metryk, trendów i historii statusów poszczególnych przebiegów.
Pytanie agenta — Zbiera ustrukturyzowaną odpowiedź na pytanie agenta lub serwera MCP z akcjami przyjęcia, odmowy i anulowania.
Przebiegi w tle — Pokazuje zadania agentów w kolejce, wykonywane i ukończone, z żądaniami otwarcia lub anulowania.
Miernik budżetu — Porównuje podane wykorzystanie z limitem, uwzględniając niedostępność i przekroczenie.
Przegląd zmian — Prezentuje zmiany plików od aplikacji i prosi o zachowanie lub odrzucenie każdej części.
Menedżer konektorów — Pokazuje stan połączeń i prosi o połączenie, rozłączenie lub ponowienie dla konektorów aplikacji.
Udzielenie uprawnienia — Przedstawia prośbę o ograniczone uprawnienie i przekazuje aplikacji zgodę lub odmowę.
Reguły uprawnień — Pokazuje reguły aplikacji i prosi o zmianę decyzji: zezwól, zapytaj lub odmów.
Przebieg agenta — Główny panel przebiegu ze stanem, czasem, krokiem, kosztem i akcjami anulowania oraz ponowienia.
Ślad agenta — Hierarchiczny widok śladu agenta i LLM z filtrami odcinków oraz skokami do przekazań.
Kolejka zatwierdzeń — Dostępna z klawiatury kolejka wywołań narzędzi zatwierdzanych lub odrzucanych we wspólnym oknie.
Panel artefaktu — Podgląd wyniku agenta z przełączaniem kodu, wersjami, kopiowaniem i pobieraniem.
Rama przeglądarki — Widok ekranu agenta ze zrzutami, adresem tylko do odczytu i kontrolą przejęcia.
Karta commitu — Zwięzłe podsumowanie commitu ze statystyką zmian i odnośnikami do różnic plików.
Panel porównania — Porównuje dwa wyniki obok siebie i pozwala wskazać zwycięzcę w ocenie modeli.
Pasek potwierdzenia — Pozwala zatwierdzić lub odrzucić akcję agenta w transkrypcji bez okna modalnego.
Eksplorator kontekstu — Pokazuje części kontekstu wywołania modelu, szacunki tokenów, cytowania, ukrycia danych i eksport.
Zbiór ocen — Filtrowana lista przykładów oceny z etykietami oraz dodawaniem, usuwaniem i importem.
Wynik oceny — Ocena według kryteriów i przegląd ludzki przebiegów jednego przykładu.
Przebieg oceny — Postęp oceny zbiorczej z rozwijanymi szczegółami przykładów, źródłami i śladami narzędzi.
Podsumowanie zasad — Lista decyzji o ochronie, uprawnieniach, prywatności i narzędziach z dostępnymi wyjaśnieniami.
Oś odcinków — Pozioma oś odcinków śladu agenta z kolorami stanu i wspólną skalą czasu.
Ślad stosu — Przekształca ślady JS/TS, przeglądarki i Pythona w aktywne ramki z ukryciem wewnętrznych.
Lista zadań — Żywy, rozwijany plan agenta ze stanami kroków i podzadaniami.
Terminal — Konsola ANSI tylko do odczytu ze strumieniowym wyjściem, szukaniem i śledzeniem końca.
Wyniki testów — Podsumowanie zaliczonych i niezaliczonych testów z filtrami i rozwinięciem błędów.
Panel rozumowania — Rozwijany zapis bieżącego lub przejrzanego rozumowania agenta.
Zatwierdzanie narzędzia — Okno do zatwierdzenia, odrzucenia lub poprawienia wywołania narzędzia przez człowieka.
Blok wywołania narzędzia — Rozwijany blok wywołania z argumentami, błędem i wynikiem.
Znacznik wywołania narzędzia — Krótki znacznik nazwy, stanu i czasu działania narzędzia.
Formularz parametrów narzędzia — Tworzy edytowalny formularz argumentów wywołania na podstawie płaskiego JSON Schema.
Wynik narzędzia w oknie — Okno modalne ze stanem, czasem i szczegółowym wynikiem wywołania.
Widok wyniku narzędzia — Wyświetla wynik przez zarejestrowany renderer, a w razie potrzeby jako JSON.
Wybór narzędzi — Przeszukiwalne okno wyboru dostępnych narzędzi agenta według kategorii.
Oś narzędzi — Chronologiczna lista wywołań z ponowieniami, zatwierdzaniem przez człowieka i ukryciem wrażliwych pól.
Drzewo śladu — Rozwijana hierarchia odcinków śladu agenta lub LLM z czasem i opcjonalnymi kosztami.
Karta wyniku — Obramowana karta nadająca wspólny wygląd własnym rendererom wyników narzędzi.
Pole wyniku — Zwięzły wiersz etykiety i wartości w kartach wyników oraz gęstych zestawieniach.
Aplikacja MCP — Uruchamia zasób aplikacji MCP w izolowanym środowisku i przekazuje żądania jako typowane zdarzenia.
Studio promptów — Niezależne od dostawcy środowisko do edycji, podglądu, wersjonowania, zapisu i uruchamiania promptów.
Przeglądarka schematu — Pokazuje drzewa JSON Schema z ograniczeniami, polami wymaganymi, gałęziami i błędami walidacji.
Panel podagentów — Pokazuje hierarchię przebiegów podagentów z zadaniami, modelami, postępem i akcjami.

Wyszukiwanie i grafy wiedzy

Karta społeczności — Podsumowuje grupę w grafie wiedzy, pokazując członków i akcję otwarcia szczegółów.
Eksplorator embeddingów — Dostępny wykres punktowy współrzędnych embeddingów 2D z kolorami klastrów i wyborem punktów.
Karta encji — Karta encji grafu wiedzy z typem, właściwościami, liczbą powiązań i akcją skupienia w grafie.
Znacznik encji — Wzmianka @entity w tekście agenta z podglądem po najechaniu lub uzyskaniu fokusu.
Profil encji — Szczegóły encji z miarą pewności i kartami relacji, fragmentów źródłowych oraz pochodzenia.
Graf relacji — Pokazuje związki jako przesuwalny i skalowalny diagram węzłów oraz krawędzi.
Legenda grafu — Legenda typów węzłów służąca również do filtrowania ich widoczności.
Kolejka przetwarzania — Kontrolowana lista dokumentów w procesie przetwarzania z postępem i akcjami ponowienia lub anulowania.
Baza wiedzy — Lista źródeł z synchronizacją, stanem indeksowania, uprawnieniami i akcjami zarządzania.
Administracja bazą wiedzy — Panel kart łączący źródła bazy wiedzy z kolejką przetwarzania i przekazujący akcje aplikacji.
Eksplorator grafu wiedzy — Łączy widok grafu, wyszukiwanie encji, filtry typów, rozwijanie sąsiedztwa i znajdowanie ścieżek.
Mapa myśli — Rozwijane promieniste drzewo tematów do przestrzennego przeglądania hierarchii.
Lista sąsiadów — Wiersze relacji jednej encji z przejściem i rozwinięciem w grafie.
Paleta węzłów — Przeszukiwalna biblioteka węzłów według kategorii do umieszczania na płótnie.
Pasek ścieżki — Zwięzły, przewijany łańcuch węzłów i relacji obrazujący ścieżkę rozumowania GraphRAG.
Eksplorator fragmentów — Uszeregowane fragmenty RAG ze wskaźnikami trafności i odsyłaczem do dokumentu.
Znacznik cytowania — Znacznik [n] w tekście z podglądem i barwą według pewności lub weryfikacji.
Podsumowanie oparcia w źródłach — Pokazuje poparcie twierdzeń, pokrycie cytowaniami, pewność, ostrzeżenia i dowody.
Panel pamięci — Pamięć robocza i długotrwałe wspomnienia agenta z oceną pewności oraz akcjami wymagającymi potwierdzenia.
Panel pochodzenia — Rozwijany wykaz encji, relacji, społeczności i fragmentów podpierających odpowiedź.
Odpowiedź RAG — Odpowiedź oparta na źródłach z bezpiecznym Markdownem, cytatami, oceną i podglądami.
Postęp badań — Pokazuje kroki badań, liczby źródeł i całościowy postęp dostarczony przez aplikację.
Wyniki wyszukiwania — Uszeregowane fragmenty z usuwaniem duplikatów, grupami źródeł i widokiem zwięzłym lub rozwiniętym.
Wyszukiwanie w źródłach — Pole zapytania RAG z filtrami, zakresem, trybem wektorowym lub słów kluczowych i stanem.
Ślad wyszukiwania — Oś etapów z dowodami dla przepisania zapytania, embeddingu, pobierania i ponownego rankingu.
Karta źródła — Źródło cytatu z tytułem, stroną, fragmentem i rozwijanym pełnym tekstem.
Lista źródeł — Rozwijany panel grupujący karty cytowań jednej wiadomości.
Wybór źródeł — Drzewo pól wyboru ograniczające źródła następnej odpowiedzi, z wyszukiwaniem i wyborem wszystkich.
Dowody twierdzeń — Sprawdza wygenerowane twierdzenia względem cytowań, pokazując poparcie, pewność i dowody.
Pulpit oceny RAG — Pokazuje metryki jakości RAG, trendy, przekroje ocen i historię przebiegów obliczone przez aplikację.
Porównanie wyszukiwania — Porównuje obok siebie uszeregowane wyniki pobierania i ponownego rankingu wraz z ocenami.

Formularze i pola

Przycisk — Przycisk akcji z wariantami kolorów, rozmiarami i stanem ładowania.
Pole wyboru — Kontrolka formularza ze stanami zaznaczone, odznaczone i nieokreślone.
Grupa pól wyboru — Łączy powiązane pola w jedno walidowane pole formularza z wielokrotnym wyborem.
Edytor kodu — Wielowierszowy edytor kodu bez dodatkowych zależności, z opcjonalnymi numerami wierszy.
Wybór koloru — Natywne pole formularza do wyboru koloru z etykietą, podpowiedzią i błędem walidacji.
Pole kombi — Filtrowalny wybór pojedynczy lub wielokrotny łączący pole tekstowe z listą podręczną.
Wprowadzanie daty — Pole daty z wyskakującym kalendarzem i wartością w formacie ISO 8601.
Wybór daty — Kalendarz miesięczny do wyboru jednej daty lub zakresu dat.
Wybór emoji — Przeszukiwalny wybór emoji w formularzu z obsługą klawiatury.
Przycisk z ikoną — Uruchamia akcję kompaktowym, dostępnym przyciskiem zawierającym tylko ikonę.
Pole tekstowe — Jednowierszowe pole z opcjonalną etykietą, podpowiedzią i komunikatem błędu walidacji.
Wybór kraju — Wybiera kody krajów i terytoriów z przetłumaczonymi nazwami, flagami i opcjonalnym wyszukiwaniem.
Wybór waluty — Wybiera kody walut z przetłumaczonymi nazwami, symbolami i opcjonalnym wyszukiwaniem.
Wybór strefy czasowej — Wybiera identyfikatory stref czasowych z uporządkowanej listy z opcjonalnym wyszukiwaniem.
Wybór jednostki — Wybiera jednostki miary z przetłumaczonymi nazwami, symbolami i opcjonalnym wyszukiwaniem.
Wybór języka — Lista rozwijana do zmiany aktywnej wersji językowej na podstawie rejestru biblioteki.
Pole liczbowe — Pole liczbowe z limitami i krokiem oraz natywną walidacją ograniczeń.
Opcja — Element przekazujący polu kombi wartość, etykietę, grupę i informacje o stanie.
Numer telefonu — Pole telefoniczne uwzględniające kraj; wartość formularza ma standardową postać E.164.
Przycisk opcji — Kontrolka formularza pozwalająca wybrać jedną opcję z zestawu.
Grupa przycisków opcji — Oznaczona grupa pojedynczego wyboru z obsługą klawiatury.
Formularz oceniania — Konfigurowalne kryteria ocen, kategorie i komentarze z przejściem do następnej pozycji kolejki.
Lista wyboru — Lista rozwijana do wyboru jednej pozycji ze stałego zestawu.
Signature pad — Accessible form control for drawing a signature with pointer or keyboard input.
Suwak — Ustawia liczbę z zakresu, na przykład temperaturę LLM lub głośność.
Wybór próbki koloru — Wybiera jeden kolor z małego, stałego zestawu próbek zgodnie z semantyką grupy opcji.
Przełącznik — Kontrolka formularza ze stanami włączony i wyłączony dla natywnych formularzy.
Wielowierszowe pole tekstowe — Pole zwykłego tekstu z automatycznym powiększaniem, walidacją i obsługą formularza.
Wprowadzanie czasu — Segmentowane pole czasu dostosowane do języka z wyborem kolumnowym; natywną alternatywą jest lr-native-time-input.
Zakres czasu — Dwa uchwyty do wyboru początku i końca zakresu na osi liczbowej.
Przycisk przełączający — Samodzielny przycisk dwustanowy włączający opcję ze znaczeniem aria-pressed.
Grupa przycisków przełączających — Łączy przyciski w jednym miejscu nawigacji klawiaturą z wyborem wielokrotnym lub odwracalnym pojedynczym.
Natywne wprowadzanie czasu — Pole czasu przeglądarki z etykietą, podpowiedzią i błędem jako alternatywa dla lr-time-input.
Kod jednorazowy — Segmentowane pole jednorazowego kodu weryfikacyjnego z automatycznym uzupełnianiem SMS.
Przycisk wyboru — Pojedyncza opcja wyglądająca jak przycisk, zwykle w grupie lr-radio-group.
Wprowadzanie znaczników — Pole formularza zbierające usuwalne elementy, takie jak etykiety lub odbiorcy.

Prezentacja danych

Kreator zapytań grafowych — Edytor zapytań o relacje lub ścieżki w grafie z filtrami typów, limitami kroków i zapisanymi zapytaniami.
Kalendarz — Responsywny kalendarz miesięczny ze znacznikami wydarzeń i dostępnym widokiem planu.
Miernik kontekstu — Segmentowany pasek lub pierścień pokazujący użycie budżetu tokenów lub okna kontekstu.
Biblioteka dokumentów — Przeszukiwalny wykaz dokumentów z wersjami, etykietami, właścicielami i wyborem zbiorczym.
Lista zmiennych środowiskowych — Ukrywa wartości zmiennych i sekretów, umożliwiając ich pokazanie i kopiowanie dla każdego wiersza.
Drzewo plików — Eksplorator plików oparty na drzewie ze stanem Git i stopniowym wczytywaniem katalogów.
Obszar przepływu — Przesuwalne i skalowalne płótno do budowy oraz uruchamiania wizualnych przepływów DAG.
Sterowanie płótnem — Przyciski skalowania, dopasowania i blokady powiązanego płótna przepływu.
Minimapa przepływu — Mapa przeglądowa z przeciąganym prostokątem widocznego obszaru płótna.
Węzeł przepływu — Karta węzła z nagłówkiem, barwą stanu i uchwytami połączeń.
Stan przebiegu przepływu — Oznacza stany wykonania na płótnie i pokazuje zwięzły pasek kroków.
Lejek — Pokazuje spadek konwersji między etapami jako paski odniesione do pierwszego etapu.
Wskaźnik wartości — Przedstawia jedną wartość jako łuk, pierścień lub wskaźnik liniowy.
Mapa cieplna — Rysuje macierz lub kalendarz wartości na płótnie dopasowującym się do rozmiaru.
Stronicowanie — Kontrolowana nawigacja między stronami z bezpośrednim skokiem i podsumowaniem zakresu pozycji.
Kreator warunków — Składa zapytanie z wierszy pole, operator i wartość połączonych regułami AND/OR.
Pasek sekwencji — Pokazuje sekwencję stanów kategorialnych jako kolorowe komórki z opcjonalnym znacznikiem.
Miniwykres — Zwięzły trend w SVG jako linia, obszar lub słupki.
Karta statystyki — Pokazuje jedną metrykę z jednostką, trendem, rozbiciem i opcjonalnym miniwykresem.
Tabela — Tabela danych z sortowaniem nagłówków, wyborem, filtrowaniem i stronicowaniem.
Oś czasu — Połączone zdarzenia do dzienników kontroli, historii agentów i list zmian.
Pozycja osi czasu — Jeden wiersz zdarzenia z kolorowym znacznikiem, tytułem, czasem i opisem.
Drzewo — Rozwijana hierarchia do przeglądania grafów, dokumentów i plików.
Węzeł drzewa — Rekurencyjnie wyświetla węzeł i jego dzieci wewnątrz drzewa.
Chmura słów — Chmura SVG bez zależności, która skaluje słowa według ich wagi.
Siatka danych — Wirtualizowana siatka do dużych lub serwerowych zbiorów z sortowaniem, filtrowaniem i grupowaniem.

Wykresy

Wykres słupkowy — Porównuje kategorie za pomocą pionowych lub poziomych słupków.
Wykres pudełkowy — Podsumowuje rozkład na podstawie pięciu wcześniej obliczonych wartości statystycznych.
Wykres bąbelkowy — Przedstawia trzy wymiary punktu przez współrzędne x i y oraz promień bąbelka.
Wykres — Podstawowa nakładka Chart.js dla wykresów liniowych, słupkowych, kołowych i innych.
Wykres pierścieniowy — Pokazuje udziały części całości jako segmenty pierścienia.
Histogram — Grupuje liczby w przedziały o równej szerokości, pokazując ich rozkład.
Wykres liniowy — Śledzi trendy na osi ciągłej za pomocą jednej lub wielu połączonych serii.
Lekki wykres — Wykres słupkowy i liniowy w zwykłym SVG, bez zależności od Chart.js.
Wykres kołowy — Pokazuje udział poszczególnych wartości jednej serii w całości.
Polarny wykres powierzchniowy — Przedstawia każdą kategorię jako wycinek skalowany według wartości.
Wykres radarowy — Porównuje kilka metryk jednej serii na siatce promienistej.
Wykres punktowy — Rysuje pary współrzędnych x i y na osiach liniowych.

Układ i nawigacja

Akordeon — Koordynuje grupę rozwijanych paneli i może pozwalać na otwarcie kilku naraz.
Element akordeonu — Rozwijany panel przeznaczony do grupy akordeonu.
Panel nawigacji aplikacji — Responsywna nawigacja zmienia się z pełnej w same ikony, a na telefonie w nakładkę.
Grupa nawigacji — Nazwana i opcjonalnie zwijana grupa pozycji panelu nawigacji.
Pozycja nawigacji — Pozycja z ikoną i etykietą, która po zwinięciu panelu pokazuje samą ikonę.
Ścieżka nawigacji — Responsywna ścieżka pokazująca miejsce użytkownika w hierarchii stron.
Element ścieżki — Jeden link lub etykieta bieżącej strony w ścieżce nawigacji.
Grupa przycisków — Łączy powiązane akcje w nazwaną, responsywną grupę.
Karta — Obramowana powierzchnia treści z miejscami na nagłówek, media, stopkę i akcje.
Karuzela — Dostępna karuzela z klawiaturą, wskaźnikami, zapętleniem i automatycznym odtwarzaniem.
Element karuzeli — Opcjonalna semantyczna oprawa slajdu nadająca spójny wygląd elementom karuzeli.
Paleta poleceń — Przeszukiwalne menu poleceń aplikacji z nawigacją klawiaturą i skrótami.
Grupa kontrolek — Łączy różne pola formularza i przyciski w responsywny pasek.
Siatka pulpitu — Dostępna z klawiatury siatka widżetów zgłaszająca żądania przeniesienia, zmiany rozmiaru i kolizje.
Szczegóły — Dostępny panel ujawniający treść po rozwinięciu pod podsumowaniem.
Panel dokowany — Zwijany panel o zmiennym rozmiarze przy krawędzi istniejącego układu.
Panel powiązanych szczegółów — Prowadzi od danych wykresu lub tabeli do dowodów, dokumentów, encji lub przebiegów agenta.
Pozycja menu rozwijanego — Zgodny alias dla pojedynczego wiersza akcji w menu rozwijanym.
Pasek filtrów — Łączy pola i usuwalne czipy z przywracaniem oraz stanem ładowania.
Menu — Semantyczne menu akcji z przesuwanym fokusem i zagnieżdżonymi podmenu.
Pozycja menu — Jedna akcja z opcjonalną ikoną, polem wyboru lub niebezpiecznym stylem.
Element do przenoszenia — Wiersz listy z przyciskami w górę i w dół oraz dowolną wstawioną treścią.
Lista do zmiany kolejności — Zmienia kolejność wierszy przyciskami albo skrótem Ctrl/Cmd i strzałka.
Nagłówek menu — Nieinteraktywny nagłówek grupujący powiązane pozycje menu.
Pasek menu — Poziomy pasek rozwijanych menu aplikacji z pełną obsługą klawiaturą.
Pozycja paska menu — Nagłówek otwierający podmenu albo samodzielna akcja.
Menu nawigacyjne — Nawigacja nagłówka z linkami i panelami, zwijana za przyciskiem przy braku miejsca.
Pozycja menu nawigacyjnego — Link do strony lub przycisk otwierający panel nawigacyjny.
Strona — Semantyczna powłoka aplikacji dopasowująca nawigację do dostępnego miejsca, a nie do szerokości okna.
Panel responsywny — Na komputerze mieści się w układzie, na telefonie otwiera jako nakładka.
Obszar przewijania — Responsywny obszar kart lub zakładek z opcjonalnymi przyciskami wstecz i dalej.
Wybór segmentowy — Rząd przycisków do szybkiego wyboru jednej z kilku nazwanych opcji.
Podział wielopanelowy — Dzieli pulpit na przeciąganiem skalowane panele z opcjonalnym zwijaniem.
Panel dzielony — Dzieli treść na dwa obszary zmieniane przeciągnięciem pojedynczego separatora.
Przewodnik krokowy — Prowadzi przez uporządkowane etapy ze stanem i przechodzeniem do wybranego kroku.
Zakładki — Pasek zakładek z pełną obsługą klawiaturą pokazujący jeden panel naraz.
Zakładka — Zgodny opis zakładki powiązanej z panelem przez atrybuty panel i name.
Panel zakładki — Zgodny opis panelu powiązanego z zakładką przez atrybuty name i panel.
Lista wirtualna — W dużej przewijanej kolekcji wyświetla tylko wiersze widoczne na ekranie.
Widżet — Nazwany panel z opcjonalnym zwijaniem i rozwinięciem na cały ekran.

Nakładki i informacje zwrotne

Obszar powiadomień — Umieszcza ułożone w stos krótkie powiadomienia w rogu ekranu.
Krótkie powiadomienie — Pojedynczy zamykany komunikat z kolorem ważności, opcjonalną ikoną i licznikiem czasu.
Czip — Mała etykieta, filtr lub zakres, które można opcjonalnie usunąć albo przełączyć.
Grupa czipów — Łączy czipy i może ukryć nadmiar za przełącznikiem +N.
Alert — Domyślnie zamknięta wiadomość z automatycznym ukryciem i możliwością przekazania do powiadomień.
Etykieta — Zwięzła etykieta stanu, liczby lub kategorii w wierszu tekstu.
Komunikat w treści — Zamykany blok wiadomości o stanie, ostrzeżeniu lub błędzie.
Menu kontekstowe — Otwiera akcje prawym przyciskiem, długim dotykiem lub skrótem Shift+F10.
Okno dialogowe — Nakładka modalna zatrzymująca fokus do potwierdzeń, formularzy i pilnych zadań.
Panel wysuwany — Panel modalny wsuwany od dowolnej krawędzi ekranu do filtrów lub kontrolek kontekstowych.
Menu rozwijane — Podręczne menu akcji zakotwiczone do przycisku dostarczonego przez aplikację.
Stan pusty — Wyjaśnia brak treści za pomocą ikony, wiadomości i opcjonalnych akcji.
Skrót klawiaturowy — Pokazuje skrót jako osobne klawisze dopasowane do platformy.
Panel podręczny — Pływający panel kontekstowy otwierany kliknięciem i zamykany kliknięciem poza nim.
Okno zakotwiczone — Niskopoziomowy element utrzymujący pływający panel przy kotwicy.
Pasek postępu — Poziomy wskaźnik określonego lub nieokreślonego postępu z opcjonalną wartością.
Pierścień postępu — Okrągły wskaźnik określonego lub nieokreślonego postępu z etykietą w środku.
Ocena — Ocena gwiazdkowa z obsługą klawiatury i dokładnością do ułamka.
Szkielet ładowania — Animowany zamiennik treści widoczny podczas jej wczytywania.
Wskaźnik ładowania — Animowany znak nieokreślonego postępu zadania w tle.
Znacznik — Semantyczny wariant etykiety do słów kluczowych lub kategorii.
Dymek pomocy — Po najechaniu lub fokusie opisuje kontrolkę dostarczoną przez aplikację.

Przeglądarki dokumentów i plików

Przeglądarka archiwów — Wypisuje nazwy i nieskompresowane rozmiary plików ZIP bez rozpakowywania.
Przeglądarka kalendarza — Odczytuje plik .ics i pokazuje opisy, czasy i miejsca wydarzeń.
Przeglądarka kontaktów — Odczytuje dokument vCard i pokazuje dostępną kartę każdego kontaktu.
Przeglądarka CSV — Odczytuje CSV i wyświetla wiersze na wirtualizowanym, przewijanym arkuszu.
Przeglądarka zbiorów danych — Odczytuje tekst rozdzielany separatorami i pokazuje go jako typowaną, dostępną tabelę.
Porównanie dokumentów — Porównuje dwie wersje obok siebie lub w tekście, łącząc różnice z podglądami dokumentów.
Podgląd dokumentu — Wyświetla dokument lub załącznik w miejscu zależnie od MIME, a w razie potrzeby umożliwia pobranie.
Przeglądarka dokumentów — Otwiera dokument w oknie z rozszerzalnym rejestrem rendererów według typu MIME.
Przeglądarka DOCX — Konwertuje DOCX przez Mammoth na bezpieczny semantyczny HTML.
Przeglądarka e-booków — Pokazuje EPUB z nawigacją po rozdziałach przez opcjonalną bibliotekę epub.js.
Przeglądarka poczty — Odczytuje wiadomość .eml i pokazuje nagłówki, bezpieczną treść oraz załączniki.
Przeglądarka GeoJSON — Odczytuje i sprawdza GeoJSON, a następnie pokazuje jego obiekty na mapie.
Warstwa podświetleń — Rysuje aktywne prostokąty podświetlenia na rozmieszczonej treści dokumentu.
Przeglądarka HTML — Pobiera treść z adresu URL i bezpiecznie wyświetla oczyszczony HTML.
Dołączanie treści — Pobiera fragment HTML i wstawia go na stronę jako bezpieczną treść.
Przeglądarka notatników — Pokazuje notatnik Jupyter tylko do odczytu z Markdownem, kodem i bogatymi wynikami komórek.
Pasek stron — Wirtualizowany pionowy pasek miniatur do przeglądania stron dokumentu.
Przeglądarka PDF — Odczytuje strony PDF z powiększaniem, stronicowaniem i zaznaczaną warstwą tekstową.
Przeglądarka PPTX — Przybliżony podgląd prezentacji PowerPoint PPTX po stronie przeglądarki.
Przeglądarka arkuszy — Odczytuje skoroszyty .xlsx i starsze .xls z kartami arkuszy i wirtualizowanymi wierszami.
Przeglądarka SVG — Pobiera SVG z adresu URL i bezpiecznie osadza go na stronie.
Przeglądarka XML — Rozwijane, kopiowalne drzewo do oglądania dokumentów XML.

Media i pliki

Znacznik załącznika — Zwięzły widok pliku przy wiadomości ze stanem przesyłania, postępem i ponowieniem.
Awatar — Znak osoby lub encji z obrazem, ikoną albo zastępczymi inicjałami.
Obraz animowany — Odtwarza GIF, APNG lub WebP z pauzą i poszanowaniem ograniczenia ruchu.
Animacja — Animuje wstawiony element przez nazwane ustawienia lub własne klatki kluczowe.
Dodawanie załącznika — Kompaktowy przycisk w edytorze czatu otwiera wybór pliku lub menu możliwości.
Odtwarzacz audio i wideo — Odtwarzacz z synchronizowaną transkrypcją, falą dźwięku i zmianą prędkości.
Grupa awatarów — Układa nachodzące awatary w rząd i ukrywa nadmiar pod etykietą +N.
Obszar upuszczania — Zmienia dowolny obszar w cel przeciągania plików bez własnego okna wyboru.
Ikona pliku — Zlokalizowana ikona typu pliku ustalana z MIME lub nazwy.
Wybór plików — Obszar przeciągania albo wyboru kliknięciem przekazuje wybrane pliki.
Flaga — Flaga kraju lub języka w stylizowanej, opcjonalnie okrągłej ramce.
Porównanie obrazów — Separator obsługiwany klawiaturą porównuje obrazy przed zmianą i po niej.
Przeglądarka obrazów — Przesuwa i powiększa obraz rastrowy z wyróżnionymi obszarami i opcjonalnymi adnotacjami.
Przeglądarka pełnoekranowa — Pełnoekranowy modalny widok obrazów z nawigacją i powiększaniem.
Mapa — Nakładka MapLibre GL z deklaratywną legendą, kartogramem i znacznikami.
Karta mediów — Podgląd obrazu, wideo lub załączonego pliku w wiadomości czatu.
Przesuwanie i powiększanie — Przewijany obszar z ograniczonym powiększeniem treści lub obrazu.
Odtwarzanie sekwencji — Sterowanie odtwarzaniem przesuwa indeks w danym zakresie co stały odstęp czasu.
Kod QR — Koduje wartość jako możliwy do zeskanowania symbol QR na płótnie.
Wideo — Odtwarzacz z własnymi kontrolkami, wyborem napisów i miniaturami podglądu.
Lista wideo — Odtwarza filmy na liście i po zakończeniu automatycznie przechodzi do następnego.
Powiększalna ramka — Podgląd w odizolowanym iframe ze skokową zmianą skali; do obrazów służy lr-pan-zoom.

Narzędzia pomocnicze

Obserwator przecięcia — Przekazuje natywne wpisy o wejściu elementów w obszar widoczny i wyjściu z niego.
Obserwator zmian DOM — Śledzi wstawione elementy i atrybuty, przekazując natywne rekordy zmian.
Obserwator rozmiaru — Śledzi rozmiary wstawionych elementów i emituje typowane wpisy bez widocznych kontrolek.
Przycisk kopiowania — Przycisk z ikoną kopiuje tekst do schowka i potwierdza to znacznikiem.
Widok różnic — Porównuje dwa teksty wiersz po wierszu, kolorując wynik w formacie unified diff.
Separator — Semantyczny element dzielący treść poziomo lub pionowo i dopasowany do motywu.
Przycisk eksportu — Pobiera dane tabeli jako CSV lub JSON bezpośrednio albo z menu formatów.
Formatowanie bajtów — Pokazuje rozmiar według języka z wyborem jednostki i precyzji.
Formatowanie daty — Formatuje datę i czas według języka przez Intl.DateTimeFormat.
Formatowanie liczb — Formatuje liczby, waluty i zapisy skrócone przez Intl.NumberFormat.
Ikona — Wyświetla wyraźne ikony SVG z wbudowanego zestawu bez zależności.
Przeglądarka JSON — Rozwijane, kopiowalne drzewo do oglądania dowolnych danych JSON.
Znana data — Trzy pola dnia, miesiąca i roku dla daty znanej użytkownikowi.
Obszar komunikatów — Niewidoczny obszar ARIA ogranicza częstotliwość komunikatów czytnika ekranu.
Menu wzmianek — Podpowiada wzmianki @ i polecenia / przy kursorze pola tekstowego.
Stan odświeżania — Odlicza do następnego odświeżenia z wbudowaną pauzą i wznowieniem.
Rotacja treści — Zmienia wstawione elementy losowo lub po kolei dla wariantów tekstu i opinii.
Czas względny — Pokazuje czas względny według języka i sam go odświeża.
Samouczek — Przewodnik po pierwszym uruchomieniu wyróżnia elementy interfejsu krok po kroku.
Treść ukryta wizualnie — Ukrywa treść przed wzrokiem, pozostawia ją czytnikom ekranu i pokazuje po uzyskaniu fokusu.