{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "banner-announcement-sticky",
  "title": "Banner Announcement Sticky",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-react/blocks/banner-announcement-sticky/BannerAnnouncementSticky.tsx",
      "content": "'use client'\n\nimport * as React from 'react'\nimport { ArrowRight, Megaphone, X } from 'lucide-react'\nimport { Badge } from '@/components/ui/badge'\nimport { cn } from '@/lib/utils'\n\nexport interface BannerAnnouncementStickyProps {\n  className?: string\n}\n\nexport function BannerAnnouncementSticky({ className }: BannerAnnouncementStickyProps) {\n  const [isVisible, setIsVisible] = React.useState(true)\n\n  if (!isVisible) return null\n\n  return (\n    <aside\n      data-slot=\"banner-announcement-sticky\"\n      className={cn(\n        'border-border bg-card/90 relative z-50 border-b px-4 py-2.5 backdrop-blur-md transition-colors sm:px-6',\n        className,\n      )}\n    >\n      <div className=\"mx-auto flex max-w-7xl items-center justify-between gap-4 font-mono text-xs\">\n        {/* Left / Center Content */}\n        <div className=\"flex min-w-0 flex-1 items-center justify-center gap-3 sm:justify-start\">\n          <Badge\n            variant=\"secondary\"\n            className=\"bg-primary/10 text-primary border-primary/20 shrink-0 px-2 py-0.5 text-xs font-bold tracking-wider uppercase\"\n          >\n            v2.4.0 Release\n          </Badge>\n\n          <p className=\"text-foreground flex items-center gap-1.5 truncate\">\n            <Megaphone className=\"text-primary hidden size-3 shrink-0 sm:inline\" />\n            <span>Announcing 450+ Marketing &amp; SaaS Blocks with Tailwind v4 OKLCH token engine.</span>\n          </p>\n\n          <a href=\"#\" className=\"text-primary inline-flex shrink-0 items-center gap-1 font-bold hover:underline\">\n            <span>Read Release Notes</span>\n            <ArrowRight className=\"size-3\" />\n          </a>\n        </div>\n\n        {/* Dismiss Trigger Button */}\n        <button\n          type=\"button\"\n          className=\"hover:bg-muted text-muted-foreground hover:text-foreground flex size-6 shrink-0 items-center justify-center rounded-md transition-colors\"\n          aria-label=\"Dismiss banner\"\n          onClick={() => setIsVisible(false)}\n        >\n          <X className=\"size-3.5\" />\n        </button>\n      </div>\n    </aside>\n  )\n}\nexport default BannerAnnouncementSticky\n",
      "type": "registry:block",
      "target": "~/components/blocks/BannerAnnouncementSticky.tsx"
    }
  ],
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/react/badge.json"
  ],
  "description": "Sticky release announcement banner with version pill, call-to-action link, and dismiss trigger.",
  "categories": [
    "marketing"
  ],
  "deprecated": true,
  "replacedBy": "announcement"
}