Settings Notifications 1 - Event by channel switch matrix
A notification preferences table where each row is an event grouped by category and each column is a channel (email, push, in-app) with its own switch. Use it on a settings page when users need fine-grained control over which events reach them and where.
About Settings Notifications 1
A notification preferences table where each row is an event grouped by category and each column is a channel (email, push, in-app) with its own switch. Use it on a settings page when users need fine-grained control over which events reach them and where.
Settings Notifications 1 is a free settings notifications block for React, built on shadcn/ui and Tailwind CSS. It ships as 118 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
- notifications
- matrix
- switches
- push
- preferences
Installation
- Add the Chocolate UI registry to your
components.json(see the installation guide). - Run the shadcn CLI:
npx shadcn@latest add @chocolate/settings-notifications-01Dependencies installed automatically: lucide-react.
Uses: button, reveal, switch, utils.
Usage
import SettingsNotifications01 from "@/components/blocks/settings-notifications-01"
export default function Page() {
return <SettingsNotifications01 />
}