BlazorBlueprint.Components 4.0.0-beta.8

.NET 10.0 This package targets .NET 10.0. The package is compatible with this framework or higher.
This is a prerelease version of BlazorBlueprint.Components.
There is a newer version of this package available.
See the version list below for details. 
dotnet add package BlazorBlueprint.Components --version 4.0.0-beta.8
                    


                    

                
NuGet\Install-Package BlazorBlueprint.Components -Version 4.0.0-beta.8
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package. 
<PackageReference Include="BlazorBlueprint.Components" Version="4.0.0-beta.8" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
<PackageVersion Include="BlazorBlueprint.Components" Version="4.0.0-beta.8" />
                    


                            Directory.Packages.props
                        

                    

                
<PackageReference Include="BlazorBlueprint.Components" />
                    


                            Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package. 
paket add BlazorBlueprint.Components --version 4.0.0-beta.8
                    


                    

                
#r "nuget: BlazorBlueprint.Components, 4.0.0-beta.8"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package. 
#:package BlazorBlueprint.Components@4.0.0-beta.8
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package. 
#addin nuget:?package=BlazorBlueprint.Components&version=4.0.0-beta.8&prerelease
                    


                            Install as a Cake Addin
                        

                    

                
#tool nuget:?package=BlazorBlueprint.Components&version=4.0.0-beta.8&prerelease
                    


                            Install as a Cake Tool

BlazorBlueprint.Components

Pre-styled Blazor components with shadcn/ui design. Beautiful defaults with zero configuration - no Tailwind setup required!

Features

  • Zero Configuration: Pre-built CSS included - no Tailwind setup required
  • shadcn/ui Design: Beautiful, modern design language inspired by shadcn/ui
  • Pre-Styled Components: Production-ready components with pre-built styling
  • Dark Mode: Built-in dark mode support using CSS variables
  • shadcn/ui Theme Compatible: Use any theme from shadcn/ui or tweakcn.com
  • Fully Customizable: Override styles with custom CSS or Tailwind classes
  • Built with Accessibility in Mind: Includes ARIA attributes and keyboard support via BlazorBlueprint.Primitives
  • Composable: Flexible component composition patterns
  • Type-Safe: Full C# type safety with IntelliSense support
  • .NET 10 minimum: v4 targets net10.0; .NET 8 and .NET 9 are no longer supported

Installation

Retarget your application to .NET 10 or later before upgrading to v4, and keep Components and Primitives on matching v4 versions. This branch includes unreleased v4 changes; see the repository's migration guide and changelog.

dotnet add package BlazorBlueprint.Components

This package automatically includes:

  • BlazorBlueprint.Primitives - Headless primitives providing behavior and accessibility
  • BlazorBlueprint.Icons.Lucide - Lucide icon set
  • Pre-built CSS - No Tailwind setup required!

Quick Start

1. Register services in Program.cs:

builder.Services.AddBlazorBlueprintComponents();

This registers all required services including portal management, focus trapping, positioning, toast notifications, and programmatic dialogs.

2. Add to your _Imports.razor:

@using BlazorBlueprint.Components
@using BlazorBlueprint.Primitives

That's it — two imports give you access to all components and their enums (ButtonVariant, InputType, AccordionType, etc.).

3. Add CSS to your App.razor:

BlazorBlueprint Components come with pre-built CSS - no Tailwind setup required!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="/" />

    
    <link rel="stylesheet" href="styles/theme.css" />

    
    <link rel="stylesheet" href="_content/BlazorBlueprint.Components/blazorblueprint.css" />

    <HeadOutlet @rendermode="InteractiveServer" />
</head>
<body>
    <Routes @rendermode="InteractiveServer" />
    <script src="_framework/blazor.web.js"></script>
</body>
</html>

4. Add the portal host to your root layout (MainLayout.razor):

<BbPortalHost />

This is required for overlay components (Dialog, Sheet, Popover, Tooltip, etc.) to render correctly.

5. Start using components:

<BbButton Variant="ButtonVariant.Default">Click me</BbButton>

<BbDialog>
    <BbDialogTrigger AsChild>
        <BbButton>Open Dialog</BbButton>
    </BbDialogTrigger>
    <BbDialogContent>
        <BbDialogHeader>
            <BbDialogTitle>Welcome to BlazorBlueprint</BbDialogTitle>
            <BbDialogDescription>
                Beautiful Blazor components with zero configuration
            </BbDialogDescription>
        </BbDialogHeader>
        <BbDialogFooter>
            <BbDialogClose AsChild>
                <BbButton Variant="ButtonVariant.Outline">Close</BbButton>
            </BbDialogClose>
        </BbDialogFooter>
    </BbDialogContent>
</BbDialog>

That's it! No Tailwind installation, no build configuration needed.

Available Components

General

