모든 컴포넌트

308개의 Lyra UI 컴포넌트를 탐색하세요. 패밀리별 필터링, 이름 검색, 라이브 미리보기 또는 문서화된 예제 열기를 시도해 보세요.

대화 및 채팅

에이전트 작업 공간 — 스크립트, 작성기, 선택적 실행/도구/검색/접지/컨텍스트 상세 패널을 구성하는 AI 대화용 반응형 제어 셸.
오디오 시각화기 — 에이전트의 유휴, 듣기, 생각 또는 말하기 상태를 반영하는 캔버스 기반 음성 활동 시각화.
브랜치 선택기 — 재생성되거나 편집된 하나의 채팅 메시지 변형에 걸친 제어된 ‹ n / m › 탐색기.
채팅 작성기 — 내장된 전송 및 중지 컨트롤이 있는 자동 크기 조정 채팅 메시지 입력란.
채팅 메시지 — 아바타, 배지 및 상태 인식 푸터가 있는 역할 기반 채팅 버블 셸.
채팅 뷰포트 — 하단 고정 추적 동작, 최신으로 이동하는 피어(pill), 미확인 구분선이 있는 스크립트 스크롤 컨테이너.
체크포인트 — 채팅을 이전 상태로 되돌리기 위한 확인 후 복원 기능이 있는 인라인 대화 복원 지점.
코드 블록 — 선택적 지연 구문 강조 표시 및 복사 버튼이 있는 울타리형 코드 표시.
코드 블록 코어 — 컴파일 시간에 제공된 문법 맵에서만 강조 표시하는 빌드 경량 코드 표시.
대화 항목 — 세션의 제목, 미리보기 및 타임스탬프를 보여주는 선택 가능한 채팅 기록 행.
생성 지표 — AI 응답이 스트리밍되는 동안 경과 시간, 토큰 및 처리량을 표시합니다.
인계 구분선 — 스크립트에서 에이전트 간의 제어권 이전을 표시하는 레이블이 지정된 구분선.
Markdown — GFM 테이블, 코드 및 링크가 포함된 안전한 Markdown-to-HTML 렌더링.
Markdown 코어 — 컴파일 시간에 제공된 문법 맵에서만 감싸진 코드를 강조 표시하는 빌드 경량 Markdown 렌더링.
메시지 작업 — 복사, 재생성, 편집 및 피드백 내장 기능을 갖춘 채팅 메시지별 작업 도구 모음.
메시지 피드백 — 선택적 이유 및 댓글 상세 패널과 함께 하나의 어시스턴트 메시지에 대한 좋아요/싫어요 평점.
모델 선택 — 고정된 카탈로그 또는 자유 형식의 사용자 지정 항목을 갖춘 제공업체 및 모델 선택기.
모델 설정 패널 — 에이전트 구성을 위한 페어드 모델 선택기 및 온도 슬라이더.
음성 녹음 시작 — 길게 누르거나 토글 사용을 위한 전체 권한 요청, 녹음 및 종료 라이프사이클을 소유하는 마이크 캡처 버튼.
스트림 상태 — 단일 스트리밍 연결의 단계를 표시하며 하트비트 인식 지연 감지 기능을 제공합니다.
스트리밍 텍스트 — 빠른 토큰 업데이트를 병합하며 스트리밍 어시스턴트 텍스트를 점진적으로 렌더링합니다.
스트리밍 텍스트 코어 — 컴파일 타임에 제공된 문법 맵에서만 펜스드 코드를 강조 표시하는 빌드-린 스트리밍 텍스트 렌더러.
추천 칩 — 선택한 텍스트를 호스트로 전달하는 시작 또는 후속 프롬프트 칩의 스크롤 가능한 행.
스레드 목록 — 고정, 보관, 삭제, 이름 변경 등의 행 작업을 지원하는 그룹화되고 검색 가능한 대화 사이드바.
대화 기록 피드 — 진행 중인 음성 세션에 대한 실시간 자막 피드. 임시 자막에서 최종 자막으로 업그레이드되며, 하단 고정 스크롤 기능이 제공됩니다.
입력 중 표시기 — 어시스턴트가 응답을 작성 중임을 보여주는 시각적 존재 표시
사용량 배지 — 메시지 또는 실행당 토큰/비용/지연 시간을 표시하는 간결한 스트립 (호버 툴팁으로 상세 내역 제공).
음성 선택기 — 제공된 카탈로그에서 인라인 오디오 미리보기 및 오래된 값 처리 기능을 갖춘 TTS 음성 선택기.
위젯 렌더러 — 허용된 타입-컴포넌트 레지스트리를 통해 에이전트가 스트리밍하는 선언적 JSON 위젯 트리를 렌더링합니다.
메시지 부분 — 텍스트, 추론, 도구, 인용, 첨부 및 미디어 기본 요소와 함께 순서가 지정되고 상호 교차 가능한 AI 메시지 부분을 렌더링합니다.
프롬프트 입력 — 프롬프트 작성을 첨부 파일, 모델 및 음성 선택, 검색 소스, 언급, 명령 및 대기열화된 턴과 결합합니다.
프롬프트 대기열 — 편집, 재정렬, 제거 또는 즉시 전송할 수 있는 후속 프롬프트의 제어된 대기열을 관리합니다.
실시간 세션 — 연결, 활동, 스크립트, 캡처, 음소거 및 중단 제어를 위한 공급자 중립적인 음성 세션 셸을 제공합니다.
선택 도구 모음 — 선택된 텍스트 옆에 '질문', '인용', '출처 표시', '복사' 작업을 배치하며 문서 앵커를 유지합니다.

에이전트 도구 및 관측성

