Settings Integrations 10 - Danger zone disconnectPro
An integration settings footer with a destructive-bordered danger zone offering pause sync, delete synced data and disconnect actions, where disconnecting requires typing the app name to confirm. Use it at the bottom of any integration detail page to make irreversible actions deliberate.
About Settings Integrations 10
An integration settings footer with a destructive-bordered danger zone offering pause sync, delete synced data and disconnect actions, where disconnecting requires typing the app name to confirm. Use it at the bottom of any integration detail page to make irreversible actions deliberate.
Settings Integrations 10 is a settings integrations block for React and Tailwind CSS, included in Chocolate UI Pro with motion animations that respect reduced-motion settings. It ships as 106 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.
- settings
- danger zone
- disconnect
- destructive
- confirm
- integration
Installation
- Set up your project with
npx chocolateui initandnpx chocolateui login(see the installation guide). - Run the Chocolate UI CLI:
npx chocolateui add settings-integrations-10Dependencies installed automatically: lucide-react, motion.
Uses: button, input, reveal, utils.
Usage
import SettingsIntegrations10 from "@/components/blocks/settings-integrations-10"
export default function Page() {
return <SettingsIntegrations10 />
}