Files
Ely-GPUI-Components/tasks/ch31-43.md
T
ZacharyZhang-NYandClaude Opus 5.5 219e4744c0 i18n: Hebrew on one line, its sign held left, CLDR's short years
gpui 0.2.2 wraps shaped glyphs in the order they are drawn, so a
right-to-left line that wraps comes out garbled. The demo's Hebrew
lines are Ellipses, which cut by characters, and an Ellipsis now sits
by its text's alignment, so a short line under text_right lies at the
right; the editor's completion details take the side they ask for. A
right-to-left locale leads a minus with a left-to-right mark, as CLDR
does, so the sign stays at the digits' left inside Hebrew. en-US and
de-DE write CLDR's two-digit year. The repeated-key and second-catalog
guards have tests.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-09-27 19:20:13 -04:00

11 KiB
Raw Blame History

Chapters 31–43

T31a Project · Tasks — src/project

  • PriorityIndicator
  • IssueIdBadge
  • StatusSelect
  • AssigneePicker
  • DueDatePicker → forms::DatePicker
  • TaskItem — check, priority, due date, assignee
  • TaskList
  • SubtaskList → documents::Checklist, which gains a field to add one

T31b Project · Issues and boards

  • IssueCard
  • LabelManager
  • KanbanBoard / KanbanColumn / KanbanCard
  • Sprint Board → project::KanbanBoard
  • TaskDetailPanel

T31c Project · Plans

  • GanttChart / TimelineView → charts::GanttChart
  • Roadmap
  • Burndown Chart → charts::BurndownChart, on the charts' scales and paint
  • MilestoneProgress
  • WorkloadView

T31d Project · Time and databases

  • TimeTracker
  • Pomodoro Timer
  • DatabaseView (from T21c) — table, board, gallery, calendar, timeline

T32a Canvas · Plane — src/canvas

  • InfiniteCanvas
  • CanvasGrid / Guides
  • Ruler
  • ZoomControls / ZoomIndicator
  • MiniMap
  • ArtboardFrame

T32b Canvas · Tools

  • SelectionBox
  • TransformHandles
  • SnapIndicator
  • ToolPalette
  • ShapeTools — rect, ellipse, polygon, line, arrow
  • PenTool / PathEditor
  • TextTool
  • BrushTool / BrushSettings
  • HistoryPanel

T32c Canvas · Panels

  • LayerPanel
  • AssetPanel
  • InspectorPanel
  • AlignmentToolbar
  • ColorPanel
  • GradientPanel → forms::GradientEditor
  • ShadowEditor
  • BorderEditor
  • TypographyPanel
  • ConstraintsEditor
  • AutoLayoutControls
  • ExportPanel

T32d Canvas · Graphs and boards

  • NodeEditor / NodeGraph
  • Node / Port / Edge / Connection
  • FlowChart / DiagramEditor
  • MindMap
  • Whiteboard
  • StickyNote
  • Connector Line

T33a DB & Dev Tools · Databases — src/devtools

  • ConnectionManager
  • ConnectionForm
  • SchemaTree
  • QueryEditor → editor::CodeEditor
  • QueryResultGrid → tables::DataGrid
  • QueryHistory
  • QueryPlanViewer
  • TableStructureEditor
  • ERDiagram
  • IndexManager
  • RedisKeyBrowser

T33b DB & Dev Tools · Data formats

  • DocumentViewer (MongoDB / JSON) → devtools::JsonViewer
  • JsonViewer / JsonTree
  • JsonEditor
  • YamlViewer
  • XmlViewer

T33c DB & Dev Tools · APIs

  • ApiRequestBuilder
  • ResponseViewer
  • HeadersTable
  • QueryParamsEditor → forms::KeyValueInput
  • EnvironmentSelector
  • CollectionTree
  • WebSocketConsole
  • GraphQLExplorer

T33d DB & Dev Tools · Tools and machines

  • RegexTester
  • Base64 / Encoder
  • ColorContrastChecker
  • ContainerList
  • PodList
  • ResourceMonitor

T34 Dashboard — src/dashboard

  • Dashboard Grid
  • Widget / DashboardCard
  • StatCard → data_display::Statistic
  • MetricsChart → charts::LineChart
  • AlertList
  • IncidentCard
  • UptimeBar
  • ServiceStatus
  • HealthCheck Indicator
  • LogStream → terminal::LogViewer
  • TraceWaterfall → debug::TimelineProfiler
  • EventStream
  • ResourceGauge → data_display::Gauge
  • SystemMonitor → devtools::ResourceMonitor
  • ProcessTable → terminal::ProcessList
  • NetworkGraph (throughput) → charts::RealtimeChart
  • MapView / GeoHeatmap → maps::MapView, maps::GeoHeatmap (T41)
  • WorldMap → maps::WorldMap (T41)
  • RefreshIntervalSelector
  • DashboardFilterBar