활동 피드 — 에이전트의 세부 작업에 대한 추가 전용 스트리밍 로그로, 실행이 완료되면 완료된 단계 요약으로 축소됩니다.
에이전트 평가 대시보드 — 측정 항목 카드와 추세 차트, 그리고 실행별 상태 기록을 결합한 제어된 평가 개요.
에이전트 질문 — 에이전트 또는 MCP 서버 질문에 대한 구조화된 응답을 수집하며, 수락, 거부, 취소 액션을 포함합니다.
백그라운드 실행 — 열려 있거나 취소 요청이 있는 호스트 관리 큐, 실행 중, 완료된 에이전트 작업을 표시합니다.
예산 미터 — 사용 가능한 상태와 초과 상태를 포함하여 제한 대비 제공된 사용량을 표시합니다.
변경 검토 — 호스트가 제공한 파일 변경 사항을 검토하고 각 덩어리(hunk)에 대한 유지 또는 폐기 결정을 요청합니다.
커넥터 관리자 — 호스트 관리 커넥터의 연결 상태를 표시하고 연결, 연결 해제 또는 재시도 액션을 요청합니다.
권한 부여 — 범위가 지정된 권한 요청을 제시하고 사용자의 허용 또는 거부 선택을 호스트에 보고합니다.
권한 규칙 — 호스트가 정의한 권한 규칙을 표시하고, 해당 규칙의 허용, 요청, 또는 거부 결정에 대한 변경을 요청합니다.
에이전트 실행 — 하나의 에이전트 실행을 위한 최상위 셸로, 상태, 경과 시간, 현재 단계, 비용을 보여주며, 취소 및 재시도 액션을 포함합니다.
에이전트 추적 — 공유 스팬 배열을 사용하는 스팬 유형 필터와 핸드오프 빠른 이동 기능이 포함된 계층적 에이전트/LLM 추적 보기.
승인 대기열 — 공유 대화 상자를 통해 검토 및 승인 또는 거부되는 보류 중인 도구 호출의 키보드 접근 가능 대기열.
아티팩트 패널 — 미리보기/코드 토글, 버전 탐색, 복사/다운로드 액션이 포함된 에이전트 생성 아티팩트 주변의 셸.
브라우저 프레임 — 스크린샷 스트림, 읽기 전용 URL 및 제어권 장악 컨트롤을 표시하는 프레젠테이션 에이전트-컴퓨터 뷰포트.
커밋 카드 — diffstat 및 파일별 변경 사항이 포함된 간결한 커밋 요약.】
비교 패널 — 아레나 스타일 모델 평가를 위한 승자 투표가 포함된 나란히 A/B 출력 비교.
확인 바 — 대화 상자 대신 기록(transcript)에 위치하는, 제안된 에이전트 액션 하나에 대한 인라인, 비모달 승인/거부 블록.
컨텍스트 검사기 — 토큰 추정치, 인용, 마스킹 마커 및 복사/내보내기 제어 기능을 갖춘 모델 호출 컨텍스트 세그먼트 검사 보기.
평가 데이터셋 — 추가, 제거, 가져오기, 내보내기 기능이 있는 필터링 및 태그 지정 가능한 평가 예제 목록.
평가 결과 — 하나의 평가 예제 실행을 비교하기 위한 루브릭 점수 및 수동 검토 표면.
평가 실행 — 전체 진행 상황과 접지(grounding) 및 도구 추적을 포함한 예제별 공개 정보가 포함된 평가 배치에 대한 실시간 진행 상황 보기.
정책 요약 — 가드레일, 권한, 개인 정보 보호 및 도구 정책 결정에 대한 읽기 전용 목록. 접근 가능한 허용, 거부 또는 검토 필요 설명 포함.
스팬 워터폴 — 공유 시간 축을 따라 상태별 막대로 표시되는 에이전트 추적의 스팬에 대한 수평 타임라인.
스택 트레이스 — JS/TS, 브라우저 및 Python 스택 트레이스를 활성화 가능한 프레임으로 파싱하며 내부 프레임 폴딩을 지원합니다.
작업 목록 — 단계별 라이프사이클 상태와 중첩된 하위 단계를 포함하는 에이전트 계획의 실시간 접기/펼치기 트래커.
터미널 — 검색 및 하단 고정 스크롤을 지원하는, 스트리밍되는 에이전트 또는 도구 출력을 읽기 전용 ANSI 콘솔 렌더링.
테스트 결과 — 상태별 카운트, 필터 토글, 자동 확장 실패 상세 정보를 포함한 Pass/fail 테스트 스위트 요약.
사고 패널 — AI 에이전트의 실시간 또는 검토된 추론 기록을 위한 접기/펼치기 패널.
도구 승인 다이얼로그 — 제안된 도구 호출이 실행되기 전에 승인, 거부 또는 편집하는 휴먼-인-더-루프 게이트.
도구 호출 블록 — 인수, 오류 및 결과를 표시하기 위해 확장되는 단일 에이전트 도구 호출을 위한 접기/펼치기 인라인 블록.
도구 호출 칩 — 단일 에이전트 도구 호출의 이름, 상태 및 지속 시간을 요약하는 간결한 인라인 피어.
도구 매개변수 폼 — 도구의 평면 JSON Schema를 기반으로 호출 인수를 조정하기 위한 편집 가능한 폼을 생성합니다.
도구 결과 다이얼로그 — 도구 호출의 상태, 지속 시간 및 전체 결과 상세를 표시하는 모달 오버레이.
도구 결과 뷰 — 등록된 렌더러를 통해 도구 호출의 결과를 렌더링하며, JSON으로 폴백합니다.
도구 선택 다이얼로그 — 활성화할 에이전트 도구를 선택하기 위한 카테고리별 그룹화 및 검색 가능한 다이얼로그.
도구 타임라인 — 재시도 횟수, 인간 승인 게이팅, 민감 필드 마스킹이 포함된 에이전트 실행의 도구 호출에 대한 연대기적 목록.
추적 트리 — 지속 시간 바와 선택적 토큰/비용 열을 가진 에이전트/LLM 추적을 위한 접기/펼치기 스팬 계층.
결과 카드 — 사용자 지정 도구 결과 렌더러에 작은 카드 모양을 제공하는 테두리 카드 셸
결과 필드 — 도구 결과 카드 및 밀집된 메타데이터 스트립을 위한 간결한 레이블/값 행
MCP 앱 — 격리된 샌드박스에서 실행 가능한 MCP App 리소스를 호스팅하고 호스트 요청을 유형화된 이벤트로 노출합니다.
프롬프트 스튜디오 — 구조화된 프롬프트를 편집, 미리 보기, 버전 관리, 저장 및 실행하기 위한 공급자 중립 워크벤치를 제공합니다.
스키마 뷰어 — 제약 조건, 필수 상태, 구성 브랜치 및 유효성 검사 문제를 포함하는 선택 가능한 JSON Schema 트리를 검사합니다.
서브 에이전트 패널 — 상태, 작업, 모델, 진행 상황 및 라이프사이클 작업을 포함하는 서브 에이전트 실행의 제어된 계층 구조를 표시합니다.

