ZacharyZhang-NY/Ely-GPUI-Components
1
1 Fork 0
Code Issues Pull Requests Actions 11 Packages Projects Releases Wiki Activity
Files
931e0ed6f56e1b82afa446a6816ea719e779c9aa
Ely-GPUI-Components/tasks/ch31-43.md
T
ZacharyZhang-NY 931e0ed6f5 Maps · View: host tiles, pins and a popup, a picker, coordinates 
maps::MapView lays the host's tile for each zoom, column and row in Web
Mercator, the nearest cut scaled past the zooms it serves, on whole
pixels. gpui packs pictures in its atlas without padding and samples
them linearly, so each tile draws with a one-pixel rim copied from its
own edge, one of its pixels larger each side and clipped, and no seam
shows. A drag, the wheel or the arrows pan; Command-wheel, + and - or
its buttons zoom about the pointer or the center; the owner keeps the
viewport. MapMarker pins take a press and Enter when the map hears
them; MapPopup opens toward the map's larger half and stays inside it,
closing by its button or Escape. LocationPicker picks the place under a
center crosshair; CoordinateDisplay writes degrees or degrees, minutes
and seconds with tabular figures and a copy button. The gallery's tiles
are Natural Earth's countries, cut z0 to z3 by scripts/tiles.py.
2026-09-27 21:22:50 -04:00

12 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; AppKit's announcement request needs none, but no process here is trusted to observe VoiceOver take it
  • SkipLink → i18n::SkipLink: a Tab stop in flow that shows only while focused, raised over the page, and hands focus to its target
  • AccessibleIcon — blocked: no accessibility tree
  • AriaLabel helper — blocked: no accessibility tree
  • KeyboardNavigationHelper → interaction::RovingFocus
  • ScreenReaderOnly — blocked: no accessibility tree
  • ColorBlindSafe Palette → Theme::set_color_blind_safe: chart hues fitted to stay apart under Machado's simulated protanopia, deuteranopia and tritanopia, each 3:1 on its page

T41a Maps · View — src/maps

  • MapView — host tiles → maps::MapView: the host's tile for each zoom, column and row, the nearest cut scaled past its zooms; a drag, the wheel or the arrows pan, Command-wheel, + and - or its buttons zoom
  • MapMarker → maps::MapMarker, a pin keyed by its place's name, pressable when the map hears it
  • MapPopup → maps::MapPopup, over or under its point toward the larger half, held inside the map
  • LocationPicker → maps::LocationPicker, the place under a center crosshair
  • CoordinateDisplay → maps::CoordinateDisplay, degrees or degrees, minutes and seconds, copyable

T41b Maps · Layers

  • MapCluster
  • RouteLine
  • GeoJSON Layer
  • GeoHeatmap (from T34)

T41c Maps · World

  • ChoroplethMap
  • WorldMap (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
Reference in new issue View Git Blame Copy Permalink