Skip to content

COMPONENT_ROADMAP.md

Latest commit

 

History

History
131 lines (98 loc) · 8.08 KB

COMPONENT_ROADMAP.md

File metadata and controls

131 lines (98 loc) · 8.08 KB
Raw

ShellUI Component Roadmap

Goal: Build the components and tooling needed for a Tailwind-first Blazor design system.

.NET 8, 9 and 10 · Tailwind CSS 4.3.2

Current inventory

ComponentRegistry is the source of truth for component availability, names, and dependencies. The current registry contains 254 entries:

  • 98 direct CLI targets shown by shellui list
  • 156 hidden entries for sub-components, variants, models, services, and support assets
  • Packable projects: ShellUI.CLI and ShellUI.Components

Hidden entries are not counted as direct targets. They can still be installed recursively when a parent target declares them.

Implemented direct targets (98)

The following categories describe the direct targets in the current registry, not a promise about future scope.

  • Form (27): Button, ButtonGroup, ChatInput, Checkbox, Combobox, DataPicker, DatePicker, DateRangePicker, Field, FileUpload, Form, Input, InputGroup, InputOTP, Label, MultiSelect, NumberInput, RadioGroup, Select, Slider, Switch, TagInput, Textarea, TimePicker, Toggle, ToggleGroup, TypedSelect
  • Layout (16): Accordion, AspectRatio, AuthLayout01, AuthLayout02, AuthLayout03, Breadcrumb, Card, Collapsible, DashboardLayout01, DashboardLayout02, LinkCard, Navbar, Resizable, ScrollArea, Separator, Sidebar
  • Feedback (9): Alert, Callout, EmptyState, Loading, Progress, Skeleton, Sonner, Toast, Tooltip
  • Overlay (9): AlertDialog, Command, CommandPalette, Dialog, Drawer, Dropdown, HoverCard, Popover, Sheet
  • Navigation (8): ContextMenu, Menubar, NavigationMenu, Pagination, PrevNextNav, Stepper, Tabs, TreeView
  • Data Display (25): AreaChart, Avatar, Badge, BarChart, Calendar, Carousel, Chart, ChartSeries, Chat, ChatMessage, DataTable, DonutChart, JsonViewer, LineChart, MultiSeriesChart, PieChart, PromptSuggestions, QrCode, RadarChart, RadialChart, Reasoning, StatCard, Table, Timeline, ToolCall
  • Typography (1): Kbd
  • Media (1): ImageViewer
  • Utility (2): CopyButton, ThemeToggle

Added in 0.4

  • Kbd — keyboard key hint
  • AspectRatio — fixed-ratio container
  • ButtonGroup — joined buttons, horizontal or vertical
  • ToggleGroup — single or multiple selection (ToggleGroupItem)
  • InputGroup — input with prefix and suffix slots
  • NumberInput — increment/decrement input with min, max and step
  • StatCard — KPI tile with value, change and trend
  • Timeline — vertical event timeline (TimelineItem)
  • TreeView — expandable, selectable tree (TreeViewItem)
  • QrCode — QR code rendered as SVG (QRCoder)
  • ImageViewer — thumbnail with zoomable lightbox
  • Chat, ChatMessage, ChatInput — AI chat panel, message bubbles with streaming indicator, and a prompt input (Enter sends, Shift+Enter adds a newline)
  • PromptSuggestions — clickable suggestion chips for an empty chat
  • Reasoning, ToolCall — collapsible blocks for streamed model reasoning and tool calls (pending, running, done, error)
  • Field — label, control, description and validation message as one unit
  • JsonViewer — collapsible, highlighted JSON tree with copy

ShellDocs (done)