검색 및 지식 그래프

커뮤니티 카드 — 멤버 칩과 드릴다운 액션을 갖춘 지식 그래프 커뮤니티 클러스터 요약 카드.
임베딩 탐색기 — 호스트 투영 임베딩 좌표의 접근 가능한 2D 산점도 보기 (선택적 클러스터 색상 지정 및 포인트 선택 기능 포함).
엔티티 카드 — 타입 배지, 속성, 차수 및 그래프 내 포커스 액션을 갖춘 단일 지식 그래프 엔티티의 파일(Dossier) 카드.
엔티티 칩 — 에이전트 산문용 인라인 @엔티티 언급 및 호버/포커스 미리보기 팝오버.
엔티티 정보집 — 헤더, 신뢰도 통계 및 관계, 지원 청크, 출처(provenance) 탭을 갖춘 엔티티 상세 표면.
그래프 — 패닝 및 확대/축소가 가능한 힘 기반 노드-링크 다이어그램으로 관계를 매핑합니다.
그래프 범례 — 가시성 필터 역할도 하는 쌍을 이루는 그래프의 노드 유형 범례입니다.
수집 대기열 — 수집 파이프라인을 통과하는 문서의 제어된 목록으로, 단계, 진행률, 개수 및 재시도 또는 취소 요청을 보여줍니다.
지식 기반 — 동기화 상태, 인덱싱 상태, 권한 및 행별 관리 요청이 포함된 검색 지식 기반 소스 목록입니다.
지식 기반 관리 — 지식 기반 소스를 수집 대기열과 연결하고 관리 작업을 호스트로 전달하는 탭 기반 작업 셸입니다.
지식 그래프 탐색기 — 그래프 렌더링, 엔티티 검색, 유형 필터, 근접 영역 확장 및 경로 찾기를 결합한 지식 그래프 탐색 셸입니다.
마인드맵 — 계층 구조를 공간적으로 탐색하고 주제를 깊이 파고들 수 있는 방사형 확장 가능한 주제 트리입니다.
이웃 목록 — 개체 하나의 관계 행과 행별 탐색 및 그래프 내 확장 기능입니다.
노드 팔레트 — 흐름 캔버스에 노드를 드래그하거나 배치할 수 있는 검색 가능하고 분류된 노드 라이브러리입니다.
경로 스트립 — GraphRAG 추론 경로를 렌더링하는 간결하고 스크롤 가능한 노드-관계-노드 체인입니다.
청크 검사기 — 관련성 점수 막대와 문서 뷰어의 깊은 링크가 포함된 검색된 RAG 청크의 순위 목록.
인용 배지 — 호버 미리보기 및 신뢰도/검증 색상 지정이 있는 인라인 [n] 인용 마커.
근거 요약 — 주장 수준의 근거 점수판으로, 지원 횟수, 인용 범위, 신뢰도, 경고 및 증거 인용을 보여줍니다.
메모리 패널 — 단기 컨텍스트 및 장기 메모리를 위한 에이전트 작업 메모리 표면이며, 신뢰도 및 확인 게이트가 적용된 액션을 제공합니다.
출처 이력 패널 — 콜랩스 가능한 엔티티, 관계, 커뮤니티 및 청크 분석을 통해 하나의 답변의 근거를 렌더링합니다.
RAG 답변 — 정제된 Markdown, 인용 배지, 근거 평가 및 확장 가능한 출처 미리보기를 결합한 근거 기반 답변 표면.
연구 진행 상황 — 호스트가 제공한 연구 단계, 출처 개수 및 전체 완료 진행률을 표시합니다.
검색 결과 — 중복 제거, 출처 그룹화, 선택 및 간소화 또는 확장된 표시 모드를 갖춘 순위가 지정된 검색 청크 목록.
검색 검색 — 필터 및 범위 칩, 벡터/키워드/하이브리드 모드 선택기 및 상태 피드백을 갖춘 검색 또는 RAG 표면용 쿼리 바.
검색 추적 — 각 재작성, 임베드, 검색, 재순위 지정 및 필터링 단계에 대한 확장 가능한 증거가 포함된 검색 파이프라인 단계 타임라인.
출처 카드 — 출처의 제목, 페이지, 발췌 및 확장 가능한 전체 텍스트를 보여주는 인용 항목.
출처 목록 — 채팅 메시지의 인용 카드를 하나의 헤더 아래에 그룹화하는 콜랩스 가능한 출처 패널.
출처 선택기 — 다음 답변의 근거가 되는 출처를 범위 지정하는 체크박스 트리. 삼중 상태 폴더, 전체 선택 및 검색 기능 포함.
주장 증거 — 지원 상태, 신뢰도 및 증거와 함께 인용된 주장을 감사합니다.
RAG 평가 대시보드 — 호스트가 계산한 결과를 바탕으로 RAG 품질 지표, 추세, 평가 슬라이스 및 실행 기록을 제시합니다.
검색 비교 — 오버랩 및 점수 분석과 함께 순위가 매겨진 검색 및 재순위 지정 결과 세트를 나란히 비교합니다.

