컴포넌트

51개의 공개 컴포넌트와 13개의 기능 실험. 모든 영상은 E2E harness가 구동하는 실제 zenit Storybook 창의 Metal drawable에서 녹화했으며, 소스와 Props 표는 저장소에서 그대로 추출합니다.

Buttonui.widgets.Button기본, 보조, 위험 동작, 링크형, 아이콘 전용 버튼.Checkboxui.widgets.Checkbox선택 안 됨, 선택됨, 불확정 상태를 갖는 독립 불리언 선택.Switchui.widgets.Switch즉시 적용되는 설정을 위한 토글.Radioui.widgets.RadioGroup상호 배타적인 옵션에서 값 하나를 선택합니다.Sliderui.widgets.Slider연속 또는 단계 범위에서 값을 선택합니다.Rateui.widgets.Rate별점 또는 개수가 정해진 평가.NumberStepperui.widgets.NumberStepper수량과 파라미터를 정밀하게 증감합니다.Inputui.widgets.Input한 줄 텍스트, 이메일, 비밀번호, 검색 입력.Textareaui.widgets.Textareahelper, error, 비활성 상태를 지원하는 여러 줄 편집.Selectui.widgets.Select단일 선택, 다중 선택, 지우기 가능, 검색 가능한 선택기.Form CompositionInput · Select · Button같은 크기 단계의 Input, Select, Button 조합: 필터 툴바와 업무 폼.ComboBoxui.widgets.ComboBox검색과 필터링이 가능하고 값을 다시 채워 넣는 조합 입력.TagsInputui.widgets.TagsInput키보드로 여러 token을 연속 입력합니다.FileUploadui.widgets.FileUpload파일 선택과 드롭 영역.DatePickerui.widgets.DatePicker날짜를 입력하거나 캘린더에서 선택합니다.DateRangePickerui.widgets.DateRangePicker시작일과 종료일을 선택합니다.Formui.widgets.FormOf(T)타입이 지정된 폼 상태, 필드 메타데이터, 검증 시점.Badgeui.widgets.Badge낮은 강조의 상태, 개수, 시맨틱 색상 라벨.Tagui.widgets.Tag닫을 수 있거나 읽기 전용인 분류 라벨.Chipui.widgets.Chip간결한 선택지, 필터 조건, 아이콘 token.Cardui.widgets.Card제목, 본문, 상호작용 표면을 하나의 시각 단위로 묶습니다.Alertui.widgets.Alert페이지 안에 유지되는 피드백.Progressui.widgets.Progress확정 진행률과 불확정 작업 상태.Spinnerui.widgets.Spinner짧은 로딩 대기를 위한 간결한 애니메이션.Skeletonui.widgets.Skeleton콘텐츠가 로드되는 동안 표시되는 자리표시자 골격.Timelineui.widgets.Timeline시간이나 상태별로 세로 이벤트를 표시합니다.Breadcrumbui.widgets.Breadcrumb현재 위치와 상위 경로를 보여 줍니다.Stepsui.widgets.Steps여러 단계 작업의 완료, 현재, 대기 상태를 보여 줍니다.Treeui.widgets.Tree계층 데이터, 파일 트리, 펼칠 수 있는 구조.Tableui.widgets.Table고정 열 정의와 사용자 정의 cell renderer를 갖춘 기본 테이블.DataTableui.widgets.DataTable필터, 페이지 이동, 열 동작을 갖춘 데이터 테이블.Calendarui.widgets.Calendar월 보기에서의 날짜 탐색과 선택.Markdownui.widgets.Markdown지원되는 Markdown 부분 집합을 네이티브 노드로 렌더링합니다.Iconsui.system_icons프로바이더에 독립적인 시맨틱 아이콘 역할, 크기, 색조.Tabsui.widgets.Tabs같은 맥락 안에서 동등한 뷰를 전환합니다.Accordionui.widgets.Accordion섹션을 접고 펼칩니다.Menuui.widgets.Menu단축키 힌트가 있는 컨텍스트 동작 목록.DropdownMenuui.widgets.DropdownMenu버튼에서 열리는 명령 모음.Notificationui.widgets.Notifier작업을 방해하지 않는 알림: 아홉 가지 유형, 진행률, 액션 버튼, 스택, 여덟 개의 도킹 위치.Tooltipui.widgets.Tooltip컨트롤에 짧은 보충 설명을 제공합니다.Popoverui.widgets.PopoverTooltip보다 풍부한 임시 콘텐츠를 담습니다.Modalui.widgets.Modal차단형 작업, 확인, 집중된 맥락.Sheetui.widgets.Sheet창 가장자리에서 밀려 들어오는 보조 패널.GlassBoxui.widgets.GlassBox실제 backdrop blur를 사용하는 유리 표면.Dividerui.widgets.Divider가로, 세로, 라벨이 있는 구분선.Stackui.widgets.HStack / VStack자주 쓰는 가로, 세로 배치.Layout / Box Modelui.box박스 모델, 백분율, 절대 위치, Flex / Grid, 클리핑의 커버리지 매트릭스.VirtualListui.widgets.VirtualList대량의 균일한 높이 데이터 중 보이는 구간만 마운트합니다.VirtualList (Dynamic)ui.widgets.VirtualList행 높이가 다른 가상 목록.ScrollAreaui.widgets.mountScrollArea직접 그리는 스크롤, 스크롤바, 프로그래밍 방식 위치 지정.Gridui.widgets.mountGrid2차원 행·열 데이터와 사용자 정의 cell renderer.GlassLabui.widgets.GlassBoxGlassBox 광학 파라미터 실험대: 굴절, 베젤 너비, 확대.GlassIslandsui.widgets.GlassBox하나의 배경 위에 겹친 여러 유리 섬.GlassMotionui.widgets.GlassBox유리의 변형과 스크롤 중 떠 있는 툴바.GlassChromeui.widgets.GlassBox앱 chrome: 스크롤되는 콘텐츠 위의 유리 제목 표시줄과 툴바.CanvasEventsui.events캔버스 수준 이벤트: 스크롤, 확대 제스처, 드래그, 클립보드 PNG 왕복.Dragui.interaction드래그와 가로 resize 핸들.Gesturesui.interaction싱글, 더블, 트리플 클릭과 길게 누르기의 제스처 중재.AnimControlsui.fx애니메이션 제어: yoyo, 타임라인, 키프레임, 스프링.VectorPathui.path벡터 경로 기하: 선, 채우기, 히트 테스트.BlendModesui.box블렌드 모드와 불투명도 합성.Emojiui.text컬러 이모지, ZWJ 시퀀스, 피부색 수정자.RTLui.text아랍어, 히브리어, 라틴 문자 혼합 텍스트.WordNavui.widgets.Textarea문자 체계를 넘나드는 단어 단위 커서 이동.