Component Description
Accordion Collapsible content sections with smooth animations
Alert Contextual feedback messages with variant support
Alert Dialog Modal confirmation dialogs requiring user action
Aspect Ratio Maintain consistent width-to-height ratios
Avatar User profile images with fallback initials and group support
Badge Labels for status, categories, and metadata
Breadcrumb Navigation breadcrumb trail with separator support
Button Interactive buttons with multiple variants and sizes
Button Group Grouped button controls with shared styling
Calendar Date selection calendar
Card Content container with header, content, and footer sections
Carousel Scrollable content carousel with navigation controls
Chart Data visualization with multiple series types (Bar, Line, Area, Pie, Radar, Radial)
Collapsible Expandable content area with trigger control
Empty Empty state placeholder for no-content scenarios
Item List item container for menus and lists
Kbd Keyboard shortcut display
Pagination Page navigation controls
Progress Progress indicator bar
Resizable Resizable panel layout with drag handles
Scroll Area Custom scrollable area with styled scrollbars
Separator Visual dividers for content sections
Skeleton Loading placeholders for content and images
Spinner Loading spinner indicator
Split Button Button with dropdown action split
Timeline Chronological event display
Toggle Toggle button control
Toggle Group Single or multi-select toggle group
Tree View Hierarchical data display with selection, checkboxes, and keyboard navigation
Typography Typography components for consistent text styling

Overlays & Navigation

Component Description
Command Command palette for quick actions and navigation
Context Menu Right-click context menus with items, labels, and shortcuts
Dialog Modal dialogs with backdrop and focus management
Drawer Slide-out drawer panels with header, footer, and items
Dropdown Menu Context menus with items, separators, and shortcuts
Hover Card Rich preview cards on hover with delay control
Menubar Horizontal menu bar with dropdown menus
Navigation Menu Responsive navigation menu with submenus
Popover Floating panels for additional content and actions
Responsive Nav Mobile-responsive navigation
Sheet Side panels that slide in from viewport edges
Sidebar Responsive navigation sidebar with collapsible menus
Tabs Tabbed interface for organizing related content
Toast Toast notification system with action support
Tooltip Brief informational popups on hover or focus

Data & Enterprise

Component Description
Dashboard Grid Drag-and-drop, resizable widget layout for dashboards with responsive breakpoints and state persistence
Scheduler Day/week/work-week scheduling with Monday/Sunday week starts, configurable slots, resource lanes, drag/resize, event editing, confirmed deletion, recurrence and optional per-event IANA time zones
TreeSelect Searchable single/multiple hierarchy selection with cascading checkboxes, indeterminate states, leaf-only selection and form binding
Cascader Hierarchy columns, path search, leaf/branch selection, keyboard/RTL navigation and automatic scrolling to the active level
FileUpload Optional transport callback with progress, cancellation, retries and preserved browser files
DataGrid Enterprise data grid with sorting, filtering, row grouping, row/cell/batch editing, isolated drafts, validation, rejected-save recovery, selection, expandable rows, virtualization, and column management
DataTable Tables with sorting, filtering, pagination, and row selection
DataView List and grid layouts with sorting, filtering, pagination, and infinite scroll
Dynamic Form Schema-driven form rendering from JSON or code definitions
Filter Builder Visual query builder for data filter expressions with AND/OR logic and nested groups
Form Wizard Multi-step form wizard with progress tracking, per-step validation, and navigation controls

Form Controls

Component Description
Checkbox Binary selection control with indeterminate state
Checkbox Group Group of checkboxes with shared state management
Color Picker Color selection input
Combobox Autocomplete input with searchable dropdown
Currency Input Currency-formatted number input
Date Picker Date selection input with calendar popup
Date Range Picker Date range selection input
Field Form field wrapper with label, description, and error states
File Upload Drag-and-drop file selection with preview and optional upload progress, cancellation and retry
Input Text input fields with multiple types and sizes
Input Field Integrated input with field label and description
Input Group Grouped input controls with addons and buttons
Input OTP One-time password input with segmented fields
Label Accessible labels for form controls
Masked Input Input with mask pattern enforcement
Multi Select Multi-select dropdown with tag support
Native Select Native HTML select element with styling
Numeric Input Number input with formatting and validation
Radio Group Mutually exclusive options with keyboard navigation
Range Slider Dual-handle range slider input
Rating Star/icon rating input
Select Dropdown selection with groups and labels
Slider Single-handle slider input
Switch Toggle control for on/off states
Tag Input Inline tag/chip input for managing string lists with suggestions and validation
Textarea Multi-line text input field
Time Picker Time selection input

Editors

Component Description
Markdown Editor Markdown editor with toolbar and live preview
Rich Text Editor Rich text editor with formatting toolbar

Pre-Built Form Fields

Convenience wrappers that combine a form control with BbField for label, description, and error handling:

Component Description
FormFieldCheckbox Checkbox with integrated field wrapper
FormFieldCombobox Combobox with integrated field wrapper
FormFieldInput Input with integrated field wrapper
FormFieldMultiSelect MultiSelect with integrated field wrapper
FormFieldRadioGroup RadioGroup with integrated field wrapper
FormFieldSelect Select with integrated field wrapper
FormFieldSwitch Switch with integrated field wrapper

Services

Service Description
ToastService Toast notification state management
DialogService Programmatic dialog/confirm control
IPortalService Portal management for overlays (from Primitives)
IFocusManager Focus trapping and restoration (from Primitives)
IPositioningService Floating element positioning (from Primitives)
IKeyboardShortcutService Global keyboard shortcut registration (from Primitives)
DropdownManagerService Coordinates dropdown mutual exclusivity (from Primitives)

Component API Reference

Button

<BbButton
    Variant="ButtonVariant.Default"
    Size="ButtonSize.Default"
    Type="ButtonType.Button"
    IconPosition="IconPosition.Start"
    Disabled="false">
    Click me