양식 및 입력 필드

버튼 — 톤 변형, 크기 및 로딩 상태를 갖춘 토큰화된 액션 버튼.
체크박스 — 체크됨, 체크 해제됨, 미정 상태를 갖는 부울 폼 컨트롤.
체크박스 그룹 — 관련 체크박스를 하나의 폼 연관, 유효성 검사된 다중 선택 필드로 그룹화합니다.
코드 에디터 — 선택적 줄 번호 가터가 있는 종속성 없는 다중 라인 코드 편집 표면.
색상 선택기 — 레이블, 힌트 및 유효성 검사 오류 크롬이 있는 폼 연관 네이티브 색상 입력.
콤보박스 — 텍스트 입력과 리스트박스 팝오버를 결합한 필터링 가능한 단일 또는 다중 선택 쌍.
날짜 입력 — 첨부된 달력 팝오버와 ISO-8601 값을 갖는 날짜 필드.
날짜 선택기 — 단일 날짜 또는 날짜 범위를 선택하기 위한 인라인 월 그리드 달력.
이모지 선택기 — 이모지 선택을 위한 검색 가능하고 키보드 탐색 가능한 폼 연관 선택기.
아이콘 버튼 — 컴팩트하고 접근 가능한 아이콘 전용 버튼으로 액션을 트리거합니다.
입력 — 선택적 레이블, 힌트 및 인라인 유효성 검사 크롬이 있는 단일 라인 텍스트 필드.
국가 선택기 — 번역된 이름, 국기 및 선택적 검색으로 국가와 지역 코드를 선택합니다.
통화 선택기 — 번역된 이름, 기호 및 선택적 검색으로 통화 코드를 선택합니다.
시간대 선택기 — 정렬된 목록에서 시간대 식별자를 선택하며 검색을 선택적으로 사용할 수 있습니다.
단위 선택기 — 번역된 이름, 기호 및 선택적 검색으로 측정 단위를 선택합니다.
로케일 선택기 — 라이브러리 자체 로케일 레지스트리에서 가져온 활성 로케일 전환을 위한 폐쇄 목록 드롭다운.
숫자 입력 — 최소값, 최대값, 단계 제약 조건 및 네이티브 제약 조건 유효성 검사를 갖는 숫자 필드.
옵션 — 콤보박스에 값, 레이블, 그룹화 및 상태 데이터를 공급하는 선택 가능한 옵션.
전화번호 입력 — 폼 값이 표준 E.164 형식인 국가 인식 전화번호 필드.
라디오 — 세트에서 하나의 옵션을 선택하는 양식 연관 단일 선택 컨트롤
라디오 그룹 — 레이블이 지정되고 키보드 탐색이 가능한 단일 선택 라디오 버튼 그룹.
루브릭 양식 — 평가 대기열을 처리하기 위한 제출 및 다음 흐름을 가진 구성 가능한 점수, 카테고리 및 코멘트 루브릭.
선택 — 고정된 선택지 세트에서 하나의 옵션을 선택하기 위한 폐쇄 목록 드롭다운.
Signature pad — Accessible form control for drawing a signature with pointer or keyboard input.
슬라이더 — LLM 온도 또는 볼륨 레벨과 같은 설정을 위한 숫자 범위 컨트롤.
스와치 피커 — 라디오 그룹 컨트롤이 내장된 작고 고정된 색상 스와치 세트 위의 단일 선택 피커.
스위치 — 네이티브 양식을 위한 켜기/끄기 스위치 의미론을 가진 부울 토글 스위치 양식 컨트롤.
텍스트 영역 — 자동 확장, 유효성 검사 및 양식 컨트롤 크롬이 있는 다중 라인 일반 텍스트 입력.
시간 입력 — 연결된 열 선택기가 있는 로케일 인식 세그먼트 시간 필드; 브라우저 네이티브 input[type=time] 경험은 lr-native-time-input입니다.
시간 범위 — 숫자 도메인에서 시작 및 끝 범위를 선택하는 두 개의 핸들 브러시.
토글 — aria-pressed 의미론을 사용하여 옵션을 켜거나 끄는 자체 관리형 두 상태 버튼.
토글 그룹 — 여러 개 또는 지울 수 있는 단일 선택을 가진 하나의 탭 스톱 뒤에 토글 버튼을 그룹화합니다.
네이티브 시간 입력 — 플랫폼 자체 피커보다 세그먼트된 lr-time-input이 선호되는 경우를 위한 Lyra 레이블, 힌트 및 유효성 검사 크롬으로 래핑된 네이티브 브라우저 시간 선택기 필드.
OTP 입력 — 내장 SMS 자동 채우기가 있는 일회용 인증 코드 입력을 위한 세그먼트 필드.
라디오 버튼 — 원형이 아닌 버튼 형태로 스타일링된 단일 선택 컨트롤로, 일반적으로 lr-radio-group을 사용하여 세그먼트 컨트롤로 그룹화됩니다.
토큰 입력 — 태그나 수신자 같은 제거 가능한 토큰 목록을 수집하는 양식 연관 필드.

데이터 표시

