BROWSER MODEClick → browser → visible
Ready when you are.
Opening, focus, submenus, and dismissal stay local. An application action still reaches C#.
Try Save draft to run an application callback.
Interaction Mode
Interaction Mode
New in v4.5.0 for both Components and Primitives: keep floating UI and typed input responsive with browser-local interactions and asynchronous application callbacks.
v4.5.0
Opt-in mode
Keyboard accessible
LOCAL UI EVENTSObserved directly in this browser
LAST REVEALInput → positioned floating layer
APPLICATION CALLBACKS00 pending · 0 parent renders
Dropdown menus
Compare browser-local opening, focus, submenus, and dismissal with the default Blazor interaction mode. On Interactive Server, the default path includes a server round trip.
STANDARD BLAZORClick → server → render
The familiar server path.
The default mode processes interactions through the active Blazor renderer, including a server round trip here.
Existing behavior is still the default.
↑↓ navigate ·→ submenu ·Esc dismiss · type to find an item
Select with asynchronous commits
Change the workspace while a callback is pending. Selection updates immediately; older responses cannot replace your latest choice.
Last accepted by serverDesign
Checkbox and radio menus
Filter feedback stays local while application callbacks run. Use the delay and rejection settings above to distinguish pending choices from accepted values.
Accepted: unread False, mentions False, notifications all.
A visible checkmark is optimistic feedback. Pending items expose data-neo-pending; the accepted summary changes only after the callback.
Date, time, and composed controls
One scoped policy keeps floating layers, item highlighting, and keyboard focus local. Application values, search callbacks, and newly rendered content still use Blazor.
Date picker
Open the calendar and navigate its visible days locally; choosing a date updates the bound value through Blazor.
Selected: None
DatePicker examplesTime picker
Open locally, then use the existing time fields and Apply action to commit a time.
Selected: None
TimePicker examplesCombobox
Hover highlighting and keyboard navigation stay local. Searching and committing a workspace still use Blazor.
Selected: None
Combobox examplesMulti-select
Hover, keyboard navigation, and dismissal stay local. Keep the list open while Blazor updates the selected teams.
Selected: None
MultiSelect examplesThese examples inherit Browser mode without setting it on each control.
Command search
The same CommandInput used by spotlight, with browser-owned typing and navigation. Search has a 300 ms debounce, followed by a deliberately delayed application callback.
Workspace
Create project
Browse projects
Invite teammate
Preferences
Change theme
Notification settings
Archived workspace
Keep typing while search finishes
Callbacks wait 700 ms. Try spaces, edit in the middle, or backspace to empty. Hover and arrow-key highlighting stay local; Enter selects when the latest query has finished.
Processed query: (empty)
Selected: None
Ready
Reset recreates this example and invalidates its pending callbacks. Filtering and selection still run through Blazor.
Command examplesLoad values after the inputs appear
These inputs mount empty. Load an existing segment to populate untouched fields through ordinary binding, or type during the delay to keep your local draft.
An untouched input displays the name when loading finishes.
Once you edit, the incoming name cannot overwrite your draft.
Formatted inputs update too. Focus the loaded budget to see its full precision.
Inputs are ready. Load a segment, then try again while typing during the delay.
Loading uses ordinary @bind-Value, without a loading guard or revision bump. Start again creates fresh inputs. For an intentional replacement of an edited value, use ValueRevision. Applications should also guard their own model assignments when loading overlaps edits.
Type freely while the server works
The browser owns the draft and caret. These callbacks deliberately wait 700 ms; old responses cannot overwrite newer typing. Use an explicit revision to reset a draft.
Accepted: Hello
Accepted: Hello
Local text is a draft until accepted. Rejection restores the accepted value after the latest callback. An interrupted request can have an uncertain outcome.
Save the latest draft
Type quickly and save immediately. BrowserEditForm keeps existing EditForm handlers and validators, flushes pending drafts before validation, and holds the snapshot through Save.
Saved: None
Rejected or corrected values, incomplete composition, resets and uncertain delivery stop submission. Review the field and submit again.
Enable actions before blur
Change mode notifies only on empty ↔ non-empty transitions while typing. Further non-empty typing stays local until blur/change or an explicit Save flush.
Callbacks: 0 · accepted value: (empty)
Multiline and grouped drafts
Textarea and InputGroup share Input's browser draft, IME, reset and form synchronization protocol. Save immediately after typing to include the latest values.
Hover and disclosure
HoverCard and Tooltip support hover, focus and informational touch taps. Accordion expansion and Collapsible state stay in the browser; mounted content remains live Blazor content.
Summary preview
Expansion, keyboard navigation, focus and ARIA state update without waiting for a circuit.
Application callbacks and the business logic of components inside each panel.
Hidden content remains mounted and can still load data or hold subscriptions.
Instant tabs for mounted content
Evaluate each tab set before inheriting Browser mode. Use an explicit Blazor override for lazy loading, expensive grids/charts/editors, or content whose mount lifecycle should run only when selected.
Small panels switch locally and retain their state.
Inactive panels stay mounted. Hidden does not mean lazy or free to initialize.
Data controls and editor drafts
Formatted inputs, tags, OTP, date/time segments, toggles and sliders share local editing with versioned acceptance. Save synchronizes their latest values before validation; invalid or uncertain drafts stop submission.
Adopt a policy with exceptions
Explicit component setting → nearest scoped override → application family setting → application global default → library Blazor default.
Live Blazor content inside a browser popover
This theme picker inherits Browser mode. Its buttons still execute the existing Blazor theme handlers.
Family defaults let floating shells and menus use Browser while inputs and selection controls keep Blazor behavior. Selection includes Select, Combobox, MultiSelect and picker shells, including composed search UI; Inputs includes standalone Command, text fields, structured fields, checkboxes, toggles and sliders. Internal search follows its selection control’s resolved mode. Scoped overrides apply to all families unless their optional Family parameter narrows the scope. The date/time pickers, Combobox, and MultiSelect above inherit their explicit Browser scope. Their floating shells and transient focus become local; search, value commits, and new calendar content remain Blazor interactions. Large lists and repeated row menus may be better kept in Blazor mode with mount-on-demand content.
Popover and browser events
Open a floating layer and watch its events without adding server callbacks.
Small layer. Local behavior.
This popover opens, positions, takes focus, and dismisses in the browser. These native controls need no application callback.
LIVE IN YOUR BROWSER
Local event stream
Open a browser-mode component to see its events.
Browser mode supports action/link menus, checkbox and radio items, submenus, popovers, and selects. Local feedback does not confirm server acceptance; circuit interruptions can leave requests uncertain.