</BbButton>
Parameter Type Default Values
Variant ButtonVariant Default Default, Destructive, Outline, Secondary, Ghost, Link
Size ButtonSize Default Small, Default, Large, Icon, IconSmall, IconLarge
Type ButtonType Button Button, Submit, Reset
IconPosition IconPosition Start Start, End

Input

<BbInput
    Type="InputType.Email"
    Placeholder="name@example.com"
    Disabled="false" />
Parameter Type Default Values
Type InputType Text Text, Email, Password, Number, Tel, Url, Search, Date, Time, File

Avatar

<BbAvatar Size="AvatarSize.Default">
    <BbAvatarImage Source="user.jpg" Alt="User" />
    <BbAvatarFallback>JD</BbAvatarFallback>
</BbAvatar>
Parameter Type Default Values
Size AvatarSize Default Small, Default, Large, ExtraLarge

Badge

<BbBadge Variant="BadgeVariant.Default">New</BbBadge>
Parameter Type Default Values
Variant BadgeVariant Default Default, Secondary, Destructive, Outline

Accordion

<BbAccordion Type="AccordionType.Single" Collapsible="true">
    <BbAccordionItem Value="item-1">
        <BbAccordionTrigger>Section 1</BbAccordionTrigger>
        <BbAccordionContent>Content 1</BbAccordionContent>
    </BbAccordionItem>
</BbAccordion>
Parameter Type Default Description
Type AccordionType Single Single (one item open) or Multiple (many items open)
Collapsible bool false When Single, allows closing all items

Tabs

<BbTabs
    DefaultValue="tab1"
    Orientation="TabsOrientation.Horizontal"
    ActivationMode="TabsActivationMode.Automatic">
    <BbTabsList>
        <BbTabsTrigger Value="tab1">Tab 1</BbTabsTrigger>
        <BbTabsTrigger Value="tab2">Tab 2</BbTabsTrigger>
    </BbTabsList>
    <BbTabsContent Value="tab1">Content 1</BbTabsContent>
    <BbTabsContent Value="tab2">Content 2</BbTabsContent>
</BbTabs>
Parameter Type Default Values
Orientation TabsOrientation Horizontal Horizontal, Vertical
ActivationMode TabsActivationMode Automatic Automatic (on focus), Manual (on click)

Sheet

<BbSheet>
    <BbSheetTrigger AsChild>
        <BbButton>Open Sheet</BbButton>
    </BbSheetTrigger>
    <BbSheetContent Side="SheetSide.Right">
        <BbSheetHeader>
            <BbSheetTitle>Sheet Title</BbSheetTitle>
            <BbSheetDescription>Sheet description</BbSheetDescription>
        </BbSheetHeader>
        
    </BbSheetContent>
</BbSheet>
Parameter Type Default Values
Side SheetSide Right Top, Right, Bottom, Left

Select

<BbSelect TValue="string" @bind-Value="selectedValue">
    <BbSelectTrigger>
        <BbSelectValue Placeholder="Select an option" />
    </BbSelectTrigger>
    <BbSelectContent>
        <BbSelectItem Value="@("option1")" Text="Option 1" />
        <BbSelectItem Value="@("option2")" Text="Option 2" />
    </BbSelectContent>
</BbSelect>

Select is a generic component. Specify TValue for type safety.

Separator

<BbSeparator Orientation="SeparatorOrientation.Horizontal" />
Parameter Type Default Values
Orientation SeparatorOrientation Horizontal Horizontal, Vertical

Skeleton

<BbSkeleton Shape="SkeletonShape.Rectangular" Class="w-full h-4" />
<BbSkeleton Shape="SkeletonShape.Circular" Class="w-12 h-12" />
Parameter Type Default Values
Shape SkeletonShape Rectangular Rectangular, Circular

DataTable

<BbDataTable TItem="User" Items="users" SelectionMode="DataTableSelectionMode.Multiple">
    <BbDataTableColumn TItem="User" Field="x => x.Name" Header="Name" />
    <BbDataTableColumn TItem="User" Field="x => x.Email" Header="Email" />
</BbDataTable>
Parameter Type Default Values
SelectionMode DataTableSelectionMode None None, Single, Multiple

Theming

BlazorBlueprint is 100% compatible with shadcn/ui themes. Customize your application's appearance using CSS variables.

Using Themes from shadcn/ui and tweakcn

You can use any theme from:

Simply copy the CSS variables and paste them into your wwwroot/styles/theme.css file.

Example Theme

Create wwwroot/styles/theme.css:

@layer base {
  :root {
    --background: oklch(1 0 0);
    --foreground: oklch(0.1450 0 0);
    --primary: oklch(0.2050 0 0);
    --primary-foreground: oklch(0.9850 0 0);
    /* ... other variables */
  }

  .dark {
    --background: oklch(0.1450 0 0);
    --foreground: oklch(0.9850 0 0);
    --primary: oklch(0.9220 0 0);
    --primary-foreground: oklch(0.2050 0 0);
    /* ... other variables */
  }
}

Reference it in your App.razor before the BlazorBlueprint CSS:

<link rel="stylesheet" href="styles/theme.css" />
<link rel="stylesheet" href="_content/BlazorBlueprint.Components/blazorblueprint.css" />

Dark Mode

Dark mode automatically activates when you add the .dark class to the <html> element. All components will switch to dark mode colors.

