62:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 63:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 64:T9c50,'use client' import * as React from 'react' import { Activity, Battery, Bell, Bluetooth, CheckCircle2, Download, Droplets, Flame, PhoneCall, ShieldAlert, ShieldCheck, Snowflake, ThermometerSnowflake, ThermometerSun, } from 'lucide-react' import { cn } from '@/lib/utils' import { Badge } from '@/components/ui/badge' import { Button } from '@/components/ui/button' import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '@/components/ui/card' import { Progress } from '@/components/ui/progress' import { Separator } from '@/components/ui/separator' import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table' export interface LogEntry { id: string timestamp: string timeAgo: string internalTemp: number ambientTemp: number deltaT: number probeLocation: string probeId: string humidity: number status: 'optimal' | 'in-spec' | 'warning' | 'breach' isLatest?: boolean } export interface ChartReading { time: string hourLabel: string internalTemp: number ambientTemp: number milestone: string } export interface ColdChainTempMonitorProps extends React.HTMLAttributes { shipmentId?: string shipmentTitle?: string tempClass?: string beaconId?: string protocolVersion?: string batteryPercent?: number batteryDays?: number currentInternalTemp?: number currentAmbientTemp?: number currentHumidity?: number totalExcursions?: number monitoringHours?: number logs?: LogEntry[] chartData?: ChartReading[] } const defaultChartData: ChartReading[] = [ { time: '00:00', hourLabel: '00:00 UTC', internalTemp: -19.8, ambientTemp: 18.2, milestone: 'FRA Departure Tarmac' }, { time: '03:00', hourLabel: '03:00 UTC', internalTemp: -20.4, ambientTemp: -4.5, milestone: 'Flight EK046 Climb' }, { time: '06:00', hourLabel: '06:00 UTC', internalTemp: -20.8, ambientTemp: -6.2, milestone: 'Cruise Flight Level 380', }, { time: '09:00', hourLabel: '09:00 UTC', internalTemp: -20.1, ambientTemp: 12.4, milestone: 'DXB Descent & Approach', }, { time: '12:00', hourLabel: '12:00 UTC', internalTemp: -19.2, ambientTemp: 38.6, milestone: 'DXB Ramp Tarmac Transfer', }, { time: '15:00', hourLabel: '15:00 UTC', internalTemp: -19.6, ambientTemp: 32.0, milestone: 'Perishable Hub Staging', }, { time: '18:00', hourLabel: '18:00 UTC', internalTemp: -19.8, ambientTemp: 26.5, milestone: 'Active Reefer Bay #4' }, { time: '21:00', hourLabel: '21:00 UTC', internalTemp: -19.5, ambientTemp: 25.0, milestone: 'Pre-Connection QA Inspection', }, { time: '24:00', hourLabel: '14:30 UTC', internalTemp: -19.4, ambientTemp: 24.8, milestone: 'Dubai Hub Terminal 2' }, ] const defaultLogs: LogEntry[] = [ { id: 'log-1', timestamp: 'Aug 21, 14:30 UTC', timeAgo: '24s ago', internalTemp: -19.4, ambientTemp: 24.8, deltaT: 44.2, probeLocation: 'Pallet Center Core', probeId: 'Probe #A1', humidity: 18, status: 'optimal', isLatest: true, }, { id: 'log-2', timestamp: 'Aug 21, 14:00 UTC', timeAgo: '30m ago', internalTemp: -19.5, ambientTemp: 25.2, deltaT: 44.7, probeLocation: 'Upper Cargo Lid', probeId: 'Probe #B2', humidity: 18, status: 'optimal', }, { id: 'log-3', timestamp: 'Aug 21, 13:30 UTC', timeAgo: '1h ago', internalTemp: -19.2, ambientTemp: 28.4, deltaT: 47.6, probeLocation: 'Lower Ventral Core', probeId: 'Probe #C1', humidity: 19, status: 'in-spec', }, { id: 'log-4', timestamp: 'Aug 21, 13:00 UTC', timeAgo: '1.5h ago', internalTemp: -19.8, ambientTemp: 36.1, deltaT: 55.9, probeLocation: 'Pallet Center Core', probeId: 'Probe #A1', humidity: 20, status: 'optimal', }, { id: 'log-5', timestamp: 'Aug 21, 12:30 UTC', timeAgo: '2h ago', internalTemp: -20.1, ambientTemp: 38.6, deltaT: 58.7, probeLocation: 'Outer Thermal Jacket', probeId: 'Probe #D4', humidity: 19, status: 'optimal', }, ] export const ColdChainTempMonitor = React.forwardRef( ( { className, shipmentId = '#CC-9482', shipmentTitle = 'Vaccine Cold-Chain Consignment #CC-9482', tempClass = 'Ultra-Cold Frozen · Target: -20°C ± 2°C', beaconId = 'SensorTag #BT-4892 · BLE 5.3', protocolVersion = 'IATA CEIV / WHO-PQS Standard', batteryPercent = 94, batteryDays = 180, currentInternalTemp = -19.4, currentAmbientTemp = 24.8, currentHumidity = 18, totalExcursions = 0, monitoringHours = 96, logs = defaultLogs, chartData = defaultChartData, ...props }, ref, ) => { const [isExporting, setIsExporting] = React.useState(false) const [exportNotification, setExportNotification] = React.useState(false) const [activeTimeframe, setActiveTimeframe] = React.useState<'24h' | '48h' | '96h'>('24h') const [selectedReadingIndex, setSelectedReadingIndex] = React.useState(null) const [dryIceCapacityPercent] = React.useState(78) const [dryIceEnduranceHours] = React.useState(72) const handleExportCSV = () => { setIsExporting(true) setTimeout(() => { setIsExporting(false) setExportNotification(true) setTimeout(() => { setExportNotification(false) }, 4500) }, 500) } const chartPoints = React.useMemo(() => { const data = chartData const svgWidth = 740 const paddingX = 40 const usableWidth = svgWidth - paddingX * 2 return data.map((d, i) => { const x = paddingX + (i / (data.length - 1)) * usableWidth const yInternal = 110 - (d.internalTemp - -20) * 22.5 const yAmbient = 180 - ((d.ambientTemp - -10) / 55) * 150 return { x, yInternal, yAmbient, ...d, } }) }, [chartData]) const internalPath = React.useMemo(() => { const pts = chartPoints if (!pts.length) return '' let path = `M ${pts[0].x},${pts[0].yInternal}` for (let i = 1; i < pts.length; i++) { const prev = pts[i - 1] const curr = pts[i] const cx = (prev.x + curr.x) / 2 path += ` C ${cx},${prev.yInternal} ${cx},${curr.yInternal} ${curr.x},${curr.yInternal}` } return path }, [chartPoints]) const internalArea = React.useMemo(() => { const pts = chartPoints if (!pts.length) return '' const firstX = pts[0].x const lastX = pts[pts.length - 1].x return `${internalPath} L ${lastX},210 L ${firstX},210 Z` }, [chartPoints, internalPath]) const ambientPath = React.useMemo(() => { const pts = chartPoints if (!pts.length) return '' let path = `M ${pts[0].x},${pts[0].yAmbient}` for (let i = 1; i < pts.length; i++) { const prev = pts[i - 1] const curr = pts[i] const cx = (prev.x + curr.x) / 2 path += ` C ${cx},${prev.yAmbient} ${cx},${curr.yAmbient} ${curr.x},${curr.yAmbient}` } return path }, [chartPoints]) return (

