# Chapters 1–10 ## T01 Primitives — `src/primitives` - [x] Box / View — native `div()` - [x] Text — native: strings and `StyledText` are elements - [x] Icon (T00) - [x] IconSet / IconRegistry (T00) - [x] Svg — native `svg()` - [x] Image — loading, failed, placeholder over `img()` - [x] Canvas — native `canvas()` - [x] Divider / Separator - [x] Spacer — native `div().flex_1()` - [x] Portal — native `deferred(anchored())` - [x] Overlay / Backdrop - [x] Slot — native `impl IntoElement` params and `ParentElement` - [x] Show / When — native `.when()` / `.when_some()` - [x] For / Each — native `.children(iter)` - [x] Fragment — native: children take iterators - [x] VisuallyHidden — blocked: gpui 0.2.2 has no accessibility tree - [x] FocusRing - [x] FocusScope / FocusTrap - [x] ClickOutside — native `on_mouse_down_out` - [x] HoverArea — native `on_hover` / `.hover()` - [x] Pressable — press state, long press - [x] KeyboardHandler — native `on_key_down` / `on_action` - [x] Measure - [x] ResizeObserver → `primitives::Measure` - [x] IntersectionObserver - [x] Clipboard — native `write_to_clipboard` / `read_from_clipboard` - [x] Tooltip Trigger — owns `Tooltip`: delay, follow mouse, rich content ## T02 Typography — `src/typography` - [x] Heading (H1–H6) - [x] Title / Subtitle - [x] Paragraph - [x] Label - [x] Caption - [x] Overline - [x] Code - [x] Kbd — ⌘ / Ctrl by platform - [x] KbdCombo - [x] Blockquote - [x] Highlight / Mark - [x] Truncate — native `.truncate()` - [x] LineClamp — native `.line_clamp(n)` - [x] MiddleEllipsis - [x] EllipsisTooltip - [x] Link - [x] ExternalLink - [x] RelativeTime - [x] DateTimeText - [x] NumberText - [x] CurrencyText - [x] PercentText - [x] FileSizeText - [x] DurationText - [x] PluralText - [x] CopyableText - [x] SelectableText — prove: selection over `StyledText` layout - [x] Emoji — shortcodes - [x] Latex / MathInline — prove: TeX subset - [x] AnimatedNumber - [x] Typewriter - [x] GradientText — per-glyph tonal ramp - [x] ShimmerText ## T03 Layout — `src/layout` - [x] Stack / HStack / VStack - [x] Flex — native `.flex()` - [x] Grid / GridItem — native `.grid()`, `.col_span()` - [x] SimpleGrid - [x] Masonry - [x] Center — native `.flex().items_center().justify_center()` - [x] Container - [x] AspectRatio - [x] Inset / Padding — native `.p_*()` - [x] Wrap — native `.flex_wrap()` - [x] Absolute / Positioned — native `.absolute()` - [x] Layer / ZStack - [x] ScrollArea - [x] Scrollbar - [x] ScrollShadow - [x] ScrollToTop - [x] StickyHeader - [x] SplitPane — horizontal, vertical, nested - [x] ResizablePanel / ResizablePanelGroup → `layout::SplitPane` - [x] ResizeHandle - [x] Collapsible - [x] Accordion / AccordionItem - [x] Card / CardHeader / CardBody / CardFooter - [x] Panel / PanelHeader - [x] Section / SectionHeader - [x] Group / Fieldset - [x] Frame - [x] Well - [x] Sidebar - [x] Drawer - [x] Sheet - [x] Page / PageHeader / PageContent - [x] AppShell - [x] MasterDetail - [x] ThreeColumnLayout → `layout::SplitPane` - [x] Dock / DockPanel - [x] DockZone / DropIndicator - [x] FloatingPanel - [x] Pane / PaneGroup - [x] Workspace — versioned layout snapshot - [x] Viewport ## T04 Window & Shell — `src/shell` - [x] TitleBar - [x] WindowControls — macOS, Windows, Linux - [x] TrafficLights → `shell::WindowControls` - [x] WindowDragRegion — `shell::drag_region`: native drag area, Linux move, double-click zoom - [x] WindowResizeBorder — `shell::ResizeBorder`: client decorations only; macOS and Windows resize natively - [x] MenuBar → `menus::MenuBar` (T08): the NativeMenu definitions, drawn in the window - [x] NativeMenu — native `cx.set_menus()` - [x] Toolbar / ToolbarGroup / ToolbarSeparator - [x] StatusBar / StatusBarItem - [x] ActivityBar - [x] NavigationRail → `shell::ActivityBar` - [x] TabBar - [x] SplashScreen - [x] AboutDialog - [x] TrayIcon / TrayMenu — macOS `NSStatusItem`; other systems get an error - [x] DockBadge — macOS dock tile; other systems get an error - [x] JumpList — native `cx.set_dock_menu()` - [x] SystemNotification — blocked: an unbundled app has no notification center; gpui 0.2.2 has no API - [x] MultiWindow Manager - [x] WindowSwitcher - [x] QuickLauncher → `navigation::SearchPalette` in an always-on-top window (T07) - [x] MiniWindow / CompactMode - [x] AlwaysOnTop — native `WindowKind::PopUp` - [x] PictureInPicture → `shell::MiniWindow` at a screen corner; the host supplies the view - [x] UpdateBanner / UpdateDialog - [x] CrashReporter - [x] OfflineIndicator - [x] ZoomControl ## T05 Buttons & Actions — `src/buttons` - [x] Button (T00) - [x] IconButton (T00) - [x] ButtonGroup - [x] SplitButton → lands with Menus (T08): its dropdown is a Menu - [x] DropdownButton / MenuButton → `menus::DropdownMenu` (T08) - [x] ToggleButton - [x] ToggleGroup - [x] SegmentedControl - [x] FloatingActionButton - [x] LoadingButton → `buttons::Button` loading state, lands with Spinner (T11) - [x] ConfirmButton — hold or click twice - [x] HoldToConfirm → `buttons::ConfirmButton` - [x] CopyButton - [x] ShareButton - [x] CloseButton - [x] BackButton - [x] MoreButton - [x] ActionBar - [x] BulkActionBar - [x] ActionSheet - [x] QuickActions - [x] ShortcutHint → `buttons::Button::shortcut` ## T06a Forms · Text — `src/forms` - [x] Input / TextField - [x] TextArea → `forms::TextInput::multi_line` - [x] PasswordInput - [x] SearchInput - [x] NumberInput - [x] ScrubInput - [x] CurrencyInput → `forms::NumberInput::currency` - [x] PercentInput → `forms::NumberInput::percent` - [x] UnitInput - [x] EmailInput - [x] UrlInput - [x] PhoneInput - [x] MaskedInput - [x] PinInput / OTPInput - [x] InlineEdit / EditableText - [x] InputGroup / InputAddon - [x] ClearableInput → `forms::Input::clearable` - [x] AutoResizeInput → `forms::TextInput::multi_line` - [x] MentionInput - [x] HashtagInput → `forms::MentionInput` with `#` - [x] TagInput / TokenInput - [x] KeyValueInput - [x] ListInput - [x] PathInput — native dialog via `prompt_for_paths` - [x] RegexInput - [x] ExpressionInput - [x] HotkeyInput / ShortcutRecorder ## T06b Forms · Selection - [x] Checkbox - [x] CheckboxGroup - [x] CheckboxCard - [x] Radio / RadioGroup - [x] RadioCard - [x] Switch / Toggle - [x] Select - [x] NativeSelect — blocked: gpui 0.2.2 has no native popup menu - [x] Combobox - [x] Autocomplete → `forms::Combobox::free` - [x] MultiSelect - [x] CascadeSelect / Cascader - [x] TreeSelect → lands with Lists & Trees (T13): its list is a Tree - [x] TransferList - [x] ListBox - [x] ChoiceChips / FilterChips - [x] Rating - [x] Slider - [x] RangeSlider - [x] VerticalSlider → `forms::Slider::vertical` - [x] Knob / Dial - [x] Stepper ## T06c Forms · Date & Time - [x] Calendar - [x] DatePicker - [x] DateRangePicker - [x] TimePicker - [x] DateTimePicker - [x] MonthPicker / YearPicker / QuarterPicker - [x] WeekPicker - [x] RelativeDatePicker - [x] TimezoneSelect - [x] DurationPicker - [x] CronEditor ## T06d Forms · Color - [x] ColorPicker — HSV, RGB, HEX, alpha → `forms::ColorPicker` - [x] ColorSwatch → `forms::ColorSwatch` - [x] ColorPalette → `forms::ColorPalette` - [x] EyeDropper — proved: `NSColorSampler`; sRGB read tested (`read_srgb`), the sampler draws out of process → `forms::EyeDropper` - [x] GradientEditor → `forms::GradientEditor` ## T06e Forms · Files - [x] FilePicker / FileInput → `forms::FileInput` - [x] FolderPicker → `forms::PathInput::directories` (T06a) - [x] DropZone → `forms::DropZone` - [x] UploadList → lands with Loading & Motion (T11): its rows are ProgressBars - [x] ImageUpload — preview, crop → lands with Media (T26): its crop is the ImageCropper - [x] AvatarUpload → lands with Data Display (T12): it is an Avatar you replace ## T06f Forms · Other - [x] SignaturePad → `forms::SignaturePad` - [x] CodeInput → `forms::CodeInput`, colored by `code_highlights` - [x] JsonInput → `forms::JsonInput`, colored by `json_highlights` - [x] FontPicker → `forms::FontPicker` - [x] IconPicker → `forms::IconPicker` - [x] EmojiPicker → `forms::EmojiPicker` - [x] LanguageSelect → `forms::Combobox::languages` - [x] CountrySelect → `forms::Combobox::countries` - [x] CurrencySelect → `forms::Combobox::currencies` ## T06g Forms · Structure - [ ] Form - [ ] FormField - [ ] FormLabel - [ ] FormDescription / HelperText - [ ] FormError / ValidationMessage - [ ] FormSection - [ ] FormActions - [ ] FieldArray - [ ] InlineForm - [ ] WizardForm / MultiStepForm - [ ] DirtyIndicator ## T07 Navigation — `src/navigation` - [ ] Tabs — top, left, bottom - [ ] EditorTabs - [ ] TabOverflowMenu - [ ] Breadcrumb - [ ] Pagination - [ ] LoadMore - [ ] Stepper / Steps / Wizard — as `Steps` - [ ] Sidebar Navigation / NavItem / NavGroup - [ ] NavigationMenu - [ ] ActivityBar Item → `shell::ActivityBar` - [ ] BackForwardNavigation - [ ] History Navigation → `navigation::BackForwardNavigation` - [ ] Anchor / TableOfContents - [ ] JumpTo / GoToLine - [ ] CommandPalette - [ ] QuickOpen - [ ] QuickSwitcher - [ ] SearchPalette - [ ] SpotlightSearch → `navigation::SearchPalette`; T04 QuickLauncher opens it always on top - [ ] Tour / Onboarding ## T08 Menus — `src/menus` - [ ] Menu / MenuItem / MenuGroup / MenuSeparator - [ ] SubMenu - [ ] CheckboxMenuItem - [ ] RadioMenuItem - [ ] MenuItemShortcut - [ ] MenuItemIcon - [ ] ContextMenu - [ ] DropdownMenu — also T05 DropdownButton / MenuButton and SplitButton - [ ] MenuBar Menu — `menus::MenuBar`, also T04 MenuBar: the native menus, drawn in the window - [ ] OverflowMenu - [ ] MegaMenu - [ ] SearchableMenu - [ ] PieMenu / RadialMenu ## T09 Overlays — `src/overlays` - [ ] Tooltip → `primitives::Tooltip` - [ ] Popover - [ ] HoverCard - [ ] Dialog / Modal - [ ] AlertDialog - [ ] ConfirmDialog - [ ] PromptDialog - [ ] FullscreenDialog - [ ] Sheet → `layout::Sheet` - [ ] Drawer → `layout::Drawer` - [ ] Lightbox - [ ] Spotlight / Coachmark - [ ] FloatingToolbar - [ ] Callout / Peek - [ ] DropdownPanel → `overlays::Popover` - [ ] InlinePopup → `overlays::Popover` - [ ] ToastViewport ## T10 Feedback — `src/feedback` - [ ] Toast — success, error, warning, info, action, undo - [ ] Notification - [ ] NotificationCenter - [ ] Alert - [ ] Banner - [ ] Callout / Admonition - [ ] InlineMessage - [ ] StatusMessage - [ ] Snackbar → `feedback::Toast` - [ ] UndoToast → `feedback::Toast` - [ ] ErrorView - [ ] ErrorBoundary — renders and logs a `Result` error; never catches panics - [ ] NotFound / 404 → `feedback::ErrorView` - [ ] NoPermission / 403 → `feedback::ErrorView` - [ ] Maintenance → `feedback::ErrorView` - [ ] Offline → `feedback::ErrorView` - [ ] EmptyState - [ ] Result - [ ] ConfirmationCard - [ ] SavingIndicator - [ ] SyncStatus - [ ] ConnectionStatus - [ ] Countdown - [ ] Timer