Button
Hotkey Bound Button
The button owns its shortcut: it binds the listener, prints ⌘ on macOS and Ctrl elsewhere, and flashes when the combination actually fires.
What you can change
- the caption through the label prop
- the shortcut through the combo prop: mod means Cmd on macOS and Ctrl elsewhere
- the action through the onAction prop, which a plain click fires as well
A link for your AI agent: preview, code and instructions.
Preview
Use it with AI
- 1. Copy the link.
- 2. Write to your agent in your own words and drop the link into the sentence.
- 3. The agent opens the link and installs the component from the registry.
put this on the home page as the hero:
https://vibeui.ru/c/button-025?lang=en&theme=dark
Not sure where to paste it? Step-by-step guide
Show the full instructions
What the link says, spelled out. Use it when your agent cannot open links — paste this text instead.
Loading…
For developers
The install command lives in the “Component source” block below — a signed link that stays valid for 24 hours.
Technical notes
The component is self-contained: one file, no dependencies, its own palette in the local --vibeui-button-025-* variables. Client component: a keydown listener sits on window, and a combo of the form "mod+s" is parsed into modifiers and a main key. The platform is read through useSyncExternalStore: the server snapshot is always false, so the server and client markup match, and after hydration the keys are repainted for the system. While the focus is in an input field or a contenteditable, the shortcut is not intercepted. The handler is kept in a ref so that the listener does not resubscribe on every render.
Tags
- button
- hotkey
- keyboard
- shortcut
Component source
The same file your agent installs. Here in case you would rather copy it by hand.
Loading…