ZacharyZhang-NY/Ely-GPUI-Components
1
1 Fork 0
Code Issues Pull Requests Actions 11 Packages Projects Releases Wiki Activity
Files
a13343c2a5af7adb5817ecfbf74bc3752eb0bb4e
Ely-GPUI-Components/tasks/ch01-10.md
T
ZacharyZhang-NY a13343c2a5 T01 primitives: image, divider, backdrop, focus, pressable, measure, tooltip 
Ely-built primitives plus gallery demos for every chapter-one entry,
including gpui natives. The gallery now scripts real input by posting
NSEvents to its own queue and shoots each interaction in both modes.
Codex gpt-6-astra (max): three rounds; the last finding, a two-line
doc comment, was fixed after the three-review cap.
2026-09-25 00:39:06 -04:00

8.9 KiB
Raw Blame History

Chapters 1–10

T01 Primitives — src/primitives

  • Box / View — native div()
  • Text — native: strings and StyledText are elements
  • Icon (T00)
  • IconSet / IconRegistry (T00)
  • Svg — native svg()
  • Image — loading, failed, placeholder over img()
  • Canvas — native canvas()
  • Divider / Separator
  • Spacer — native div().flex_1()
  • Portal — native deferred(anchored())
  • Overlay / Backdrop
  • Slot — native impl IntoElement params and ParentElement
  • Show / When — native .when() / .when_some()
  • For / Each — native .children(iter)
  • Fragment — native: children take iterators
  • VisuallyHidden — blocked: gpui 0.2.2 has no accessibility tree
  • FocusRing
  • FocusScope / FocusTrap
  • ClickOutside — native on_mouse_down_out
  • HoverArea — native on_hover / .hover()
  • Pressable — press state, long press
  • KeyboardHandler — native on_key_down / on_action
  • Measure
  • ResizeObserver → primitives::Measure
  • IntersectionObserver
  • Clipboard — native write_to_clipboard / read_from_clipboard
  • Tooltip Trigger — owns Tooltip: delay, follow mouse, rich content

T02 Typography — src/typography

  • Heading (H1–H6)
  • Title / Subtitle
  • Paragraph
  • Label
  • Caption
  • Overline
  • Code
  • Kbd — ⌘ / Ctrl by platform
  • KbdCombo
  • Blockquote
  • Highlight / Mark
  • Truncate — native .truncate()
  • LineClamp — native .line_clamp(n)
  • MiddleEllipsis
  • EllipsisTooltip
  • Link
  • ExternalLink
  • RelativeTime
  • DateTimeText
  • NumberText
  • CurrencyText
  • PercentText
  • FileSizeText
  • DurationText
  • PluralText
  • CopyableText
  • SelectableText — prove: selection over StyledText layout
  • Emoji — shortcodes
  • Latex / MathInline — prove: TeX subset
  • AnimatedNumber
  • Typewriter
  • GradientText — per-glyph tonal ramp
  • ShimmerText

T03 Layout — src/layout

  • Stack / HStack / VStack
  • Flex — native .flex()
  • Grid / GridItem — native .grid(), .col_span()
  • SimpleGrid
  • Masonry
  • Center — native .flex().items_center().justify_center()
  • Container
  • AspectRatio
  • Inset / Padding — native .p_*()
  • Wrap — native .flex_wrap()
  • Absolute / Positioned — native .absolute()
  • Layer / ZStack
  • ScrollArea
  • Scrollbar
  • ScrollShadow
  • ScrollToTop
  • StickyHeader
  • SplitPane — horizontal, vertical, nested
  • ResizablePanel / ResizablePanelGroup → layout::SplitPane
  • ResizeHandle
  • Collapsible
  • Accordion / AccordionItem
  • Card / CardHeader / CardBody / CardFooter
  • Panel / PanelHeader
  • Section / SectionHeader
  • Group / Fieldset
  • Frame
  • Well
  • Sidebar
  • Drawer
  • Sheet
  • Page / PageHeader / PageContent
  • AppShell
  • MasterDetail
  • ThreeColumnLayout → layout::SplitPane
  • Dock / DockPanel
  • DockZone / DropIndicator
  • FloatingPanel
  • Pane / PaneGroup
  • Workspace — versioned layout snapshot
  • Viewport

T04 Window & Shell — src/shell

  • TitleBar
  • WindowControls — macOS, Windows, Linux
  • TrafficLights → shell::WindowControls
  • WindowDragRegion — native window_control_area
  • WindowResizeBorder — prove: client-side decorations
  • MenuBar
  • NativeMenu — native cx.set_menus()
  • Toolbar / ToolbarGroup / ToolbarSeparator
  • StatusBar / StatusBarItem
  • ActivityBar
  • NavigationRail → shell::ActivityBar
  • TabBar
  • SplashScreen
  • AboutDialog
  • TrayIcon / TrayMenu — prove
  • DockBadge — prove
  • JumpList — native cx.set_dock_menu()
  • SystemNotification — prove
  • MultiWindow Manager
  • WindowSwitcher
  • QuickLauncher
  • MiniWindow / CompactMode
  • AlwaysOnTop — native WindowKind::PopUp
  • PictureInPicture — host content
  • UpdateBanner / UpdateDialog
  • CrashReporter
  • OfflineIndicator
  • ZoomControl

T05 Buttons & Actions — src/buttons

  • Button (T00)
  • IconButton (T00)
  • ButtonGroup
  • SplitButton
  • DropdownButton / MenuButton
  • ToggleButton
  • ToggleGroup
  • SegmentedControl
  • FloatingActionButton
  • LoadingButton → buttons::Button loading state
  • ConfirmButton — hold or click twice
  • HoldToConfirm → buttons::ConfirmButton
  • CopyButton
  • ShareButton
  • CloseButton
  • BackButton
  • MoreButton
  • ActionBar
  • BulkActionBar
  • ActionSheet
  • QuickActions
  • ShortcutHint

T06a Forms · Text — src/forms

  • Input / TextField
  • TextArea
  • PasswordInput
  • SearchInput
  • NumberInput
  • ScrubInput
  • CurrencyInput
  • PercentInput
  • UnitInput
  • EmailInput
  • UrlInput
  • PhoneInput
  • MaskedInput
  • PinInput / OTPInput
  • InlineEdit / EditableText
  • InputGroup / InputAddon
  • ClearableInput → forms::Input
  • AutoResizeInput → forms::Input
  • MentionInput
  • HashtagInput
  • TagInput / TokenInput
  • KeyValueInput
  • ListInput
  • PathInput — native dialog via prompt_for_paths
  • RegexInput
  • ExpressionInput
  • 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
  • Tour / Onboarding

T08 Menus — src/menus

  • Menu / MenuItem / MenuGroup / MenuSeparator
  • SubMenu
  • CheckboxMenuItem
  • RadioMenuItem
  • MenuItemShortcut
  • MenuItemIcon
  • ContextMenu
  • DropdownMenu
  • MenuBar Menu → shell::MenuBar
  • 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
Reference in new issue View Git Blame Copy Permalink