Switch
Confirmed Danger Switch
A switch for a dangerous action: turning it off unfolds a panel with the consequence and two buttons, while turning it back on applies instantly.
What you can change
- the setting caption through label and the explanation through description
- the question text through question
- the button captions through confirmText and cancelText
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/switch-005?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
A client component: a useState on the state itself and on showing the panel. The onChange handler is asymmetric — turning on is applied instantly, while turning off only opens the question, so the switch physically does not move until confirmation. The panel is built into the flow rather than into a dialog: a modal window would cover the very setting being asked about. The appearance is animated and is suppressed by prefers-reduced-motion. The palette lives in --vibeui-switch-005-*.
Tags
- switch
- confirm
- danger
- settings
Component source
The same file your agent installs. Here in case you would rather copy it by hand.
Loading…