{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "floor-plan-explorer",
  "title": "Floor Plan Explorer",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/floor-plan-explorer/FloorPlanExplorer.vue",
      "content": "<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport type { HTMLAttributes } from 'vue'\nimport { Bath, Bed, Building2, Check, Download } 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, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'\nimport AvailableUnitsTable from './AvailableUnitsTable.vue'\nimport FloorPlanCanvas from './FloorPlanCanvas.vue'\nimport { floorPlans } from './floor-plan-explorer-data'\nimport type { AvailableUnit, FloorPlanData, RoomSpec } from './floor-plan-explorer-types'\n\nexport type { AvailableUnit, FloorPlanData, RoomSpec } from './floor-plan-explorer-types'\nimport { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'\n\nconst props = defineProps<{\n  class?: HTMLAttributes['class']\n}>()\n\nconst activeTab = ref('plan-b')\nconst selectedRoomId = ref<string | null>('living')\nconst hoveredRoomId = ref<string | null>(null)\nconst selectedUnitNumber = ref<string>('402')\nconst showDimensions = ref(true)\nconst showFurniture = ref(true)\nconst showPins = ref(true)\nconst unitSystem = ref<'imperial' | 'metric'>('imperial')\nconst isDownloadingPdf = ref(false)\nconst downloadSuccess = ref(false)\nconst showTourSuccess = ref(false)\n\nconst currentPlan = computed(() => floorPlans[activeTab.value] || floorPlans['plan-b'])\n\nconst activeRoom = computed(() => {\n  if (hoveredRoomId.value) {\n    return currentPlan.value.rooms.find((r) => r.id === hoveredRoomId.value) || null\n  }\n  if (selectedRoomId.value) {\n    return currentPlan.value.rooms.find((r) => r.id === selectedRoomId.value) || null\n  }\n  return currentPlan.value.rooms[0] || null\n})\n\nfunction handleSelectTab(key: string) {\n  activeTab.value = key\n  const plan = floorPlans[key]\n  if (plan) {\n    selectedRoomId.value = plan.rooms[0]?.id || null\n    hoveredRoomId.value = null\n    selectedUnitNumber.value = plan.availableUnits[0]?.unitNumber || ''\n  }\n}\n\nfunction handleSelectRoom(roomId: string) {\n  selectedRoomId.value = roomId === selectedRoomId.value ? null : roomId\n}\n\nfunction handleHoverRoom(roomId: string | null) {\n  hoveredRoomId.value = roomId\n}\n\nfunction handleSelectUnit(unitNo: string) {\n  selectedUnitNumber.value = unitNo\n}\n\nfunction handleDownloadPdf() {\n  isDownloadingPdf.value = true\n  downloadSuccess.value = false\n  setTimeout(() => {\n    isDownloadingPdf.value = false\n    downloadSuccess.value = true\n    setTimeout(() => {\n      downloadSuccess.value = false\n    }, 4000)\n  }, 900)\n}\n\nfunction handleScheduleTour() {\n  showTourSuccess.value = true\n  setTimeout(() => {\n    showTourSuccess.value = false\n  }, 4500)\n}\n</script>\n\n<template>\n  <div data-slot=\"floor-plan-explorer\" :class=\"cn('bg-background text-foreground w-full space-y-6', props.class)\">\n    <!-- Header: Building Title, Plan Switcher Tabs, Action Button -->\n    <header class=\"border-border flex flex-col gap-4 border-b pb-6 lg:flex-row lg:items-center lg:justify-between\">\n      <div class=\"space-y-1.5\">\n        <div class=\"flex items-center gap-2\">\n          <Badge variant=\"outline\" class=\"text-muted-foreground gap-1 px-2 py-0.5 font-mono text-xs\">\n            <Building2 class=\"text-primary size-3\" />\n            The Grandview Collection\n          </Badge>\n          <span class=\"text-muted-foreground text-xs\">Tower West · Residences</span>\n        </div>\n        <h1 class=\"text-xl font-semibold tracking-tight sm:text-2xl\">\n          The Grandview Penthouse Collection · Floor Plan Explorer\n        </h1>\n        <p class=\"text-muted-foreground text-xs sm:text-sm\">\n          Interactive architectural layout inspector, dimensional specifications, and real-time residential unit\n          availability.\n        </p>\n      </div>\n\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <Button\n          aria-label=\"Download attachment\"\n          variant=\"outline\"\n          size=\"sm\"\n          class=\"h-9 gap-2 text-xs\"\n          :disabled=\"isDownloadingPdf\"\n          @click=\"handleDownloadPdf\"\n        >\n          <Download v-if=\"!downloadSuccess\" class=\"text-muted-foreground size-3.5\" />\n          <Check v-else class=\"text-success size-3.5\" />\n          <span>{{\n            isDownloadingPdf ? 'Generating PDF...' : downloadSuccess ? 'PDF Downloaded' : 'Download PDF Floor Plan'\n          }}</span>\n        </Button>\n      </div>\n    </header>\n\n    <!-- Plan Selection Tabs Bar -->\n    <div class=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n      <Tabs :model-value=\"activeTab\" class=\"w-full sm:w-auto\" @update:model-value=\"handleSelectTab(String($event))\">\n        <TabsList class=\"bg-muted/60 grid h-10 w-full grid-cols-3 gap-1 p-1 sm:w-auto\">\n          <TabsTrigger\n            value=\"plan-a\"\n            class=\"data-[state=active]:bg-background px-3 text-xs font-medium data-[state=active]:shadow-xs sm:px-4 sm:text-sm\"\n          >\n            Plan A - 1 Bed / 1 Bath\n          </TabsTrigger>\n          <TabsTrigger\n            value=\"plan-b\"\n            class=\"data-[state=active]:bg-background px-3 text-xs font-medium data-[state=active]:shadow-xs sm:px-4 sm:text-sm\"\n          >\n            Plan B - 2 Bed / 2 Bath\n          </TabsTrigger>\n          <TabsTrigger\n            value=\"plan-c\"\n            class=\"data-[state=active]:bg-background px-3 text-xs font-medium data-[state=active]:shadow-xs sm:px-4 sm:text-sm\"\n          >\n            Plan C - 3 Bed Penthouse\n          </TabsTrigger>\n        </TabsList>\n      </Tabs>\n\n      <div class=\"flex items-center gap-2\">\n        <span class=\"text-muted-foreground text-xs\">Units:</span>\n        <div class=\"border-border bg-muted/30 inline-flex rounded-md border p-0.5\">\n          <button\n            type=\"button\"\n            :class=\"\n              cn(\n                'focus-visible:ring-ring rounded px-2.5 py-1 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none',\n                unitSystem === 'imperial'\n                  ? 'bg-background text-foreground shadow-xs'\n                  : 'text-muted-foreground hover:text-foreground',\n              )\n            \"\n            @click=\"unitSystem = 'imperial'\"\n          >\n            Sq Ft / ft\n          </button>\n          <button\n            type=\"button\"\n            :class=\"\n              cn(\n                'focus-visible:ring-ring rounded px-2.5 py-1 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none',\n                unitSystem === 'metric'\n                  ? 'bg-background text-foreground shadow-xs'\n                  : 'text-muted-foreground hover:text-foreground',\n              )\n            \"\n            @click=\"unitSystem = 'metric'\"\n          >\n            m² / m\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- 2-Column Inspector: Left 2D CAD Blueprint Canvas, Right Specs & Availability -->\n    <div class=\"grid grid-cols-1 gap-6 lg:grid-cols-12\">\n      <!-- Left Column: 2D Architectural Layout Canvas (7 cols) -->\n      <FloorPlanCanvas\n        :plan=\"currentPlan\"\n        :active-room=\"activeRoom\"\n        :unit-system=\"unitSystem\"\n        :show-dimensions=\"showDimensions\"\n        :show-furniture=\"showFurniture\"\n        :show-pins=\"showPins\"\n        :selected-room-id=\"selectedRoomId\"\n        :hovered-room-id=\"hoveredRoomId\"\n        @toggle-dimensions=\"showDimensions = !showDimensions\"\n        @toggle-furniture=\"showFurniture = !showFurniture\"\n        @toggle-pins=\"showPins = !showPins\"\n        @hover-room=\"handleHoverRoom\"\n        @select-room=\"handleSelectRoom\"\n      />\n\n      <!-- Right Column: Unit Specs, Room Breakdown & Available Units Table (5 cols) -->\n      <div class=\"space-y-6 lg:col-span-5\">\n        <!-- Selected Plan Header Card with Total Area -->\n        <Card class=\"border-border bg-card shadow-xs\">\n          <CardHeader class=\"pb-3\">\n            <div class=\"flex flex-wrap items-center justify-between\">\n              <Badge variant=\"secondary\" class=\"font-mono text-xs\">\n                {{ currentPlan.tier }}\n              </Badge>\n              <div class=\"text-muted-foreground flex items-center gap-1.5 text-xs\">\n                <Bed class=\"size-3.5\" />\n                <span>{{ currentPlan.beds }} Bed</span>\n                <span>·</span>\n                <Bath class=\"size-3.5\" />\n                <span>{{ currentPlan.baths }} Bath</span>\n              </div>\n            </div>\n            <CardTitle class=\"mt-1 text-lg font-semibold tracking-tight sm:text-xl\">\n              {{ currentPlan.marketingName }}\n            </CardTitle>\n            <CardDescription class=\"text-xs leading-relaxed sm:text-sm\">\n              {{ currentPlan.description }}\n            </CardDescription>\n          </CardHeader>\n\n          <CardContent class=\"space-y-4\">\n            <!-- Total Area Hero Metric Box -->\n            <div class=\"border-border bg-muted/40 rounded-lg border p-4\">\n              <p class=\"text-muted-foreground text-xs font-medium\">Total Architectural Living Area</p>\n              <div class=\"mt-1 flex items-baseline gap-2\">\n                <span class=\"text-foreground font-mono text-2xl font-bold tracking-tight tabular-nums sm:text-3xl\">\n                  {{ currentPlan.totalAreaSqFt.toLocaleString() }}\n                </span>\n                <span class=\"text-muted-foreground text-sm font-medium\">Sq Ft</span>\n                <span class=\"text-muted-foreground/60\">/</span>\n                <span class=\"text-muted-foreground font-mono text-lg font-semibold tabular-nums\">\n                  {{ currentPlan.totalAreaSqM.toFixed(1) }}\n                </span>\n                <span class=\"text-muted-foreground text-xs font-medium\">m²</span>\n              </div>\n              <div\n                class=\"border-border/60 text-muted-foreground mt-2 flex flex-wrap items-center justify-between border-t pt-2 text-xs\"\n              >\n                <span\n                  >Interior:\n                  <strong class=\"text-foreground font-mono tabular-nums\"\n                    >{{ currentPlan.interiorSqFt }} sq ft</strong\n                  ></span\n                >\n                <span\n                  >Terrace:\n                  <strong class=\"text-foreground font-mono tabular-nums\"\n                    >{{ currentPlan.exteriorSqFt }} sq ft</strong\n                  ></span\n                >\n              </div>\n            </div>\n\n            <!-- Room Breakdown List with Interactive Highlights -->\n            <div>\n              <div class=\"mb-2 flex flex-wrap items-center justify-between\">\n                <h4 class=\"text-muted-foreground text-xs font-semibold tracking-wider uppercase\">\n                  Room Breakdown & Dimensions\n                </h4>\n                <span class=\"text-muted-foreground text-xs\">{{ currentPlan.rooms.length }} Spaces</span>\n              </div>\n\n              <div class=\"space-y-1.5\">\n                <div\n                  v-for=\"room in currentPlan.rooms\"\n                  :key=\"room.id\"\n                  :class=\"\n                    cn(\n                      'flex cursor-pointer items-center justify-between rounded-md border p-2.5 transition-colors duration-150',\n                      selectedRoomId === room.id\n                        ? 'border-primary bg-primary/5 shadow-xs'\n                        : hoveredRoomId === room.id\n                          ? 'border-border bg-muted/60'\n                          : 'border-border/60 bg-card hover:bg-muted/30',\n                    )\n                  \"\n                  @mouseenter=\"handleHoverRoom(room.id)\"\n                  @mouseleave=\"handleHoverRoom(null)\"\n                  @click=\"handleSelectRoom(room.id)\"\n                >\n                  <div class=\"flex min-w-0 items-center gap-2\">\n                    <span\n                      :class=\"\n                        cn(\n                          'size-2 rounded-full transition-colors',\n                          selectedRoomId === room.id\n                            ? 'bg-primary'\n                            : hoveredRoomId === room.id\n                              ? 'bg-primary/70'\n                              : 'bg-muted-foreground/40',\n                        )\n                      \"\n                    ></span>\n                    <div>\n                      <p class=\"text-foreground text-xs font-medium\">{{ room.name }}</p>\n                      <p class=\"text-muted-foreground text-xs\">{{ room.flooring }}</p>\n                    </div>\n                  </div>\n\n                  <div class=\"shrink-0 text-right\">\n                    <p class=\"text-foreground font-mono text-xs font-semibold tabular-nums\">\n                      {{ unitSystem === 'imperial' ? room.dimensionsImperial : room.dimensionsMetric }}\n                    </p>\n                    <p class=\"text-muted-foreground font-mono text-xs tabular-nums\">\n                      {{ unitSystem === 'imperial' ? `${room.areaSqFt} sq ft` : `${room.areaSqM} m²` }}\n                    </p>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n\n        <!-- Available Units in Building Table -->\n        <AvailableUnitsTable\n          :plan=\"currentPlan\"\n          :selected-unit-number=\"selectedUnitNumber\"\n          :tour-success=\"showTourSuccess\"\n          @select-unit=\"handleSelectUnit\"\n          @schedule-tour=\"handleScheduleTour\"\n        />\n      </div>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/floor-plan-explorer/FloorPlanExplorer.vue"
    },
    {
      "path": "packages/registry-vue/blocks/floor-plan-explorer/FloorPlanCanvas.vue",
      "content": "<script setup lang=\"ts\">\nimport { Home, Layers, MapPin, Ruler } from 'lucide-vue-next'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card } from '@/components/ui/card'\nimport { cn } from '@/lib/utils'\nimport type { FloorPlanData, RoomSpec } from './floor-plan-explorer-types'\n\ndefineProps<{\n  plan: FloorPlanData\n  activeRoom: RoomSpec | null\n  unitSystem: 'imperial' | 'metric'\n  showDimensions: boolean\n  showFurniture: boolean\n  showPins: boolean\n  selectedRoomId: string | null\n  hoveredRoomId: string | null\n}>()\n\ndefineEmits<{\n  'toggle-dimensions': []\n  'toggle-furniture': []\n  'toggle-pins': []\n  'hover-room': [roomId: string | null]\n  'select-room': [roomId: string]\n}>()\n</script>\n\n<template>\n  <!-- Left Column: 2D Architectural Layout Canvas (7 cols) -->\n  <div class=\"space-y-4 lg:col-span-7\">\n    <Card class=\"border-border bg-card overflow-hidden shadow-xs\">\n      <!-- Canvas Toolbar Header -->\n      <div class=\"border-border bg-muted/30 flex flex-wrap items-center justify-between gap-3 border-b px-4 py-3\">\n        <div class=\"flex items-center gap-2.5\">\n          <span class=\"relative flex size-2\">\n            <span class=\"bg-primary/60 absolute inline-flex size-full rounded-full opacity-75\"></span>\n            <span class=\"bg-primary relative inline-flex size-2 rounded-full\"></span>\n          </span>\n          <div>\n            <p class=\"text-foreground text-xs font-medium\">2D Architectural CAD Schematic</p>\n            <p class=\"text-muted-foreground text-xs\">Interactive room layout & dimensional spans</p>\n          </div>\n        </div>\n\n        <!-- Canvas View Options -->\n        <div class=\"flex items-center gap-1.5\">\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            :class=\"cn('h-7 gap-1 px-2 text-xs', showDimensions && 'bg-muted text-foreground')\"\n            @click=\"$emit('toggle-dimensions')\"\n          >\n            <Ruler class=\"text-muted-foreground size-3\" />\n            <span>Dimensions</span>\n          </Button>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            :class=\"cn('h-7 gap-1 px-2 text-xs', showFurniture && 'bg-muted text-foreground')\"\n            @click=\"$emit('toggle-furniture')\"\n          >\n            <Layers class=\"text-muted-foreground size-3\" />\n            <span>Fixtures</span>\n          </Button>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            :class=\"cn('h-7 gap-1 px-2 text-xs', showPins && 'bg-muted text-foreground')\"\n            @click=\"$emit('toggle-pins')\"\n          >\n            <MapPin class=\"text-muted-foreground size-3\" />\n            <span>Pins</span>\n          </Button>\n        </div>\n      </div>\n\n      <!-- Canvas Drawing Surface -->\n      <div class=\"bg-card/95 relative p-3 sm:p-5\">\n        <svg\n          viewBox=\"0 0 680 430\"\n          class=\"border-border/70 bg-card w-full rounded border select-none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <defs>\n            <!-- Blueprint Architectural Grid Pattern -->\n            <pattern id=\"cad-grid-pattern\" width=\"20\" height=\"20\" patternUnits=\"userSpaceOnUse\">\n              <path d=\"M 20 0 L 0 0 0 20\" fill=\"none\" class=\"stroke-muted-foreground/10\" stroke-width=\"0.75\" />\n            </pattern>\n            <pattern id=\"cad-grid-major\" width=\"100\" height=\"100\" patternUnits=\"userSpaceOnUse\">\n              <rect width=\"100\" height=\"100\" fill=\"url(#cad-grid-pattern)\" />\n              <path d=\"M 100 0 L 0 0 0 100\" fill=\"none\" class=\"stroke-muted-foreground/20\" stroke-width=\"1.25\" />\n            </pattern>\n            <!-- Balcony / Terrace Wood Decking Pattern -->\n            <pattern id=\"deck-slats\" width=\"8\" height=\"8\" patternUnits=\"userSpaceOnUse\" patternTransform=\"rotate(45)\">\n              <line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"8\" class=\"stroke-muted-foreground/25\" stroke-width=\"1.5\" />\n            </pattern>\n          </defs>\n\n          <!-- Blueprint Grid Background -->\n          <rect width=\"680\" height=\"430\" fill=\"url(#cad-grid-major)\" />\n\n          <!-- North Arrow Compass Widget -->\n          <g transform=\"translate(635, 38)\" class=\"text-muted-foreground\">\n            <circle cx=\"0\" cy=\"0\" r=\"18\" fill=\"none\" class=\"stroke-border\" stroke-width=\"1.2\" />\n            <path d=\"M 0 -13 L 4 4 L 0 1 L -4 4 Z\" class=\"fill-primary\" />\n            <path d=\"M 0 1 L 4 4 L 0 13 L -4 4 Z\" class=\"fill-muted-foreground/30\" />\n            <text x=\"0\" y=\"-15\" text-anchor=\"middle\" class=\"fill-foreground font-mono text-xs font-bold\">N</text>\n          </g>\n\n          <!-- Scale Indicator Bar -->\n          <g transform=\"translate(25, 412)\" class=\"text-muted-foreground\">\n            <line x1=\"0\" y1=\"0\" x2=\"100\" y2=\"0\" class=\"stroke-foreground\" stroke-width=\"2\" />\n            <line x1=\"0\" y1=\"-4\" x2=\"0\" y2=\"4\" class=\"stroke-foreground\" stroke-width=\"2\" />\n            <line x1=\"50\" y1=\"-3\" x2=\"50\" y2=\"3\" class=\"stroke-foreground\" stroke-width=\"1.5\" />\n            <line x1=\"100\" y1=\"-4\" x2=\"100\" y2=\"4\" class=\"stroke-foreground\" stroke-width=\"2\" />\n            <text x=\"0\" y=\"-7\" class=\"fill-muted-foreground font-mono text-xs\">0</text>\n            <text x=\"46\" y=\"-7\" class=\"fill-muted-foreground font-mono text-xs\">10'</text>\n            <text x=\"94\" y=\"-7\" class=\"fill-muted-foreground font-mono text-xs\">20'</text>\n            <text x=\"115\" y=\"3\" class=\"fill-muted-foreground font-mono text-xs\">Scale 1/4\" = 1'0\"</text>\n          </g>\n\n          <!-- Architectural Rooms Layout Polygons -->\n          <g>\n            <template v-for=\"room in plan.rooms\" :key=\"room.id\">\n              <g\n                class=\"cursor-pointer transition-colors duration-200\"\n                @mouseenter=\"$emit('hover-room', room.id)\"\n                @mouseleave=\"$emit('hover-room', null)\"\n                @click=\"$emit('select-room', room.id)\"\n              >\n                <!-- Room Floor Fill -->\n                <rect\n                  :x=\"room.rect.x\"\n                  :y=\"room.rect.y\"\n                  :width=\"room.rect.w\"\n                  :height=\"room.rect.h\"\n                  :fill=\"room.id === 'balcony' || room.id === 'sky-terrace' ? 'url(#deck-slats)' : 'currentColor'\"\n                  :class=\"\n                    cn(\n                      'transition-colors duration-150',\n                      selectedRoomId === room.id || hoveredRoomId === room.id\n                        ? 'text-primary/15'\n                        : room.id === 'balcony' || room.id === 'sky-terrace'\n                          ? 'text-muted/60'\n                          : 'text-card',\n                    )\n                  \"\n                />\n\n                <!-- Room Border Perimeter -->\n                <rect\n                  :x=\"room.rect.x\"\n                  :y=\"room.rect.y\"\n                  :width=\"room.rect.w\"\n                  :height=\"room.rect.h\"\n                  fill=\"none\"\n                  :class=\"\n                    cn(\n                      'transition-colors duration-150',\n                      selectedRoomId === room.id\n                        ? 'stroke-primary stroke-[2.5]'\n                        : hoveredRoomId === room.id\n                          ? 'stroke-primary/70 stroke-[2]'\n                          : 'stroke-border/90 stroke-[1.5]',\n                    )\n                  \"\n                />\n\n                <!-- Architectural Fixtures Silhouette Layer -->\n                <g\n                  v-if=\"showFurniture\"\n                  class=\"stroke-muted-foreground/35 text-muted-foreground/20 pointer-events-none fill-none\"\n                >\n                  <!-- Living Room: Sofa & Coffee Table -->\n                  <template v-if=\"room.id === 'living' || room.id === 'grand-salon'\">\n                    <rect\n                      :x=\"room.rect.x + 24\"\n                      :y=\"room.rect.y + 24\"\n                      width=\"75\"\n                      height=\"40\"\n                      rx=\"4\"\n                      stroke-width=\"1.2\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <rect\n                      :x=\"room.rect.x + 38\"\n                      :y=\"room.rect.y + 72\"\n                      width=\"46\"\n                      height=\"24\"\n                      rx=\"2\"\n                      stroke-width=\"1.2\"\n                      class=\"stroke-muted-foreground/30\"\n                    />\n                    <line\n                      :x1=\"room.rect.x + 130\"\n                      :y1=\"room.rect.y + 20\"\n                      :x2=\"room.rect.x + 130\"\n                      :y2=\"room.rect.y + 110\"\n                      stroke-dasharray=\"3 3\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/20\"\n                    />\n                  </template>\n\n                  <!-- Bedroom: Bed Silhouette & Pillows -->\n                  <template\n                    v-if=\"\n                      room.id === 'master-bed' ||\n                      room.id === 'guest-bed' ||\n                      room.id === 'primary-suite' ||\n                      room.id === 'bed-2'\n                    \"\n                  >\n                    <rect\n                      :x=\"room.rect.x + 20\"\n                      :y=\"room.rect.y + 25\"\n                      width=\"60\"\n                      height=\"75\"\n                      rx=\"3\"\n                      stroke-width=\"1.2\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <rect\n                      :x=\"room.rect.x + 26\"\n                      :y=\"room.rect.y + 30\"\n                      width=\"20\"\n                      height=\"14\"\n                      rx=\"2\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/30\"\n                    />\n                    <rect\n                      :x=\"room.rect.x + 54\"\n                      :y=\"room.rect.y + 30\"\n                      width=\"20\"\n                      height=\"14\"\n                      rx=\"2\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/30\"\n                    />\n                    <line\n                      :x1=\"room.rect.x + 20\"\n                      :y1=\"room.rect.y + 55\"\n                      :x2=\"room.rect.x + 80\"\n                      :y2=\"room.rect.y + 55\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/20\"\n                    />\n                  </template>\n\n                  <!-- Kitchen: Island & Cooktop / Prep Sink -->\n                  <template v-if=\"room.id === 'kitchen'\">\n                    <rect\n                      :x=\"room.rect.x + 18\"\n                      :y=\"room.rect.y + 20\"\n                      width=\"85\"\n                      height=\"36\"\n                      rx=\"2\"\n                      stroke-width=\"1.2\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <circle\n                      :cx=\"room.rect.x + 38\"\n                      :cy=\"room.rect.y + 38\"\n                      r=\"6\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <circle\n                      :cx=\"room.rect.x + 56\"\n                      :cy=\"room.rect.y + 38\"\n                      r=\"6\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <rect\n                      :x=\"room.rect.x + 72\"\n                      :y=\"room.rect.y + 30\"\n                      width=\"18\"\n                      height=\"16\"\n                      rx=\"1\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/30\"\n                    />\n                  </template>\n\n                  <!-- Bathrooms: Tub / Shower & Vanity -->\n                  <template v-if=\"room.id === 'master-bath' || room.id === 'guest-bath' || room.id === 'spa-bath'\">\n                    <rect\n                      :x=\"room.rect.x + 12\"\n                      :y=\"room.rect.y + 15\"\n                      width=\"38\"\n                      height=\"50\"\n                      rx=\"6\"\n                      stroke-width=\"1.2\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                    <circle\n                      :cx=\"room.rect.x + 31\"\n                      :cy=\"room.rect.y + 40\"\n                      r=\"3\"\n                      stroke-width=\"1\"\n                      class=\"stroke-muted-foreground/40\"\n                    />\n                  </template>\n\n                  <!-- Balcony: Railing Post Accents -->\n                  <template v-if=\"room.id === 'balcony' || room.id === 'sky-terrace'\">\n                    <line\n                      :x1=\"room.rect.x\"\n                      :y1=\"room.rect.y\"\n                      :x2=\"room.rect.x\"\n                      :y2=\"room.rect.y + room.rect.h\"\n                      stroke-width=\"3\"\n                      class=\"stroke-primary/50\"\n                    />\n                  </template>\n                </g>\n\n                <!-- Dimension Leader Line Callouts -->\n                <g v-if=\"showDimensions\" class=\"pointer-events-none select-none\">\n                  <!-- Room Dimension Text -->\n                  <text\n                    :x=\"room.pinX\"\n                    :y=\"room.pinY + 16\"\n                    text-anchor=\"middle\"\n                    class=\"fill-muted-foreground font-mono text-xs font-medium\"\n                  >\n                    {{ unitSystem === 'imperial' ? room.dimensionsImperial : room.dimensionsMetric }}\n                  </text>\n                </g>\n              </g>\n            </template>\n          </g>\n\n          <!-- Outer Perimeter Heavy Structural Walls -->\n          <g class=\"pointer-events-none\">\n            <!-- Windows with Glass Double Thin Lines -->\n            <line x1=\"160\" y1=\"75\" x2=\"380\" y2=\"75\" class=\"stroke-sky-400 dark:stroke-sky-300\" stroke-width=\"2.5\" />\n            <line x1=\"390\" y1=\"75\" x2=\"540\" y2=\"75\" class=\"stroke-sky-400 dark:stroke-sky-300\" stroke-width=\"2.5\" />\n            <line x1=\"550\" y1=\"75\" x2=\"635\" y2=\"75\" class=\"stroke-sky-400 dark:stroke-sky-300\" stroke-width=\"2.5\" />\n          </g>\n\n          <!-- Interactive Room Highlight Pins -->\n          <g v-if=\"showPins\">\n            <template v-for=\"room in plan.rooms\" :key=\"`pin-${room.id}`\">\n              <g\n                :transform=\"`translate(${room.pinX}, ${room.pinY - 8})`\"\n                class=\"cursor-pointer transition-transform duration-150\"\n                @mouseenter=\"$emit('hover-room', room.id)\"\n                @mouseleave=\"$emit('hover-room', null)\"\n                @click=\"$emit('select-room', room.id)\"\n              >\n                <!-- Pulsing Halo on Selected -->\n                <circle\n                  v-if=\"selectedRoomId === room.id || hoveredRoomId === room.id\"\n                  cx=\"0\"\n                  cy=\"0\"\n                  r=\"16\"\n                  class=\"fill-primary/30\"\n                />\n\n                <!-- Pin Badge Background Pill -->\n                <rect\n                  x=\"-48\"\n                  y=\"-12\"\n                  width=\"96\"\n                  height=\"24\"\n                  rx=\"12\"\n                  :class=\"\n                    cn(\n                      'transition-colors duration-150',\n                      selectedRoomId === room.id\n                        ? 'fill-primary stroke-primary-foreground stroke-1 shadow-md'\n                        : hoveredRoomId === room.id\n                          ? 'fill-foreground stroke-background stroke-1'\n                          : 'fill-card/90 stroke-border stroke-1 shadow-xs backdrop-blur-xs',\n                    )\n                  \"\n                />\n\n                <!-- Pin Label Text -->\n                <text\n                  x=\"0\"\n                  y=\"4\"\n                  text-anchor=\"middle\"\n                  :class=\"\n                    cn(\n                      'font-mono text-xs font-semibold select-none',\n                      selectedRoomId === room.id\n                        ? 'fill-primary-foreground'\n                        : hoveredRoomId === room.id\n                          ? 'fill-background'\n                          : 'fill-foreground',\n                    )\n                  \"\n                >\n                  {{ room.shortLabel }}\n                </text>\n              </g>\n            </template>\n          </g>\n        </svg>\n      </div>\n\n      <!-- Canvas Footer Status / Active Room Info -->\n      <div class=\"border-border bg-muted/20 flex flex-wrap items-center justify-between gap-3 border-t px-4 py-3\">\n        <div class=\"flex items-center gap-2\">\n          <Badge variant=\"outline\" class=\"gap-1 font-mono text-xs font-normal\">\n            <Home class=\"text-primary size-3\" />\n            Active Focus: {{ activeRoom?.name || 'Overview' }}\n          </Badge>\n          <span class=\"text-muted-foreground text-xs\">\n            {{ unitSystem === 'imperial' ? activeRoom?.dimensionsImperial : activeRoom?.dimensionsMetric }} ·\n            <span class=\"text-foreground font-mono font-medium tabular-nums\">\n              {{ unitSystem === 'imperial' ? `${activeRoom?.areaSqFt} Sq Ft` : `${activeRoom?.areaSqM} m²` }}\n            </span>\n          </span>\n        </div>\n\n        <div class=\"text-muted-foreground flex items-center gap-2 text-xs\">\n          <span class=\"hidden sm:inline\">Finish:</span>\n          <span class=\"text-foreground font-medium\">{{ activeRoom?.flooring }}</span>\n        </div>\n      </div>\n    </Card>\n\n    <!-- Floor Plan Features / Highlights Strip -->\n    <div class=\"grid grid-cols-1 gap-3 sm:grid-cols-2 md:grid-cols-4\">\n      <div class=\"border-border bg-card rounded-lg border p-3 shadow-xs\">\n        <p class=\"text-muted-foreground text-xs\">Ceiling Height</p>\n        <p class=\"text-foreground mt-0.5 font-mono text-sm font-semibold tabular-nums\">\n          {{ plan.ceilingHeight }}\n        </p>\n      </div>\n      <div class=\"border-border bg-card rounded-lg border p-3 shadow-xs\">\n        <p class=\"text-muted-foreground text-xs\">Outdoor Space</p>\n        <p class=\"text-foreground mt-0.5 font-mono text-sm font-semibold tabular-nums\">\n          {{\n            unitSystem === 'imperial' ? `${plan.exteriorSqFt} Sq Ft` : `${(plan.exteriorSqFt * 0.0929).toFixed(1)} m²`\n          }}\n        </p>\n      </div>\n      <div class=\"border-border bg-card rounded-lg border p-3 shadow-xs\">\n        <p class=\"text-muted-foreground text-xs\">Exposure</p>\n        <p class=\"text-foreground mt-0.5 text-xs font-medium\">{{ plan.exposure }}</p>\n      </div>\n      <div class=\"border-border bg-card rounded-lg border p-3 shadow-xs\">\n        <p class=\"text-muted-foreground text-xs\">Starting Rent</p>\n        <p class=\"text-foreground mt-0.5 font-mono text-sm font-semibold tabular-nums\">\n          ${{ plan.startingRent.toLocaleString() }}<span class=\"text-muted-foreground text-xs font-normal\">/mo</span>\n        </p>\n      </div>\n    </div>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/floor-plan-explorer/FloorPlanCanvas.vue"
    },
    {
      "path": "packages/registry-vue/blocks/floor-plan-explorer/AvailableUnitsTable.vue",
      "content": "<script setup lang=\"ts\">\nimport { Calendar, CheckCircle2, FileText } from 'lucide-vue-next'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport { cn } from '@/lib/utils'\nimport type { FloorPlanData } from './floor-plan-explorer-types'\n\ndefineProps<{\n  plan: FloorPlanData\n  selectedUnitNumber: string\n  tourSuccess: boolean\n}>()\n\ndefineEmits<{\n  'select-unit': [unitNumber: string]\n  'schedule-tour': []\n}>()\n</script>\n\n<template>\n  <!-- Available Units in Building Table -->\n  <Card class=\"border-border bg-card shadow-xs\">\n    <CardHeader class=\"pb-3\">\n      <div class=\"flex flex-wrap items-center justify-between\">\n        <div>\n          <CardTitle class=\"text-sm font-semibold tracking-tight sm:text-base\"> Available Units in Building </CardTitle>\n          <CardDescription class=\"text-xs\">\n            Real-time occupancy and lease rates for {{ plan.tabLabel }}\n          </CardDescription>\n        </div>\n        <Badge variant=\"outline\" class=\"font-mono text-xs\">\n          {{ plan.availableUnits.filter((u) => u.status !== 'leased').length }} Available\n        </Badge>\n      </div>\n    </CardHeader>\n\n    <CardContent class=\"p-0\">\n      <div class=\"overflow-x-auto\">\n        <Table>\n          <TableHeader>\n            <TableRow class=\"hover:bg-transparent\">\n              <TableHead class=\"w-[80px] text-xs font-medium\">Unit</TableHead>\n              <TableHead class=\"text-xs font-medium\">Floor & View</TableHead>\n              <TableHead class=\"text-right text-xs font-medium\">Monthly Rent</TableHead>\n              <TableHead class=\"text-right text-xs font-medium\">Status</TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            <TableRow\n              v-for=\"unit in plan.availableUnits\"\n              :key=\"unit.unitNumber\"\n              :class=\"\n                cn(\n                  'cursor-pointer text-xs transition-colors',\n                  selectedUnitNumber === unit.unitNumber ? 'bg-muted/80 font-medium' : 'hover:bg-muted/40',\n                )\n              \"\n              @click=\"$emit('select-unit', unit.unitNumber)\"\n            >\n              <TableCell class=\"text-foreground font-mono font-semibold tabular-nums\">\n                Unit {{ unit.unitNumber }}\n              </TableCell>\n              <TableCell>\n                <div class=\"text-foreground text-xs\">{{ unit.view }}</div>\n                <div class=\"text-muted-foreground text-xs\">Floor {{ unit.floor }} · {{ unit.exposure }}</div>\n              </TableCell>\n              <TableCell class=\"text-foreground text-right font-mono font-semibold tabular-nums\">\n                ${{ unit.monthlyRent.toLocaleString() }}\n                <span class=\"text-muted-foreground font-normal\">/mo</span>\n              </TableCell>\n              <TableCell class=\"text-right\">\n                <Badge\n                  v-if=\"unit.status === 'available-now'\"\n                  class=\"border-success/20 bg-success/10 text-success text-xs font-normal\"\n                >\n                  {{ unit.statusLabel }}\n                </Badge>\n                <Badge\n                  v-else-if=\"unit.status === 'available-soon'\"\n                  class=\"border-info/20 bg-info/10 text-info text-xs font-normal\"\n                >\n                  {{ unit.statusLabel }}\n                </Badge>\n                <Badge\n                  v-else-if=\"unit.status === 'under-contract'\"\n                  class=\"border-warning/20 bg-warning/10 text-warning text-xs font-normal\"\n                >\n                  {{ unit.statusLabel }}\n                </Badge>\n                <Badge v-else variant=\"secondary\" class=\"text-muted-foreground text-xs font-normal\">\n                  {{ unit.statusLabel }}\n                </Badge>\n              </TableCell>\n            </TableRow>\n          </TableBody>\n        </Table>\n      </div>\n    </CardContent>\n\n    <CardFooter class=\"border-border flex flex-col gap-2.5 border-t pt-4\">\n      <div class=\"flex w-full flex-col gap-2 sm:flex-row\">\n        <Button class=\"w-full gap-2 text-xs sm:flex-1\" @click=\"$emit('schedule-tour')\">\n          <Calendar class=\"size-3.5\" />\n          <span>Schedule Private Showing</span>\n        </Button>\n        <Button variant=\"outline\" class=\"w-full gap-2 text-xs sm:flex-1\" @click=\"$emit('schedule-tour')\">\n          <FileText class=\"size-3.5\" />\n          <span>Apply for Unit</span>\n        </Button>\n      </div>\n\n      <div\n        v-if=\"tourSuccess\"\n        class=\"bg-success/10 text-success flex w-full items-center gap-2 rounded-md p-2.5 text-xs\"\n      >\n        <CheckCircle2 class=\"size-4 shrink-0\" />\n        <span\n          >Tour request received for Unit {{ selectedUnitNumber }}. Leasing agent will contact you within 15\n          minutes.</span\n        >\n      </div>\n\n      <p class=\"text-muted-foreground text-center text-xs\">\n        Self-guided tours and agent-accompanied showings available daily 9:00 AM – 7:00 PM.\n      </p>\n    </CardFooter>\n  </Card>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/floor-plan-explorer/AvailableUnitsTable.vue"
    },
    {
      "path": "packages/registry-vue/blocks/floor-plan-explorer/floor-plan-explorer-data.ts",
      "content": "import type { FloorPlanData } from './floor-plan-explorer-types'\n\nexport const floorPlans: Record<string, FloorPlanData> = {\n  'plan-a': {\n    id: 'plan-a',\n    tabKey: 'plan-a',\n    tabLabel: 'Plan A - 1 Bed / 1 Bath',\n    marketingName: 'Plan A - The Urban Haven',\n    tier: 'Urban Gallery Residence',\n    beds: 1,\n    baths: 1,\n    totalAreaSqFt: 780,\n    totalAreaSqM: 72.5,\n    interiorSqFt: 735,\n    exteriorSqFt: 45,\n    ceilingHeight: `10' 0\" Finished`,\n    exposure: 'East · Garden & Sunrise',\n    startingRent: 3450,\n    description:\n      'Artfully designed open-concept layout featuring oversized east-facing windows, gourmet galley kitchen with quartz surfaces, secluded bedroom suite with walk-in closet, and a private sunrise terrace.',\n    highlights: [\n      'Floor-to-ceiling glass wall',\n      'European quartz kitchen island',\n      'Deep soaking tub & frameless shower',\n      'Private sunrise terrace',\n    ],\n    rooms: [\n      {\n        id: 'living',\n        name: 'Living & Dining Room',\n        shortLabel: 'Living / Dining',\n        dimensionsImperial: `16' × 12'`,\n        dimensionsMetric: '4.9m × 3.7m',\n        areaSqFt: 192,\n        areaSqM: 17.8,\n        flooring: 'Wide Plank Natural White Oak',\n        features: ['East Sunrise Exposure', '9-Foot Glazing Wall', 'Concealed Media Wiring'],\n        pinX: 280,\n        pinY: 175,\n        rect: { x: 170, y: 90, w: 230, h: 170 },\n      },\n      {\n        id: 'master-bed',\n        name: 'Master Bedroom',\n        shortLabel: 'Master Bed',\n        dimensionsImperial: `13' × 11'`,\n        dimensionsMetric: '4.0m × 3.4m',\n        areaSqFt: 143,\n        areaSqM: 13.3,\n        flooring: 'Plush Organic Wool Loop',\n        features: ['Acoustic Insulation', 'Custom Closet Built-ins', 'Blackout Shade Pocket'],\n        pinX: 505,\n        pinY: 175,\n        rect: { x: 410, y: 90, w: 190, h: 170 },\n      },\n      {\n        id: 'kitchen',\n        name: 'Gourmet Galley Kitchen',\n        shortLabel: 'Kitchen',\n        dimensionsImperial: `11' × 9'`,\n        dimensionsMetric: '3.4m × 2.7m',\n        areaSqFt: 99,\n        areaSqM: 9.2,\n        flooring: 'Calacatta Honed Quartzite',\n        features: ['Integrated Bosch Appliances', 'Undermount LED Lights', 'Soft-Close Walnut Joinery'],\n        pinX: 280,\n        pinY: 330,\n        rect: { x: 170, y: 270, w: 230, h: 120 },\n      },\n      {\n        id: 'master-bath',\n        name: 'Primary Full Bath',\n        shortLabel: 'Full Bath',\n        dimensionsImperial: `9' × 6'`,\n        dimensionsMetric: '2.7m × 1.8m',\n        areaSqFt: 54,\n        areaSqM: 5.0,\n        flooring: 'Matte Slate & Terrazzo',\n        features: ['Kohler Undermount Sink', 'Frameless Glass Shower', 'Backlit Anti-Fog Vanity'],\n        pinX: 505,\n        pinY: 330,\n        rect: { x: 410, y: 270, w: 190, h: 120 },\n      },\n      {\n        id: 'balcony',\n        name: 'Private Terrace',\n        shortLabel: 'Terrace',\n        dimensionsImperial: `9' × 5'`,\n        dimensionsMetric: '2.7m × 1.5m',\n        areaSqFt: 45,\n        areaSqM: 4.2,\n        flooring: 'Weathered Teak Decking',\n        features: ['Architectural Steel Railing', 'Exterior Power Outlet', 'Garden Courtyard Vistas'],\n        pinX: 105,\n        pinY: 175,\n        rect: { x: 50, y: 90, w: 110, h: 170 },\n      },\n    ],\n    availableUnits: [\n      {\n        unitNumber: '304',\n        floor: 3,\n        view: 'Courtyard & Garden',\n        monthlyRent: 3450,\n        sqFt: 780,\n        status: 'available-now',\n        statusLabel: 'Available Now',\n        moveInDate: 'Immediate',\n        exposure: 'East',\n      },\n      {\n        unitNumber: '604',\n        floor: 6,\n        view: 'Skyline Sunrise View',\n        monthlyRent: 3650,\n        sqFt: 780,\n        status: 'available-soon',\n        statusLabel: 'Available Oct 15',\n        moveInDate: 'Oct 15, 2026',\n        exposure: 'East / North',\n      },\n      {\n        unitNumber: '904',\n        floor: 9,\n        view: 'High-Floor Park View',\n        monthlyRent: 3800,\n        sqFt: 780,\n        status: 'leased',\n        statusLabel: 'Leased',\n        moveInDate: 'Occupied',\n        exposure: 'East',\n      },\n    ],\n  },\n  'plan-b': {\n    id: 'plan-b',\n    tabKey: 'plan-b',\n    tabLabel: 'Plan B - 2 Bed / 2 Bath',\n    marketingName: 'Plan B - The Skyline Suite',\n    tier: 'Signature Corner Residence',\n    beds: 2,\n    baths: 2,\n    totalAreaSqFt: 1420,\n    totalAreaSqM: 132.0,\n    interiorSqFt: 1360,\n    exteriorSqFt: 60,\n    ceilingHeight: `10' 6\" Finished`,\n    exposure: 'Southwest · Bay & City Skyline',\n    startingRent: 4850,\n    description:\n      'Expansive dual-exposure residence centered around a dramatic living and entertaining salon with floor-to-ceiling panoramic glass, chef-grade kitchen island, split master and guest wings, and a sheltered private terrace.',\n    highlights: [\n      'Dual-aspect corner positioning with 270° light',\n      'Chef island with 10-foot marble waterfall',\n      'Primary wing with dual walk-in closets',\n      'Dedicated foyer vestibule & utility pantry',\n    ],\n    rooms: [\n      {\n        id: 'living',\n        name: 'Living Room',\n        shortLabel: 'Living Room',\n        dimensionsImperial: `18' × 14'`,\n        dimensionsMetric: '5.5m × 4.3m',\n        areaSqFt: 252,\n        areaSqM: 23.4,\n        flooring: 'Wide Plank European White Oak',\n        features: ['Floor-to-Ceiling Corner Glazing', 'Motorized Solar Shades', 'Recessed Architectural Lighting'],\n        pinX: 255,\n        pinY: 160,\n        rect: { x: 150, y: 75, w: 220, h: 175 },\n      },\n      {\n        id: 'master-bed',\n        name: 'Master Bedroom',\n        shortLabel: 'Master Bed',\n        dimensionsImperial: `15' × 12'`,\n        dimensionsMetric: '4.6m × 3.7m',\n        areaSqFt: 180,\n        areaSqM: 16.7,\n        flooring: 'New Zealand Wool Weave',\n        features: ['South Bay Views', 'Direct En-Suite Access', 'Custom Millwork Wardrobe'],\n        pinX: 455,\n        pinY: 145,\n        rect: { x: 380, y: 75, w: 155, h: 150 },\n      },\n      {\n        id: 'kitchen',\n        name: 'Chef Kitchen & Dining',\n        shortLabel: 'Kitchen',\n        dimensionsImperial: `12' × 10'`,\n        dimensionsMetric: '3.7m × 3.0m',\n        areaSqFt: 120,\n        areaSqM: 11.1,\n        flooring: 'Calacatta Honed Quartzite',\n        features: ['Waterfall Marble Island', 'Sub-Zero & Wolf Appliances', 'Pantry Cabinetry'],\n        pinX: 255,\n        pinY: 325,\n        rect: { x: 150, y: 260, w: 220, h: 135 },\n      },\n      {\n        id: 'master-bath',\n        name: 'Master Bath',\n        shortLabel: 'Master Bath',\n        dimensionsImperial: `10' × 8'`,\n        dimensionsMetric: '3.0m × 2.4m',\n        areaSqFt: 80,\n        areaSqM: 7.4,\n        flooring: 'Bianco Carrara Marble',\n        features: ['Dual Floating Vanities', 'Walk-in Rain Shower', 'Acoustic Privacy Door'],\n        pinX: 590,\n        pinY: 145,\n        rect: { x: 545, y: 75, w: 90, h: 150 },\n      },\n      {\n        id: 'guest-bed',\n        name: 'Guest Bedroom / Study',\n        shortLabel: 'Guest Bed',\n        dimensionsImperial: `13' × 11'`,\n        dimensionsMetric: '4.0m × 3.4m',\n        areaSqFt: 143,\n        areaSqM: 13.3,\n        flooring: 'Wide Plank European White Oak',\n        features: ['Multi-Function Home Office', 'South Window Exposure', 'Built-in Closet System'],\n        pinX: 565,\n        pinY: 320,\n        rect: { x: 490, y: 245, w: 145, h: 150 },\n      },\n      {\n        id: 'guest-bath',\n        name: 'Guest Full Bath',\n        shortLabel: 'Guest Bath',\n        dimensionsImperial: `8' × 6'`,\n        dimensionsMetric: '2.4m × 1.8m',\n        areaSqFt: 48,\n        areaSqM: 4.5,\n        flooring: 'Smoked Gray Terrazzo',\n        features: ['Full Soaking Tub', 'Modern Matte Black Fixtures', 'Linen Storage'],\n        pinX: 430,\n        pinY: 320,\n        rect: { x: 380, y: 245, w: 100, h: 150 },\n      },\n      {\n        id: 'balcony',\n        name: 'Private Terrace',\n        shortLabel: 'Terrace',\n        dimensionsImperial: `10' × 6'`,\n        dimensionsMetric: '3.0m × 1.8m',\n        areaSqFt: 60,\n        areaSqM: 5.6,\n        flooring: 'Architectural Ipe Wood',\n        features: ['Panoramic Bay Overlook', 'Weatherproof Recessed Sconces', 'Glass Wind Guard'],\n        pinX: 90,\n        pinY: 160,\n        rect: { x: 40, y: 75, w: 100, h: 175 },\n      },\n    ],\n    availableUnits: [\n      {\n        unitNumber: '402',\n        floor: 4,\n        view: 'South City View',\n        monthlyRent: 4850,\n        sqFt: 1420,\n        status: 'available-now',\n        statusLabel: 'Available Now',\n        moveInDate: 'Immediate',\n        exposure: 'South / West',\n      },\n      {\n        unitNumber: '708',\n        floor: 7,\n        view: 'Bay & Marina View',\n        monthlyRent: 5200,\n        sqFt: 1420,\n        status: 'available-soon',\n        statusLabel: 'Available Sep 1',\n        moveInDate: 'Sep 1, 2026',\n        exposure: 'Bay View / South',\n      },\n      {\n        unitNumber: '1102',\n        floor: 11,\n        view: 'Penthouse Level Panoramic',\n        monthlyRent: 5600,\n        sqFt: 1420,\n        status: 'leased',\n        statusLabel: 'Leased',\n        moveInDate: 'Occupied',\n        exposure: 'Panoramic South',\n      },\n    ],\n  },\n  'plan-c': {\n    id: 'plan-c',\n    tabKey: 'plan-c',\n    tabLabel: 'Plan C - 3 Bed Penthouse',\n    marketingName: 'Plan C - The Grandview Penthouse',\n    tier: 'Crown Estate Penthouse',\n    beds: 3,\n    baths: 3.5,\n    totalAreaSqFt: 2250,\n    totalAreaSqM: 209.0,\n    interiorSqFt: 2090,\n    exteriorSqFt: 160,\n    ceilingHeight: `11' 8\" Finished`,\n    exposure: '360° Panoramic · Harbor, Bay & Bridges',\n    startingRent: 9400,\n    description:\n      'A true architectural masterpiece occupying the top levels of the tower. Direct key-lock private elevator access opens into a sweeping grand salon with 11.5-foot ceilings, full culinary kitchen with butler pantry, spa sanctuary primary suite, and wraparound sky terrace.',\n    highlights: [\n      'Private elevator vestibule with secure biometric access',\n      'Wraparound sky terrace with built-in gas fire table',\n      'Primary retreat with double walk-in dressing galleries',\n      'Butler service pantry with climate-controlled wine vault',\n    ],\n    rooms: [\n      {\n        id: 'grand-salon',\n        name: 'Grand Salon & Living',\n        shortLabel: 'Grand Salon',\n        dimensionsImperial: `24' × 16'`,\n        dimensionsMetric: '7.3m × 4.9m',\n        areaSqFt: 384,\n        areaSqM: 35.7,\n        flooring: 'Herringbone European Oak',\n        features: ['360° Bay Vista Glazing', 'Gas Linear Fireplace', 'Custom Architectural Coving'],\n        pinX: 275,\n        pinY: 155,\n        rect: { x: 160, y: 85, w: 240, h: 150 },\n      },\n      {\n        id: 'primary-suite',\n        name: 'Primary Penthouse Suite',\n        shortLabel: 'Primary Suite',\n        dimensionsImperial: `18' × 14'`,\n        dimensionsMetric: '5.5m × 4.3m',\n        areaSqFt: 252,\n        areaSqM: 23.4,\n        flooring: 'Custom Silk-Wool Blend Weave',\n        features: ['Harbor Sunrise Exposure', 'Sitting Lounge Area', 'Dual Walk-in Closets'],\n        pinX: 480,\n        pinY: 155,\n        rect: { x: 410, y: 85, w: 140, h: 150 },\n      },\n      {\n        id: 'spa-bath',\n        name: 'Spa Sanctuary Primary Bath',\n        shortLabel: 'Spa Bath',\n        dimensionsImperial: `12' × 9'`,\n        dimensionsMetric: '3.7m × 2.7m',\n        areaSqFt: 108,\n        areaSqM: 10.0,\n        flooring: 'Bookmatched Calacatta Marble',\n        features: ['Freestanding Oval Soaking Tub', 'Dual Steam Shower', 'Radiant Heated Flooring'],\n        pinX: 595,\n        pinY: 155,\n        rect: { x: 560, y: 85, w: 80, h: 150 },\n      },\n      {\n        id: 'dining',\n        name: 'Formal Dining Gallery',\n        shortLabel: 'Dining Room',\n        dimensionsImperial: `15' × 12'`,\n        dimensionsMetric: '4.6m × 3.7m',\n        areaSqFt: 180,\n        areaSqM: 16.7,\n        flooring: 'Herringbone European Oak',\n        features: ['Seating for 10-12 Guests', 'Integrated Bar Cabinetry', 'Designer Chandelier Anchor'],\n        pinX: 235,\n        pinY: 315,\n        rect: { x: 160, y: 245, w: 150, h: 145 },\n      },\n      {\n        id: 'kitchen',\n        name: 'Culinary Kitchen & Pantry',\n        shortLabel: 'Kitchen',\n        dimensionsImperial: `16' × 11'`,\n        dimensionsMetric: '4.9m × 3.4m',\n        areaSqFt: 176,\n        areaSqM: 16.3,\n        flooring: 'Taj Mahal Quartzite',\n        features: ['12-Foot Monolithic Island', 'Gaggenau 400 Series Suite', 'Butler Prep Scullery'],\n        pinX: 95,\n        pinY: 315,\n        rect: { x: 40, y: 245, w: 110, h: 145 },\n      },\n      {\n        id: 'bed-2',\n        name: 'Bedroom Suite 2',\n        shortLabel: 'Bed 2 Suite',\n        dimensionsImperial: `14' × 12'`,\n        dimensionsMetric: '4.3m × 3.7m',\n        areaSqFt: 168,\n        areaSqM: 15.6,\n        flooring: 'Wide Plank European Oak',\n        features: ['En-Suite Private Bath', 'South Window Bank', 'Deep Built-in Wardrobe'],\n        pinX: 395,\n        pinY: 315,\n        rect: { x: 320, y: 245, w: 150, h: 145 },\n      },\n      {\n        id: 'bed-3',\n        name: 'Bedroom 3 / Executive Study',\n        shortLabel: 'Bed 3 / Study',\n        dimensionsImperial: `13' × 11'`,\n        dimensionsMetric: '4.0m × 3.4m',\n        areaSqFt: 143,\n        areaSqM: 13.3,\n        flooring: 'Custom Walnut Parquetry',\n        features: ['Integrated Library Shelving', 'Acoustic Pocket Doors', 'Corner View Light'],\n        pinX: 560,\n        pinY: 315,\n        rect: { x: 480, y: 245, w: 160, h: 145 },\n      },\n      {\n        id: 'sky-terrace',\n        name: 'Wraparound Sky Terrace',\n        shortLabel: 'Sky Terrace',\n        dimensionsImperial: `20' × 8'`,\n        dimensionsMetric: '6.1m × 2.4m',\n        areaSqFt: 160,\n        areaSqM: 14.9,\n        flooring: 'Porcelain Pavers & Teak',\n        features: ['Integrated Linear Gas Hearth', 'Outdoor Audio Pre-Wire', 'Frameless Wind Barrier'],\n        pinX: 340,\n        pinY: 45,\n        rect: { x: 160, y: 25, w: 360, h: 50 },\n      },\n    ],\n    availableUnits: [\n      {\n        unitNumber: 'PH-01',\n        floor: 14,\n        view: '360° Bay & City Skyline',\n        monthlyRent: 9400,\n        sqFt: 2250,\n        status: 'available-now',\n        statusLabel: 'Available Now',\n        moveInDate: 'Immediate',\n        exposure: '360° Panoramic',\n      },\n      {\n        unitNumber: 'PH-02',\n        floor: 14,\n        view: 'Harbor Sunrise & Marina',\n        monthlyRent: 9100,\n        sqFt: 2250,\n        status: 'under-contract',\n        statusLabel: 'Under Contract',\n        moveInDate: 'Pending',\n        exposure: 'East / South',\n      },\n      {\n        unitNumber: 'PH-03',\n        floor: 15,\n        view: 'Crown Sky Penthouse with Spa',\n        monthlyRent: 10500,\n        sqFt: 2250,\n        status: 'available-soon',\n        statusLabel: 'Available Nov 1',\n        moveInDate: 'Nov 1, 2026',\n        exposure: 'Crown Panoramic',\n      },\n    ],\n  },\n}\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/floor-plan-explorer/floor-plan-explorer-data.ts"
    },
    {
      "path": "packages/registry-vue/blocks/floor-plan-explorer/floor-plan-explorer-types.ts",
      "content": "export interface RoomSpec {\n  id: string\n  name: string\n  shortLabel: string\n  dimensionsImperial: string\n  dimensionsMetric: string\n  areaSqFt: number\n  areaSqM: number\n  flooring: string\n  features: string[]\n  pinX: number\n  pinY: number\n  rect: {\n    x: number\n    y: number\n    w: number\n    h: number\n  }\n}\n\nexport interface AvailableUnit {\n  unitNumber: string\n  floor: number\n  view: string\n  monthlyRent: number\n  sqFt: number\n  status: 'available-now' | 'available-soon' | 'leased' | 'under-contract'\n  statusLabel: string\n  moveInDate: string\n  exposure: string\n}\n\nexport interface FloorPlanData {\n  id: string\n  tabKey: string\n  tabLabel: string\n  marketingName: string\n  tier: string\n  beds: number\n  baths: number\n  totalAreaSqFt: number\n  totalAreaSqM: number\n  interiorSqFt: number\n  exteriorSqFt: number\n  ceilingHeight: string\n  exposure: string\n  startingRent: number\n  description: string\n  highlights: string[]\n  rooms: RoomSpec[]\n  availableUnits: AvailableUnit[]\n}\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/floor-plan-explorer/floor-plan-explorer-types.ts"
    }
  ],
  "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",
    "https://uipkge.dev/r/vue/tabs.json"
  ],
  "description": "Architectural unit floor plan inspector and residential layout explorer with 2D CAD-styled blueprint canvas, interactive room highlight pins, dimensional callouts, room breakdown specs, and building unit availability table.",
  "categories": [
    "real-estate",
    "app",
    "hospitality",
    "dashboard"
  ]
}