Usage Example

<BbDialog>
    <BbDialogTrigger AsChild>
        <BbButton>Open Dialog</BbButton>
    </BbDialogTrigger>
    <BbDialogContent>
        <BbDialogHeader>
            <BbDialogTitle>Confirm Action</BbDialogTitle>
            <BbDialogDescription>
                Are you sure you want to proceed?
            </BbDialogDescription>
        </BbDialogHeader>
        <p>This action cannot be undone.</p>
        <BbDialogFooter>
            <BbDialogClose AsChild>
                <BbButton Variant="ButtonVariant.Outline">Cancel</BbButton>
            </BbDialogClose>
            <BbButton Variant="ButtonVariant.Default">Confirm</BbButton>
        </BbDialogFooter>
    </BbDialogContent>
</BbDialog>

AsChild Pattern

Use AsChild on trigger components to use your own styled elements instead of the default button:

<BbDropdownMenu>
    <BbDropdownMenuTrigger AsChild>
        <BbButton Variant="ButtonVariant.Outline">
            Actions
            <BbLucideIcon Name="chevron-down" Size="16" />
        </BbButton>
    </BbDropdownMenuTrigger>
    <BbDropdownMenuContent>
        <BbDropdownMenuItem>Edit</BbDropdownMenuItem>
        <BbDropdownMenuItem>Delete</BbDropdownMenuItem>
    </BbDropdownMenuContent>
</BbDropdownMenu>

This is the industry-standard pattern from Radix UI/shadcn/ui. When AsChild is true, the child component (e.g., BbButton) automatically receives trigger behavior via TriggerContext.

Form Example

<div class="space-y-4">
    <div>
        <BbLabel For="email">Email</BbLabel>
        <BbInput Id="email" Type="InputType.Email" Placeholder="name@example.com" />
    </div>

    <div class="flex items-center space-x-2">
        <BbCheckbox Id="terms" @bind-Checked="agreedToTerms" />
        <BbLabel For="terms">I agree to the terms and conditions</BbLabel>
    </div>

    <BbButton Disabled="@(!agreedToTerms)">Submit</BbButton>
</div>

@code {
    private bool agreedToTerms = false;
}

Customizing Components

Override Default Styles

Use the Class parameter to add custom CSS classes or Tailwind classes (if you have Tailwind set up):

<BbButton Class="bg-purple-600 hover:bg-purple-700">
    Custom Button
</BbButton>

<BbCard Class="border-2 border-purple-500 shadow-xl">
    Custom Card Styling
</BbCard>

Note: BlazorBlueprint Components include pre-built CSS and don't require Tailwind. However, you can still use Tailwind classes for customization if you've set up Tailwind in your project.

Classes you pass through Class come from your Tailwind build, not from blazorblueprint.css. Every utility the library ships is prefixed bb: (.bb\:flex, .bb\:sm\:hidden) and kept in its own cascade layer, so your build and the library's can never emit the same class name and their load order does not matter. The library strips its prefix when merging, so Class="p-6" still replaces the component's own bb:p-4. Do not @source this package from your Tailwind input — it finds only prefixed tokens and emits nothing. If you have no Tailwind build, the prefixed classes work anywhere on the page (class="bb:flex bb:gap-4"), but the set is whatever the components use and is not a stable API.

Component Composition

Build complex UIs by composing components:

<BbCard>
    <BbCardHeader>
        <BbCardTitle>Settings</BbCardTitle>
        <BbCardDescription>Manage your account settings</BbCardDescription>
    </BbCardHeader>
    <BbCardContent class="space-y-4">
        <div>
            <BbLabel>Email Notifications</BbLabel>
            <BbSwitch @bind-Checked="emailNotifications" />
        </div>
        <BbSeparator />
        <div>
            <BbLabel>Push Notifications</BbLabel>
            <BbSwitch @bind-Checked="pushNotifications" />
        </div>
    </BbCardContent>
    <BbCardFooter>
        <BbButton>Save Changes</BbButton>
    </BbCardFooter>
</BbCard>

Design Philosophy

BlazorBlueprint.Components follows the shadcn/ui philosophy with zero-configuration deployment:

  1. Zero Configuration: Pre-built CSS included - just install and use
  2. shadcn/ui Compatible: Uses the same design tokens and CSS variables
  3. Built on Primitives: All behavior comes from BlazorBlueprint.Primitives
  4. Theme Tokens: Fully themeable using CSS variables
  5. Built with Accessibility in Mind: Includes ARIA attributes and keyboard support
  6. Customizable: Override with custom CSS or add Tailwind if needed

When to Use

Use BlazorBlueprint.Components when:

  • Want beautiful defaults with shadcn/ui design
  • Need zero-configuration setup (no build tools required)
  • Want to ship quickly without building components from scratch
  • Need dark mode and theming support out of the box
  • Want shadcn/ui theme compatibility

Consider BlazorBlueprint.Primitives when:

  • Building a completely custom design system
  • Want zero opinions about styling
  • Need to match a specific brand or design language
  • Prefer full control over all CSS

Documentation

For full documentation, examples, and API reference, visit:

Dependencies

Optional:

  • Tailwind CSS (if you want to use Tailwind classes for customization)
  • Quill 2 (load its JavaScript and CSS in the host application when using RichTextEditor)

License

