{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "announcement-banner-split",
  "title": "Announcement — Split Banner",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-react/blocks/announcement-banner-split/AnnouncementBannerSplit.tsx",
      "content": "'use client'\n\nimport { ArrowRight, CircleAlert, Info } from 'lucide-react'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Separator } from '@/components/ui/separator'\n\nexport function AnnouncementBannerSplit({ tone = 'neutral' }: { tone?: 'neutral' | 'attention' }) {\n  const Icon = tone === 'attention' ? CircleAlert : Info\n\n  return (\n    <section\n      data-slot=\"announcement-banner-split\"\n      className={`border-b ${tone === 'attention' ? 'border-border bg-muted' : 'border-border bg-card'}`}\n    >\n      <div className=\"mx-auto flex max-w-6xl flex-col gap-4 px-6 py-4 sm:flex-row sm:items-center sm:gap-8\">\n        {/* Message column carries the classification; the action column stays\n            the same width whatever the message length, so a stack of these\n            banners aligns down the page. */}\n        <div className=\"flex min-w-0 flex-1 items-start gap-3\">\n          <Icon\n            className={`mt-0.5 size-4 shrink-0 ${tone === 'attention' ? 'text-destructive' : 'text-muted-foreground'}`}\n            aria-hidden=\"true\"\n          />\n          <div className=\"min-w-0\">\n            <div className=\"flex flex-wrap items-center gap-2\">\n              <Badge variant={tone === 'attention' ? 'outline' : 'secondary'}>\n                {tone === 'attention' ? 'Scheduled maintenance' : 'Release 2.4.0'}\n              </Badge>\n              <span className=\"text-muted-foreground font-mono text-xs\">Aug 14, 2026 · 02:00–04:00 UTC</span>\n            </div>\n            <p className=\"mt-1.5 text-sm leading-relaxed\">\n              {tone === 'attention'\n                ? 'Query serving stays online. Scheduled materialisation pauses for the window and resumes automatically.'\n                : 'Command palette, table virtualisation past 10k rows, and AA-contrast sidebar badges in dark mode.'}\n            </p>\n          </div>\n        </div>\n\n        <Separator orientation=\"vertical\" className=\"hidden h-10 sm:block\" />\n\n        <div className=\"flex shrink-0 items-center gap-2\">\n          <Button variant=\"outline\" size=\"sm\">\n            {tone === 'attention' ? 'Status page' : 'Full changelog'}\n            <ArrowRight className=\"ml-1.5 size-3.5\" aria-hidden=\"true\" />\n          </Button>\n          <Button variant=\"ghost\" size=\"sm\">\n            Subscribe\n          </Button>\n        </div>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:block",
      "target": "~/components/blocks/AnnouncementBannerSplit.tsx"
    }
  ],
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/react/badge.json",
    "https://uipkge.dev/r/react/button.json",
    "https://uipkge.dev/r/react/separator.json"
  ],
  "description": "Full-width announcement band split between a labelled message column and an action column, sized for release notes and maintenance notices rather than promotions.",
  "categories": [
    "marketing"
  ],
  "deprecated": true,
  "replacedBy": "announcement"
}