Fix: block registry dependencies

public/r/analytics-map.json

@@ -8,14 +8,14 @@
     "lucide-react"
   ],
   "registryDependencies": [
-    "map",
+    "@mapcn/map",
     "card",
     "chart"
   ],
   "files": [
     {
       "path": "src/registry/blocks/analytics-map/page.tsx",
-      "content": "\"use client\";\n\nimport {\n  Map,\n  MapControls,\n  MapMarker,\n  MarkerContent,\n  MarkerTooltip,\n} from \"@/components/ui/map\";\nimport { OverviewCard } from \"./components/overview-card\";\nimport { BreakdownCard } from \"./components/breakdown-card\";\nimport {\n  locations,\n  visitedPagesRows,\n  countriesRows,\n  referrersRows,\n  browsersRows,\n} from \"./data\";\n\nconst MAP_HEIGHT = \"38rem\";\n\nexport function AnalyticsMapBlock() {\n  return (\n    <div\n      className=\"bg-background relative min-h-screen\"\n      style={{ \"--map-height\": MAP_HEIGHT } as React.CSSProperties}\n    >\n      <div className=\"relative h-(--map-height)\">\n        <Map\n          center={[-2, 16]}\n          zoom={1.5}\n          scrollZoom={false}\n          renderWorldCopies={true}\n        >\n          <MapControls showFullscreen />\n          {locations.map((location) => (\n            <MapMarker\n              key={location.city}\n              longitude={location.lng}\n              latitude={location.lat}\n            >\n              <MarkerContent>\n                <div\n                  className=\"rounded-full bg-blue-500/70\"\n                  style={{\n                    width: location.size * 3,\n                    height: location.size * 3,\n                  }}\n                />\n              </MarkerContent>\n              <MarkerTooltip\n                offset={20}\n                className=\"bg-background text-foreground border\"\n              >\n                <p className=\"text-muted-foreground font-medium\">\n                  {location.city}\n                </p>\n                <p className=\"mt-1\">\n                  <span className=\"font-medium tabular-nums\">\n                    {location.size}\n                  </span>{\" \"}\n                  active users\n                </p>\n              </MarkerTooltip>\n            </MapMarker>\n          ))}\n        </Map>\n        <div\n          className=\"via-background/30 to-background pointer-events-none absolute inset-x-0 bottom-0 h-40 bg-linear-to-b from-transparent\"\n          aria-hidden\n        />\n        <OverviewCard />\n      </div>\n\n      <div className=\"grid gap-4 p-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n        <BreakdownCard title=\"Visited pages\" rows={visitedPagesRows} />\n        <BreakdownCard title=\"Referrers\" rows={referrersRows} />\n        <BreakdownCard title=\"Countries\" rows={countriesRows} />\n        <BreakdownCard title=\"Browsers\" rows={browsersRows} />\n      </div>\n    </div>\n  );\n}\n",
+      "content": "\"use client\";\n\nimport {\n  Map,\n  MapControls,\n  MapMarker,\n  MarkerContent,\n  MarkerTooltip,\n} from \"@/components/ui/map\";\nimport { OverviewCard } from \"./components/overview-card\";\nimport { BreakdownCard } from \"./components/breakdown-card\";\nimport {\n  locations,\n  visitedPagesRows,\n  countriesRows,\n  referrersRows,\n  browsersRows,\n} from \"./data\";\n\nconst MAP_HEIGHT = \"38rem\";\n\nexport function AnalyticsMapBlock() {\n  return (\n    <div\n      className=\"bg-background relative min-h-screen\"\n      style={{ \"--map-height\": MAP_HEIGHT } as React.CSSProperties}\n    >\n      <div className=\"relative h-(--map-height)\">\n        <Map\n          center={[-2, 16]}\n          zoom={1.5}\n          scrollZoom={false}\n          renderWorldCopies={true}\n        >\n          <MapControls showFullscreen />\n          {locations.map((location) => (\n            <MapMarker\n              key={location.city}\n              longitude={location.lng}\n              latitude={location.lat}\n            >\n              <MarkerContent>\n                <div\n                  className=\"rounded-full bg-blue-500/70\"\n                  style={{\n                    width: location.size * 3,\n                    height: location.size * 3,\n                  }}\n                />\n              </MarkerContent>\n              <MarkerTooltip\n                offset={20}\n                className=\"bg-background text-foreground border\"\n              >\n                <p className=\"text-muted-foreground font-medium\">\n                  {location.city}\n                </p>\n                <p className=\"mt-0.5\">{location.size} active users</p>\n              </MarkerTooltip>\n            </MapMarker>\n          ))}\n        </Map>\n        <div\n          className=\"via-background/30 to-background pointer-events-none absolute inset-x-0 bottom-0 h-40 bg-linear-to-b from-transparent\"\n          aria-hidden\n        />\n        <OverviewCard />\n      </div>\n\n      <div className=\"grid gap-4 p-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4\">\n        <BreakdownCard title=\"Visited pages\" rows={visitedPagesRows} />\n        <BreakdownCard title=\"Referrers\" rows={referrersRows} />\n        <BreakdownCard title=\"Countries\" rows={countriesRows} />\n        <BreakdownCard title=\"Browsers\" rows={browsersRows} />\n      </div>\n    </div>\n  );\n}\n",
       "type": "registry:page",
       "target": "app/analytics/page.tsx"
     },

public/r/delivery-tracker.json

@@ -7,7 +7,7 @@
     "lucide-react"
   ],
   "registryDependencies": [
-    "map",
+    "@mapcn/map",
     "card",
     "badge",
     "button"

public/r/heatmap.json

@@ -5,7 +5,7 @@
   "description": "Globe-projected heatmap visualizing earthquake density with zoom-dependent styling.",
   "dependencies": [],
   "registryDependencies": [
-    "map",
+    "@mapcn/map",
     "card"
   ],
   "files": [

public/r/logistics-network.json

@@ -7,10 +7,9 @@
     "lucide-react"
   ],
   "registryDependencies": [
-    "map",
-    "card",
-    "badge",
-    "button"
+    "@mapcn/map",
+    "sidebar",
+    "separator"
   ],
   "files": [
     {
@@ -39,7 +38,7 @@
     },
     {
       "path": "src/registry/blocks/logistics-network/components/network-map.tsx",
-      "content": "\"use client\";\n\nimport {\n  Map,\n  MapControls,\n  MapMarker,\n  MarkerContent,\n  MarkerTooltip,\n} from \"@/components/ui/map\";\nimport { SidebarTrigger } from \"@/components/ui/sidebar\";\nimport {\n  modeConfig,\n  regionLabels,\n  statusConfig,\n  type Hub,\n  type Route,\n} from \"../data\";\nimport { MapArcs } from \"./map-arcs\";\nimport { Separator } from \"@/components/ui/separator\";\n\ninterface NetworkMapProps {\n  hubs: Hub[];\n  routes: Route[];\n}\n\nfunction MapControlsCard() {\n  return (\n    <div className=\"border-border/40 bg-background/70 absolute top-4 left-4 z-20 flex items-center gap-3 rounded-lg border px-2.5 py-1.5 backdrop-blur-sm\">\n      <SidebarTrigger />\n      <Separator orientation=\"vertical\" className=\"h-4!\" />\n      <div className=\"flex items-center gap-3 text-xs\">\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: modeConfig.air.color }}\n          />\n          <span>{modeConfig.air.label}</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: modeConfig.ground.color }}\n          />\n          <span>{modeConfig.ground.label}</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: statusConfig.delayed.color }}\n          />\n          <span>{statusConfig.delayed.label}</span>\n        </div>\n        <div className=\"bg-border h-4 w-px\" />\n        <div className=\"flex items-center gap-1.5\">\n          <div className=\"size-2.5 shrink-0 rounded-full border border-white bg-blue-500 shadow-sm\" />\n          <span>Hub</span>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function NetworkMap({ hubs, routes }: NetworkMapProps) {\n  return (\n    <div className=\"relative h-full\">\n      <MapControlsCard />\n\n      <Map center={[-98, 39]} zoom={4} projection={{ type: \"globe\" }}>\n        <MapControls />\n        <MapArcs routes={routes} />\n\n        {hubs.map((hub) => (\n          <MapMarker key={hub.id} longitude={hub.lng} latitude={hub.lat}>\n            <MarkerContent>\n              <div className=\"size-3 rounded-full border-2 border-white bg-blue-500 shadow-md\" />\n            </MarkerContent>\n            <MarkerTooltip\n              offset={16}\n              className=\"bg-background text-foreground border px-2.5 py-1.5\"\n            >\n              <p className=\"font-medium\">{hub.city}</p>\n              <p className=\"text-muted-foreground mt-1\">\n                {hub.shipments.toLocaleString()} shipments\n                <span className=\"mx-1.5\">·</span>\n                {regionLabels[hub.region]}\n              </p>\n            </MarkerTooltip>\n          </MapMarker>\n        ))}\n      </Map>\n    </div>\n  );\n}\n",
+      "content": "\"use client\";\n\nimport {\n  Map,\n  MapControls,\n  MapMarker,\n  MarkerContent,\n  MarkerTooltip,\n} from \"@/components/ui/map\";\nimport { SidebarTrigger } from \"@/components/ui/sidebar\";\nimport {\n  modeConfig,\n  regionLabels,\n  statusConfig,\n  type Hub,\n  type Route,\n} from \"../data\";\nimport { MapArcs } from \"./map-arcs\";\nimport { Separator } from \"@/components/ui/separator\";\n\ninterface NetworkMapProps {\n  hubs: Hub[];\n  routes: Route[];\n}\n\nfunction MapControlsCard() {\n  return (\n    <div className=\"border-border/40 bg-background/70 absolute top-4 left-4 z-20 flex items-center gap-3 rounded-lg border px-2.5 py-1.5 backdrop-blur-sm\">\n      <SidebarTrigger />\n      <Separator orientation=\"vertical\" className=\"h-4!\" />\n      <div className=\"flex items-center gap-3 text-xs\">\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: modeConfig.air.color }}\n          />\n          <span>{modeConfig.air.label}</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: modeConfig.ground.color }}\n          />\n          <span>{modeConfig.ground.label}</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <span\n            className=\"h-0.5 w-4 shrink-0 rounded-full\"\n            style={{ backgroundColor: statusConfig.delayed.color }}\n          />\n          <span>{statusConfig.delayed.label}</span>\n        </div>\n        <div className=\"bg-border h-4 w-px\" />\n        <div className=\"flex items-center gap-1.5\">\n          <div className=\"size-2.5 shrink-0 rounded-full border border-white bg-blue-500 shadow-sm\" />\n          <span>Hub</span>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function NetworkMap({ hubs, routes }: NetworkMapProps) {\n  return (\n    <div className=\"relative h-full\">\n      <MapControlsCard />\n\n      <Map center={[-98, 39]} zoom={4} projection={{ type: \"globe\" }}>\n        <MapControls />\n        <MapArcs routes={routes} />\n\n        {hubs.map((hub) => (\n          <MapMarker key={hub.id} longitude={hub.lng} latitude={hub.lat}>\n            <MarkerContent>\n              <div className=\"size-3 rounded-full border-2 border-white bg-blue-500 shadow-md\" />\n            </MarkerContent>\n            <MarkerTooltip\n              offset={16}\n              className=\"bg-background text-foreground border px-2.5 py-1.5\"\n            >\n              <p className=\"font-medium\">{hub.city}</p>\n              <p className=\"text-muted-foreground mt-1\">\n                {hub.shipments.toLocaleString()} shipments\n                <span className=\"mx-1\">•</span>\n                {regionLabels[hub.region]}\n              </p>\n            </MarkerTooltip>\n          </MapMarker>\n        ))}\n      </Map>\n    </div>\n  );\n}\n",
       "type": "registry:component",
       "target": "app/logistics/components/network-map.tsx"
     }

public/r/registry.json

@@ -34,7 +34,7 @@
       "title": "Analytics Map",
       "description": "Real-time analytics overview with a world map, breakdown cards, and device stats.",
       "dependencies": ["recharts", "lucide-react"],
-      "registryDependencies": ["map", "card", "chart"],
+      "registryDependencies": ["@mapcn/map", "card", "chart"],
       "files": [
         {
           "path": "src/registry/blocks/analytics-map/page.tsx",
@@ -68,7 +68,7 @@
       "title": "Logistics Network",
       "description": "Domestic logistics map with a sidebar of stats.",
       "dependencies": ["lucide-react"],
-      "registryDependencies": ["map", "card", "badge", "button"],
+      "registryDependencies": ["@mapcn/map", "sidebar", "separator"],
       "files": [
         {
           "path": "src/registry/blocks/logistics-network/page.tsx",
@@ -107,7 +107,7 @@
       "title": "Heatmap",
       "description": "Globe-projected heatmap visualizing earthquake density with zoom-dependent styling.",
       "dependencies": [],
-      "registryDependencies": ["map", "card"],
+      "registryDependencies": ["@mapcn/map", "card"],
       "files": [
         {
           "path": "src/registry/blocks/heatmap/page.tsx",
@@ -123,7 +123,7 @@
       "title": "Delivery Tracker",
       "description": "Live order tracking with route progress, courier position, and order details.",
       "dependencies": ["lucide-react"],
-      "registryDependencies": ["map", "card", "badge", "button"],
+      "registryDependencies": ["@mapcn/map", "card", "badge", "button"],
       "files": [
         {
           "path": "src/registry/blocks/delivery-tracker/page.tsx",

registry.json

@@ -34,7 +34,7 @@
       "title": "Analytics Map",
       "description": "Real-time analytics overview with a world map, breakdown cards, and device stats.",
       "dependencies": ["recharts", "lucide-react"],
-      "registryDependencies": ["map", "card", "chart"],
+      "registryDependencies": ["@mapcn/map", "card", "chart"],
       "files": [
         {
           "path": "src/registry/blocks/analytics-map/page.tsx",
@@ -68,7 +68,7 @@
       "title": "Logistics Network",
       "description": "Domestic logistics map with a sidebar of stats.",
       "dependencies": ["lucide-react"],
-      "registryDependencies": ["map", "card", "badge", "button"],
+      "registryDependencies": ["@mapcn/map", "sidebar", "separator"],
       "files": [
         {
           "path": "src/registry/blocks/logistics-network/page.tsx",
@@ -107,7 +107,7 @@
       "title": "Heatmap",
       "description": "Globe-projected heatmap visualizing earthquake density with zoom-dependent styling.",
       "dependencies": [],
-      "registryDependencies": ["map", "card"],
+      "registryDependencies": ["@mapcn/map", "card"],
       "files": [
         {
           "path": "src/registry/blocks/heatmap/page.tsx",
@@ -123,7 +123,7 @@
       "title": "Delivery Tracker",
       "description": "Live order tracking with route progress, courier position, and order details.",
       "dependencies": ["lucide-react"],
-      "registryDependencies": ["map", "card", "badge", "button"],
+      "registryDependencies": ["@mapcn/map", "card", "badge", "button"],
       "files": [
         {
           "path": "src/registry/blocks/delivery-tracker/page.tsx",

src/registry/blocks/analytics-map/page.tsx

@@ -55,12 +55,7 @@ export function AnalyticsMapBlock() {
                 <p className="text-muted-foreground font-medium">
                   {location.city}
                 </p>
-                <p className="mt-1">
-                  <span className="font-medium tabular-nums">
-                    {location.size}
-                  </span>{" "}
-                  active users
-                </p>
+                <p className="mt-0.5">{location.size} active users</p>
               </MarkerTooltip>
             </MapMarker>
           ))}

src/registry/blocks/logistics-network/components/network-map.tsx

@@ -81,7 +81,7 @@ export function NetworkMap({ hubs, routes }: NetworkMapProps) {
               <p className="font-medium">{hub.city}</p>
               <p className="text-muted-foreground mt-1">
                 {hub.shipments.toLocaleString()} shipments
-                <span className="mx-1.5">·</span>
+                <span className="mx-1">•</span>
                 {regionLabels[hub.region]}
               </p>
             </MarkerTooltip>