Ely-GPUI-Components/tasks/ch01-10.md

# 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

- [ ] Checkbox
- [ ] CheckboxGroup
- [ ] CheckboxCard
- [ ] Radio / RadioGroup
- [ ] RadioCard
- [ ] Switch / Toggle
- [ ] Select
- [ ] NativeSelect — blocked: gpui 0.2.2 has no native popup menu
- [ ] Combobox
- [ ] Autocomplete
- [ ] MultiSelect
- [ ] CascadeSelect / Cascader
- [ ] TreeSelect
- [ ] TransferList
- [ ] ListBox
- [ ] ChoiceChips / FilterChips
- [ ] Rating
- [ ] Slider
- [ ] RangeSlider
- [ ] VerticalSlider → `forms::Slider`
- [ ] Knob / Dial
- [ ] Stepper

## T06c Forms · Date & Time

- [ ] Calendar
- [ ] DatePicker
- [ ] DateRangePicker
- [ ] TimePicker
- [ ] DateTimePicker
- [ ] MonthPicker / YearPicker / QuarterPicker
- [ ] WeekPicker
- [ ] RelativeDatePicker
- [ ] TimezoneSelect
- [ ] DurationPicker
- [ ] CronEditor

## T06d Forms · Color

- [ ] ColorPicker — HSV, RGB, HEX, alpha
- [ ] ColorSwatch
- [ ] ColorPalette
- [ ] EyeDropper — prove: `NSColorSampler`
- [ ] GradientEditor

## T06e Forms · Files

- [ ] FilePicker / FileInput
- [ ] FolderPicker
- [ ] DropZone
- [ ] UploadList
- [ ] ImageUpload — preview, crop
- [ ] AvatarUpload

## T06f Forms · Other

- [ ] SignaturePad
- [ ] CodeInput
- [ ] JsonInput
- [ ] FontPicker
- [ ] IconPicker
- [ ] EmojiPicker
- [ ] LanguageSelect
- [ ] CountrySelect
- [ ] CurrencySelect

## 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