{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "telehealth-video-room",
  "title": "Telehealth Video Room",
  "type": "registry:page",
  "files": [
    {
      "path": "packages/registry-vue/blocks/telehealth-video-room/TelehealthVideoRoom.vue",
      "content": "<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref } from 'vue'\nimport {\n  AlertCircle,\n  CheckCircle2,\n  Clock,\n  Download,\n  FileCheck,\n  FileText,\n  Heart,\n  HeartPulse,\n  Lock,\n  Mic,\n  MicOff,\n  PanelRightClose,\n  PanelRightOpen,\n  Paperclip,\n  PhoneOff,\n  Pill,\n  RefreshCw,\n  Send,\n  Share2,\n  ShieldCheck,\n  Thermometer,\n  Video,\n  VideoOff,\n  Wifi,\n  X,\n  MessageSquare,\n  Settings,\n} from 'lucide-vue-next'\nimport { Avatar, AvatarFallback } from '@/components/ui/avatar'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Input } from '@/components/ui/input'\nimport { Separator } from '@/components/ui/separator'\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'\nimport { Textarea } from '@/components/ui/textarea'\n\n// Interactive State\nconst isMuted = ref(false)\nconst isCameraOff = ref(false)\nconst isScreenSharing = ref(false)\nconst isSidebarOpen = ref(true)\nconst activeTab = ref<'notes' | 'chat' | 'vitals'>('notes')\nconst isCallEnded = ref(false)\nconst showSettingsModal = ref(false)\nconst callDurationSeconds = ref(868) // 14:28\nconst unreadChatCount = ref(0)\nconst lastVitalsUpdate = ref('Just now')\nconst isRefreshingVitals = ref(false)\n\n// Timer logic\nlet timerInterval: ReturnType<typeof setInterval> | null = null\n\nonMounted(() => {\n  timerInterval = setInterval(() => {\n    if (!isCallEnded.value) {\n      callDurationSeconds.value += 1\n    }\n  }, 1000)\n})\n\nonUnmounted(() => {\n  if (timerInterval) clearInterval(timerInterval)\n})\n\nconst formattedDuration = computed(() => {\n  const mins = Math.floor(callDurationSeconds.value / 60)\n  const secs = callDurationSeconds.value % 60\n  return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`\n})\n\n// SOAP Notes State\nconst chiefComplaint = ref(\n  'Recurrent palpitations, sudden resting tachycardia (120-140 bpm), and lightheadedness over the past 2 weeks following morning coffee.',\n)\nconst soapSubjective = ref(\n  'Patient reports 4 distinct episodes in past 14 days. Episodes last ~5-10 minutes with abrupt onset and offset. No syncope, mild lightheadedness. Denies chest pressure or radiating pain. Reports high work stress and 3-4 espresso shots daily.',\n)\nconst soapObjective = ref(\n  'In-call vitals: HR 74 bpm regular sinus, BP 128/82 mmHg, SpO2 98%. Telemetry strip transmitted via Smart Hub shows NSR with infrequent PACs. No ST elevation or ischemic changes.',\n)\nconst soapAssessment = ref(\n  '1. Paroxysmal Supraventricular Tachycardia (PSVT) vs. Benign Premature Atrial Contractions (PACs) secondary to high caffeine consumption and sympathetic stress.\\n2. Stage 1 Essential Hypertension - well controlled on current regimen.',\n)\nconst soapPlan = ref(\n  '1. Ordered 14-day continuous Holter monitor patch.\\n2. Titrate Metoprolol Succinate ER to 25mg PO daily.\\n3. Restrict caffeine to ≤1 cup/day; hydration goal 2.5L daily.\\n4. Follow-up video consultation in 3 weeks or ASAP if syncope occurs.',\n)\n\n// Prescription Generator State\ninterface PrescriptionItem {\n  id: string\n  drugName: string\n  dosage: string\n  sig: string\n  quantity: string\n  refills: number\n  pharmacy: string\n  timestamp: string\n  status: 'transmitted' | 'pending'\n  rxNumber: string\n}\n\nconst selectedDrugPreset = ref('metoprolol')\nconst customDosage = ref('25mg PO Daily in Morning')\nconst customQuantity = ref('30 tablets')\nconst customRefills = ref('2')\nconst rxSuccessMessage = ref('')\n\nconst drugOptions = [\n  {\n    id: 'metoprolol',\n    name: 'Metoprolol Succinate ER',\n    defaultDosage: '25mg PO Daily (Morning)',\n    defaultQty: '30 tablets',\n    refills: '2',\n  },\n  {\n    id: 'propranolol',\n    name: 'Propranolol HCl',\n    defaultDosage: '10mg PO BID (Twice Daily)',\n    defaultQty: '60 tablets',\n    refills: '1',\n  },\n  {\n    id: 'diltiazem',\n    name: 'Diltiazem HCl Extended Release',\n    defaultDosage: '120mg PO Daily',\n    defaultQty: '30 capsules',\n    refills: '3',\n  },\n  { id: 'lisinopril', name: 'Lisinopril', defaultDosage: '10mg PO Daily', defaultQty: '30 tablets', refills: '3' },\n]\n\nconst prescriptions = ref<PrescriptionItem[]>([\n  {\n    id: 'rx-1',\n    drugName: 'Metoprolol Succinate ER 25mg',\n    dosage: 'Take 1 tablet by mouth daily in the morning',\n    sig: '1 tab PO QAM',\n    quantity: '30 tablets',\n    refills: 2,\n    pharmacy: 'CVS Pharmacy #4021 (Austin, TX)',\n    timestamp: '10:24 AM',\n    status: 'transmitted',\n    rxNumber: 'RX-994182',\n  },\n])\n\nfunction handleSelectDrugPreset(drugId: string) {\n  selectedDrugPreset.value = drugId\n  const found = drugOptions.find((d) => d.id === drugId)\n  if (found) {\n    customDosage.value = found.defaultDosage\n    customQuantity.value = found.defaultQty\n    customRefills.value = found.refills\n  }\n}\n\nfunction handleGeneratePrescription() {\n  const current = drugOptions.find((d) => d.id === selectedDrugPreset.value)\n  const drugName = current ? current.name : 'Custom Medication'\n  const newRx: PrescriptionItem = {\n    id: `rx-${Date.now()}`,\n    drugName: `${drugName} (${customDosage.value})`,\n    dosage: customDosage.value,\n    sig: `Take as directed: ${customDosage.value}`,\n    quantity: customQuantity.value,\n    refills: parseInt(customRefills.value) || 1,\n    pharmacy: 'CVS Pharmacy #4021 (Austin, TX)',\n    timestamp: 'Just now',\n    status: 'transmitted',\n    rxNumber: `RX-${Math.floor(100000 + Math.random() * 900000)}`,\n  }\n  prescriptions.value.unshift(newRx)\n  rxSuccessMessage.value = `e-Rx signed & securely transmitted to CVS Pharmacy #4021 (${newRx.rxNumber})`\n  setTimeout(() => {\n    rxSuccessMessage.value = ''\n  }, 4500)\n}\n\n// Chat Thread State\ninterface ChatMessage {\n  id: string\n  sender: 'doctor' | 'patient'\n  senderName: string\n  text: string\n  timestamp: string\n  attachment?: {\n    name: string\n    size: string\n    type: 'pdf' | 'image'\n  }\n}\n\nconst chatInput = ref('')\nconst chatMessages = ref<ChatMessage[]>([\n  {\n    id: 'msg-1',\n    sender: 'doctor',\n    senderName: 'Dr. Sarah Jenkins, MD',\n    text: 'Hello David! I have your chart open and we are receiving your continuous telemetry stream. How are you feeling right now?',\n    timestamp: '10:15 AM',\n  },\n  {\n    id: 'msg-2',\n    sender: 'patient',\n    senderName: 'David Chen (You)',\n    text: 'Good morning Dr. Jenkins. Feeling better than yesterday, but had another fluttering sensation around 8 AM after my second cup of coffee.',\n    timestamp: '10:17 AM',\n  },\n  {\n    id: 'msg-3',\n    sender: 'patient',\n    senderName: 'David Chen (You)',\n    text: 'I captured the rhythm episode on my smart watch and exported the 30-second single lead PDF strip here.',\n    timestamp: '10:18 AM',\n    attachment: {\n      name: 'Apple_Watch_ECG_Lead_I_2026.pdf',\n      size: '1.4 MB · PDF ECG Report',\n      type: 'pdf',\n    },\n  },\n  {\n    id: 'msg-4',\n    sender: 'doctor',\n    senderName: 'Dr. Sarah Jenkins, MD',\n    text: 'Thank you, David! Reviewing the strip now. The baseline is normal sinus rhythm with occasional isolated PACs. This matches our telemetry.',\n    timestamp: '10:20 AM',\n  },\n])\n\nfunction handleSendMessage() {\n  const text = chatInput.value.trim()\n  if (!text) return\n  chatMessages.value.push({\n    id: `msg-${Date.now()}`,\n    sender: 'patient',\n    senderName: 'David Chen (You)',\n    text,\n    timestamp: 'Just now',\n  })\n  chatInput.value = ''\n\n  // Simulated provider automated acknowledgment if consultation active\n  setTimeout(() => {\n    if (!isCallEnded.value) {\n      chatMessages.value.push({\n        id: `msg-doc-${Date.now()}`,\n        sender: 'doctor',\n        senderName: 'Dr. Sarah Jenkins, MD',\n        text: 'Noted! I have added this observation into your encounter notes and prescription schedule.',\n        timestamp: 'Just now',\n      })\n    }\n  }, 1200)\n}\n\nfunction handleOpenTab(tab: 'notes' | 'chat' | 'vitals') {\n  activeTab.value = tab\n  isSidebarOpen.value = true\n}\n\nfunction handleEndCall() {\n  isCallEnded.value = true\n}\n\nfunction handleRestartCall() {\n  isCallEnded.value = false\n  callDurationSeconds.value = 0\n}\n\nfunction handleRefreshVitals() {\n  isRefreshingVitals.value = true\n  setTimeout(() => {\n    isRefreshingVitals.value = false\n    lastVitalsUpdate.value = 'Just now'\n  }, 800)\n}\n</script>\n\n<template>\n  <div data-slot=\"telehealth-video-room\" class=\"bg-background text-foreground w-full space-y-4\">\n    <!-- Top Room Bar -->\n    <header class=\"bg-card rounded-xl border p-4 shadow-xs sm:px-6 sm:py-3.5\">\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <!-- Call Metadata & HIPAA Badge -->\n        <div class=\"flex flex-wrap items-center gap-3\">\n          <div class=\"flex items-center gap-2\">\n            <span class=\"relative flex size-3\">\n              <span v-if=\"!isCallEnded\" class=\"bg-success absolute inline-flex h-full w-full rounded-full opacity-75\" />\n              <span :class=\"['relative inline-flex size-3 rounded-full', isCallEnded ? 'bg-zinc-400' : 'bg-success']\" />\n            </span>\n            <div class=\"flex items-center gap-1.5 font-mono text-sm font-semibold tracking-tight\">\n              <Clock class=\"text-muted-foreground size-3.5\" />\n              <span>{{ isCallEnded ? 'Call Ended' : formattedDuration }}</span>\n            </div>\n          </div>\n\n          <Separator orientation=\"vertical\" class=\"hidden h-5 sm:block\" />\n\n          <!-- HIPAA Encrypted Connection Badge -->\n          <Badge variant=\"outline\" class=\"border-success/30 bg-success/10 text-success gap-1.5 text-xs font-medium\">\n            <Lock class=\"text-success size-3\" />\n            <span>HIPAA Encrypted · AES-256</span>\n          </Badge>\n\n          <Separator orientation=\"vertical\" class=\"hidden h-5 md:block\" />\n\n          <!-- Doctor & Patient Context Strip -->\n          <div class=\"hidden items-center gap-2 lg:flex\">\n            <div class=\"flex items-center gap-1.5 text-xs\">\n              <span class=\"text-muted-foreground\">Provider:</span>\n              <span class=\"text-foreground font-semibold\">Dr. Sarah Jenkins, MD</span>\n              <span class=\"text-muted-foreground\">(Cardiology)</span>\n            </div>\n            <div class=\"flex items-center gap-1.5 text-xs\">\n              <span class=\"text-muted-foreground\">Patient:</span>\n              <span class=\"text-foreground font-semibold\">David Chen</span>\n              <span class=\"text-muted-foreground font-mono text-xs\">(MRN-88412)</span>\n            </div>\n          </div>\n        </div>\n\n        <!-- Header Actions: End Call & Network Status -->\n        <div class=\"flex items-center gap-2.5\">\n          <div class=\"text-muted-foreground hidden items-center gap-1.5 text-xs sm:flex\">\n            <Wifi class=\"text-success size-3.5\" />\n            <span>HD Connection (18ms)</span>\n          </div>\n\n          <Button\n            v-if=\"!isCallEnded\"\n            variant=\"destructive\"\n            size=\"sm\"\n            class=\"h-8 gap-1.5 px-3 text-xs font-semibold shadow-xs\"\n            @click=\"handleEndCall\"\n          >\n            <PhoneOff class=\"size-3.5\" />\n            <span>End Consultation</span>\n          </Button>\n\n          <Button\n            v-else\n            variant=\"default\"\n            size=\"sm\"\n            class=\"h-8 gap-1.5 px-3 text-xs font-semibold\"\n            @click=\"handleRestartCall\"\n          >\n            <RefreshCw class=\"size-3.5\" />\n            <span>Reconnect Call</span>\n          </Button>\n        </div>\n      </div>\n    </header>\n\n    <!-- Main Video Room Grid (Video Canvas + Collapsible Workspace) -->\n    <div class=\"grid grid-cols-1 gap-4 lg:grid-cols-12\">\n      <!-- Video Call Canvas (Center 8 cols when open, full 12 cols when collapsed) -->\n      <section\n        :class=\"[\n          'relative flex flex-col justify-between overflow-hidden rounded-xl border border-zinc-800 bg-zinc-950 p-4 text-white shadow-lg transition-colors duration-200',\n          isSidebarOpen ? 'min-h-[560px] lg:col-span-8 xl:col-span-8' : 'min-h-[600px] lg:col-span-12',\n        ]\"\n      >\n        <!-- Overlay Top: Provider Status & Watermark -->\n        <div class=\"z-10 flex flex-wrap items-start justify-between gap-3\">\n          <!-- Doctor Name & Active Speaking Indicator -->\n          <div\n            class=\"flex items-center gap-2.5 rounded-lg border border-zinc-700/60 bg-zinc-900/85 p-2 shadow-md backdrop-blur-md\"\n          >\n            <Avatar class=\"border-success/50 size-8 border\">\n              <AvatarFallback class=\"bg-success/15 text-success text-xs font-semibold\">SJ</AvatarFallback>\n            </Avatar>\n            <div>\n              <div class=\"flex items-center gap-1.5\">\n                <span class=\"text-xs font-semibold text-zinc-100\">Dr. Sarah Jenkins, MD</span>\n                <Badge\n                  variant=\"outline\"\n                  class=\"border-success/40 bg-success/20 text-success px-1 py-0 text-xs font-normal\"\n                >\n                  Attending\n                </Badge>\n              </div>\n              <div class=\"text-muted-foreground flex items-center gap-2 text-xs\">\n                <div class=\"flex items-center gap-1\">\n                  <Mic class=\"text-success size-3\" />\n                  <div class=\"flex items-center gap-0.5\">\n                    <span class=\"bg-success size-1 animate-pulse rounded-full\" />\n                    <span class=\"bg-success h-2.5 w-0.5 animate-[pulse_0.8s_ease-in-out_infinite] rounded-full\" />\n                    <span class=\"bg-success h-3.5 w-0.5 animate-[pulse_1.2s_ease-in-out_infinite] rounded-full\" />\n                    <span class=\"bg-success h-1.5 w-0.5 animate-[pulse_0.6s_ease-in-out_infinite] rounded-full\" />\n                  </div>\n                  <span class=\"text-success text-xs font-medium\">Speaking</span>\n                </div>\n                <span>·</span>\n                <span>St. Jude Telehealth Clinic</span>\n              </div>\n            </div>\n          </div>\n\n          <!-- Feed Encryption & Signal Badge -->\n          <div\n            class=\"flex items-center gap-1.5 rounded-lg border border-zinc-800 bg-zinc-900/80 px-2.5 py-1 text-xs text-zinc-300 backdrop-blur-sm\"\n          >\n            <ShieldCheck class=\"text-success size-3.5\" />\n            <span class=\"font-mono text-xs\">1080p 60fps · BAA Protected</span>\n          </div>\n        </div>\n\n        <!-- Main Video Placeholder Canvas (Simulated high-res clinical video stream) -->\n        <div class=\"relative my-auto flex flex-col items-center justify-center pt-12 pb-28 text-center\">\n          <!-- Background radial glow -->\n          <div class=\"pointer-events-none absolute inset-0 bg-radial from-emerald-950/20 via-zinc-950/80 to-zinc-950\" />\n\n          <div class=\"relative z-10 space-y-4\">\n            <!-- Simulated Video Avatar Portrait with active ring -->\n            <div class=\"relative mx-auto size-28 sm:size-36\">\n              <div\n                class=\"absolute -inset-1 rounded-full bg-gradient-to-tr from-emerald-500 to-teal-400 opacity-60 blur-xs\"\n              />\n              <div\n                class=\"border-success/80 relative flex size-full items-center justify-center overflow-hidden rounded-full border-2 bg-zinc-900 shadow-xl\"\n              >\n                <Avatar class=\"size-full\">\n                  <AvatarFallback class=\"text-success bg-zinc-900 text-xl font-bold sm:text-2xl\"> SJ </AvatarFallback>\n                </Avatar>\n              </div>\n              <span class=\"bg-success absolute right-2 bottom-2 size-4 rounded-full ring-2 ring-zinc-950\" />\n            </div>\n\n            <!-- Provider Live Status Title -->\n            <div class=\"space-y-1\">\n              <h3 class=\"text-base font-semibold tracking-tight text-zinc-100 sm:text-lg\">Dr. Sarah Jenkins, MD</h3>\n              <p class=\"text-muted-foreground text-xs\">\n                Department of Cardiovascular Medicine · Clinical Telehealth Encounter\n              </p>\n            </div>\n\n            <!-- Video Stream Diagnostic Watermark -->\n            <div\n              class=\"text-muted-foreground inline-flex max-w-full items-center gap-2 rounded-full border border-zinc-800 bg-zinc-900/70 px-3 py-1 font-mono text-xs\"\n            >\n              <span class=\"bg-success size-1.5 shrink-0 rounded-full\" />\n              <span class=\"truncate\">Session: #TH-9021-TX</span>\n              <span class=\"hidden sm:inline\">·</span>\n              <span class=\"hidden truncate sm:inline\">Latency: 24ms (0% loss)</span>\n            </div>\n          </div>\n        </div>\n\n        <!-- Picture-in-Picture Self Video Tile (Patient View - Bottom Right) -->\n        <div\n          class=\"absolute right-4 bottom-20 z-20 aspect-video w-36 overflow-hidden rounded-xl border-2 border-zinc-700/80 bg-zinc-900 shadow-sm transition-colors sm:right-6 sm:bottom-20 sm:w-48\"\n        >\n          <div\n            v-if=\"!isCameraOff\"\n            class=\"relative flex size-full flex-col justify-between bg-gradient-to-b from-zinc-800 to-zinc-950 p-2 text-white\"\n          >\n            <div class=\"flex items-center justify-between\">\n              <Badge variant=\"outline\" class=\"border-zinc-700 bg-zinc-900/80 px-1 py-0 text-xs text-zinc-300\">\n                You (720p)\n              </Badge>\n              <div\n                :class=\"[\n                  'flex size-4 items-center justify-center rounded-full',\n                  isMuted ? 'bg-destructive text-white' : 'bg-success/80 text-white',\n                ]\"\n              >\n                <MicOff v-if=\"isMuted\" class=\"size-2.5\" />\n                <Mic v-else class=\"size-2.5\" />\n              </div>\n            </div>\n\n            <div class=\"flex items-center gap-1.5\">\n              <Avatar class=\"size-5\">\n                <AvatarFallback class=\"bg-zinc-700 text-xs font-bold text-zinc-100\">DC</AvatarFallback>\n              </Avatar>\n              <span class=\"truncate text-xs font-medium text-zinc-200\">David Chen</span>\n            </div>\n          </div>\n\n          <!-- Camera Off Placeholder -->\n          <div\n            v-else\n            class=\"text-muted-foreground flex size-full flex-col items-center justify-center gap-1 bg-zinc-950 p-2 text-center\"\n          >\n            <VideoOff class=\"text-muted-foreground size-4\" />\n            <span class=\"text-xs font-medium\">Camera Off</span>\n          </div>\n        </div>\n\n        <!-- Floating Call Controls Bar (Bottom Center) -->\n        <div class=\"z-20 flex items-center justify-center pt-4\">\n          <div\n            class=\"flex flex-wrap items-center justify-center gap-1.5 rounded-full border border-zinc-700/70 bg-zinc-900/90 p-2 shadow-sm backdrop-blur-md sm:gap-2 sm:px-4\"\n          >\n            <!-- Mute / Unmute Button -->\n            <Button\n              :variant=\"isMuted ? 'destructive' : 'secondary'\"\n              size=\"icon\"\n              class=\"size-9 rounded-full sm:size-10\"\n              :aria-label=\"isMuted ? 'Unmute microphone' : 'Mute microphone'\"\n              @click=\"isMuted = !isMuted\"\n            >\n              <MicOff v-if=\"isMuted\" class=\"size-4\" />\n              <Mic v-else class=\"text-success size-4\" />\n            </Button>\n\n            <!-- Video On / Off Button -->\n            <Button\n              :variant=\"isCameraOff ? 'destructive' : 'secondary'\"\n              size=\"icon\"\n              class=\"size-9 rounded-full sm:size-10\"\n              :aria-label=\"isCameraOff ? 'Turn on camera' : 'Turn off camera'\"\n              @click=\"isCameraOff = !isCameraOff\"\n            >\n              <VideoOff v-if=\"isCameraOff\" class=\"size-4\" />\n              <Video v-else class=\"text-success size-4\" />\n            </Button>\n\n            <!-- Screen Share Button -->\n            <Button\n              :variant=\"isScreenSharing ? 'default' : 'secondary'\"\n              size=\"icon\"\n              class=\"size-9 rounded-full sm:size-10\"\n              :aria-label=\"isScreenSharing ? 'Stop sharing screen' : 'Share screen'\"\n              @click=\"isScreenSharing = !isScreenSharing\"\n            >\n              <Share2 class=\"size-4\" />\n            </Button>\n\n            <Separator orientation=\"vertical\" class=\"mx-1 h-6 bg-zinc-700\" />\n\n            <!-- Tab Quick Toggle Buttons -->\n            <Button\n              :variant=\"isSidebarOpen && activeTab === 'notes' ? 'default' : 'secondary'\"\n              size=\"sm\"\n              class=\"h-9 gap-1.5 rounded-full px-3 text-xs sm:h-10 sm:px-3.5\"\n              @click=\"handleOpenTab('notes')\"\n            >\n              <FileText class=\"size-3.5\" />\n              <span class=\"hidden sm:inline\">SOAP Notes</span>\n            </Button>\n\n            <Button\n              :variant=\"isSidebarOpen && activeTab === 'chat' ? 'default' : 'secondary'\"\n              size=\"sm\"\n              class=\"relative h-9 gap-1.5 rounded-full px-3 text-xs sm:h-10 sm:px-3.5\"\n              @click=\"handleOpenTab('chat')\"\n            >\n              <MessageSquare class=\"size-3.5\" />\n              <span class=\"hidden sm:inline\">In-Call Chat</span>\n              <span\n                v-if=\"!isSidebarOpen && unreadChatCount > 0\"\n                class=\"bg-destructive text-destructive-foreground absolute -top-1 -right-1 flex size-4 items-center justify-center rounded-full text-xs font-bold\"\n              >\n                {{ unreadChatCount }}\n              </span>\n            </Button>\n\n            <Button\n              :variant=\"isSidebarOpen && activeTab === 'vitals' ? 'default' : 'secondary'\"\n              size=\"sm\"\n              class=\"h-9 gap-1.5 rounded-full px-3 text-xs sm:h-10 sm:px-3.5\"\n              @click=\"handleOpenTab('vitals')\"\n            >\n              <HeartPulse class=\"text-destructive size-3.5\" />\n              <span class=\"hidden sm:inline\">Vitals</span>\n            </Button>\n\n            <Separator orientation=\"vertical\" class=\"mx-1 h-6 bg-zinc-700\" />\n\n            <!-- Device Settings Toggle -->\n            <Button\n              variant=\"secondary\"\n              size=\"icon\"\n              class=\"size-9 rounded-full sm:size-10\"\n              aria-label=\"Audio and Video Settings\"\n              @click=\"showSettingsModal = !showSettingsModal\"\n            >\n              <Settings class=\"size-4 text-zinc-300\" />\n            </Button>\n\n            <!-- Expand / Collapse Sidebar Toggle -->\n            <Button\n              variant=\"secondary\"\n              size=\"icon\"\n              class=\"size-9 rounded-full sm:size-10\"\n              :aria-label=\"isSidebarOpen ? 'Collapse side workspace' : 'Open side workspace'\"\n              @click=\"isSidebarOpen = !isSidebarOpen\"\n            >\n              <PanelRightClose v-if=\"isSidebarOpen\" class=\"size-4 text-zinc-300\" />\n              <PanelRightOpen v-else class=\"size-4 text-zinc-300\" />\n            </Button>\n          </div>\n        </div>\n\n        <!-- Quick Settings Flyout / Drawer Banner (when clicked) -->\n        <div\n          v-if=\"showSettingsModal\"\n          class=\"bg-card text-card-foreground absolute top-16 right-4 z-30 w-72 rounded-xl border p-4 shadow-xl\"\n        >\n          <div class=\"flex items-center justify-between pb-2\">\n            <h4 class=\"text-muted-foreground text-xs font-bold tracking-wider uppercase\">AV Devices & HIPAA</h4>\n            <Button\n              variant=\"ghost\"\n              size=\"icon\"\n              class=\"size-6\"\n              aria-label=\"Close settings modal\"\n              @click=\"showSettingsModal = false\"\n            >\n              <X class=\"size-3.5\" />\n            </Button>\n          </div>\n          <div class=\"space-y-3 pt-1 text-xs\">\n            <div>\n              <label class=\"text-muted-foreground block font-medium\">Microphone</label>\n              <div class=\"text-foreground mt-0.5 rounded border p-1.5 font-mono text-xs\">\n                Default - MacBook Pro Mic (CoreAudio)\n              </div>\n            </div>\n            <div>\n              <label class=\"text-muted-foreground block font-medium\">Camera</label>\n              <div class=\"text-foreground mt-0.5 rounded border p-1.5 font-mono text-xs\">\n                FaceTime HD Camera (1080p)\n              </div>\n            </div>\n            <div>\n              <label class=\"text-muted-foreground block font-medium\">Speaker Output</label>\n              <div class=\"text-foreground mt-0.5 rounded border p-1.5 font-mono text-xs\">Studio Display Speakers</div>\n            </div>\n          </div>\n        </div>\n      </section>\n\n      <!-- Collapsible Side Workspace (Right 1/3 when open) -->\n      <aside\n        v-if=\"isSidebarOpen\"\n        class=\"bg-card flex flex-col overflow-hidden rounded-xl border shadow-xs lg:col-span-4 xl:col-span-4\"\n      >\n        <Tabs v-model=\"activeTab\" class=\"flex h-full flex-col\">\n          <!-- Workspace Tab Navigation Header -->\n          <div class=\"bg-muted/30 flex items-center justify-between border-b px-3 py-2.5\">\n            <TabsList class=\"grid h-8 w-full max-w-[320px] grid-cols-3\">\n              <TabsTrigger value=\"notes\" class=\"gap-1 text-xs font-medium\">\n                <FileText class=\"size-3\" />\n                <span>Notes & Rx</span>\n              </TabsTrigger>\n              <TabsTrigger value=\"chat\" class=\"gap-1 text-xs font-medium\">\n                <MessageSquare class=\"size-3\" />\n                <span>Chat</span>\n              </TabsTrigger>\n              <TabsTrigger value=\"vitals\" class=\"gap-1 text-xs font-medium\">\n                <HeartPulse class=\"text-destructive size-3\" />\n                <span>Vitals</span>\n              </TabsTrigger>\n            </TabsList>\n\n            <Button\n              variant=\"ghost\"\n              size=\"icon\"\n              class=\"text-muted-foreground hover:text-foreground ml-1 size-8\"\n              aria-label=\"Close sidebar\"\n              @click=\"isSidebarOpen = false\"\n            >\n              <PanelRightClose class=\"size-4\" />\n            </Button>\n          </div>\n\n          <!-- TAB 1: Clinical Notes & Rx -->\n          <TabsContent value=\"notes\" class=\"flex-1 space-y-4 overflow-y-auto p-4 focus-visible:outline-none\">\n            <!-- Patient Demographics Pill Strip -->\n            <div class=\"bg-muted/40 space-y-2 rounded-lg border p-3\">\n              <div class=\"flex items-center justify-between\">\n                <div class=\"flex items-center gap-2\">\n                  <Avatar class=\"size-7\">\n                    <AvatarFallback class=\"bg-primary/10 text-primary text-xs font-bold\">DC</AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <span class=\"text-foreground text-xs font-bold\">David Chen</span>\n                    <span class=\"text-muted-foreground ml-1 text-xs\">44y · Male</span>\n                  </div>\n                </div>\n                <Badge variant=\"destructive\" class=\"text-xs font-normal\"> Allergy: Penicillin </Badge>\n              </div>\n              <div\n                class=\"text-muted-foreground flex flex-wrap items-center justify-between gap-1 border-t pt-2 text-xs\"\n              >\n                <span>DOB: 05/14/1982</span>\n                <span>Pharmacy: CVS #4021 (Austin)</span>\n              </div>\n            </div>\n\n            <!-- Chief Complaint -->\n            <div class=\"space-y-1.5\">\n              <label class=\"text-muted-foreground flex items-center gap-1.5 text-xs font-bold tracking-wider uppercase\">\n                <AlertCircle class=\"text-warning size-3.5\" />\n                Chief Complaint\n              </label>\n              <div class=\"bg-muted/20 text-foreground rounded-lg border p-2.5 text-xs leading-relaxed\">\n                {{ chiefComplaint }}\n              </div>\n            </div>\n\n            <!-- SOAP Documentation Cards -->\n            <div class=\"space-y-3\">\n              <div class=\"flex items-center justify-between\">\n                <span class=\"text-muted-foreground text-xs font-bold tracking-wider uppercase\"\n                  >SOAP Encounter Note</span\n                >\n                <span class=\"text-muted-foreground font-mono text-xs\">ICD-10: I47.1</span>\n              </div>\n\n              <!-- S: Subjective -->\n              <div class=\"bg-card space-y-1 rounded-lg border p-3\">\n                <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                  <span\n                    class=\"bg-primary text-primary-foreground flex size-4 items-center justify-center rounded-full text-xs\"\n                    >S</span\n                  >\n                  <span>Subjective</span>\n                </div>\n                <p class=\"text-muted-foreground text-xs leading-relaxed\">{{ soapSubjective }}</p>\n              </div>\n\n              <!-- O: Objective -->\n              <div class=\"bg-card space-y-1 rounded-lg border p-3\">\n                <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                  <span\n                    class=\"bg-primary text-primary-foreground flex size-4 items-center justify-center rounded-full text-xs\"\n                    >O</span\n                  >\n                  <span>Objective (Telemetry & Exam)</span>\n                </div>\n                <p class=\"text-muted-foreground text-xs leading-relaxed\">{{ soapObjective }}</p>\n              </div>\n\n              <!-- A: Assessment -->\n              <div class=\"bg-card space-y-1 rounded-lg border p-3\">\n                <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                  <span\n                    class=\"bg-primary text-primary-foreground flex size-4 items-center justify-center rounded-full text-xs\"\n                    >A</span\n                  >\n                  <span>Assessment & Differential</span>\n                </div>\n                <p class=\"text-muted-foreground text-xs leading-relaxed whitespace-pre-line\">{{ soapAssessment }}</p>\n              </div>\n\n              <!-- P: Plan (Editable) -->\n              <div class=\"bg-card space-y-2 rounded-lg border p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <div class=\"text-foreground flex items-center gap-1.5 text-xs font-semibold\">\n                    <span\n                      class=\"bg-primary text-primary-foreground flex size-4 items-center justify-center rounded-full text-xs\"\n                      >P</span\n                    >\n                    <span>Clinical Plan & Orders</span>\n                  </div>\n                  <span class=\"text-muted-foreground text-xs\">Editable</span>\n                </div>\n                <Textarea\n                  v-model=\"soapPlan\"\n                  rows=\"3\"\n                  class=\"resize-y text-xs leading-relaxed\"\n                  placeholder=\"Enter medical orders, follow-up recommendations...\"\n                />\n              </div>\n            </div>\n\n            <!-- Quick e-Prescription Generator -->\n            <Card class=\"border-primary/30 shadow-xs\">\n              <CardHeader class=\"px-3.5 pt-3 pb-2\">\n                <div class=\"flex items-center justify-between\">\n                  <CardTitle class=\"text-foreground flex items-center gap-1.5 text-xs font-bold\">\n                    <Pill class=\"text-primary size-3.5\" />\n                    Electronic Prescription (e-Rx)\n                  </CardTitle>\n                  <Badge variant=\"outline\" class=\"font-mono text-xs\">NPI #1894021</Badge>\n                </div>\n                <CardDescription class=\"text-xs\">\n                  Generate and electronically sign DEA-compliant prescription\n                </CardDescription>\n              </CardHeader>\n              <CardContent class=\"space-y-3 px-3.5 pb-3\">\n                <div class=\"space-y-1.5\">\n                  <label class=\"text-muted-foreground text-xs font-medium\">Select Medication</label>\n                  <div class=\"grid grid-cols-2 gap-1.5\">\n                    <Button\n                      v-for=\"drug in drugOptions\"\n                      :key=\"drug.id\"\n                      type=\"button\"\n                      :variant=\"selectedDrugPreset === drug.id ? 'default' : 'outline'\"\n                      size=\"sm\"\n                      class=\"h-7 justify-start truncate px-2 text-xs\"\n                      @click=\"handleSelectDrugPreset(drug.id)\"\n                    >\n                      {{ drug.name }}\n                    </Button>\n                  </div>\n                </div>\n\n                <div class=\"grid grid-cols-2 gap-2\">\n                  <div class=\"space-y-1\">\n                    <label class=\"text-muted-foreground text-xs\">Dosage & Frequency</label>\n                    <Input v-model=\"customDosage\" class=\"h-7 text-xs\" />\n                  </div>\n                  <div class=\"space-y-1\">\n                    <label class=\"text-muted-foreground text-xs\">Quantity & Refills</label>\n                    <Input v-model=\"customQuantity\" class=\"h-7 text-xs\" />\n                  </div>\n                </div>\n\n                <div\n                  v-if=\"rxSuccessMessage\"\n                  class=\"border-success/30 bg-success/10 text-success flex items-center gap-1.5 rounded-md border p-2 text-xs font-medium\"\n                >\n                  <CheckCircle2 class=\"size-3.5 shrink-0\" />\n                  <span>{{ rxSuccessMessage }}</span>\n                </div>\n\n                <Button size=\"sm\" class=\"w-full gap-1.5 text-xs font-semibold\" @click=\"handleGeneratePrescription\">\n                  <FileCheck class=\"size-3.5\" />\n                  <span>Sign & Transmit e-Rx to Pharmacy</span>\n                </Button>\n\n                <!-- Encounter Prescriptions History -->\n                <div v-if=\"prescriptions.length > 0\" class=\"space-y-1.5 border-t pt-1\">\n                  <span class=\"text-muted-foreground text-xs font-medium\">Active Prescriptions this Visit:</span>\n                  <div\n                    v-for=\"rx in prescriptions\"\n                    :key=\"rx.id\"\n                    class=\"bg-muted/30 space-y-1 rounded border p-2 text-xs\"\n                  >\n                    <div class=\"flex items-center justify-between\">\n                      <span class=\"text-foreground font-semibold\">{{ rx.drugName }}</span>\n                      <Badge variant=\"outline\" class=\"border-success/40 bg-success/10 text-success text-xs\">\n                        {{ rx.status === 'transmitted' ? 'Transmitted' : 'Pending' }}\n                      </Badge>\n                    </div>\n                    <p class=\"text-muted-foreground text-xs\">\n                      {{ rx.dosage }} · {{ rx.quantity }} (Refills: {{ rx.refills }})\n                    </p>\n                    <p class=\"text-muted-foreground font-mono text-xs\">{{ rx.pharmacy }} · {{ rx.rxNumber }}</p>\n                  </div>\n                </div>\n              </CardContent>\n            </Card>\n          </TabsContent>\n\n          <!-- TAB 2: In-Call Chat -->\n          <TabsContent value=\"chat\" class=\"flex h-[460px] flex-col focus-visible:outline-none\">\n            <!-- HIPAA Banner -->\n            <div class=\"bg-success/10 text-success flex items-center gap-2 border-b p-2.5 text-xs\">\n              <ShieldCheck class=\"text-success size-4 shrink-0\" />\n              <span>Encrypted Consultation Chat · Archived in EHR Audit Log</span>\n            </div>\n\n            <!-- Messages List -->\n            <div class=\"flex-1 space-y-3.5 overflow-y-auto p-4\">\n              <div\n                v-for=\"msg in chatMessages\"\n                :key=\"msg.id\"\n                :class=\"['flex flex-col gap-1 text-xs', msg.sender === 'patient' ? 'items-end' : 'items-start']\"\n              >\n                <div class=\"text-muted-foreground flex items-center gap-1.5 px-1 text-xs\">\n                  <span>{{ msg.senderName }}</span>\n                  <span>·</span>\n                  <span>{{ msg.timestamp }}</span>\n                </div>\n\n                <!-- Message bubble -->\n                <div\n                  :class=\"[\n                    'max-w-[85%] rounded-2xl px-3.5 py-2 leading-relaxed shadow-xs',\n                    msg.sender === 'patient'\n                      ? 'bg-primary text-primary-foreground rounded-br-xs'\n                      : 'bg-muted text-foreground rounded-bl-xs',\n                  ]\"\n                >\n                  <p>{{ msg.text }}</p>\n\n                  <!-- Attachment preview if present -->\n                  <div\n                    v-if=\"msg.attachment\"\n                    class=\"mt-2 flex items-center justify-between gap-2 rounded-lg border border-white/20 bg-black/10 p-2 text-xs\"\n                  >\n                    <div class=\"flex min-w-0 items-center gap-2\">\n                      <FileText class=\"size-4 shrink-0\" />\n                      <div class=\"min-w-0\">\n                        <p class=\"truncate font-medium\">{{ msg.attachment.name }}</p>\n                        <p class=\"text-xs opacity-80\">{{ msg.attachment.size }}</p>\n                      </div>\n                    </div>\n                    <Button\n                      variant=\"ghost\"\n                      size=\"icon\"\n                      class=\"size-6 shrink-0 text-current hover:bg-white/10\"\n                      aria-label=\"Download attachment\"\n                    >\n                      <Download class=\"size-3.5\" />\n                    </Button>\n                  </div>\n                </div>\n              </div>\n            </div>\n\n            <!-- Chat Composer -->\n            <div class=\"bg-muted/20 space-y-2 border-t p-3\">\n              <div class=\"flex items-center gap-1.5\">\n                <Input\n                  v-model=\"chatInput\"\n                  placeholder=\"Type encrypted message to Dr. Jenkins...\"\n                  class=\"h-8 text-xs\"\n                  @keydown.enter.prevent=\"handleSendMessage\"\n                />\n                <Button\n                  variant=\"ghost\"\n                  size=\"icon\"\n                  class=\"text-muted-foreground hover:text-foreground size-8 shrink-0\"\n                  aria-label=\"Attach clinical file\"\n                >\n                  <Paperclip class=\"size-4\" />\n                </Button>\n                <Button\n                  size=\"sm\"\n                  class=\"h-8 shrink-0 gap-1 px-3 text-xs\"\n                  :disabled=\"!chatInput.trim()\"\n                  @click=\"handleSendMessage\"\n                >\n                  <Send class=\"size-3.5\" />\n                  <span>Send</span>\n                </Button>\n              </div>\n              <div class=\"text-muted-foreground flex items-center justify-between px-1 text-xs\">\n                <span>Press Enter to send</span>\n                <span>BAA Encrypted</span>\n              </div>\n            </div>\n          </TabsContent>\n\n          <!-- TAB 3: Patient Vitals & Telemetry -->\n          <TabsContent value=\"vitals\" class=\"flex-1 space-y-4 overflow-y-auto p-4 focus-visible:outline-none\">\n            <!-- Telemetry Stream Banner -->\n            <div class=\"bg-muted/30 flex items-center justify-between rounded-lg border p-3\">\n              <div class=\"flex items-center gap-2\">\n                <span class=\"relative flex size-2.5\">\n                  <span class=\"bg-success absolute inline-flex h-full w-full rounded-full opacity-75\" />\n                  <span class=\"bg-success relative inline-flex size-2.5 rounded-full\" />\n                </span>\n                <div>\n                  <h4 class=\"text-foreground text-xs font-bold\">Live Telemetry Feed</h4>\n                  <p class=\"text-muted-foreground text-xs\">BLE Medical Hub · Updated {{ lastVitalsUpdate }}</p>\n                </div>\n              </div>\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                class=\"h-7 gap-1.5 text-xs\"\n                :disabled=\"isRefreshingVitals\"\n                @click=\"handleRefreshVitals\"\n              >\n                <RefreshCw :class=\"['size-3', isRefreshingVitals && 'animate-spin']\" />\n                <span>Refresh</span>\n              </Button>\n            </div>\n\n            <!-- Vitals Telemetry Grid -->\n            <div class=\"grid grid-cols-2 gap-3\">\n              <!-- Blood Pressure -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground text-xs font-semibold\">Blood Pressure</span>\n                  <Badge variant=\"outline\" class=\"border-success/40 bg-success/10 text-success text-xs\"> Normal </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">128/82</span>\n                    <span class=\"text-muted-foreground text-xs\">mmHg</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">Target: &lt;130/85 mmHg</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>Smart Cuff</span>\n                  <span class=\"text-foreground font-medium\">MAP: 97</span>\n                </div>\n              </Card>\n\n              <!-- Heart Rate -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground flex items-center gap-1 text-xs font-semibold\">\n                    <Heart class=\"text-destructive size-3\" />\n                    Heart Rate\n                  </span>\n                  <Badge variant=\"outline\" class=\"border-success/40 bg-success/10 text-success text-xs\"> NSR </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">74</span>\n                    <span class=\"text-muted-foreground text-xs\">bpm</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">Resting (Range: 68-88)</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>Rhythm: Sinus</span>\n                  <span class=\"text-success font-medium\">Regular</span>\n                </div>\n              </Card>\n\n              <!-- Oxygen Saturation (SpO2) -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground text-xs font-semibold\">Oxygen (SpO2)</span>\n                  <Badge variant=\"outline\" class=\"border-success/40 bg-success/10 text-success text-xs\">\n                    Optimal\n                  </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">98%</span>\n                    <span class=\"text-muted-foreground text-xs\">Ambient</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">Room Air (FiO2 21%)</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>PulseOx Probe</span>\n                  <span class=\"text-foreground font-medium\">PI: 4.8%</span>\n                </div>\n              </Card>\n\n              <!-- Body Temperature -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground flex items-center gap-1 text-xs font-semibold\">\n                    <Thermometer class=\"text-warning size-3\" />\n                    Temperature\n                  </span>\n                  <Badge variant=\"secondary\" class=\"text-xs\"> Afebrile </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">98.4°</span>\n                    <span class=\"text-muted-foreground text-xs\">F</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">36.9°C (Temporal Scan)</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>Scanner Hub</span>\n                  <span class=\"text-foreground font-medium\">Normal</span>\n                </div>\n              </Card>\n\n              <!-- Respiration Rate -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground text-xs font-semibold\">Respiration</span>\n                  <Badge variant=\"secondary\" class=\"text-xs\"> Eupneic </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">16</span>\n                    <span class=\"text-muted-foreground text-xs\">br/min</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">Range: 12-20 normal</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>Chest Sensor</span>\n                  <span class=\"text-foreground font-medium\">Steady</span>\n                </div>\n              </Card>\n\n              <!-- Fasting Blood Glucose -->\n              <Card class=\"space-y-2 p-3\">\n                <div class=\"flex items-center justify-between\">\n                  <span class=\"text-muted-foreground text-xs font-semibold\">Glucose</span>\n                  <Badge variant=\"outline\" class=\"border-success/40 bg-success/10 text-success text-xs\"> Normal </Badge>\n                </div>\n                <div>\n                  <div class=\"flex items-baseline gap-1\">\n                    <span class=\"text-foreground font-mono text-xl font-bold tracking-tight\">94</span>\n                    <span class=\"text-muted-foreground text-xs\">mg/dL</span>\n                  </div>\n                  <p class=\"text-muted-foreground mt-0.5 text-xs\">Fasting 3.5h post-meal</p>\n                </div>\n                <div class=\"text-muted-foreground flex items-center justify-between border-t pt-1.5 text-xs\">\n                  <span>Continuous CGM</span>\n                  <span class=\"text-success font-medium\">In Range</span>\n                </div>\n              </Card>\n            </div>\n\n            <!-- Physician Vitals Summary -->\n            <div class=\"bg-muted/20 space-y-1.5 rounded-lg border p-3 text-xs\">\n              <div class=\"text-foreground flex items-center gap-1.5 font-semibold\">\n                <ShieldCheck class=\"text-success size-3.5\" />\n                <span>Physician Baseline Parameter Assessment</span>\n              </div>\n              <p class=\"text-muted-foreground leading-relaxed\">\n                All live telemetry telemetry values remain within normal hemodynamic thresholds. Patient exhibits no\n                signs of acute decompensation or malignant arrhythmias during the video encounter.\n              </p>\n            </div>\n          </TabsContent>\n        </Tabs>\n      </aside>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:page",
      "target": "~/app/components/blocks/TelehealthVideoRoom.vue"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/avatar.json",
    "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/input.json",
    "https://uipkge.dev/r/vue/separator.json",
    "https://uipkge.dev/r/vue/tabs.json",
    "https://uipkge.dev/r/vue/textarea.json"
  ],
  "description": "HIPAA-compliant telehealth video consultation room with live telemetry vitals, clinical SOAP notes, in-call encrypted chat, and prescription generator drawer.",
  "categories": [
    "healthcare",
    "app",
    "communication"
  ]
}