Documentation-site components are implemented in ShellDocs, which builds on ShellUI. They are not ShellUI CLI targets.

  • CodeBlock — CodeGroup, CodeTab, and syntax highlighting via CodeBlockEnhancer
  • MarkdownRenderer — MarkdownContent
  • FileTree — FileTree, FileTreeItem
  • Full-text SearchDialog — SearchDialog backed by SearchIndex
  • TableOfContents
  • DocsSidebar, DocsHeader, DocsBreadcrumb wrappers
  • TypeTable — TypeTable and AutoTypeTable
  • Tabs (Docs variant) — CodeGroup / CodeTab
  • ShellDocs pipeline — frontmatter parsing, routing, search index, and live previews (ComponentPreview, PreviewFrame)

ShellUI building blocks used by ShellDocs: Callout, CopyButton, LinkCard, PrevNextNav, Breadcrumb, Tabs, Stepper, Command/CommandPalette, Sidebar, Navbar, ThemeToggle and Table.

Compositional upgrades (done)

The current registry provides explicit sub-components for these parent components. Where a parent declares them, the installer resolves them recursively; other parents may expose parts through a separate composition path.

  • Tabs — TabsList, TabsTrigger, TabsContent, value-based state
  • Stepper — StepperList, StepperStep, StepperContent, optional confirmation on the last step
  • Collapsible — CollapsibleTrigger, CollapsibleContent
  • Dialog — DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, DialogClose
  • Card — CardHeader, CardTitle, CardDescription, CardContent, CardFooter
  • Accordion — AccordionItem, AccordionTrigger, AccordionContent
  • Dropdown — DropdownTrigger, DropdownContent, DropdownItem
  • Popover — PopoverTrigger, PopoverContent
  • HoverCard — HoverCardTrigger, HoverCardContent
  • Drawer and Sheet — explicit trigger/content and variant support
  • Select — SelectTrigger, SelectContent, SelectItem (the native select still works)
  • ContextMenu — ContextMenuTrigger, ContextMenuContent, ContextMenuOption
  • NavigationMenu — NavList, NavItem, NavTrigger, NavContent
  • Carousel — CarouselList, CarouselSlide
  • AlertDialog — AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel (0.4)
  • Breadcrumb — BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis (0.4)
  • Command — CommandInput, CommandList, CommandGroup, CommandOption, CommandEmpty, CommandSeparator (0.4)
  • Form — FormField, FormItem, FormLabel, FormControl, FormDescription, FormMessage (0.4)
  • Menubar — MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem, MenubarSeparator (0.4)
  • Pagination — PaginationContent, PaginationItem, PaginationLink, PaginationPrevious, PaginationNext, PaginationEllipsis (0.4)
  • Resizable — ResizablePanelGroup, ResizablePanel, ResizableHandle (0.4; the old Resizable is deprecated)

The intended pattern is explicit child components, cascaded state and callbacks, value/label parameters, and Tailwind utility classes matching the shadcn-style API.

Unscheduled ideas

These are unscheduled ideas. They are not current registry targets, and no date or release commitment is implied.

AI

  • CodeBlock (ShellUI) — copyable code block for chat responses

Forms and input

  • ColorPicker — swatches and HEX/RGB input
  • Rating — star rating input
  • SignaturePad — draw-to-sign canvas

Data and layout

  • VirtualList — wrapper over Blazor Virtualize with ShellUI styling
  • InfiniteScroll — load more on scroll
  • KanbanBoard — drag-and-drop columns and cards
  • SortableList — drag-and-drop reordering

Media

  • VideoPlayer — video playback with ShellUI controls
  • AudioPlayer — audio playback with waveform-style progress
  • ImageGallery — grid of images sharing one lightbox with next/previous
  • Barcode — barcode display

Rich content

  • RichTextEditor — WYSIWYG editor

Roadmap maintenance

  • Derive direct counts, names, categories, availability, and dependencies from ComponentRegistry.
  • Move an idea into the implemented section only when it has a registered target and a working CLI installation path.
  • Do not infer that a component is standalone from a prose list; use the dependency metadata described in COMPONENT_DEPENDENCIES.md.
  • Keep future ideas explicitly unscheduled until a release owner assigns a scope and date.