Components
35 families · 106 sub-components in 7 categories · 91% covered (96 with story, API, usage and accessibility).
Forms & input 36 · 94%
ButtonButtons trigger actions; one primary per view, the rest default or ghost.5 sub-components · 100% coveredText fieldSingle- and multi-line text entry with label, hint and error.10 sub-components · 100% coveredSelectTwo field types — Select for a closed list, Record select for a searchable list of records; both with an optional multiple mode. Never a native select.7 sub-components · 71% coveredChoiceBinary and small-set choices: checkbox, radio, switch, segmented and chips.6 sub-components · 100% coveredDate & timeTyped and picked dates, times and ranges sharing one calendar.6 sub-components · 100% coveredFilterNotion-style filter bar: every chip carries a value, no empty chips.2 sub-components · 100% covered
Overlays & dialogs 11 · 91%
DialogModal and modeless windows for focused tasks, from confirm to full form.7 sub-components · 86% coveredPopoverAnchored overlay layers: the Popover building layer (action menus → Menu button, choice → Picker menu), tooltips and entity previews.3 sub-components · 100% coveredCommand paletteThe single ⌘K surface: search, commands and page actions in one overlay, results on the canonical Item list.1 sub-component · 100% covered
Navigation 12 · 92%
App shellApplication frame: sidebar navigation, top bar and the drawer slot.5 sub-components · 100% coveredSection top barOne bar above every list or record: title, chips, search and actions.5 sub-components · 80% coveredTabsHorizontal tab strips for switching views within a page or record.2 sub-components · 100% covered
Records & data 25 · 84%
Item listThe canonical listing: one row pattern for tasks, e-mails, activities, notes, files and queues.2 sub-components · 100% coveredRecord railThe record panel: the single source of truth for its fields, one card.1 sub-component · 100% coveredTableSegment tables with sortable headers, clipped cells and summary row.3 sub-components · 100% coveredTask listTask rows led by priority and state glyph, no hairline or header, one linked entity, owner and due date; compact or full mode.1 sub-component · 100% coveredEmail listMailbox rows with sender, subject, snippet and quick actions.1 sub-component · 100% coveredAttachmentOne shape of a file attachment everywhere: name, size and context actions in a 28px chip.2 sub-components · 100% coveredVoice messageMedia messages in a chat bubble — voice note, round video note and 16:9 video — with one shared player and a collapsible transcript.3 sub-components · 100% coveredDeal cardPipeline board card summarising a deal.1 sub-component · 100% coveredStat tileKPI tile with value, label and target; hairline, no shadow.2 sub-components · 100% coveredChartColumn or bar chart for structured numbers that come from a tool or a query: a pipeline by stage, volume by month, share by person.1 sub-component · 100% coveredSection blockTitled block with count and actions used to group record content.1 sub-component · 100% coveredTimelineActivity axis of a record: events, changes and the next-step nudge.1 sub-component · 100% coveredNote cardCard of a note with author, time, title and body excerpt.1 sub-component · 100% coveredMeeting analysisCharts of the meeting analysis and coaching module.5 sub-components · 20% covered
Identity 6 · 83%
Identity marksOne mark for every record: initials or a photo for a person and a company, a typed tile for everything else, a generated face for our own users.5 sub-components · 80% coveredEntity referenceOne component for referring to a record: default, mini or removable.1 sub-component · 100% covered
States & feedback 13 · 92%
Empty stateWhat a list or panel shows when there is nothing yet — or when loading it failed.1 sub-component · 100% coveredLoadingSkeletons and loaders that hold layout while data arrives.6 sub-components · 100% coveredToastTransient bottom notifications for finished or failed actions.1 sub-component · 100% coveredNotificationsBell panel listing unread and past notifications.1 sub-component · 100% coveredStatusSmall indicators of state and quantity; use sparingly.4 sub-components · 75% covered