Components · v0.10.0
Every UI surface, as typed Go.
One page per constructor. Use the sidebar to jump between them — it tracks the page you're on.
Buttons & links
6 constructors
Buttons & links
Button
Primary action element with size + variant slots.
/components/button
Buttons & links
Link
Typed anchor with external-link affordances.
/components/link
Buttons & links
CopyButton
Copies text from a target selector to clipboard.
/components/copybutton
Buttons & links
ShortcutHint
Inline keyboard-shortcut chip.
/components/shortcuthint
Buttons & links
ThemeToggle
Cycles data-color-scheme between dark/light/auto.
/components/themetoggle
Buttons & links
Kbd
Semantic <kbd> primitive for keyboard input — pair with ShortcutHint for styled chips.
/components/kbd
Tags & badges
Feedback
12 constructors
Feedback
Banner
Full-width alert; optional dismiss + action.
/components/banner
Feedback
Callout
Bordered prose call-out for tips or warnings.
/components/callout
Feedback
Notification
Toast-style notification with icon + variant.
/components/notification
Feedback
EmptyState
Zero-data placeholder with optional CTA.
/components/emptystate
Feedback
Spinner
Indeterminate progress indicator.
/components/spinner
Feedback
SkeletonPresets
Shimmer placeholders while content loads.
/components/skeleton
Feedback
PollingIndicator
Animated live-data heartbeat.
/components/pollingindicator
Feedback
NetworkRetryBanner
Surface that appears when an island RPC fails.
/components/networkretrybanner
Feedback
OptimisticAction
Action that commits + can rollback on error.
/components/optimisticaction
Feedback
NotificationBell
Bell icon with unread badge + popover (trigger + widget).
/components/notificationbell
Feedback
Progress
Native <progress> wrapper — determinate (Value set) or indeterminate (Value < 0).
/components/progress
Feedback
Toast
Stacked notifications — client (data-fui-toast) or server (X-Gofastr-Toast header).
/components/toast
Layout
10 constructors
Layout
Card
Surface with optional header / footer; whole-card link when Href is set.
/components/card
Layout
Container
Max-width wrapper with width tokens.
/components/container
Layout
Stack
Vertical flex stack with gap token.
/components/stack
Layout
Grid
CSS Grid with min column width + gap tokens.
/components/grid
Layout
Cluster
Horizontal flex with wrap.
/components/cluster
Layout
Center
Centers children horizontally + vertically.
/components/center
Layout
Box
Polymorphic <div> with padding/surface tokens.
/components/box
Layout
Divider
Horizontal or vertical rule.
/components/divider
Layout
AspectRatio
Maintains aspect ratio for media boxes.
/components/aspectratio
Layout
Sticky
Sticky-positioned wrapper.
/components/sticky
Navigation
16 constructors
Navigation
PageHeader
Eyebrow + title + actions.
/components/pageheader
Navigation
Breadcrumbs
Hierarchy trail.
/components/breadcrumbs
Navigation
Pagination
Page-cursor controls.
/components/pagination
Navigation
Toolbar
Horizontal action group with separators.
/components/toolbar
Navigation
Sidebar
Hierarchical navigation sidebar.
/components/sidebar
Navigation
TableOfContents
In-page anchor list (runtime fills from headings).
/components/toc
Navigation
BackToTop
Floating back-to-top button.
/components/backtotop
Navigation
SkipLink
Skip-nav for assistive tech.
/components/skiplink
Navigation
Menu
Dropdown menu list.
/components/menu
Navigation
SegmentedControl
Single-select tabbed buttons.
/components/segmented
Navigation
Tabs
Signal-driven tab strip — client-side panel switching with zero JS.
/components/tabs
Navigation
CommandPalette
⌘K modal palette — wired in nav (try it).
/components/commandpalette
Navigation
GlobalSearch
Inline persistent search bar.
/components/globalsearch
Navigation
Tree
WAI-ARIA treeview with roving tabindex, type-ahead, and arrow-key nav.
/components/tree
Navigation
NestedList
Recursive ul/ol with native <details> collapse on branches — no runtime module.
/components/nestedlist
Navigation
ScrollSpy
IntersectionObserver active-section tracking for in-page anchor navs.
/components/scrollspy
Disclosure
5 constructors
Disclosure
Accordion
Native <details> accordion stack.
/components/accordion
Disclosure
Tooltip
Hover/focus-triggered tip.
/components/tooltip
Disclosure
ConfirmAction
Two-step confirm interaction (trigger + modal pair).
/components/confirmaction
Disclosure
Collapsible
Expand/collapse section using native <details>.
/components/collapsible
Disclosure
Disclosure
Single styled <details>/<summary> reveal — keyboard + find-in-page work with no JS.
/components/disclosure
Forms
24 constructors
Forms
Form
Form container with submit + validation.
/components/form
Forms
FormField
Label + input + help text + error.
/components/formfield
Forms
FormSection
Bordered group of related fields.
/components/formsection
Forms
Select
Native <select> styled to match the theme.
/components/select
Forms
Checkbox
Single boolean toggle.
/components/checkbox
Forms
CheckboxGroup
Grouped boolean options.
/components/checkboxgroup
Forms
Radio
Single-select among grouped options.
/components/radio
Forms
Switch
On/off toggle that looks like a physical switch.
/components/switch
Forms
Textarea
Multi-line text input with autosize.
/components/textarea
Forms
NumberInput
Numeric input with stepper buttons.
/components/numberinput
Forms
PasswordInput
Password with show/hide toggle.
/components/passwordinput
Forms
SearchInput
Search field with leading icon + clear button.
/components/searchinput
Forms
RangeSlider
Min/max thumb pair.
/components/rangeslider
Forms
Slider
Single-value slider.
/components/slider
Forms
TagInput
Free-form tag entry with chips.
/components/taginput
Forms
Combobox
Type-ahead suggestion picker.
/components/combobox
Forms
Multiselect
Multi-pick from a list with chips.
/components/multiselect
Forms
FilterChipBar
Active filter chip strip with per-chip dismiss RPC.
/components/filterchipbar
Forms
InputGroup
Input plus leading/trailing addon.
/components/inputgroup
Forms
ValidationSummary
Form-top error roll-up.
/components/validationsummary
Forms
ConditionalField
Show/hide a form field based on a sibling value.
/components/conditionalfield
Forms
FormRepeater
Add/remove rows of fields.
/components/formrepeater
Forms
Repeater
Generic repeatable group.
/components/repeater
Forms
SortableList
Drag + keyboard reorderable list that POSTs the new order to an RPC.
/components/sortablelist
Data
13 constructors
Data
DataTable
Sortable + paginated data table island.
/components/datatable
Data
JSONViewer
Pretty-printed expandable JSON.
/components/jsonviewer
Data
DiffViewer
Unified or split diff display.
/components/diffviewer
Data
CodeBlock
Plain code block (no highlight).
/components/codeblock
Data
Markdown
Render Markdown source.
/components/markdown
Data
Timeline
Vertical event timeline.
/components/timeline
Data
Avatar
User picture or initials.
/components/avatar
Data
AvatarGroup
Stacked avatars with overflow chip.
/components/avatargroup
Data
StatCard
Metric tile with trend.
/components/statcard
Data
AnimatedCounter
Number that animates on appearance.
/components/animatedcounter
Data
Rating
Star rating input or display.
/components/rating
Data
Counter
Numeric counter with +/− buttons — client-side only.
/components/counter
Data
InfiniteScroll
Sentinel-driven lazy pagination — server appends HTML + a next-cursor header.
/components/infinitescroll
Charts
Media
6 constructors
Media
OptimizedImage
Image with width/height + lazy + srcset.
/components/image
Media
Icon
Bundled SVG icon set with named lookup.
/components/icon
Media
Gallery
Image grid with lightbox.
/components/gallery
Media
Lightbox
Modal viewer for images.
/components/lightbox
Media
Carousel
Horizontal slider with snap.
/components/carousel
Media
PipelineImage
Image processed through the framework's image pipeline.
/components/pipelineimage
Inputs
5 constructors
Inputs
FileUpload
Single-file picker with preview.
/components/fileupload
Inputs
FileDropzone
Drag-and-drop file upload.
/components/dropzone
Inputs
TimePicker
Hour + minute picker.
/components/timepicker
Inputs
ColorPicker
Native swatch picker.
/components/colorpicker
Inputs
Toggle Switch
Boolean toggle — client-side signal flip, no RPC.
/components/toggle
Wizards
Clientside Interactivity
9 constructors
Clientside Interactivity
Click to Update
Click a button → server returns a value → it appears on screen without reloading.
/components/rpc-signal
Clientside Interactivity
Click to Open Popup
Click a button → server confirms → a modal pops up. No JavaScript needed.
/components/rpc-open-widget
Clientside Interactivity
Submit Without Reload
Submit a form and see the result inline — the page never reloads.
/components/rpc-form-signal
Clientside Interactivity
Redirect After Action
Click a button → server confirms → you land on a new page, no full reload.
/components/rpc-navigate
Clientside Interactivity
Scroll Reveal
Elements fade in as they scroll into view — IntersectionObserver, no JS needed.
/components/scroll-reveal
Clientside Interactivity
Signal Animate
Toggle a CSS class when a signal changes — the same primitive drives several transition styles. Each example is one signal + one class.
/components/signal-animate
Clientside Interactivity
Dropdown
Click-toggle dropdown with click-outside dismiss and Escape to close.
/components/dropdown
Clientside Interactivity
Section Menu
Grouped, collapsible navigation: a sticky rail on desktop, a framework drawer (backdrop + click-outside close + focus trap) on mobile (< 900px). Powers the docs + components nav. Active item highlighted; auto-closes on navigation.
/components/section-menu
Clientside Interactivity
Signal Store
Typed shared state: one producer renames the company, every bound consumer updates client-side — no per-consumer request.
/components/signal-store
Overlays
3 constructors
Overlays
Modal
Center-mounted dialog: backdrop, focus trap, Escape, URL deeplinking.
/components/modal
Overlays
Drawer
Edge-mounted sliding panel — same dismiss affordances as Modal, plus deeplinking.
/components/drawer
Overlays
BottomSheet
Mobile-friendly bottom-anchored variant of Drawer with drag-to-dismiss.
/components/bottomsheet