Apache License 2.0 - see LICENSE for details.

The package includes LICENSE, NOTICE, and staticwebassets/THIRD-PARTY-NOTICES.txt. The bundled Tailwind CSS, tw-animate-css, and ECharts assets retain their upstream licenses, including the D3, ZRender, and Microsoft helper notices within ECharts. These notices are also available at _content/BlazorBlueprint.Components/THIRD-PARTY-NOTICES.txt.

Contributing

Contributions are welcome! Please see our Contributing Guide.

Product Compatible and additional computed target framework versions.
.NET net10.0 is compatible.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages (2)

Showing the top 2 NuGet packages that depend on BlazorBlueprint.Components:

Package Downloads
NEXCODE.Caffeine.UI

Shared Blazor UI Components — Blazor Blueprint, Plotly Charts, Localization
BlueprintShell

Embeddable Blazor shell built on BlazorBlueprint. Spin up a themed, dockable UI on a configurable port from any .NET application.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
4.1.0-beta.2 0 9/22/2026
4.1.0-beta.1 21 9/21/2026
4.0.1 374 9/19/2026
4.0.0 50 9/19/2026
4.0.0-beta.10 36 9/19/2026
4.0.0-beta.9 39 9/18/2026
4.0.0-beta.8 45 9/17/2026
4.0.0-beta.5 68 9/16/2026
4.0.0-beta.4 40 9/16/2026
4.0.0-beta.3 71 9/15/2026
4.0.0-beta.2 54 9/15/2026
4.0.0-beta.1 48 9/15/2026
3.17.0 981 9/13/2026
3.16.1 157 9/12/2026
3.16.0 3,947 9/4/2026
3.15.0 21,553 8/5/2026
3.14.1 18,128 7/16/2026
3.14.0 904 7/15/2026
3.13.0 11,774 7/2/2026
3.12.1 8,423 6/17/2026
Loading failed

## What's New in v4.0.0-beta.8

**This is a prerelease.** The API may still change before the stable v4.0.0 release.

### Breaking Changes

- **.NET 10**: the package now targets `net10.0` only and depends on `Microsoft.AspNetCore.Components.Web` 10.0.12. .NET 8 and .NET 9 are no longer supported.
- **BlazorBlueprint.Primitives**: the dependency is now 4.0.0-beta.8, which has its own breaking changes. Keep Components and Primitives on matching v4 versions. See the Primitives release notes and `V4-MIGRATION-GUIDE.md`.
- **Stylesheet**: every Tailwind utility in `blazorblueprint.css` is now prefixed `bb:` (`.bb\:flex`) and lives in its own `bb-utilities` cascade layer, so your Tailwind build and the library's can no longer emit the same class. The layer order is `properties, theme, base, components, bb-utilities, utilities, bb`.
- **Class parameter**: no markup change is needed. `ClassNames.cn` merges across the prefix, so `Class="p-6"` still replaces the library's `bb:p-4`.
- **Tailwind `@source`**: remove any `@source` that points at the Blazor Blueprint package or sources. Under a prefixed build it emits nothing.
- **Projects without a Tailwind build**: bare utilities in your own markup (`class="flex gap-4"`) that relied on `blazorblueprint.css` now match nothing. Add a Tailwind build, or use the prefixed classes as a stopgap; that class set is not a stable API.
- **shimmer**, **scroll-fade-x**: renamed to `bb:shimmer` and `bb:scroll-fade-x`.
- **Theme variables**: Tailwind's generated variables are prefixed too (`--bb-spacing`, `--bb-default-transition-duration`). Semantic tokens such as `--background` and `--border` are unchanged.
- **CursorExtensions.ToClass**: returns the prefixed class (`bb:cursor-pointer`).
- **Internal class names**: CSS, JavaScript or tests that select internal elements by utility class (`.flex-col`, `.hidden`) need the prefix. Prefer the `data-slot` and other data attributes, which are stable.
- **Menus**: **BbDropdownMenu**, **BbContextMenu** and **BbMenubar** content and items now take their colours from `--bb-menu-*` tokens. The default hover and focus highlight is a tint of the menu foreground, not `--accent`. Set `--bb-menu-accent: var(--accent)` and `--bb-menu-accent-foreground: var(--accent-foreground)` to restore the old highlight.
- **BbCarousel**: drag and swipe navigation is now on by default (`Draggable="true"`), and the root element is keyboard-focusable. JavaScript now positions the slides, so **BbCarouselContent** no longer renders an inline `transform`. `SlidesPerView` below 1, a negative `Gap` or an `AutoplayInterval` below 1000 now throws.
- **BbDataGrid**: a paged `IQueryable` source without search, grouping or virtualization now runs the full query only when a CSV export is requested. Keep its query provider (for example a `DbContext`) alive until then.
- **ThemeService**: `SetRadiusAsync` throws for values outside 0–4 rem, and invalid `ThemeOptions` defaults throw when the service is created. A stored radius outside that range is ignored.
- **BbTooltipTrigger**: `AsChild` now defaults to `false`. Add `AsChild="true"` where the child consumes the trigger context itself, such as a `BbButton`.
- **BbDrawerTrigger**, **BbDrawerClose**: now render a real `<button type="button">` and gain `AsChild`. Set `AsChild="true"` when the child is already a control, or you get a button inside a button.
- **JavaScript modules**: components import their module once per circuit through `JsModules.GetAsync` / `PrimitiveModules.GetAsync` and no longer dispose it. Primitive modules are reached through `bb-primitives.js` under a namespace (`elementUtils.isNearBottom`). Custom code that imported individual primitive files must be updated.
- **Core bundle**: `theme.js`, `sidebar.js`, `sidebar-inset.js`, `text-input.js` and `composition-guard.js` ship as `bb-components-core.js` under a namespace (`theme.initialize`). Import it through `ComponentModules.GetCoreAsync`.
- **BbPopoverContent**, **BbSelectContent**, **BbDropdownMenuContent**: `BbFloatingPortal` wires dismissal and listbox keys in the call that opens the overlay. JavaScript owns `data-side`, `data-focused` and `aria-activedescendant`, so stop rendering them from C#.
- **BbSortable**: keyboard sorting is on by default, so each item, or its drag handle, is now a tab stop. Set `KeyboardSorting="false"` to keep the old tab order.
- **BbSortable**: in a drop between two connected lists, the source list's `OnRemove` now runs before the target list's `OnAdd`.
- **IVirtualizedGroupHandler**: gains `TryHoverItem(string elementId)`. Custom implementations must add it.
- **BbRichTextEditor**: Quill 2 is now required. The Quill 1 fallback for `getSemanticHTML` is removed, and the setup notes pin `quill@2.0.3`.