그래프 쿼리 빌더 — 엔티티 앵커, 유형 필터, 호프 제한 및 저장된 쿼리가 있는 쿼리된 그래프 관계 또는 경로에 대한 폼 연관 편집기.
달력 — 이벤트 마커와 키보드 접근 가능한 일정 보기 기능을 갖춘 반응형 월별 달력.
컨텍스트 미터 — 토큰 예산 또는 컨텍스트 창을 위한 세그먼트형 점유율 미터 (바 또는 링).
문서 라이브러리 — 버전, 태그, 소유자, 최신성, 정렬 및 일괄 선택이 가능한 검색 및 필터링 가능한 문서 인벤토리.
환경 변수 목록 — 환경 변수 및 비밀 정보를 위한 마스킹된 키/값 목록 (행별 표시 및 복사 기능 포함).
파일 트리 — git 상태 배지 및 지연 디렉토리 로딩이 적용된 트리 컴포넌트용 파일 탐색기 프리셋.
플로우 캔버스 — 시각적 DAG 워크플로우를 구축하고 실행하기 위한 이동 및 확대/축소 가능한 캔버스.
플로우 컨트롤 — 페어드 플로우 캔버스를 위한 확대/축소, 맞춤, 잠금 버튼 클러스터.
플로우 미니맵 — 페어드 플로우 캔버스를 위한 드래그 가능한 뷰포트 사각형이 있는 코너 개요 지도.
플로우 노드 — 워크플로우 노드 카드 (헤더, 상태 표시, 플로우 캔버스용 연결 핸들 포함).
흐름 실행 상태 — 실행 상태 장식(decoration)을 흐름 캔버스에 표시하고 간결한 단계 요약 스트립을 보여줍니다.
깔때기 — 첫 번째 단계에 정규화된 막대로 단계별 전환 이탈률을 보여줍니다.
게이지 — 단일 값을 방사형, 링 또는 선형 미터로 보여줍니다.
히트맵 — 값의 매트릭스 또는 달력 그리드를 크기 조정 가능한 캔버스 히트맵으로 렌더링합니다.
페이지네이션 — 편집 가능한 페이지 이동 및 항목 범위 요약이 포함된 제어된 페이지 탐색입니다.
조건 빌더 — 테이블 또는 대시보드 데이터용 조합형 구조화된 쿼리 빌더로, 필드/연산자/값 조건 행과 AND/OR 조합기를 결합합니다.
시퀀스 스트립 — 선택적 마커와 함께 범주형 상태의 시퀀스를 색상 셀로 시각화하는 컴팩트한 항목별 스트립.
스파크라인 — 데이터 시리즈에 대한 라인, 채워진 영역 또는 막대로 컴팩트한 인라인 SVG 추세를 플롯합니다.
통계 지표 — 단일 KPI를 단위, 추세 칩, 상세 내역 행 및 선택적 스파크라인과 함께 표시합니다.
테이블 — 정렬 가능한 헤더, 선택, 필터링 및 페이지네이션이 포함된 표현형 데이터 테이블.
타임라인 — 감사 추적, 에이전트 기록 및 변경 로그를 위한 과거 이벤트 행의 연결된 시퀀스.
타임라인 항목 — 색상 코딩된 마커, 제목, 타임스탬프 및 설명을 포함하는 타임라인의 단일 이벤트 행.
트리 — 그래프, 문서 또는 파일 트리를 탐색하기 위한 확장/축소 계층 구조.
트리 노드 — 트리 내의 단일 노드와 그 자식에 대한 재귀적 트리 항목 행 렌더러.
워드 클라우드 — 가중치에 따라 각 단어를 조정하는 제로 의존성 SVG 태그 클라우드.
데이터 그리드 — 정렬, 필터링, 그룹화, 페이지네이션 및 선택 기능이 내장된 대규모 또는 서버 백업 데이터셋용 가상화 데이터 그리드.

차트

막대 차트 — 수직 또는 수평 막대를 사용하여 카테고리 간 값을 비교합니다.
상자 그림 — 사전 계산된 5개 숫자 통계 요약에서 분포를 요약합니다.
버블 차트 — x, y 위치 및 버블 반경을 사용하여 포인트당 세 가지 차원을 플롯합니다.
차트 — 라인, 막대, 파이 및 기타 데이터 시각화를 구동하는 핵심 Chart.js 래퍼.
도넛 차트 — 원형의 세그먼트로 부분 대 전체 비율을 보여줍니다.
히스토그램 — 숫자 값을 동일한 너비의 버킷으로 분류하여 분포를 드러냅니다.
라인 차트 — 하나 이상의 연결된 시리즈를 연속 축에 걸쳐 추적합니다.
라이트 차트 — chart.js가 필요 없는, 순수 SVG로 렌더링되는 의존성 없는 막대 및 라인 차트
파이 차트 — 전체 대비 한 시리즈의 비율을 보여주는 비례 파이 차트
극 영역 차트 — 각 카테고리를 값에 따라 크기가 조정된 웨지(wedge)로 플로팅하는 극 영역 차트
레이더 차트 — 방사형 그리드에서 하나의 시리즈의 여러 측정 항목을 비교하는 레이더 차트
산점도 차트 — 선형 축상의 원시 x/y 좌표 쌍의 산점도

레이아웃 및 탐색

