Files
Ely-GPUI-Components/tasks/ch21-30.md
T
ZacharyZhang-NY ff4e828795 T25e Generative: models
ModelCard sets a model's maker, what it does, its facts and tags, and
Use unless it is in use. ModelDownloadManager lists downloads with how
much of how much, speed and time left, and Pause, Resume, Cancel,
Retry and Delete by state. ModelStatus marks a model idle, loading,
loaded with its GPU memory, or failed. HardwareMonitor sets a meter per
part beside its history. FineTuneJobCard shows a job's phase, its
epochs and its loss on training and held-out data.

AGENTS.md: after each item, cargo clean -p ely-gpui-component too;
old builds of the crate had filled the disk. The reveal rule names
layout::bring_into_view.
2026-09-26 13:45:17 -04:00

12 KiB
Raw Blame History

Chapters 21–30

T21a Documents · Editing — src/documents

  • RichTextEditor
  • MarkdownEditor — visual, source, split
  • BlockEditor
  • Block types — paragraph, heading, list, todo, quote, code, divider, table, image, video, embed, math, callout, toggle, columns, synced; video and embed open as cards the app plays or shows
  • BlockHandle → the block editor's handle, a menus::OverflowMenu that drags its block
  • SlashMenu → / in BlockEditor
  • FloatingFormatToolbar → overlays::FloatingToolbar
  • FixedFormatToolbar
  • LinkEditor
  • MentionMenu → @ in RichTextEditor and BlockEditor; forms::MentionInput in a field
  • EmojiAutocomplete → a colon and two letters in RichTextEditor and BlockEditor
  • TableEditor → the block editor's table: rows and columns added and removed, cells merged across
  • ImageEditorBlock → the block editor's picture: resized by its edges, aligned, captioned
  • MathEditor / LatexBlock → the block editor's math block over typography::Latex
  • MermaidBlock / DiagramBlock — host renders the SVG → BlockEditor::diagrams
  • CodeBlockEditor → the block editor's code block
  • TodoItem / Checklist
  • PlaceholderText → each kind's hint in BlockEditor
  • WordCount / CharacterCount → WordCount, with limit for characters
  • ReadingTime

T21b Documents · Reading

  • MarkdownRenderer
  • DocumentViewer — host pages
  • PDFViewer — host pages; thumbnails, search, zoom, notes → documents::DocumentViewer with thumbnails, find (an editor::FindWidget) and notes
  • EpubReader — host chapters
  • OfficePreview — host pages → documents::DocumentViewer
  • PageThumbnailList
  • TableOfContents → navigation::TableOfContents; MarkdownRenderer::sections and outline feed it
  • DocumentOutline → navigation::TableOfContents
  • Footnote
  • Glossary / TooltipTerm
  • ReadingProgress
  • FocusMode / ZenMode → documents::ZenMode
  • PrintPreview — host pages

T21c Documents · Knowledge

  • PageTree → lists::Tree, a page's emoji leading its label
  • Backlinks
  • GraphView → charts::NetworkGraph
  • PageCover / PageIcon
  • PageProperties → data_display::PropertyGrid
  • DatabaseView — table, board, gallery, calendar, timeline → lands with Project (T31): its board is the KanbanBoard, its calendar the CalendarMonthView (T30)
  • TemplatePicker
  • TrashBin
  • VersionHistory
  • PageHistoryDiff
  • Favorites / Pinned → documents::Favorites

T22 Collaboration — src/collab

  • PresenceAvatars
  • RemoteCursor → over a forms::TextInput, placed where its offset sits as the field paints
  • RemoteSelection → over a forms::TextInput, from TextInput::bounds_for_range
  • CommentThread
  • CommentBubble / CommentMarker → collab::CommentMarker, its thread in an overlays::Popover
  • CommentSidebar
  • Reply / ReactionPicker
  • Reactions
  • Annotation / Highlight → collab::AnnotatedText; a plain mark is typography::Highlight
  • SuggestionMode → edits become suggestions through collab::suggested
  • TrackChanges
  • ShareDialog → with collab::LinkAccess for who the link lets in
  • PermissionSelect
  • InviteInput → a forms::TagInput that checks each address
  • AccessList
  • ActivityLog → data_display::ActivityFeed
  • FollowMode
  • LiveIndicator