### New Components

- **BbScheduler**: day, week and work-week time slots with resource lanes, overlapping events, an event editor with delete confirmation, and drag-to-move and resize that snap to `SlotMinutes`. Supports recurrence (edit one occurrence or the series), IANA time zones with DST checks, `FirstDayOfWeek`, `InitialScrollHour`, and `OnEventChange` with `Cancel` to reject a change.
- **SchedulerEngine**: public helpers to expand recurring events (`Expand`), apply an edit (`ApplyChange`), validate an event and convert a local time to an instant (`ToInstant`).
- **BbTreeSelect**: searchable hierarchy picker with single or multiple selection, cascading checkboxes with indeterminate states, `LeafOnly`, clearing and `EditContext` binding.
- **BbCascader**: column-based hierarchy picker with full-path search, optional branch selection (`ChangeOnSelect`), keyboard and RTL navigation, and `EditContext` binding.
- **BbDateInput**, **BbTimeInput**: culture-aware segmented date and time entry with keyboard increments, min/max bounds, an optional calendar or time picker, and `EditContext` validation.
- **BbAppBar**: top app bar with title, description, back button, actions, sticky positioning and safe-area padding.
- **BbBottomNav**, **BbBottomNavItem**: bottom tab navigation with a bindable `Value`, links, icons, fixed positioning and safe-area padding.
- **BbNotificationBadge**: count or dot badge over any content, with `Maximum`, `ShowZero`, `Position` and `Variant`.
- **BbQuantityStepper**: integer stepper with `Min`, `Max` and `Step`, `EditContext` binding, and an `OnRemove` callback when decreasing at the minimum.
- **BbSectionHeader**: section title with description, actions and an optional separator.
- **BbMotion**: preset or custom keyframe animations, triggered on visibility, in view, hover, press or from code (`PlayAsync`). Respects reduced motion.
- **BbHeightAnimation**: animates expanding, collapsing and content resizing while keeping the content mounted.
- **BbSelectionIndicator**: an indicator that slides to the active element and can follow hover and keyboard focus.
- **BbPageTransition**, **BbScreenTransition**: animate incoming page content, or new screen content when `TransitionKey` changes.
- **BbRenderStateProvider**: cascades a `RenderState` that tells content when the app is interactive.
- **BbThemeScope**: applies a `ThemeDesign` and an optional radius to a subtree, including its floating overlays.
- **BbSidebarPillNav**, **BbSidebarPillNavItem**, **BbSidebarPillInset**: floating pill navigation for the collapsed `SidebarCollapsedMode.Pill` sidebar.
- **BbSidebarSelectionIndicator**: animated selection indicator for sidebar menus.
- **Menu submenus and radio items**: **BbDropdownMenu**, **BbContextMenu** and **BbMenubar** each gain `Sub`, `SubTrigger`, `SubContent`, `RadioGroup` and `RadioItem` components. **BbContextMenuCheckboxItem** is also new.
- **BbSortableHandle**: accessible drag handle with a default grip icon.
- **BbBadgeIcon**: small decorative icon for a **BbBadge**, by Lucide `Name` or custom content.

### New Features