아코디언 — 여러 개의 패널을 그룹화하고, 선택적으로 여러 패널을 동시에 열 수 있게 합니다.
아코디언 항목 — 아코디언 그룹에 배치되도록 설계된 접거나 펼칠 수 있는 패널.
앱 레일 — 전체 표시, 아이콘만 표시, 모바일 오버레이 상태에 맞춰 조정되는 반응형 탐색 레일.
앱 레일 그룹 — 앱 레일 내의 내비게이션 항목을 그룹화하는 제목이 지정되고 선택적으로 접을 수 있는 섹션.
앱 레일 항목 — 앱 레일의 아이콘 및 레이블 내비게이션 항목 (아이콘 전용 축소 상태 포함).
브레드크럼 — 페이지 계층 구조 내에서 사용자의 위치를 보여주는 반응형 내비게이션 경로
브레드크럼 항목 — 브레드크럼 내비게이션 경로의 링크 또는 현재 페이지 레이블
버튼 그룹 — 관련 액션 버튼들을 하나의 반응형 레이블 클러스터로 그룹화합니다.
카드 — 헤더, 미디어, 푸터, 액션 슬롯을 갖춘 테두리 콘텐츠 표면.
캐러셀 — 키보드 탐색, 표시기, 루핑, 자동 재생 기능이 있는 접근 가능한 단일 슬라이드 캐러셀.
캐러셀 항목 — 캐러셀 자식 요소에 일관된 항목 스타일을 제공하는 선택적 의미론적 슬라이드 래퍼.
명령어 팔레트 — 키보드 탐색 및 단축키가 있는 검색 가능한 애플리케이션 명령어 메뉴.
컨트롤 그룹 — 혼합된 폼 컨트롤과 액션 버튼을 하나의 반응형 중앙 정렬된 툴바 행으로 그룹화함.
대시보드 그리드 — 레이아웃 항목을 배치하고 이동, 크기 조정 및 충돌 요청을 방출하는 반응형, 키보드 접근 가능한 제어 위젯 그리드.
상세 정보 — 요약 아래의 콘텐츠를 표시하기 위해 확장되는 접근 가능한 표시 패널.
도킹 패널 — 기존 레이아웃의 한쪽 가장자리에 도킹되는 크기 조정 및 접을 수 있는 패널.
드릴다운 패널 — 차트 또는 테이블 데이터에서 관련 증거, 문서, 엔티티 또는 에이전트 실행으로 이동하는 제어된 탐색 셸이며, 브레드크럼 경로를 포함함.
드롭다운 항목 — 드롭다운 메뉴 내부의 단일 액션 행에 대한 Web Awesome 호환 별칭.
필터 바 — Lyra 입력 필드와 제거 가능한 칩으로 구성되며, 초기화 및 로딩 상태를 갖춘 대시보드 필터 행.
메뉴 — 로빙 포커스와 중첩된 하위 메뉴를 가진 액션 항목의 인라인 의미론적 메뉴.
메뉴 항목 — 선택적 아이콘, 체크박스 또는 파괴적 스타일을 가진 메뉴의 단일 액션 행.
재정렬 항목 — 재정렬 목록 내부의 단일 행으로, 임의의 슬롯된 콘텐츠와 함께 위/아래로 이동 버튼을 쌍으로 묶음.
재정렬 목록 — 행별 버튼 또는 Ctrl/Cmd+Arrow 단축키를 통해 이동 가능한 범용 재정렬 목록.
메뉴 레이블 — 메뉴 목록 내 관련 항목을 그룹화하는 비대화형 섹션 제목을 추가합니다.
메뉴바 — 전체 키보드 탐색이 가능한 제목이 지정된 드롭다운 메뉴를 가진 수평 애플리케이션 메뉴바.
메뉴바 항목 — 슬롯된 메뉴를 열거나 일반 동작으로 작동하는 최상위 메뉴바 제목.
내비게이션 메뉴 — 공간이 부족할 때 메뉴 토글 뒤로 접히는 링크 및 플라이아웃 패널의 사이트 헤더 내비게이션.
내비게이션 메뉴 항목 — 페이지 링크 또는 플라이아웃 패널을 여는 표시 버튼인 내비게이션 메뉴 항목.
페이지 — 뷰포트가 아닌 자체 할당 크기에 따라 데스크톱 컬럼과 모달 모바일 드로어 사이를 전환하는 의미론적 애플리케이션 셸.
반응형 패널 — 데스크톱에서는 인라인으로 콘텐츠를 배치하거나 모바일에서는 오버레이 시트로 표시합니다.
스크롤러 — 카드 및 탭 행에 대한 선택적 이전/다음 컨트롤이 있는 반응형 오버플로우 표면.
세그먼티드 — 한눈에 여러 레이블이 지정된 옵션 중 하나를 선택하는 단일 선택 버튼 행.
멀티 스플릿 — 선택적 반응형 축소 기능을 가진 드래그 가능한 패널로 대시보드를 분할합니다.
스플릿 패널 — 단일 구분 기호를 가진 두 개의 드래그 가능한 창으로 콘텐츠를 분할하며, multi-panel lr-multi-split의 더 간단한 대안입니다.
스텝퍼 — 단계별 상태와 클릭하여 이동하는 기능을 갖춘 순서가 지정된 다단계 마법사로 사용자를 안내합니다.
탭 — 전체 키보드 탐색이 가능한 한 번에 하나의 라이트-DOM 패널을 보여주는 탭 스트립.
탭 — 패널 및 이름 속성을 통해 탭 그룹 내의 일치하는 패널과 쌍을 이루는 Web Awesome/Shoelace 호환 탭 설명자.
탭 패널 — Web Awesome/Shoelace와 호환되는 패널 설명자로, name 및 panel 속성을 통해 tab-group 내부의 일치하는 탭과 쌍을 이룹니다.
가상 목록 — 대규모 스크롤 가능한 컬렉션에 대해 화면에 보이는 행만 렌더링하는 창 목록 호스트
위젯 — 선택적 접기 및 전체 화면 확장 토글이 있는 제목 패널 셸

오버레이 및 피드백

