. | Accordion anatomy; 1header; 2 icon; 3 panel |
. | breadcrumb anatomy; 1 page link; 2 separator |
. | Contained button anatomy; A Text label; B Container; C Icon (optional) |
. | Outlined button anatomy; A Text label; B Container; C Icon (optional) |
. | Icon button anatomy; B container optional; C icon |
. | Checkbox anatomy; 1 Group label optional; 2 Checkbox input; 3 Checkbox label |
. | Code Snippet; 1 Snippet text; 2 Copy button optional; 3 Show more button optional |
. | Content switcher; 1 Selected content tab; 2 Content tab; 3 Text label |
. | Data base anatomy; 1 Title and description; 2 Toolbar; 3 Column header; 4 Table row; 5 Pagination table bar |
. | Anatomy of date pickers; 1 Label; 2 Date field; 3 Date format; 4 Icon; 5 Calendar; 6 Month and year controls; 7 Weekday; 8 Previous and next month controls; 9 Day |
. | 1 Label; 3 AM/PM selector; |
. | Dropdown anatomy 1 Label; 2 Helper text; 3 Field; 4 Option; 5 Menu |
. | File uploader anatomy; 1 Heading; 2 Description; 3 Button or drop zone label; 4 Uploaded file; 5 x: The delete x icon will remove the uploaded file. |
. | Form anatomy 1 Labels; 2 Input fields; 3 Helper text; 4 Placeholder text; 5 Validation; 6 Action |
. | Inline loading 1 Loading status; 2 Label optional |
. | Link anatomy; 1 Label |
. | Modal anatomy; 1 Header; 2 Body; 3 Footer; 4 X; 5 overlay |
. | Dropdown; 1 Label; 2 Helper text; 3 Field; 4 Option; 5 Menu; |
. | Notification anatomy; 1 Icon; 2 Title; 3 Action actionable only; 4 Close button; 5 Message; 6 Timestamp optional for toast |
. | Number input anatomy; 1 Label; 2 Numeric value; 3 Helper text; 4 Field; 5 Subtract icon; 6 Add icon; 7 Status icon; 8 Error or Warning text |
. | Radio button anatomy; 1 Group label optional; 2 Radio button input; 3 Radio button label |
. | Structured list anatomy; 1 column header; 2 Data now |
. | Line tabs anatomy; A Label; B Indicator; D Container; |
. | Contained tab with icons only B Indicator; C Icon; D Container; |
. | Contained tabs with icon and secondary label anatomy; A Label; B Indicator; C Icon optional; D Container; E Secondary label optional; |
. | Text input anatomy; 1 Label; 2 Value; 3 Helper text; 4 Field; 5 Input requirements optional; 6 Character counter text area only; 7 Resize handle text area only; |
. | Tile anatomy; 1 Container; 2 Content area |
. | Definition tooltip anatomy; 1 UI trigger; 2 Caret tip; 3 Container; |
. | Icon button tooltip anatomy; 1 Icon button; 2 Caret tip; 3 Container; |
. | Standard tooltip anatomy; 1 UI trigger button; 2 Caret tip; 3 Container; |
. | UI shell header anatomy; 1 Hamburger menu; 2 Header name; 3 Header links; 4 Sub-menu; 5 Header utilities; 6 Switcher |
. | UI Shell right panel; 1 switcher item; 2 switcher divider; |
. | UI shell left panel; 1 sub-menu; 2 expanded sub-menu; 3 sub-menu items; 4 link |
. | Toggletip anatomy; 1 UI trigger button; 2 Tip; 3 Content area; 4 Popover containers; |
. | Treeview anatomy; 1 branch node; 2 leaf node; 3 caret icon; 4 node icon |