Files
Ely-GPUI-Components/tasks/ch31-43.md
T
ZacharyZhang-NYandClaude Opus 5.5 9e3e6c109d Interaction · Keys, scroll and focus: roving focus, scroll sync, type-ahead
RovingFocus keeps a row or column of items behind one Tab stop: the
arrows walk focus, Home and End reach the ends, Enter or Space presses,
and a press moves the stop without taking focus. ScrollSync keeps boxes
at one place along an axis: the pane a wheel turned leads, and a canvas
ahead of the panes copies its place before they draw. SelectableList
moves its cursor to the row that starts with the letters typed, the
letters joining within a pause and a Command letter left to the app.
forms::History becomes public as the undo manager. The gallery shows
gpui's own key bindings, a two-stroke chord waiting on its first
stroke, uniform_list, autofocus and the focus ring.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-09-27 16:10:32 -04:00

333 lines
9.3 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Chapters 31–43
## T31a Project · Tasks — `src/project`
- [x] PriorityIndicator
- [x] IssueIdBadge
- [x] StatusSelect
- [x] AssigneePicker
- [x] DueDatePicker → `forms::DatePicker`
- [x] TaskItem — check, priority, due date, assignee
- [x] TaskList
- [x] SubtaskList → `documents::Checklist`, which gains a field to add one
## T31b Project · Issues and boards
- [x] IssueCard
- [x] LabelManager
- [x] KanbanBoard / KanbanColumn / KanbanCard
- [x] Sprint Board → `project::KanbanBoard`
- [x] TaskDetailPanel
## T31c Project · Plans
- [x] GanttChart / TimelineView → `charts::GanttChart`
- [x] Roadmap
- [x] Burndown Chart → `charts::BurndownChart`, on the charts' scales and paint
- [x] MilestoneProgress
- [x] WorkloadView
## T31d Project · Time and databases
- [x] TimeTracker
- [x] Pomodoro Timer
- [x] DatabaseView (from T21c) — table, board, gallery, calendar, timeline
## T32a Canvas · Plane — `src/canvas`
- [x] InfiniteCanvas
- [x] CanvasGrid / Guides
- [x] Ruler
- [x] ZoomControls / ZoomIndicator
- [x] MiniMap
- [x] ArtboardFrame
## T32b Canvas · Tools
- [x] SelectionBox
- [x] TransformHandles
- [x] SnapIndicator
- [x] ToolPalette
- [x] ShapeTools — rect, ellipse, polygon, line, arrow
- [x] PenTool / PathEditor
- [x] TextTool
- [x] BrushTool / BrushSettings
- [x] HistoryPanel
## T32c Canvas · Panels
- [x] LayerPanel
- [x] AssetPanel
- [x] InspectorPanel
- [x] AlignmentToolbar
- [x] ColorPanel
- [x] GradientPanel → `forms::GradientEditor`
- [x] ShadowEditor
- [x] BorderEditor
- [x] TypographyPanel
- [x] ConstraintsEditor
- [x] AutoLayoutControls
- [x] ExportPanel
## T32d Canvas · Graphs and boards
- [x] NodeEditor / NodeGraph
- [x] Node / Port / Edge / Connection
- [x] FlowChart / DiagramEditor
- [x] MindMap
- [x] Whiteboard
- [x] StickyNote
- [x] Connector Line
## T33a DB & Dev Tools · Databases — `src/devtools`
- [x] ConnectionManager
- [x] ConnectionForm
- [x] SchemaTree
- [x] QueryEditor → `editor::CodeEditor`
- [x] QueryResultGrid → `tables::DataGrid`
- [x] QueryHistory
- [x] QueryPlanViewer
- [x] TableStructureEditor
- [x] ERDiagram
- [x] IndexManager
- [x] RedisKeyBrowser
## T33b DB & Dev Tools · Data formats
- [x] DocumentViewer (MongoDB / JSON) → `devtools::JsonViewer`
- [x] JsonViewer / JsonTree
- [x] JsonEditor
- [x] YamlViewer
- [x] XmlViewer
## T33c DB & Dev Tools · APIs
- [x] ApiRequestBuilder
- [x] ResponseViewer
- [x] HeadersTable
- [x] QueryParamsEditor → `forms::KeyValueInput`
- [x] EnvironmentSelector
- [x] CollectionTree
- [x] WebSocketConsole
- [x] GraphQLExplorer
## T33d DB & Dev Tools · Tools and machines
- [x] RegexTester
- [x] Base64 / Encoder
- [x] ColorContrastChecker
- [x] ContainerList
- [x] PodList
- [x] ResourceMonitor
## T34 Dashboard — `src/dashboard`
- [x] Dashboard Grid
- [x] Widget / DashboardCard
- [x] StatCard → `data_display::Statistic`
- [x] MetricsChart → `charts::LineChart`
- [x] AlertList
- [x] IncidentCard
- [x] UptimeBar
- [x] ServiceStatus
- [x] HealthCheck Indicator
- [x] LogStream → `terminal::LogViewer`
- [x] TraceWaterfall → `debug::TimelineProfiler`
- [x] EventStream
- [x] ResourceGauge → `data_display::Gauge`
- [x] SystemMonitor → `devtools::ResourceMonitor`
- [x] ProcessTable → `terminal::ProcessList`
- [x] NetworkGraph (throughput) → `charts::RealtimeChart`
- [ ] MapView / GeoHeatmap → `maps::MapView`, `maps::GeoHeatmap` (T41)
- [ ] WorldMap → `maps::WorldMap` (T41)
- [x] RefreshIntervalSelector
- [x] DashboardFilterBar
## T35 Settings — `src/settings`
- [x] SettingsLayout
- [x] SettingsSection
- [x] SettingsRow
- [x] SettingsSearch
- [x] ThemeSelector (T39's ThemeSwitcher points here)
- [x] AccentColorPicker
- [x] FontSizeControl
- [x] FontFamilySelect → `forms::FontPicker`
- [x] DensitySelector
- [x] LanguageSelector → `forms::Combobox::languages` (T06f)
- [x] KeyboardShortcutsList
- [x] ShortcutEditor → `editor::KeybindingsEditor`
- [x] ProxySettings
- [x] StorageSettings / CacheClear
- [x] PrivacySettings
- [x] NotificationSettings
- [x] StartupSettings
- [x] ImportExportSettings
- [x] ResetToDefault
- [x] AdvancedSettings / FeatureFlags
- [x] DeveloperMode Toggle
## T36a Account · Sign in — `src/account`
- [x] LoginForm
- [x] SignupForm
- [x] OAuthButtons
- [x] MagicLinkForm
- [x] TwoFactorInput
- [x] ForgotPassword
## T36b Account · Profile and access
- [x] ProfileCard
- [x] ProfileEditor
- [x] AccountSwitcher
- [x] WorkspaceSwitcher / OrgSwitcher
- [x] UserMenu
- [x] SessionList
- [x] ApiKeyManager
## T36c Account · Billing and team
- [x] SubscriptionCard / PlanBadge
- [x] UsageQuota
- [x] BillingHistory
- [x] PaymentMethodForm
- [x] UpgradePrompt / Paywall
- [x] TeamMemberTable
- [x] RoleSelector
- [x] InvitationList
## T37a Onboarding · Flows and highlights — `src/onboarding`
- [x] OnboardingWizard — on `navigation::Wizard` without its numbered steps
- [x] WelcomeTour → `overlays::Tour` (T09b)
- [x] Coachmark / Hotspot — Coachmark → `overlays::Spotlight`; Hotspot here
- [x] FeatureHighlight / NewBadge — NewBadge → `data_display::Badge` with `Tone::Accent`, which FeatureHighlight wears
- [x] Checklist (first-run tasks) → `onboarding::SetupChecklist`; a to-do list ticked by hand is `documents::Checklist`
## T37b Onboarding · Help
- [x] HelpTooltip → `primitives::HelpTooltip`, the mark FormLabel's help shows
- [x] HelpPanel / DocsSidebar
- [x] KeyboardShortcutCheatsheet — `settings::KeyboardShortcutsList` in an `overlays::Dialog`
- [x] WhatsNewDialog — `data_display::Changelog` in an `overlays::Dialog`
- [x] FeedbackWidget
- [x] ContactSupport
- [x] InlineHelp
- [x] EmptyStateWithAction → `feedback::EmptyState`, whose `action` adds its buttons
## T38a Interaction · Pointer — `src/interaction`
- [x] Draggable — native `on_drag`
- [x] Droppable / DropTarget — native `on_drop`, `drag_over`, `can_drop`
- [x] DragOverlay / DragPreview — native drag view
- [x] DragGhost → DragPreview (native)
- [x] Sortable / SortableContext → `motion::Reorder`
- [x] Resizable
- [x] Rotatable — an svg: gpui 0.2.2 turns no other element
- [x] Selectable / SelectionArea
- [x] RubberBandSelection → `interaction::SelectionArea`
- [x] LongPress → `primitives::Pressable`
- [x] DoubleClick — native `ClickEvent::click_count`
- [x] Gesture — prove: wheel zoom through `layout::Viewport`, two-finger swipe through `lists::SwipeableListItem`; pinch blocked, gpui 0.2.2 forwards no magnify event
- [x] PanZoom → `layout::Viewport`
## T38b Interaction · Keys, scroll and focus
- [x] Hotkeys / KeyBinding — native `actions!`, `bind_keys`, `key_context`
- [x] KeyChord — native multi-keystroke bindings; `window.pending_input_keystrokes()` shows the first stroke
- [x] Undo / Redo Manager → `forms::History`, made public
- [x] InfiniteScroll Trigger → `lists::InfiniteList`
- [x] VirtualScroller — native `list()` / `uniform_list()`
- [x] ScrollSync
- [x] Autofocus — native `window.focus()`
- [x] RovingTabIndex → `interaction::RovingFocus`
- [x] TypeAhead → `lists::SelectableList`, whose letters move its cursor
- [x] FocusVisible → `primitives::FocusRing`
## T39 Theme — `src/theme`
- [x] ThemeProvider (T00)
- [ ] ThemeSwitcher → `settings::ThemeSelector` (T35)
- [x] ColorTokens / DesignTokens (T00)
- [ ] ThemeEditor
- [ ] ThemeImporter — VS Code theme JSON
- [ ] SyntaxThemes
- [ ] IconThemeProvider
- [ ] DensityProvider (T00)
- [ ] RadiusProvider (T00)
- [ ] FontProvider (T00)
- [ ] HighContrastMode (T00)
- [ ] ReducedMotionProvider (T00)
- [ ] Platform Style
- [ ] VibrancyBackground / Mica / Acrylic — native `WindowBackgroundAppearance::Blurred`
- [x] Elevation / Shadow (T00)
## T40 i18n & a11y — `src/i18n`
- [ ] I18nProvider
- [ ] Trans / LocalizedText
- [ ] LocaleNumber / LocaleDate
- [ ] RTL layout — prove: mirrored stacks
- [ ] LiveRegion / Announcer — blocked: gpui 0.2.2 has no accessibility tree
- [ ] SkipLink
- [ ] AccessibleIcon — blocked: no accessibility tree
- [ ] AriaLabel helper — blocked: no accessibility tree
- [ ] KeyboardNavigationHelper
- [ ] ScreenReaderOnly — blocked: no accessibility tree
- [ ] ColorBlindSafe Palette
## T41 Maps — `src/maps`
- [ ] MapView — host tiles
- [ ] MapMarker
- [ ] MapPopup
- [ ] MapCluster
- [ ] RouteLine
- [ ] GeoJSON Layer
- [ ] ChoroplethMap
- [ ] LocationPicker
- [ ] CoordinateDisplay
- [ ] WorldMap (from T34)
- [ ] GeoHeatmap (from T34)
## T42 Misc — `src/misc`
- [ ] Clock / WorldClock
- [ ] Stopwatch
- [ ] Calculator
- [ ] UnitConverter
- [ ] QRCodeScanner — prove: host frames, `rqrr` decode
- [ ] BarcodeDisplay → `data_display::Barcode`
- [ ] Captcha
- [ ] Signature → `forms::SignaturePad`
- [ ] Rating Widget → `forms::Rating`
- [ ] Poll / Survey
- [ ] Quiz / Flashcard
- [ ] ChangeLog Viewer → `data_display::Changelog`
- [ ] LicenseViewer
- [ ] Terms / Consent Dialog
- [ ] CookieBanner
- [ ] WebView — prove: `wry`
- [ ] IframeEmbed / EmbedCard
- [ ] HTMLPreview → `misc::WebView`
- [ ] PrintButton — blocked: gpui 0.2.2 has no print API
- [ ] ExportDialog — PDF, PNG, CSV, JSON
- [ ] ImportDialog — field mapping
- [ ] CSVImporter
- [ ] ShareSheet
## T43 Library Tooling — `src/tooling`
- [ ] ComponentGallery / Storybook
- [ ] PlaygroundPanel
- [ ] InspectorOverlay
- [ ] FPSMeter / PerfOverlay
- [ ] RenderCounter
- [ ] EventLogger
- [ ] DesignTokenViewer
- [ ] IconBrowser
- [ ] A11yChecker — contrast audit
- [ ] ScreenshotTest Harness — self-capture; scripted input since T01