T23a AI Chat · Messages — src/chat

  • ChatContainer
  • MessageList — virtualized, stick to bottom, new-message hint
  • MessageBubble — user, assistant, system, error
  • MessageAvatar
  • MessageHeader
  • MessageFooter
  • StreamingText
  • StreamingMarkdown
  • StreamingCursor
  • CodeBlock — language, copy, download, run, fold, apply
  • MathBlock → typography::Latex
  • TableBlock → documents::MarkdownRenderer
  • MermaidRenderer → the host draws the SVG; chat::ImageMessage shows it
  • ImageMessage / ImageGrid
  • FileMessage
  • AudioMessage
  • VideoMessage — host frames
  • LinkPreviewCard
  • QuoteReply
  • MessageActions
  • MessageEditor
  • BranchNavigator
  • RegenerateButton → chat::regenerate_button
  • StopGeneratingButton → chat::stop_button
  • ContinueButton → chat::continue_button
  • ErrorMessage / RetryMessage → chat::ErrorMessage, over feedback::Alert
  • RateLimitNotice
  • FeedbackForm
  • ScrollToBottomButton
  • DateSeparator
  • ThinkingBlock / ReasoningPanel → chat::ThinkingBlock
  • ThinkingIndicator
  • ThinkingDuration

T23b AI Chat · Citations

  • CitationBadge / InlineCitation → chat::CitationBadge, set after the words it cites
  • SourceCard
  • SourceList / SourcesPanel → chat::SourceList
  • SearchProgress
  • WebResultCard
  • DocumentChunkPreview

T23c AI Chat · Input

  • PromptInput / Composer → chat::PromptInput
  • AttachmentButton
  • AttachmentChip / AttachmentPreview → chat::AttachmentChip, a picture's thumbnail or a file's icon
  • PasteImagePreview → a pasted picture as an AttachmentChip
  • DragDropOverlay
  • VoiceInputButton
  • VoiceWaveform / RecordingIndicator → chat::VoiceWaveform, a red dot and the time with the bars
  • SlashCommandMenu → / at the start of chat::PromptInput, over forms::Suggestions
  • PromptTemplateMenu → menus::DropdownMenu of saved prompts
  • ContextMentionMenu → @ in chat::PromptInput
  • ContextChips
  • ModelSelector → forms::Select, a note on each model
  • ModeSelector → buttons::SegmentedControl
  • ToolToggleMenu → menus::DropdownMenu with check rows
  • TemperatureSlider / ParameterPanel → chat::ParameterPanel
  • SystemPromptEditor
  • TokenCounter
  • ContextWindowMeter → data_display::UsageBar
  • CostEstimator
  • SendButton
  • InputHint

T23d AI Chat · Conversations

  • ConversationList
  • ConversationItem
  • ConversationSearch → forms::SearchInput over chat::ConversationList::query
  • NewChatButton → chat::new_chat_button, a buttons::Button
  • FolderList / ProjectList → chat::ProjectList
  • ProjectKnowledgePanel
  • SharedConversationView
  • ConversationExport

T23e AI Chat · Welcome

  • WelcomeScreen / Greeting → chat::WelcomeScreen, a greeting for the hour
  • SuggestionChips / StarterPrompts → chat::SuggestionChips
  • PromptLibrary → documents::TemplatePicker over saved prompts
  • FollowUpSuggestions
  • CapabilityCards

T24a Agent · Tool calls — src/agent

  • ToolCallCard
  • ToolCallGroup
  • ToolApprovalDialog
  • PermissionPrompt

T24b Agent · Progress

  • AgentStepList / TaskTimeline → agent::AgentStepList, over data_display::Timeline
  • AgentPlan / TodoList → agent::AgentPlan, marks that pop in as items finish
  • AgentStatus
  • AgentProgress
  • SubAgentTree → lists::Tree, a node per agent with its state as note and tone

T24c Agent · Changes

  • FileChangeCard
  • MultiFileDiff Review → agent::MultiFileDiffReview, verdicts as collab::Decision
  • CommandExecutionCard → terminal::CommandBlock

T24d Agent · Previews

  • BrowserPreview / ScreenshotStream — host frames → agent::BrowserPreview, the frames so far along its foot
  • ComputerUseViewer — host frames
  • ArtifactPanel
  • ArtifactVersionSwitcher → chat::BranchNavigator, in agent::ArtifactPanel
  • LivePreview — host content

T24e Agent · Environment

  • SandboxStatus
  • MCPServerList / ConnectorList → agent::McpServerList
  • ToolRegistry Panel → agent::ToolRegistry
  • MemoryPanel
  • CheckpointList / Rewind → agent::CheckpointList, Rewind on each point but the current