토스트 — 토스트 알림을 화면 모서리에 고정하는 스태킹 영역.
토스트 항목 — 심각도 강조 표시, 선택적 아이콘 및 자동 해제 타이머가 있는 단일 해제 가능한 토스트.
칩 — 태그, 필터 또는 범위를 위한 작고 알약 모양의 요소로, 선택적으로 제거하거나 토글할 수 있음.
칩 그룹 — 칩 세트를 감싸며, 제한을 초과할 경우 선택적 +N 오버플로우 토글을 제공함.
알림 — 기본적으로 닫혀 있으며, 시간 경과에 따른 자동 숨김 및 선택적 공유 토스트 스택으로의 핸드오프가 가능한 알림 메시지
배지 — 상태, 카운트 또는 카테고리를 인라인으로 표시하는 간결한 상태 레이블
콜아웃 — 상태, 경고 및 오류 콘텐츠를 위한 인라인 메시지 표면이며, 해제 가능합니다.
컨텍스트 메뉴 — 모든 영역을 오른쪽 클릭, 길게 누르기 또는 Shift+F10 대상이 되어 액션 메뉴를 여는 기능을 합니다.
다이얼로그 — 확인, 폼, 기타 인터럽트 작업에 사용되는 포커스 트랩 모달 오버레이.
드로어 — 필터 또는 컨텍스트 제어를 위해 뷰포트 가장자리에서 모달 패널을 슬라이드합니다.
드롭다운 — 액션 목록을 사용자 소유 트리거에 고정하는 메뉴 역할의 팝오버
빈 상태 — 아이콘, 메시지, 선택적 액션을 통해 데이터가 없거나 비어있는 상태를 전달합니다.
키보드 키 — 키보드 단축키를 키캡으로 렌더링하는 플랫폼 인식 칩
팝오버 — 컨텍스트 콘텐츠 및 제어를 위한 클릭 트리거, 라이트 디스미스 플로팅 표면
팝업 — 플로팅 패널을 앵커에 정렬 상태로 유지하는 저수준 고정 위치 프리미티브. 팝오버 및 툴팁 컴포넌트의 기반 엔진과 동일합니다.
진행 표시줄 — 선택적 값을 가진 결정적 또는 비결정적 수평 진행 표시기.
진행 링 — 중앙 레이블이 있는 원형 결정형 또는 비결정형 진행 표시기.
평점 — 키보드 접근 가능한 분수 정밀도 부분 채우기 별점
스켈레톤 — 콘텐츠 로딩 중 임시로 표시되는 애니메이션 로딩 플레이스홀더.
스피너 — 비결정적이고 애니메이션화된 바쁜 상태 표시기로 진행 중인 백그라운드 작업을 알립니다.
태그 — 키워드 또는 카테고리 레이블링을 위한 배지 처리의 의미론적 별칭
툴팁 — 호버 및 포커스 트리거가 되어 사용자 소유 트리거를 설명하는 툴팁

문서 및 파일 뷰어

아카이브 뷰어 — 내용을 추출하지 않고 ZIP 아카이브 내부의 파일 이름과 압축되지 않은 크기를 나열합니다.
캘린더 뷰어 — .ics 캘린더 파일의 이벤트를 요약, 시간, 위치로 구문 분석하고 렌더링합니다.
연락처 뷰어 — vCard 문서를 가져와 연락처당 접근 가능한 카드 하나를 렌더링합니다.
CSV 뷰어 — CSV 파일을 가져와 가상화되고 스크롤 가능한 시트에 행을 렌더링합니다.
데이터셋 뷰어 — 구분된 텍스트를 가져와 유형화되고 접근 가능한 데이터 테이블로 렌더링합니다.
문서 비교 — 두 문서 버전을 나란히 또는 인라인으로 비교하며, 텍스트 diff 뷰와 렌더링된 문서 미리보기를 결합합니다.
문서 미리보기 — MIME 유형을 기반으로 문서 또는 첨부 파일을 인라인으로 미리보며, 다운로드 대체 기능을 제공합니다.
문서 뷰어 — 플러그인 가능한 MIME 유형 렌더러 레지스트리를 사용하여 다이얼로그에서 문서를 표시합니다.
DOCX 뷰어 — mammoth 컨버터를 통해 DOCX 파일을 정리된 의미론적 HTML로 렌더링합니다.
전자책 뷰어 — 선택적 epub.js 피어를 사용하여 챕터 탐색이 가능한 EPUB을 렌더링합니다.
이메일 뷰어 — 헤더, 정리된 본문, 첨부 파일이 포함된 .eml 메시지를 구문 분석하고 렌더링합니다.
GeoJSON 뷰어 — GeoJSON 파일의 피처를 가져오고, 유효성을 검사하며, 지도에 렌더링합니다.
하이라이트 레이어 — 위치 지정된 문서 콘텐츠 위에 활성화 가능한 하이라이트 사각형을 그리는 오버레이입니다.
HTML 뷰어 — URL을 가져와 이를 정리한 후 안전하게 HTML을 렌더링합니다.
포함 — HTML 조각을 가져와 정리된 light-DOM 페이지 콘텐츠로 트랜스클루드합니다.
노트북 뷰어 — 마크다운, 코드 및 풍부한 셀 출력을 구성하는 읽기 전용 Jupyter 노트북 렌더러.
페이지 레일 — 페이지 주소화된 문서를 페이지 탐색용으로 가상화된 수직 썸네일 레일.
PDF 뷰어 — 확대/축소, 페이지 매김, 선택 가능한 텍스트 레이어를 갖춘 PDF 페이지를 가져와 렌더링합니다.
PPTX 뷰어 — PowerPoint PPTX 프레젠테이션을 위한 최선의 노력 클라이언트 측 뷰어.
스프레드시트 뷰어 — 시트 탭과 가상화된 행을 갖춘 .xlsx 및 레거시 .xls 워크북을 가져와 렌더링합니다.
SVG 뷰어 — URL에서 인라인의, 정리된 SVG 문서를 가져와 안전하게 렌더링합니다.
XML 뷰어 — XML 문서를 검사하기 위한 접기 가능하고 복사 가능한 트리 뷰.

미디어 및 파일

