{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "security-certification-band",
  "title": "Security — Certification Band",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-react/blocks/security-certification-band/SecurityCertificationBand.tsx",
      "content": "'use client'\n\nimport { useState } from 'react'\nimport { ShieldCheck } from 'lucide-react'\nimport { Button } from '@/components/ui/button'\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'\nimport { Separator } from '@/components/ui/separator'\n\n// Issuing body and audit date are what make a certification claim checkable;\n// a bare logo row is decoration.\nconst certifications = [\n  { name: 'SOC 2 Type II', body: 'Prescient Assurance', audited: 'Mar 2026' },\n  { name: 'ISO 27001', body: 'BSI Group', audited: 'Jan 2026' },\n  { name: 'GDPR', body: 'Self-attested · DPA available', audited: 'Ongoing' },\n  { name: 'HIPAA', body: 'Third-party assessed', audited: 'Nov 2025' },\n]\n\nexport function SecurityCertificationBand() {\n  const [region, setRegion] = useState('eu')\n\n  return (\n    <section data-slot=\"security-certification-band\" className=\"border-border bg-muted/40 border-y\">\n      <div className=\"mx-auto max-w-6xl px-6 py-8\">\n        <div className=\"flex flex-wrap items-center gap-x-6 gap-y-4\">\n          <div className=\"flex items-center gap-2\">\n            <ShieldCheck className=\"text-muted-foreground size-4\" aria-hidden=\"true\" />\n            <span className=\"text-sm font-medium\">Audited, not asserted</span>\n          </div>\n\n          <Separator orientation=\"vertical\" className=\"hidden h-8 sm:block\" />\n\n          <dl className=\"flex min-w-0 flex-1 flex-wrap gap-x-8 gap-y-3\">\n            {certifications.map((certification) => (\n              <div key={certification.name}>\n                <dt className=\"text-sm font-semibold\">{certification.name}</dt>\n                <dd className=\"text-muted-foreground text-xs\">\n                  {certification.body} · {certification.audited}\n                </dd>\n              </div>\n            ))}\n          </dl>\n\n          <div className=\"flex items-center gap-2\">\n            <Select value={region} onValueChange={setRegion}>\n              <SelectTrigger className=\"h-8 w-44 text-xs\" aria-label=\"Data residency\">\n                <SelectValue />\n              </SelectTrigger>\n              <SelectContent>\n                <SelectItem value=\"eu\">EU residency</SelectItem>\n                <SelectItem value=\"us\">US residency</SelectItem>\n                <SelectItem value=\"au\">AU residency</SelectItem>\n              </SelectContent>\n            </Select>\n            <Button variant=\"outline\" size=\"sm\">\n              Trust centre\n            </Button>\n          </div>\n        </div>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:block",
      "target": "~/components/blocks/SecurityCertificationBand.tsx"
    }
  ],
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/react/button.json",
    "https://uipkge.dev/r/react/select.json",
    "https://uipkge.dev/r/react/separator.json"
  ],
  "description": "Slim compliance band listing each certification with its issuing body and last audit date, plus a data residency selector, for placing above a pricing table.",
  "categories": [
    "marketing"
  ]
}