{/* Header Section */}

{shipmentTitle}

{/* Temperature Class Badge in Sky Blue */} {tempClass}

{beaconId}

{batteryPercent}% ({batteryDays} days remaining)

Live Telemetry · DXB Terminal 2 Transit

{/* Action Button */}

{/* Export Success Banner */} {exportNotification && (

Cold-chain telemetry audit log exported successfully with cryptographic SHA-256 chain-of-custody seal.

)} {/* 4 Telemetry Overview Cards */}

{/* 1. Current Internal Temperature */}

Internal Core Temp

In Target Zone

{currentInternalTemp > 0 ? `+${currentInternalTemp}` : currentInternalTemp}°C Payload

±0.6°C setpoint

Target Corridor: -22.0°C to -18.0°C

Probe #A1 (Pallet Center Core)

{/* 2. Ambient External Temperature */}

Ambient External

Dubai Tarmac

{currentAmbientTemp > 0 ? `+${currentAmbientTemp}` : currentAmbientTemp}°C Air Temp

ΔT 44.2°C

Transfer Node: DXB Cargo T2

VIP Cryo-Insulation Envelope Active

{/* 3. Relative Humidity */}

Cargo Humidity

Optimal Dry

{currentHumidity}% RH

Zero Condensation

Dew Point: -32.4°C Spec < 35%

