{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "immunization-history",
  "title": "Immunization History",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/immunization-history/ImmunizationHistory.vue",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport {\n  AlertCircle,\n  Building2,\n  Calendar,\n  Check,\n  CheckCircle2,\n  Download,\n  ExternalLink,\n  FileCheck,\n  Globe,\n  Lock,\n  Plane,\n  QrCode,\n  ShieldCheck,\n  Syringe,\n} from 'lucide-vue-next'\nimport { cn } from '@/lib/utils'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\n\nconst props = defineProps<{\n  class?: HTMLAttributes['class']\n}>()\n\ninterface VaccineRecord {\n  id: string\n  vaccineName: string\n  formulation: string\n  cvxCode: string\n  ndcCode?: string\n  doseSequence: string\n  doseBadgeVariant: 'default' | 'secondary' | 'outline'\n  administeredDate: string\n  manufacturer: string\n  lotNumber: string\n  facility: string\n  provider: string\n  nextDueDate: string\n  statusType: 'valid' | 'permanent' | 'booster-due'\n  statusLabel: string\n}\n\ninterface ProtectionSummary {\n  disease: string\n  status: string\n  doseLabel: string\n  lastAdministered: string\n  badgeVariant: 'success' | 'secondary' | 'outline'\n  badgeText: string\n}\n\nconst patientProfile = {\n  name: 'Elena Rostova',\n  dob: '1994-06-12',\n  age: 32,\n  gender: 'Female',\n  mrn: 'IMM-9406-821',\n  jurisdiction: 'State of California (CAIR2 Registry)',\n  complianceStatus: 'Fully Immunized · Meets School & Travel Mandates',\n  shcIssuer: 'California Department of Public Health (CDPH)',\n  shcKeyId: 'CDPH-SMART-2025-V3',\n  shcSignature: 'ECDSA P-256 (SHA-256)',\n  jwsFragment: 'shc:/5676290952432060346029243740436037704054664037593670346029243740436037704054664037593670',\n}\n\nconst protectionSummaries: ProtectionSummary[] = [\n  {\n    disease: 'COVID-19',\n    status: 'Active Protection',\n    doseLabel: 'Updated Booster (2025/2026)',\n    lastAdministered: 'Oct 12, 2025',\n    badgeVariant: 'success',\n    badgeText: 'Verified Active',\n  },\n  {\n    disease: 'Influenza',\n    status: 'Seasonal Protection',\n    doseLabel: 'Quadrivalent (2025/2026)',\n    lastAdministered: 'Sep 28, 2025',\n    badgeVariant: 'success',\n    badgeText: 'Valid thru Sep 2026',\n  },\n  {\n    disease: 'Tdap',\n    status: 'Active (10-Yr Cycle)',\n    doseLabel: 'Tetanus, Diphtheria, Pertussis',\n    lastAdministered: 'Jun 14, 2022',\n    badgeVariant: 'secondary',\n    badgeText: 'Valid thru 2032',\n  },\n  {\n    disease: 'MMR',\n    status: 'Immune Protection',\n    doseLabel: 'Complete 2-Dose Series',\n    lastAdministered: 'Aug 22, 2010',\n    badgeVariant: 'success',\n    badgeText: 'Lifelong Immunity',\n  },\n]\n\nconst vaccineRecords: VaccineRecord[] = [\n  {\n    id: 'rec-1',\n    vaccineName: 'COVID-19 mRNA (Pfizer-BioNTech Bivalent)',\n    formulation: 'Spikevike mRNA bivalent lineage booster',\n    cvxCode: 'CVX 229',\n    ndcCode: 'NDC 59267-1000-02',\n    doseSequence: 'Dose 3 of 3',\n    doseBadgeVariant: 'outline',\n    administeredDate: 'Oct 12, 2025',\n    manufacturer: 'Pfizer-BioNTech',\n    lotNumber: '#EW0182',\n    facility: 'UCLA Health Urgent Care',\n    provider: 'Nurse J. Adams, RN',\n    nextDueDate: 'October 2026',\n    statusType: 'valid',\n    statusLabel: 'Annual Booster Due 2026',\n  },\n  {\n    id: 'rec-2',\n    vaccineName: 'Influenza Quadrivalent',\n    formulation: 'Inactivated influenza split virion',\n    cvxCode: 'CVX 158',\n    ndcCode: 'NDC 49281-0422-50',\n    doseSequence: 'Annual Booster',\n    doseBadgeVariant: 'outline',\n    administeredDate: 'Sep 28, 2025',\n    manufacturer: 'Sanofi Pasteur',\n    lotNumber: '#FL8842',\n    facility: 'CVS MinuteClinic #4921',\n    provider: 'Pharmacist R. Patel, PharmD',\n    nextDueDate: 'September 2026',\n    statusType: 'valid',\n    statusLabel: 'Valid 2025/2026 Season',\n  },\n  {\n    id: 'rec-3',\n    vaccineName: 'Tdap (Tetanus, Diphtheria, Pertussis)',\n    formulation: 'Adsorbed acellular toxoid formulation',\n    cvxCode: 'CVX 115',\n    ndcCode: 'NDC 58160-0842-11',\n    doseSequence: 'Booster (10-Yr)',\n    doseBadgeVariant: 'outline',\n    administeredDate: 'Jun 14, 2022',\n    manufacturer: 'GlaxoSmithKline',\n    lotNumber: '#TD9021',\n    facility: 'Cedars-Sinai Primary Care',\n    provider: 'Dr. S. Miller, MD',\n    nextDueDate: 'June 2032',\n    statusType: 'valid',\n    statusLabel: 'Valid thru 2032',\n  },\n  {\n    id: 'rec-4',\n    vaccineName: 'Hepatitis B (Recombinant)',\n    formulation: 'Recombinant HBsAg protein subunit',\n    cvxCode: 'CVX 43',\n    ndcCode: 'NDC 00006-4995-00',\n    doseSequence: 'Dose 3 of 3',\n    doseBadgeVariant: 'outline',\n    administeredDate: 'Jan 18, 2018',\n    manufacturer: 'Merck & Co.',\n    lotNumber: '#HB4419',\n    facility: 'Kaiser Permanente Sunset',\n    provider: 'Nurse K. Chen, RN',\n    nextDueDate: 'Lifelong Immunity',\n    statusType: 'permanent',\n    statusLabel: 'Lifelong Immunity',\n  },\n  {\n    id: 'rec-5',\n    vaccineName: 'MMR (Measles, Mumps, Rubella)',\n    formulation: 'Live attenuated viral vaccine',\n    cvxCode: 'CVX 03',\n    ndcCode: 'NDC 00006-4681-00',\n    doseSequence: 'Dose 2 of 2',\n    doseBadgeVariant: 'outline',\n    administeredDate: 'Aug 22, 2010',\n    manufacturer: 'Merck & Co.',\n    lotNumber: '#MR1083',\n    facility: \"Stanford Children's Health\",\n    provider: 'Dr. L. Gomez, MD',\n    nextDueDate: 'Lifelong Immunity',\n    statusType: 'permanent',\n    statusLabel: 'Lifelong Immunity',\n  },\n]\n</script>\n\n<template>\n  <div data-slot=\"immunization-history\" :class=\"cn('w-full space-y-6', props.class)\">\n    <!-- Header Section -->\n    <header class=\"bg-card border-border rounded-xl border p-5 shadow-xs sm:p-6\">\n      <div class=\"flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between\">\n        <div class=\"space-y-1.5\">\n          <div class=\"flex flex-wrap items-center gap-2.5\">\n            <h1 class=\"text-foreground text-xl font-bold tracking-tight sm:text-2xl\">\n              Immunization Record & Vaccine Passport\n            </h1>\n            <Badge wrap variant=\"success\" class=\"gap-1.5 px-2.5 py-1 text-xs font-semibold\">\n              <span class=\"bg-success size-1.5 rounded-full\" aria-hidden=\"true\" />\n              {{ patientProfile.complianceStatus }}\n            </Badge>\n          </div>\n\n          <div class=\"text-muted-foreground flex flex-wrap items-center gap-x-3 gap-y-1 text-xs sm:text-sm\">\n            <span class=\"text-foreground font-semibold\">{{ patientProfile.name }}</span>\n            <span>\n              DOB: <strong class=\"text-foreground font-medium tabular-nums\">{{ patientProfile.dob }}</strong> ({{\n                patientProfile.age\n              }}\n              yrs · {{ patientProfile.gender }})\n            </span>\n            <span class=\"font-mono text-xs\">MRN: {{ patientProfile.mrn }}</span>\n            <span class=\"text-muted-foreground text-xs\">{{ patientProfile.jurisdiction }}</span>\n          </div>\n        </div>\n\n        <!-- Action Buttons -->\n        <div class=\"flex flex-wrap items-center gap-2.5\">\n          <Button variant=\"outline\" size=\"sm\" class=\"gap-1.5 text-xs font-medium\">\n            <QrCode class=\"size-3.5 shrink-0\" aria-hidden=\"true\" />\n            Share QR Pass\n          </Button>\n          <Button aria-label=\"Download attachment\" size=\"sm\" class=\"gap-1.5 text-xs font-medium\">\n            <Download class=\"size-3.5 shrink-0\" aria-hidden=\"true\" />\n            Download Official Record PDF\n          </Button>\n        </div>\n      </div>\n    </header>\n\n    <!-- Digital Health Pass Card: Verifiable SMART® Health Card -->\n    <Card class=\"border-border/90 relative overflow-hidden shadow-xs\">\n      <!-- Security Watermark Background Motif -->\n      <div\n        class=\"pointer-events-none absolute -top-10 -right-10 size-72 opacity-[0.03] select-none dark:opacity-[0.05]\"\n        aria-hidden=\"true\"\n      >\n        <ShieldCheck class=\"text-foreground size-full\" />\n      </div>\n\n      <CardHeader class=\"border-border/60 bg-muted/20 border-b pb-4\">\n        <div class=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n          <div class=\"flex items-center gap-3\">\n            <div\n              class=\"border-success/30 bg-success/10 text-success text-success flex size-9 shrink-0 items-center justify-center rounded-lg border shadow-2xs\"\n            >\n              <ShieldCheck class=\"size-5\" aria-hidden=\"true\" />\n            </div>\n            <div>\n              <div class=\"flex min-w-0 items-center gap-2\">\n                <CardTitle class=\"text-base font-semibold\">SMART® Health Card Verified</CardTitle>\n                <Badge wrap variant=\"outline\" class=\"font-mono text-xs\">W3C Credential</Badge>\n              </div>\n              <CardDescription class=\"text-xs\">\n                Issuer: {{ patientProfile.shcIssuer }} · Signed via {{ patientProfile.shcKeyId }}\n              </CardDescription>\n            </div>\n          </div>\n\n          <div class=\"flex min-w-0 flex-wrap items-center gap-2\">\n            <Badge wrap variant=\"outline\" class=\"gap-1 px-2 py-0.5 font-mono text-xs\">\n              <Lock class=\"text-success size-3\" aria-hidden=\"true\" />\n              <span>{{ patientProfile.shcSignature }}</span>\n            </Badge>\n            <Badge wrap variant=\"success\" class=\"gap-1 text-xs\">\n              <Check class=\"size-3\" aria-hidden=\"true\" />\n              Cryptographically Signed\n            </Badge>\n          </div>\n        </div>\n      </CardHeader>\n\n      <CardContent class=\"p-5 sm:p-6\">\n        <div class=\"grid grid-cols-1 gap-6 lg:grid-cols-12 lg:items-center\">\n          <!-- QR Code & Digital Signature Verification Container -->\n          <div class=\"bg-muted/40 border-border/70 min-w-0 rounded-xl border p-4 sm:p-5 lg:col-span-5\">\n            <div class=\"flex flex-col items-center gap-4 sm:flex-row\">\n              <!-- Crisp SVG QR Code Placeholder -->\n              <div\n                class=\"bg-background ring-border/80 relative flex size-36 shrink-0 items-center justify-center rounded-lg p-2.5 shadow-2xs ring-1\"\n              >\n                <svg\n                  viewBox=\"0 0 120 120\"\n                  class=\"text-foreground size-full\"\n                  fill=\"currentColor\"\n                  shape-rendering=\"crispEdges\"\n                  aria-label=\"SMART Health Card Digital QR Pass\"\n                  role=\"img\"\n                >\n                  <!-- Finder Pattern: Top-Left -->\n                  <rect x=\"6\" y=\"6\" width=\"30\" height=\"30\" rx=\"3\" />\n                  <rect x=\"11\" y=\"11\" width=\"20\" height=\"20\" rx=\"2\" class=\"fill-background\" />\n                  <rect x=\"15\" y=\"15\" width=\"12\" height=\"12\" rx=\"1.5\" />\n\n                  <!-- Finder Pattern: Top-Right -->\n                  <rect x=\"84\" y=\"6\" width=\"30\" height=\"30\" rx=\"3\" />\n                  <rect x=\"89\" y=\"11\" width=\"20\" height=\"20\" rx=\"2\" class=\"fill-background\" />\n                  <rect x=\"93\" y=\"15\" width=\"12\" height=\"12\" rx=\"1.5\" />\n\n                  <!-- Finder Pattern: Bottom-Left -->\n                  <rect x=\"6\" y=\"84\" width=\"30\" height=\"30\" rx=\"3\" />\n                  <rect x=\"11\" y=\"89\" width=\"20\" height=\"20\" rx=\"2\" class=\"fill-background\" />\n                  <rect x=\"15\" y=\"93\" width=\"12\" height=\"12\" rx=\"1.5\" />\n\n                  <!-- Timing Patterns -->\n                  <rect x=\"42\" y=\"18\" width=\"5\" height=\"5\" />\n                  <rect x=\"52\" y=\"18\" width=\"5\" height=\"5\" />\n                  <rect x=\"62\" y=\"18\" width=\"5\" height=\"5\" />\n                  <rect x=\"72\" y=\"18\" width=\"5\" height=\"5\" />\n                  <rect x=\"18\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"18\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"18\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"18\" y=\"72\" width=\"5\" height=\"5\" />\n\n                  <!-- Alignment Pattern: Bottom-Right -->\n                  <rect x=\"86\" y=\"86\" width=\"20\" height=\"20\" rx=\"2\" />\n                  <rect x=\"90\" y=\"90\" width=\"12\" height=\"12\" rx=\"1\" class=\"fill-background\" />\n                  <rect x=\"93\" y=\"93\" width=\"6\" height=\"6\" />\n\n                  <!-- Data Modules Matrix Grid -->\n                  <rect x=\"42\" y=\"32\" width=\"5\" height=\"5\" />\n                  <rect x=\"50\" y=\"32\" width=\"5\" height=\"5\" />\n                  <rect x=\"68\" y=\"32\" width=\"5\" height=\"5\" />\n                  <rect x=\"76\" y=\"32\" width=\"5\" height=\"5\" />\n                  <rect x=\"42\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"58\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"68\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"92\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"100\" y=\"42\" width=\"5\" height=\"5\" />\n                  <rect x=\"32\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"48\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"58\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"78\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"88\" y=\"52\" width=\"5\" height=\"5\" />\n                  <rect x=\"32\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"42\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"62\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"72\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"102\" y=\"62\" width=\"5\" height=\"5\" />\n                  <rect x=\"48\" y=\"72\" width=\"5\" height=\"5\" />\n                  <rect x=\"58\" y=\"72\" width=\"5\" height=\"5\" />\n                  <rect x=\"82\" y=\"72\" width=\"5\" height=\"5\" />\n                  <rect x=\"42\" y=\"82\" width=\"5\" height=\"5\" />\n                  <rect x=\"52\" y=\"82\" width=\"5\" height=\"5\" />\n                  <rect x=\"62\" y=\"82\" width=\"5\" height=\"5\" />\n                  <rect x=\"72\" y=\"82\" width=\"5\" height=\"5\" />\n                  <rect x=\"52\" y=\"92\" width=\"5\" height=\"5\" />\n                  <rect x=\"68\" y=\"92\" width=\"5\" height=\"5\" />\n                  <rect x=\"42\" y=\"102\" width=\"5\" height=\"5\" />\n                  <rect x=\"60\" y=\"102\" width=\"5\" height=\"5\" />\n                  <rect x=\"74\" y=\"102\" width=\"5\" height=\"5\" />\n                </svg>\n              </div>\n\n              <!-- Pass Metadata -->\n              <div class=\"w-full min-w-0 space-y-2 text-center sm:text-left\">\n                <div>\n                  <h2 class=\"text-foreground text-sm font-semibold\">Offline Verifiable Pass</h2>\n                  <p class=\"text-muted-foreground text-xs\">\n                    Compatible with Apple Health, Google Wallet, and international border checkpoint verifiers.\n                  </p>\n                </div>\n                <div class=\"border-border/60 bg-background/80 rounded border p-2\">\n                  <span class=\"text-muted-foreground block text-xs font-medium\">JWS Payload Digest</span>\n                  <code class=\"text-muted-foreground block truncate font-mono text-xs\">\n                    {{ patientProfile.jwsFragment }}\n                  </code>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-center gap-1 text-xs sm:justify-start\">\n                  <CheckCircle2 class=\"text-success size-3.5\" aria-hidden=\"true\" />\n                  <span>Public Key Confirmed Active</span>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <!-- Vaccine Summary Protection Chips -->\n          <div class=\"space-y-3 lg:col-span-7\">\n            <div class=\"flex items-center justify-between\">\n              <h2 class=\"text-foreground text-sm font-semibold\">Active Health Protections & Key Immunizations</h2>\n              <span class=\"text-muted-foreground text-xs font-medium\">4 Core Mandates Met</span>\n            </div>\n\n            <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n              <div\n                v-for=\"chip in protectionSummaries\"\n                :key=\"chip.disease\"\n                class=\"bg-card border-border/80 hover:border-border flex flex-col justify-between rounded-lg border p-3.5 shadow-2xs transition-colors\"\n              >\n                <div class=\"flex items-start justify-between gap-2\">\n                  <div class=\"flex min-w-0 items-center gap-2\">\n                    <div\n                      class=\"border-success/20 bg-success/10 text-success flex size-7 shrink-0 items-center justify-center rounded-md border\"\n                    >\n                      <Syringe class=\"size-3.5\" aria-hidden=\"true\" />\n                    </div>\n                    <div>\n                      <span class=\"text-foreground text-sm font-semibold\">{{ chip.disease }}</span>\n                      <p class=\"text-muted-foreground truncate text-xs\">{{ chip.doseLabel }}</p>\n                    </div>\n                  </div>\n                  <Badge wrap :variant=\"chip.badgeVariant\" class=\"text-xs font-medium\">\n                    {{ chip.badgeText }}\n                  </Badge>\n                </div>\n\n                <div\n                  class=\"border-border/60 text-muted-foreground mt-3 flex items-center justify-between border-t pt-2 text-xs\"\n                >\n                  <span\n                    >Last:\n                    <strong class=\"text-foreground font-medium tabular-nums\">{{ chip.lastAdministered }}</strong></span\n                  >\n                  <span class=\"text-success font-medium\">{{ chip.status }}</span>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </CardContent>\n    </Card>\n\n    <!-- Immunization Records Table -->\n    <Card class=\"shadow-xs\">\n      <CardHeader>\n        <div class=\"flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between\">\n          <div>\n            <CardTitle class=\"text-base font-semibold\">Administered Immunization History</CardTitle>\n            <CardDescription class=\"text-xs sm:text-sm\">\n              Complete chronological registry of vaccine administrations, CDC CVX codes, lot verification, and clinical\n              facilities.\n            </CardDescription>\n          </div>\n          <div class=\"flex min-w-0 items-center gap-2\">\n            <Badge wrap variant=\"outline\" class=\"gap-1 text-xs tabular-nums\">\n              <FileCheck class=\"text-primary size-3.5\" aria-hidden=\"true\" />\n              <span>5 Records Verified</span>\n            </Badge>\n          </div>\n        </div>\n      </CardHeader>\n\n      <CardContent class=\"p-0\">\n        <div class=\"overflow-x-auto\">\n          <Table>\n            <TableHeader>\n              <TableRow>\n                <TableHead class=\"w-[28%] min-w-[220px]\">Vaccine & CVX Code</TableHead>\n                <TableHead class=\"min-w-[130px]\">Dose Sequence</TableHead>\n                <TableHead class=\"min-w-[120px]\">Administered Date</TableHead>\n                <TableHead class=\"min-w-[160px]\">Manufacturer & Lot #</TableHead>\n                <TableHead class=\"min-w-[220px]\">Administering Facility & Provider</TableHead>\n                <TableHead class=\"min-w-[140px] text-right\">Status / Next Due</TableHead>\n              </TableRow>\n            </TableHeader>\n            <TableBody>\n              <TableRow v-for=\"record in vaccineRecords\" :key=\"record.id\">\n                <TableCell>\n                  <div class=\"text-foreground text-sm font-semibold\">{{ record.vaccineName }}</div>\n                  <div class=\"text-muted-foreground flex flex-wrap items-center gap-1.5 text-xs\">\n                    <span class=\"font-mono\">{{ record.cvxCode }}</span>\n                    <span v-if=\"record.ndcCode\" class=\"text-muted-foreground/60\">·</span>\n                    <span v-if=\"record.ndcCode\" class=\"font-mono text-xs\">{{ record.ndcCode }}</span>\n                  </div>\n                </TableCell>\n                <TableCell>\n                  <Badge wrap :variant=\"record.doseBadgeVariant\" class=\"text-xs font-medium\">\n                    {{ record.doseSequence }}\n                  </Badge>\n                </TableCell>\n                <TableCell>\n                  <div class=\"flex items-center gap-1.5\">\n                    <Calendar class=\"text-muted-foreground size-3.5 shrink-0\" aria-hidden=\"true\" />\n                    <span class=\"text-foreground text-sm font-medium tabular-nums\">{{ record.administeredDate }}</span>\n                  </div>\n                </TableCell>\n                <TableCell>\n                  <div class=\"text-foreground text-sm font-medium\">{{ record.manufacturer }}</div>\n                  <div class=\"text-muted-foreground font-mono text-xs\">{{ record.lotNumber }}</div>\n                </TableCell>\n                <TableCell>\n                  <div class=\"text-foreground flex items-center gap-1.5 text-sm font-medium\">\n                    <Building2 class=\"text-muted-foreground size-3.5 shrink-0\" aria-hidden=\"true\" />\n                    <span>{{ record.facility }}</span>\n                  </div>\n                  <div class=\"text-muted-foreground text-xs\">{{ record.provider }}</div>\n                </TableCell>\n                <TableCell class=\"text-right\">\n                  <Badge\n                    :variant=\"record.statusType === 'permanent' ? 'success' : 'secondary'\"\n                    class=\"text-xs font-medium whitespace-normal\"\n                  >\n                    {{ record.nextDueDate }}\n                  </Badge>\n                </TableCell>\n              </TableRow>\n            </TableBody>\n          </Table>\n        </div>\n      </CardContent>\n    </Card>\n\n    <!-- Upcoming Due Vaccines & Travel Advisory Alert Card -->\n    <Card class=\"border-warning/30 bg-warning/[0.04] bg-warning/[0.07] shadow-xs\">\n      <CardContent class=\"p-5 sm:p-6\">\n        <div class=\"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between\">\n          <div class=\"flex items-start gap-3.5\">\n            <div\n              class=\"border-warning/30 bg-warning/10 text-warning text-warning flex size-9 shrink-0 items-center justify-center rounded-lg border shadow-2xs\"\n            >\n              <Globe class=\"size-5\" aria-hidden=\"true\" />\n            </div>\n            <div class=\"space-y-3\">\n              <div>\n                <div class=\"flex flex-wrap items-center gap-2\">\n                  <h2 class=\"text-foreground text-base font-semibold\">\n                    Upcoming Recommendations & Travel Health Advisory\n                  </h2>\n                  <Badge wrap variant=\"warning\" class=\"gap-1 text-xs font-medium\">\n                    <AlertCircle class=\"size-3\" aria-hidden=\"true\" />\n                    CDC Notice · Level 2\n                  </Badge>\n                </div>\n                <p class=\"text-muted-foreground mt-1 text-xs sm:text-sm\">\n                  Clinical recommendations based on patient age cohort, seasonal guidelines, and destination health\n                  advisories.\n                </p>\n              </div>\n\n              <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n                <!-- Travel Alert Item 1: Yellow Fever -->\n                <div class=\"bg-card/90 border-border/80 rounded-lg border p-3.5 shadow-2xs\">\n                  <div class=\"flex flex-wrap items-center justify-between gap-2\">\n                    <div class=\"flex items-center gap-1.5\">\n                      <Plane class=\"text-warning size-3.5\" aria-hidden=\"true\" />\n                      <span class=\"text-foreground text-xs font-semibold\">Yellow Fever Vaccine (Live 17D)</span>\n                    </div>\n                    <Badge wrap variant=\"outline\" class=\"border-warning/30 text-warning text-xs\">\n                      Travel Advisory\n                    </Badge>\n                  </div>\n                  <p class=\"text-muted-foreground mt-1.5 text-xs\">\n                    Recommended for upcoming travel to endemic regions in South America (Brazil, Peru, Colombia). Single\n                    dose provides lifelong immunity; administer ≥10 days prior to departure.\n                  </p>\n                  <div\n                    class=\"border-border/60 text-muted-foreground mt-2.5 flex items-center justify-between border-t pt-2 text-xs\"\n                  >\n                    <span>Priority: <strong class=\"text-foreground font-medium\">High for South America</strong></span>\n                    <span class=\"text-warning font-medium\">Pending Rx</span>\n                  </div>\n                </div>\n\n                <!-- Advisory Item 2: Meningococcal MenACWY -->\n                <div class=\"bg-card/90 border-border/80 rounded-lg border p-3.5 shadow-2xs\">\n                  <div class=\"flex flex-wrap items-center justify-between gap-2\">\n                    <div class=\"flex items-center gap-1.5\">\n                      <Syringe class=\"text-primary size-3.5\" aria-hidden=\"true\" />\n                      <span class=\"text-foreground text-xs font-semibold\">Meningococcal Conjugate (MenACWY)</span>\n                    </div>\n                    <Badge wrap variant=\"outline\" class=\"text-xs\">Routine Booster</Badge>\n                  </div>\n                  <p class=\"text-muted-foreground mt-1.5 text-xs\">\n                    Recommended 5-year booster for international academic programs, dormitory residency, and congregate\n                    international travel settings.\n                  </p>\n                  <div\n                    class=\"border-border/60 text-muted-foreground mt-2.5 flex items-center justify-between border-t pt-2 text-xs\"\n                  >\n                    <span\n                      >Next Window:\n                      <strong class=\"text-foreground font-medium tabular-nums\">Jan – Mar 2027</strong></span\n                    >\n                    <span class=\"text-muted-foreground font-medium\">Due in 11 mos</span>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <!-- Advisory Action Buttons -->\n          <div class=\"flex shrink-0 flex-wrap items-center gap-2 lg:flex-col lg:items-end\">\n            <Button size=\"sm\" class=\"gap-1.5 text-xs font-medium\">\n              <Calendar class=\"size-3.5\" aria-hidden=\"true\" />\n              Schedule Travel Clinic Visit\n            </Button>\n            <Button variant=\"outline\" size=\"sm\" class=\"gap-1.5 text-xs font-medium\">\n              <ExternalLink class=\"size-3.5\" aria-hidden=\"true\" />\n              View CDC Destination Guidelines\n            </Button>\n          </div>\n        </div>\n      </CardContent>\n    </Card>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/ImmunizationHistory.vue"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/badge.json",
    "https://uipkge.dev/r/vue/button.json",
    "https://uipkge.dev/r/vue/card.json",
    "https://uipkge.dev/r/vue/table.json"
  ],
  "description": "Digital vaccine record passport and clinical immunization history: SMART Health Card verifiable credential with cryptographic signature, active protection summary chips, detailed CDC/WHO vaccine administration table with CVX codes and lot tracking, and travel health advisory alerts.",
  "categories": [
    "healthcare",
    "app"
  ]
}