Banner Alert Consent Check

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its button dependencies and any missing npm packages, and installs them straight into your project.

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/banner/banner11.tsx instead.

Usage

The file also exports banner11Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Banner11, banner11Demo } from "@/components/blocks/banner/banner11";

export default function Page() {
  return <Banner11 {...banner11Demo} />;
}

Props

Behavior notes

• The checkbox and dismiss button are a single action with a modifier, not two competing choices, which is why they sit inline in one footer row rather than as a stacked button pair.
• Checked state and dismissal are local component state; wire the dismiss handler to localStorage yourself if the acknowledgment should persist across reloads.
• The icon is looked up internally rather than accepted as a prop, since this is a Client Component and a Lucide icon reference can't cross the Server-to-Client props boundary from a generated demo page.

Frequently asked questions