{/* 4. Total Excursions / Breach Events */}

Excursion Events

100% Compliant

{totalExcursions} Breaches

{monitoringHours}h in-transit

Mean Kinetic Temp (MKT): -19.7°C

0 cumulative seconds out-of-spec

{/* 24-Hour Temperature Curve / Telemetry Graph */}

24-Hour Payload & Ambient Telemetry Curve

Continuous thermal gradient monitoring comparing internal core payload against ambient flight & tarmac temperatures with strict excursion threshold corridors.

{/* Legend & Timeframe */}

Internal Core

Ambient Air

Upper Limit (-18°C)

Lower Limit (-22°C)

{/* SVG Chart Area */}

{/* X-Axis Timeline Milestones */}

{chartPoints.map((pt, idx) => (

{pt.time}

{pt.milestone}

{pt.internalTemp > 0 ? `+${pt.internalTemp}` : pt.internalTemp}°C

))}

{/* Metric Summary Strip */}

Min Internal Temp

-20.8°C

At cruise altitude

Max Internal Temp

-19.2°C

During DXB ramp transfer

24h Mean Temp

-19.7°C

Optimal Setpoint

Standard Deviation

±0.4°C

Tight thermal hold

Peak External Heat

+38.6°C

DXB Tarmac 12:00 UTC

{/* Temperature Logging History Table & Protocol Card */}

{/* Table: 2 cols on lg */}

Temperature Logging History Calibrated multi-probe sensor telemetry pings across core pallet positions.

{logs.length} Recent Pings

Timestamp Internal Temp Ambient Air Delta-T Probe Location RH % Status {logs.map((log) => (

{log.timestamp} {log.isLatest && ( Now )}

{log.internalTemp > 0 ? `+${log.internalTemp}` : log.internalTemp}°C {log.ambientTemp > 0 ? `+${log.ambientTemp}` : log.ambientTemp}°C {log.deltaT}°C {log.probeLocation} ({log.probeId}) {log.humidity}% {log.status} ))}

{/* Critical Excursion Alert Protocol Card */}

Excursion Alert Protocol

Armed

Automated escalation rules and dry ice reserve endurance monitoring. {/* Escalation Rule 1 */}

Urgent SMS / Pager Alert Trigger: > -15.0°C

Triggers priority emergency dispatch if payload core temperature rises above -15.0°C for ≥ 30 consecutive minutes.

{/* Cryogenic Dry Ice Reserve */}

Dry Ice Solid CO2 Reserve

{dryIceEnduranceHours}h hold

Sublimation: 0.38 kg/hr 42 kg solid reserve

{/* Emergency Response Logistics Desk */}

Rapid Intervention Desk:

DXB Hub Team

Emergency Pager: +971 4 216 4890

Re-Icing Intervention SLA: < 20 minutes

Standard Operating SOP: SOP-BIO-904

) }, ) ColdChainTempMonitor.displayName = 'ColdChainTempMonitor' 61:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L62",null,{"namespace":"@registrydirectory","registryDependencies":["https://uipkge.dev/r/react/badge.json","https://uipkge.dev/r/react/button.json","https://uipkge.dev/r/react/card.json","https://uipkge.dev/r/react/progress.json","https://uipkge.dev/r/react/separator.json","https://uipkge.dev/r/react/table.json"]}]]}],null]}],["$","$L63",null,{"files":[{"path":"packages/registry-react/blocks/cold-chain-temp-monitor/ColdChainTempMonitor.tsx","content":"$64","type":"registry:block","target":"~/components/blocks/ColdChainTempMonitor.tsx"}],"className":"h-[70svh] min-h-80"}]]}]