T24f Agent · Control and cost

  • InterruptButton → chat::stop_button
  • HumanInputRequest
  • TokenUsageChart → charts::BarChart (stacked)
  • CostBreakdown
  • TraceViewer → debug::TimelineProfiler (a track per depth)
  • EvalResultTable → tables::DataTable (Tag and Progress cells)

T25a Generative · Prompt and settings — src/generative

  • ImageGenerationPanel → forms::Form of the fields below; Cmd-Enter generates
  • PromptEnhancer
  • NegativePromptInput → forms::TagInput
  • StylePresetPicker
  • SeedInput
  • AspectRatioPicker

T25b Generative · Queue and results

  • GenerationQueue
  • GenerationGrid
  • VariationPicker
  • ImageCompare → data_display::BeforeAfter
  • ABCompareView

T25c Generative · Canvas

  • InpaintCanvas
  • MaskBrush

T25d Generative · Sound and motion

  • AudioGenerationPlayer
  • VideoGenerationTimeline
  • TTSVoicePicker

T25e Generative · Models

  • ModelCard
  • ModelDownloadManager
  • ModelStatus
  • HardwareMonitor
  • FineTuneJobCard

T25f Generative · Data and prompts

  • DatasetViewer
  • EmbeddingVisualizer — 2D, 3D projection
  • PromptPlayground
  • PromptDiff / PromptVersionHistory

T26 Media — src/media

  • ImageViewer — zoom, pan, rotate, fit
  • ImageCropper — also T06e ImageUpload
  • ImageAnnotator
  • ImageThumbnail
  • Lightbox / Gallery Viewer → overlays::Lightbox
  • VideoPlayer — host frames
  • VideoTimeline / Scrubber
  • VideoThumbnailStrip
  • AudioPlayer — host playback
  • AudioWaveform
  • AudioSpectrum / Visualizer
  • VolumeControl
  • PlaybackSpeedControl
  • MediaControls
  • Playlist
  • SubtitleEditor
  • ScreenRecorderControls
  • CameraPreview — host frames
  • MicLevelMeter
  • DeviceSelector
  • 3DModelViewer — host frames, orbit input

T27 Files — src/files

  • FileExplorer — list, icons, columns
  • FileGrid
  • FileList
  • FileItem
  • FileIcon
  • FilePreview / QuickLook
  • FileBreadcrumb / PathBar → navigation::Breadcrumb
  • FolderTree → lists::FileTree
  • FileContextMenu → menus::ContextMenu
  • RenameInline → forms::InlineEdit
  • DragDropFiles → forms::DropZone
  • FileOperationProgress
  • TransferQueue
  • DownloadManager
  • StorageUsage → data_display::UsageBar
  • RecentFiles
  • Favorites / Bookmarks → documents::Favorites
  • FileSearch
  • DuplicateFinder
  • ArchiveViewer — host entries
  • HexViewer → debug::HexViewer

T28 Messaging — src/messaging

  • ChannelList / ChatList
  • ChannelItem
  • DirectMessageItem
  • MessageThread
  • ThreadPanel
  • ChatMessage
  • UnreadDivider
  • MessageReactions → collab::Reactions
  • ReadReceipt
  • TypingIndicator → motion::TypingIndicator
  • MemberList
  • UserProfileCard
  • OnlineStatus
  • StatusSetter
  • VoiceCallBar
  • VideoCallGrid — host frames
  • ScreenShareView — host frames
  • CallControls
  • ParticipantTile
  • IncomingCallDialog
  • StickerPicker
  • GifPicker — host images
  • PinnedMessages
  • ChannelHeader
  • HuddleIndicator

T29 Mail — src/mail

  • MailboxList / FolderList
  • MailList
  • MailItem
  • MailReader
  • MailComposer
  • RecipientInput
  • MailThreadView
  • QuotedText
  • SignatureEditor
  • LabelPicker
  • SnoozePicker
  • ScheduleSend
  • InboxZeroState

T30 Calendar — src/calendar

  • CalendarMonthView
  • CalendarWeekView
  • CalendarDayView
  • AgendaView
  • YearView
  • MiniCalendar → forms::Calendar
  • EventCard / EventChip
  • EventEditor
  • EventPopover
  • TimeGrid — drag to create, resize
  • AllDayRow
  • CurrentTimeIndicator
  • RecurrenceEditor
  • AvailabilityPicker
  • TimezoneOverlay
  • ReminderPicker
  • AttendeeList