T35 Settings — src/settings

  • SettingsLayout
  • SettingsSection
  • SettingsRow
  • SettingsSearch
  • ThemeSelector (T39's ThemeSwitcher points here)
  • AccentColorPicker
  • FontSizeControl
  • FontFamilySelect → forms::FontPicker
  • DensitySelector
  • LanguageSelector → forms::Combobox::languages (T06f)
  • KeyboardShortcutsList
  • ShortcutEditor → editor::KeybindingsEditor
  • ProxySettings
  • StorageSettings / CacheClear
  • PrivacySettings
  • NotificationSettings
  • StartupSettings
  • ImportExportSettings
  • ResetToDefault
  • AdvancedSettings / FeatureFlags
  • DeveloperMode Toggle

T36a Account · Sign in — src/account

  • LoginForm
  • SignupForm
  • OAuthButtons
  • MagicLinkForm
  • TwoFactorInput
  • ForgotPassword

T36b Account · Profile and access

  • ProfileCard
  • ProfileEditor
  • AccountSwitcher
  • WorkspaceSwitcher / OrgSwitcher
  • UserMenu
  • SessionList
  • ApiKeyManager

T36c Account · Billing and team

  • SubscriptionCard / PlanBadge
  • UsageQuota
  • BillingHistory
  • PaymentMethodForm
  • UpgradePrompt / Paywall
  • TeamMemberTable
  • RoleSelector
  • InvitationList

T37a Onboarding · Flows and highlights — src/onboarding

  • OnboardingWizard — on navigation::Wizard without its numbered steps
  • WelcomeTour → overlays::Tour (T09b)
  • Coachmark / Hotspot — Coachmark → overlays::Spotlight; Hotspot here
  • FeatureHighlight / NewBadge — NewBadge → data_display::Badge with Tone::Accent, which FeatureHighlight wears
  • Checklist (first-run tasks) → onboarding::SetupChecklist; a to-do list ticked by hand is documents::Checklist

T37b Onboarding · Help

  • HelpTooltip → primitives::HelpTooltip, the mark FormLabel's help shows
  • HelpPanel / DocsSidebar
  • KeyboardShortcutCheatsheet — settings::KeyboardShortcutsList in an overlays::Dialog
  • WhatsNewDialog — data_display::Changelog in an overlays::Dialog
  • FeedbackWidget
  • ContactSupport
  • InlineHelp
  • EmptyStateWithAction → feedback::EmptyState, whose action adds its buttons

T38a Interaction · Pointer — src/interaction

  • Draggable — native on_drag
  • Droppable / DropTarget — native on_drop, drag_over, can_drop
  • DragOverlay / DragPreview — native drag view
  • DragGhost → DragPreview (native)
  • Sortable / SortableContext → motion::Reorder
  • Resizable
  • Rotatable — an svg: gpui 0.2.2 turns no other element
  • Selectable / SelectionArea
  • RubberBandSelection → interaction::SelectionArea
  • LongPress → primitives::Pressable
  • DoubleClick — native ClickEvent::click_count
  • Gesture — prove: wheel zoom through layout::Viewport, two-finger swipe through lists::SwipeableListItem; pinch blocked, gpui 0.2.2 forwards no magnify event
  • PanZoom → layout::Viewport

T38b Interaction · Keys, scroll and focus

  • Hotkeys / KeyBinding — native actions!, bind_keys, key_context
  • KeyChord — native multi-keystroke bindings; window.pending_input_keystrokes() shows the first stroke
  • Undo / Redo Manager → forms::History, made public
  • InfiniteScroll Trigger → lists::InfiniteList
  • VirtualScroller — native list() / uniform_list()
  • ScrollSync
  • Autofocus — native window.focus()
  • RovingTabIndex → interaction::RovingFocus
  • TypeAhead → lists::SelectableList, whose letters move its cursor
  • FocusVisible → primitives::FocusRing

T39a Theme · Editing — src/theme

  • ThemeProvider (T00)
  • ThemeSwitcher → settings::ThemeSelector (T35)
  • ColorTokens / DesignTokens (T00)
  • ThemeEditor → settings::ThemeEditor; Theme::set_palette takes the owner's colors per mode
  • DensityProvider (T00) — Theme::density, laid open in settings::ThemeEditor
  • RadiusProvider (T00) — Theme::radius_scale, laid open in settings::ThemeEditor
  • FontProvider (T00) — Theme::font_scale, laid open in settings::ThemeEditor
  • HighContrastMode (T00) — Theme::set_high_contrast, laid open in settings::ThemeEditor
  • ReducedMotionProvider (T00) — Theme::reduced_motion, laid open in settings::ThemeEditor
  • Elevation / Shadow (T00)

T39b Theme · Importing

  • ThemeImporter — VS Code theme JSON → settings::ThemeImporter on settings::read_vscode_theme
  • SyntaxThemes → theme::syntax_themes, chosen through settings::SyntaxThemePicker

T39c Theme · Platform

  • IconThemeProvider → primitives::IconTheme, an owner's rules by name and extension over file_icon
  • Platform Style → theme::Platform, the theme's platform: the window buttons Ely draws, the title bar, key caps
  • VibrancyBackground / Acrylic → shell::Vibrancy in a window opened WindowBackgroundAppearance::Blurred
  • Mica — blocked: gpui 0.2.2's one blur, Blurred, is acrylic on Windows

T40a i18n — src/i18n

  • I18nProvider → i18n::I18n, a gpui global: the shown locale and one catalog per locale
  • Trans / LocalizedText → I18n::text, a message with its {name} arguments filled
  • LocaleNumber / LocaleDate → Locale::number and Locale::date, CLDR's separators, right-to-left sign and short dates
  • RTL layout — proven: Direction::row mirrors a stack and Direction::align sets its text's side; a right-to-left line stays one Ellipsis, since gpui wraps glyphs in drawn order; Ely's other components stay left to right

T40b a11y — src/i18n

  • 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