첨부 파일 칩 — 메시지에 첨부된 파일에 대한 간결한 칩 (업로드 상태, 진행률 및 재시도 기능 포함).
아바타 — 사람 또는 엔티티의 아이콘, 이미지 또는 이니셜 대체 표시를 보여주는 작은 식별자
애니메이션 이미지 — reduced motion을 준수하는 재생/일시 정지 컨트롤과 함께 애니메이션 GIF/APNG/WebP를 재생합니다.
애니메이션 — 이름 지정된 프리셋 또는 사용자 지정 키프레임으로 슬롯된 자식을 선언적으로 애니메이션합니다.
첨부 파일 트리거 — 채팅 작성기에서 파일 선택기 또는 기능 메뉴를 여는 간결한 첨부 기능.
A/V 플레이어 — 동기화된 대본, 파형, 재생 속도 제어 기능을 갖춘 오디오/비디오 플레이어.
아바타 그룹 — 겹치는 아바타를 컴팩트한 행으로 쌓고 추가 항목을 +N 배지로 축소합니다.
드롭 존 — 자체 파일 선택기 없이 모든 영역을 파일 드롭 타겟으로 변환하는 드래그 앤 드롭 래퍼입니다.
파일 아이콘 — MIME 유형 또는 파일 이름에서 결정된 지역화된 파일 유형 배지입니다.
파일 입력 — 드래그 앤 드롭 및 클릭하여 탐색하는 드롭존으로, 선택된 파일을 방출합니다.
국기 — 테마 지정 가능하며, 선택적으로 원형 프레임에 렌더링되는 국가 또는 언어 국기입니다.
이미지 비교기 — 키보드 접근 가능한 구분선을 슬라이드하여 이전 및 이후 화면을 나란히 비교합니다.
이미지 뷰어 — 레이블이 지정된 영역 하이라이트와 선택적 주석이 포함된 전체 패닝/줌 래스터 이미지 뷰어입니다.
라이트박스 — 이전/다음 탐색 및 확대/축소 기능이 있는 전체 화면 모달 이미지 뷰어
지도 — 선언적 범례, 지리 정보(choropleth), 마커가 포함된 MapLibre GL 지도 래퍼
미디어 카드 — 채팅 메시지 내 이미지, 비디오 또는 파일 첨부 파일의 인라인 미리보기.
패닝 및 줌 — 슬롯된 콘텐츠 또는 단일 이미지를 경계가 있는 확대/축소 레벨로 패닝하고 확대/축소할 수 있는 스크롤 가능한 뷰포트.
시퀀스 재생 — 고정된 타이머에 따라 인덱스를 범위로 이동시키는 재생/일시 정지 트랜스포트.
QR 코드 — 모든 값을 캔버스에 렌더링되는 스캔 가능한 QR 코드 심볼로 인코딩합니다.
비디오 — 사용자 지정 컨트롤, 선택 가능한 캡션 및 썸네일 미리보기가 있는 인라인 비디오 플레이어.
비디오 재생 목록 — 순차적인 비디오를 탐색 가능한 재생 목록에서 재생하며, 각 비디오가 완료됨에 따라 자동으로 진행됩니다.
확대 가능한 프레임 — 개별 확대/축소 컨트롤이 있는 샌드박스 iframe 미리보기; 이전 슬롯/이미지 검사 표면은 좌우 패닝 및 줌이 가능합니다.

유틸리티

교차 관찰자 — 슬롯된 타겟이 뷰포트에 진입하거나 벗어날 때 네이티브 교차 항목을 방출함.
변경 관찰자 — 요소 및 속성 변경을 위해 슬롯된 DOM을 관찰하며, 네이티브 변경 기록을 전달함.
리사이즈 옵저버 — 슬롯된 요소를 감지하고 시각적 크롬 없이 유형화된 리사이즈 이벤트를 방출합니다.
복사 버튼 — 체크 표시 피드백과 함께 텍스트 값을 클립보드에 복사하는 아이콘 전용 버튼.
차이 비교 뷰어 — 실제 두 문자열 라인 차이를 색상 코드가 지정된 unified-diff 출력으로 렌더링합니다.
구분선 — 콘텐츠를 수평 또는 수직으로 분할하는 테마 가능한 의미론적 구분자.
내보내기 버튼 — 테이블 데이터를 CSV 또는 JSON으로, 단일 형식 또는 형식 메뉴를 통해 다운로드합니다.
바이트 형식 지정 — 조정 가능한 단위 단계 및 정밀도를 갖춘 로케일 인식 바이트 크기 형식 지정.
날짜 형식 지정 — Intl.DateTimeFormat을 통한 로케일 인식 날짜 및 시간 형식 지정.
숫자 형식 지정 — Intl.NumberFormat을 통한 로케일 인식 숫자, 통화 및 압축 형식 지정.
아이콘 — 내장된 이름 지정 경로 세트에서 종속성 없이 선명한 인라인 SVG 글리프를 렌더링합니다.
JSON 뷰어 — 모든 JSON 페이로드를 검사할 수 있는 접고 펼치기 가능한, 복사 가능한 트리 뷰
알려진 날짜 — 사용자가 이미 알고 있는 날짜를 위한 일/월/년 세 필드 입력
라이브 영역 — 스크린 리더 발표를 제어하는 시각적으로 숨겨진 ARIA 라이브 영역
언급 팝오버 — 텍스트 필드에서 @-멘션 및 슬래시 명령어에 대한 커서 기반 자동 완성.
투표 상태 — 내장된 일시 중지 및 재개 제어와 함께 다음 예약된 새로고침까지의 카운트다운.
무작위 콘텐츠 — A/B 카피 및 추천사를 위해 슬롯된 자식 요소들을 무작위 또는 순차적으로 회전시킵니다
상대 시간 — 자체적으로 새로고침되는 로케일 인식 상대 타임스탬프를 표시합니다.
투어 — 첫 사용 제품 온보딩을 위한 스포트라이트 및 단계별 안내 워크스루.
시각적으로 숨김 — 콘텐츠를 시각적으로 숨기면서 스크린 리더가 사용할 수 있도록 유지하고, 포커스 시 다시 보이게 합니다.