- **BbDataGrid**: `DataGridEditMode.Cell` and `Batch` editing. Drafts are isolated copies from `EditItemFactory` (required for these modes), validated before save, and kept when a save is rejected.
- **BbDataGrid**: batch editing adds `OnBatchCommit`, `OnBatchCancel`, `CommitBatchAsync` and `CancelBatchAsync`, and `StartCellEditAsync` opens a cell editor from code.
- **DataGridRowCommitContext**: new `OriginalItem`, the unchanged source record in cell mode. **DataGridBatchCommitContext** is new.
- **BbFileUpload**: optional `UploadHandler` transport with progress, cancellation and retry. Adds `AutoUpload`, `OnUploadFinished`, `UploadFilesAsync`, `UploadFileAsync` and `CancelUpload`.
- **FileUploadItem**: new `Status`, `BytesTransferred`, `Progress` and `UploadError`. **FileUploadContext** reports progress through `ReportProgressAsync`.
- **BbDataView**: selection (`SelectionMode`, `SelectedItems`, `ItemKey`, `IsItemDisabled`), grouping (`GroupBy`, `GroupHeaderTemplate`) and list virtualization (`EnableVirtualization`).
- **BbDataView**: `MobileToolbar` moves sorting and the new `FilterContent` into a bottom sheet.
- **BbSelect**: `Presentation="SelectPresentation.BottomSheet"` shows the options in a modal bottom sheet, titled by `SheetTitle`.
- **BbMultiSelect**: `FooterContent` replaces the default footer, and `CloseAsync` closes the list from code.
- **BbFilterBuilder**: saved `Presets` shown as buttons or a dropdown (`PresetDisplay`, `ApplyPresetAsync`), `SearchableFields`, and per-field `ValueEditors` templates.
- **BbCarousel**: autoplay with a pause/play button, multiple or fractional `SlidesPerView`, `Gap`, built-in indicators, bindable `ActiveIndex`, `OnSlideChanged` and `GoToAsync`.
- **BbDrawer**: `SnapPoints` with a bindable `SnapIndex`, pointer and arrow-key resizing, and `DismissOnDrag`.
- **BbSortable**: keyboard sorting (pick up, move, move to a connected list with Control+Left/Right, drop, cancel) with `KeyboardSorting` and `KeyboardInstructions`, `CanMove` and `CanDrop` rules, and a `DragOverlayTemplate` preview.
- **BbSidebarProvider**: new `CollapsedMode`. `Pill` replaces the icon rail with floating pill navigation when the sidebar collapses.
- **Theme presets**: `ThemeDesign` sets density, font stack, card and menu surfaces, and menu colours, and is saved with the theme. Fonts are not downloaded; your app supplies them.
- **ThemeService**: new `SetPresetAsync`, `SetDesignAsync` and `Preset`. **ThemeOptions** gains `DefaultPreset`, and `ThemePresets` offers seven starting points.
- **BbThemeSwitcher**: `ShowDesignOptions` shows the design settings.
- **BbBadge**: new `Success`, `Warning` and `Info` variants, plus soft variants (`Soft`, `SoftDestructive`, `SoftSuccess`, `SoftWarning`, `SoftInfo`).
- **BbToggleGroup**: `Required` keeps the last selection, and `Scrollable` scrolls the items horizontally.
- **BbSeparator**: `LineStyle` for solid, dashed or dotted lines.
- **BbRichTextEditor**: tables through Quill 2's built-in table module. The `Full` toolbar gains a table button, and the component gains `InsertTableAsync`, `InsertRowAboveAsync`, `InsertRowBelowAsync`, `InsertColumnLeftAsync`, `InsertColumnRightAsync`, `DeleteRowAsync`, `DeleteColumnAsync` and `DeleteTableAsync`.
- **BbRichTextEditor**: the `Standard` toolbar gains undo, redo and a checklist. `UndoAsync` and `RedoAsync` are new, and `TextChangeEventArgs` reports `CanUndo` and `CanRedo`.
- **BbRichTextEditor**: the `Full` toolbar gains inline code, alignment, text colour, highlight and images. Alignment and colours are written as inline styles.
- **BbRichTextEditor**: new `ImageUploader` and `MaxImageSize` (10 MB default) to store picked, dropped or pasted images, plus `InsertImageAsync` and the `EditorImageUpload` type. Without an uploader, images embed as data URLs.
- **BbDialog**: new `RenderingStrategy`. `OverlayRenderingStrategy.Native` renders a browser `<dialog>` that needs no portal host and works across render-mode boundaries.
- **BbDialogContent**: in native mode, `CloseOnOverlayClick` controls backdrop clicks, and the stylesheet styles the native backdrop.
- **BbPopoverContent**: new `ScrollToSelected`, `ScrollToSelectedSelector` and `AutoFocusId`, applied in the call that positions the popover.
- **BbCommandInput**: new `Id`, so an owner can target the search box for focus.
- **BbCopyText**: new `ValueFuncAsync` for text that must be fetched, copied inside the user gesture so the write survives a slow callback.
- **BbCopyText**: new `OnCopyFailed` callback with a `CopyTextFailure` of `Refused` or `NoValue`.
- **ComponentModules**: new static helper with `CorePath`, `CoreUrl`, `GetCoreAsync` and `TryGetCoreLoaded` for the core JavaScript bundle.

### Bug Fixes

