v0.1.0
v0.1.0 · public beta

Floating actions.
For React.

A React 18 component for the toolbar that slides up when something is selected. Around 8 KB ESM gzipped, with zero runtime dependencies, SSR-safe rendering, and the WAI-ARIA toolbar pattern wired in.

npm i @reynsu/react-floaty
Examples

Seven real use cases.

All examples run live on this page.
Customization

9 themes from one className.

Three featured variants below — including layouts that escape the row entirely.
API

One Provider, one hook.

5 props · 5 members · ~8 KB

<FloaterActionsProvider /> component

maxVisible
Visible buttons before overflow. Default 3.
portalContainer
Portal target. Default document.body.
className
Class on the bar — theming hook.
closeOnOutsideClick
Pointerdown outside dismisses. Default true.
closeOnEscape
Escape dismisses. Default true.

useFloaterActions() hook

show(actions, opts?)
Open the bar with the given action list.
hide()
Close (animation runs to completion).
toggle(actions?)
Toggle. Reuses last actions if omitted.
open
Boolean — current open state.
actions
FloaterAction[] currently shown.