@datatechsolutions/ui 2.10.2 → 2.10.4

package/dist/{chunk-WMPZ6UTF.js → chunk-MRXTY7XN.js}

@@ -12267,15 +12267,32 @@ function GeoMapCanvasInner({
   const hasAnyActiveFilter = React12.useMemo(() => {
     return regionGroups.some((regionData) => isRegionActive?.(regionData.code));
   }, [regionGroups, isRegionActive]);
-  const effectiveWidth = projectionType === "albersUsa" ? ALBERS_WIDTH : VIEWBOX_WIDTH;
-  const effectiveHeight = projectionType === "albersUsa" ? ALBERS_HEIGHT : VIEWBOX_HEIGHT;
+  const featureBounds = React12.useMemo(() => {
+    if (!pathGenerator || !geoData) return null;
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    for (const feature of geoData.features) {
+      const bounds = pathGenerator.bounds(feature);
+      if (!bounds || !isFinite(bounds[0][0])) continue;
+      minX = Math.min(minX, bounds[0][0]);
+      minY = Math.min(minY, bounds[0][1]);
+      maxX = Math.max(maxX, bounds[1][0]);
+      maxY = Math.max(maxY, bounds[1][1]);
+    }
+    if (!isFinite(minX)) return null;
+    const pad = 15;
+    return { x: minX - pad, y: minY - pad, width: maxX - minX + pad * 2, height: maxY - minY + pad * 2 };
+  }, [pathGenerator, geoData]);
+  const effectiveWidth = featureBounds?.width ?? (projectionType === "albersUsa" ? ALBERS_WIDTH : VIEWBOX_WIDTH);
+  const effectiveHeight = featureBounds?.height ?? (projectionType === "albersUsa" ? ALBERS_HEIGHT : VIEWBOX_HEIGHT);
+  const baseX = featureBounds?.x ?? 0;
+  const baseY = featureBounds?.y ?? 0;
   const viewBoxParts = React12.useMemo(() => {
     const width = effectiveWidth / zoom;
     const height = effectiveHeight / zoom;
-    const x2 = (effectiveWidth - width) / 2 - panOffset[0];
-    const y2 = (effectiveHeight - height) / 2 - panOffset[1];
+    const x2 = baseX + (effectiveWidth - width) / 2 - panOffset[0];
+    const y2 = baseY + (effectiveHeight - height) / 2 - panOffset[1];
     return { x: x2, y: y2, width, height };
-  }, [zoom, panOffset, effectiveWidth, effectiveHeight]);
+  }, [zoom, panOffset, effectiveWidth, effectiveHeight, baseX, baseY]);
   const viewBox = `${viewBoxParts.x} ${viewBoxParts.y} ${viewBoxParts.width} ${viewBoxParts.height}`;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -12288,7 +12305,6 @@ function GeoMapCanvasInner({
         {
           ref: svgRef,
           viewBox,
-          preserveAspectRatio: "xMidYMid slice",
           className: "w-full h-full cursor-grab active:cursor-grabbing",
           "aria-label": ariaLabel,
           style: { touchAction: "none", background: "transparent" },
@@ -12572,9 +12588,9 @@ function InteractiveGeoMapInner({
     "div",
     {
       ref,
-      className: `space-y-4 ${className ?? ""}`,
+      className: `space-y-4 h-full ${className ?? ""}`,
       "data-testid": "interactive-geo-map-container",
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-full", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           GeoMapCanvas,
           {
@@ -23903,5 +23919,5 @@ exports.useGeoMapState = useGeoMapState;
 exports.useNotifications = useNotifications;
 exports.usePlatformShellStore = usePlatformShellStore;
 exports.usePullToRefresh = usePullToRefresh;
-//# sourceMappingURL=chunk-WMPZ6UTF.js.map
-//# sourceMappingURL=chunk-WMPZ6UTF.js.map
+//# sourceMappingURL=chunk-MRXTY7XN.js.map
+//# sourceMappingURL=chunk-MRXTY7XN.js.map