- **BbDataGrid**: initial sorting now applies to the first rows, so they match the sort indicators.
- **BbDataView**: with `ShowPagination="false"`, local data is no longer cut to the first page.
- **BbDataView**: a parent re-render no longer undoes a layout the user toggled, and infinite scroll keeps working after a provider load replaces the scroll container.
- **BbDrawer**: closing returns focus to the trigger that opened it, including composed triggers.
- **BbDatePicker**: focus returns to the trigger after a date is picked.
- **BbMultiSelect**: Escape closes the list and stops there, so it no longer reaches an enclosing overlay.
- **BbTreeView**: in checkable, non-strict mode, checking a parent now reaches children hidden by the search filter.
- **BbColorPicker**: dragging does nothing while `Disabled` is set.
- **Core bundle**: the modules inside `bb-components-core.js` now load from revised URLs, so a cached older `sidebar.js` cannot break an upgraded app.
- **Core bundle**: a stale cached module now fails at load with an error that names the file, instead of killing the circuit.
- **BbSidebarInset**: client-side navigation no longer kills the circuit with `Could not find 'scrollToTop'` (a regression in 4.0.0-beta.1).
- **BbCommand**, **BbCommandInput**, **BbCommandVirtualizedGroup**, **BbNavigationMenu**, **BbResponsiveNavProvider**, **BbSidebarProvider**, **BbSidebarInset**: fire-and-forget handlers now catch all exceptions, so none can end a Blazor Server circuit.
- **BbCombobox**: closing no longer fires `SearchQueryChanged` with an empty string when nothing was typed, so an infinite-scroll list is not reloaded.
- **BbCombobox**: reopens scrolled to the chosen item, which is marked with `data-bb-current`.
- **BbCopyText**: the clipboard write happens inside the user gesture, so Safari accepts it. Enter and Space are handled in JavaScript.
- **BbCopyText**: the `execCommand` fallback runs only in insecure contexts, so it no longer reports success with an empty clipboard.
- **BbDrawerTrigger**, **BbDrawerClose**: now show the themed focus ring.
- **BbPopoverContent**, **BbDropdownMenuContent**: no longer render twice on open.
- **BbDialog**, **BbAlertDialog**, **BbSheet**, **BbDrawer**: Tab no longer escapes the modal when focus is on the container or on a listbox outside the tab order, which WebKit allowed.
- **BbDropdownMenu**, **BbContextMenu**, **BbMenubar**: keys pressed with Ctrl, Alt or Meta are ignored, and in a right-to-left **BbMenubar** Left and Right move to the correct menu.
- **BbToggleGroup**: without a bound value, items show the pressed state as soon as they are toggled.
- **BbSortable**: no longer calls `OnUpdate` for an out-of-range or unchanged index, or when `Sort` is false.

### Improvements

- **Scrollbars**: native scrollbars inside library components follow the theme in light and dark mode, and the stylesheet sets `color-scheme` for each mode.
- **BbSidebar**: a closed non-collapsible sidebar is now `inert` and `aria-hidden`, and its width transition respects reduced motion.
- **Localization**: `DefaultBbLocalizer` adds strings for the new components and features.
- **Package**: adds a dependency on `Ical.Net` 5.2.3 for scheduler recurrence. The package now includes `LICENSE`, `NOTICE` and `THIRD-PARTY-NOTICES.txt`, also served at `_content/BlazorBlueprint.Components/THIRD-PARTY-NOTICES.txt`.
- **BbRichTextEditor**: `table`, `code`, `align`, `color`, `background` and `image` are registered formats, so bound or pasted HTML keeps them. The sanitizer allows `data:image/*` on `<img src>` only.
- **BbDarkModeToggle**: icons are now `h-4 w-4`, matching **BbThemeSwitcher**.
- **Reduced motion**: the `.bb-no-animate` exemption matches both `bb:animate-spin` / `bb:animate-pulse` and bare `animate-spin` / `animate-pulse`.
- **BbCommandInput**: the focus ring moves from the `<input>` to its row.
- **ThemeService**: invalid colour names in `localStorage` fall back to the default in the browser, without an extra round trip.
- **BbNavigationMenuTrigger**: ArrowDown no longer waits 50 ms before focusing the first item.
- **BbSortable**: items render with `role="listitem"`, and the live status region and keyboard instructions have stable ids.

### Performance

- **BbDataGrid**: paged `IQueryable` sources without search, grouping or virtualization count and page on the query provider instead of loading every row.
- **BbCommand**: filtered results and item positions are cached and shared, so items no longer rescan the filtered list.
- **BbSlider**, **BbRangeSlider**, **BbColorPicker**: drag feedback updates in the browser. Value updates during a drag are sent at most about every 50 ms, and the final value is sent on release.
- **BbRating**: hover updates when the pointer enters an icon, not on every mouse move.
- **BbTreeView**: search indexes parents and visible nodes, so rendering no longer repeats descendant searches.
- **Overlays**: **BbSelect**, **BbPopover**, **BbDropdownMenu**, **BbCombobox** and other floating overlays open and close in one interop call each instead of five, through the Primitives update.
- **BbCombobox**, **BbMultiSelect**: the search box is focused inside the call that opens the popover, not after a render, a 50 ms wait and another round trip.
- **BbSelect**, **BbPopover**, **BbDropdownMenu**: focus returns to the trigger inside the close call.
- **BbPopoverContent**: requests the portal ready callback only when `OnContentReady` is set.
- **BbCommandItem**: one delegated hover listener per list replaces per-item mouse handlers, and `ShouldRender` stops a focus move from re-rendering every item.
- **BbCommandList**, **BbSelectContent**, **BbMultiSelect**, **BbDataView**: infinite scroll watches for the bottom in the browser and calls .NET once, instead of a round trip per scroll event.
- **JavaScript modules**: each module is imported once per circuit and shared by all component instances.
- **Core bundle**: the five modules used on most pages ship as one file, cutting module imports per page from 3–6 to 1–3.
- **ThemeService**, **BbSidebarProvider**: initialize in one interop call each instead of two to four.
- **BbDataGrid**: key and click handlers are attached once to the grid and delegated, instead of once per row.