@xyo-network/react-map 2.64.9 → 2.65.0

package/dist/browser/hooks/index.cjs

@@ -1,180 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/hooks/index.ts
-var hooks_exports = {};
-__export(hooks_exports, {
-  useDynamicMapResize: () => useDynamicMapResize,
-  useDynamicPositioning: () => useDynamicPositioning,
-  useFindHashes: () => useFindHashes,
-  useHeatMapColors: () => useHeatMapColors,
-  useQuadKeyPayloadsToFeatures: () => useQuadKeyPayloadsToFeatures
-});
-module.exports = __toCommonJS(hooks_exports);
-
-// src/hooks/useDynamicMapResize.tsx
-var import_react = require("react");
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = (0, import_react.useState)(false);
-  const resizer = (0, import_react.useMemo)(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  (0, import_react.useEffect)(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  (0, import_react.useEffect)(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-
-// src/hooks/useDynamicPositioning.tsx
-var import_react_shared = require("@xylabs/react-shared");
-var import_react2 = require("react");
-var defaultZoom = 1.6;
-var defaultAspectRatioRange = [0.5, 2];
-var latRange = [0.9121644205263664, 1.71785031559439];
-var lngRange = [-81.4742014851959, 12.788958675506933];
-var linearInterpolate = (aspectRatio, degreeRange, aspectRatioRange) => {
-  const [degreeMin, degreeMax] = degreeRange;
-  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange;
-  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin;
-  const degreeRangeSpan = degreeMax - degreeMin;
-  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan;
-  const scaledDegree = percent * degreeRangeSpan + degreeMin;
-  return scaledDegree;
-};
-var useDynamicPositioning = () => {
-  const [options, setOptions] = (0, import_react2.useState)({});
-  const { width, height } = (0, import_react_shared.useWindowSize)();
-  (0, import_react2.useEffect)(() => {
-    if (width && height) {
-      const aspectRatio = width / height;
-      setOptions({
-        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],
-        zoom: defaultZoom
-      });
-    }
-  }, [height, width]);
-  return { options };
-};
-
-// src/hooks/useFindHashes.tsx
-var import_react_network = require("@xyo-network/react-network");
-var import_react3 = require("react");
-var animatedAnswerHashesConst = [
-  "79af071f451fc7af10d009dc63236ef9a9b211732c1ee0c06f028fcecf2336c5",
-  "531bfba6d8dfefd3bcc888aca54cdbbd4574ed2b3ec551b230845a1f9a608898",
-  "c874412b4faa4947de81372fd1ba12fdd6f43f5e408622b7f357cb2bcb3f17cb",
-  "29d3f8b882c61a82a1a1675782a27e797ea7196f45a23b4409680ab8b8d5f14e",
-  "cfd20f80ac073fd9518f4ef3f43d2a1f5e4e56e40c2677f38d6f6fecd05df60c",
-  "1354fa73497519a39aed19fc99bdbae78a880a1eafb2f7898d607e07db36528d",
-  "1043b0d25eacfc5013ae9dba780305a6fbf01a43543bd871d7c00537fca142a9",
-  "973dfc5df142851ced258d52d0ac2784e814000ac22e35776f772256b0d4dde9",
-  "463808eb74d3d87e6563970e0301a493577f8cd1b501e6e0ffa5e027ad2cea95",
-  "15b21acea2e3fd9d1ace3768a72636ee7bdf67a6f8e0807bfa2273dea2207555",
-  "32d377bfe7ebe382598c54dd13f8af7510e0a1e2fd2e913311fdd58e517e5e2e,"
-];
-var staticAnswerHashConst = "c7bbf61f61cfd4a1b2def160c28136fc1d100d39fbdb67b227a2c6e558d9d3a5";
-var useFindHashes = () => {
-  const { network } = (0, import_react_network.useNetwork)();
-  const exploreMapHashes = network?.nodes?.find((node) => node.type === "archivist")?.explorerMapHashes;
-  const animatedAnswerHashes = exploreMapHashes?.animatedAnswerHashes || animatedAnswerHashesConst;
-  const staticAnswerHash = exploreMapHashes?.staticAnswerHash || staticAnswerHashConst;
-  const foundHashes = (0, import_react3.useMemo)(() => [staticAnswerHash, ...animatedAnswerHashes], [animatedAnswerHashes, staticAnswerHash]);
-  return foundHashes;
-};
-
-// src/hooks/useHeatMapColors.tsx
-var import_material = require("@mui/material");
-var useHeatMapColors = () => {
-  const theme = (0, import_material.useTheme)();
-  const staticMapColor = "#FFFF75";
-  const highUsageColor = "#FF0000";
-  const heatMapColorProps = {
-    highUsageColor,
-    lowUsageColor: "#FFB3B3",
-    staticMapColor
-  };
-  const legendProps = {
-    endColor: highUsageColor,
-    endLabel: "High",
-    heading: "Network Usage",
-    startColor: staticMapColor,
-    startLabel: "Low",
-    textColor: theme.palette.common.white
-  };
-  return { heatMapColorProps, legendProps };
-};
-
-// src/hooks/useQuadKeyPayloadsToFeatures.tsx
-var import_lodash = require("@xylabs/lodash");
-var import_sdk_geo = require("@xyo-network/sdk-geo");
-var import_react4 = require("react");
-var quadKeyToFeature = ({ density, quadkey }) => {
-  const polygonFeature = new import_sdk_geo.GeoJson(quadkey).polygonFeature();
-  polygonFeature.properties = {
-    count: density,
-    density
-  };
-  return polygonFeature;
-};
-var setDensity = (feature) => {
-  if (feature.properties) {
-    feature.properties.value = feature.properties.density / 5;
-  }
-  return feature;
-};
-var useQuadKeyPayloadsToFeatures = (payloads) => {
-  const [multipleFeatureSets, setMultipleFeatureSets] = (0, import_react4.useState)([[]]);
-  const [features, setFeatures] = (0, import_react4.useState)([]);
-  const [error, setError] = (0, import_react4.useState)();
-  (0, import_react4.useEffect)(() => {
-    if (Array.isArray(payloads)) {
-      if ((0, import_lodash.compact)(payloads).length !== 0) {
-        const payloadsArray = payloads;
-        const mappedFeatures = payloadsArray?.map((payload) => payload?.result.map(quadKeyToFeature));
-        setMultipleFeatureSets(mappedFeatures.map((features2) => features2?.map(setDensity) ?? []));
-      } else {
-        setError(new Error("Cannot find payloads for provided hashes"));
-      }
-    }
-    if (payloads && payloads.result) {
-      const singlePayload = payloads;
-      const mappedFeatures = singlePayload.result.map(quadKeyToFeature);
-      setFeatures(mappedFeatures.map(setDensity));
-    }
-  }, [payloads]);
-  return { error, features, multipleFeatureSets };
-};
-//# sourceMappingURL=index.cjs.map

package/dist/browser/hooks/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/index.ts","../../../src/hooks/useDynamicMapResize.tsx","../../../src/hooks/useDynamicPositioning.tsx","../../../src/hooks/useFindHashes.tsx","../../../src/hooks/useHeatMapColors.tsx","../../../src/hooks/useQuadKeyPayloadsToFeatures.tsx"],"sourcesContent":["export * from './useDynamicMapResize'\nexport * from './useDynamicPositioning'\nexport * from './useFindHashes'\nexport * from './useHeatMapColors'\nexport * from './useQuadKeyPayloadsToFeatures'\n","import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n","import { useWindowSize } from '@xylabs/react-shared'\nimport { MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useState } from 'react'\n\n/**\n * Zoom level for the map\n *\n * Note: Changing zoom will require changes to Lat/Lng Ranges\n */\nconst defaultZoom = 1.6\n\n/**\n * Range of aspect ratio values (width / height = aspect ratio) to scale against degrees\n * On lower aspect ratios, the width is larger than the height and vice-versa for higher\n */\nconst defaultAspectRatioRange = [0.5, 2]\n\n/**\n * Lat/Lng ranges, the first index is the minimum and the second is the maximum\n * Index 0 is for portrait screens and centers on the Eastern Hemisphere\n * Index 1 is for wider screens near the Prime Meridian and north of the Equator\n *\n * Note: Values are based off the zoom level\n */\nconst latRange = [0.9121644205263664, 1.71785031559439]\nconst lngRange = [-81.4742014851959, 12.788958675506933]\n\n/**\n * Function to interpolate an aspect ratio value across a range of degrees and aspect ratios\n *\n * Inspired by - https://stackoverflow.com/questions/14224535/scaling-between-two-number-ranges\n *\n * @param aspectRatio aspect ratio to scale\n * @param degreeRange A latitude or longitude range (i.e. [minLat, maxLat])\n * @param aspectRatioRange A range of aspect ratios to scale against degreeRange parameter\n * @returns number\n */\nconst linearInterpolate = (aspectRatio: number, degreeRange: number[], aspectRatioRange?: number[]): number => {\n  const [degreeMin, degreeMax] = degreeRange\n  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange\n\n  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin\n  const degreeRangeSpan = degreeMax - degreeMin\n\n  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan\n  const scaledDegree = percent * degreeRangeSpan + degreeMin\n\n  return scaledDegree\n}\n\nconst useDynamicPositioning = () => {\n  const [options, setOptions] = useState<Partial<MapboxOptions>>({})\n  const { width, height } = useWindowSize()\n\n  useEffect(() => {\n    if (width && height) {\n      const aspectRatio = width / height\n\n      setOptions({\n        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],\n        zoom: defaultZoom,\n      })\n    }\n  }, [height, width])\n\n  return { options }\n}\n\nexport { useDynamicPositioning }\n","import { ArchivistPreset, useNetwork } from '@xyo-network/react-network'\nimport { useMemo } from 'react'\n\nconst animatedAnswerHashesConst = [\n  '79af071f451fc7af10d009dc63236ef9a9b211732c1ee0c06f028fcecf2336c5',\n  '531bfba6d8dfefd3bcc888aca54cdbbd4574ed2b3ec551b230845a1f9a608898',\n  'c874412b4faa4947de81372fd1ba12fdd6f43f5e408622b7f357cb2bcb3f17cb',\n  '29d3f8b882c61a82a1a1675782a27e797ea7196f45a23b4409680ab8b8d5f14e',\n  'cfd20f80ac073fd9518f4ef3f43d2a1f5e4e56e40c2677f38d6f6fecd05df60c',\n  '1354fa73497519a39aed19fc99bdbae78a880a1eafb2f7898d607e07db36528d',\n  '1043b0d25eacfc5013ae9dba780305a6fbf01a43543bd871d7c00537fca142a9',\n  '973dfc5df142851ced258d52d0ac2784e814000ac22e35776f772256b0d4dde9',\n  '463808eb74d3d87e6563970e0301a493577f8cd1b501e6e0ffa5e027ad2cea95',\n  '15b21acea2e3fd9d1ace3768a72636ee7bdf67a6f8e0807bfa2273dea2207555',\n  '32d377bfe7ebe382598c54dd13f8af7510e0a1e2fd2e913311fdd58e517e5e2e,',\n]\n\nconst staticAnswerHashConst = 'c7bbf61f61cfd4a1b2def160c28136fc1d100d39fbdb67b227a2c6e558d9d3a5'\n\nexport const useFindHashes = () => {\n  const { network } = useNetwork()\n  const exploreMapHashes = (network?.nodes?.find((node) => node.type === 'archivist') as ArchivistPreset)?.explorerMapHashes\n  const animatedAnswerHashes = exploreMapHashes?.animatedAnswerHashes || animatedAnswerHashesConst\n  const staticAnswerHash = exploreMapHashes?.staticAnswerHash || staticAnswerHashConst\n  const foundHashes = useMemo(() => [staticAnswerHash, ...animatedAnswerHashes], [animatedAnswerHashes, staticAnswerHash])\n  return foundHashes\n}\n","import { useTheme } from '@mui/material'\n\nimport { AnimatedHeatMapColorProps, ColorGradientLegendProps } from '../Colors'\n\nconst useHeatMapColors = () => {\n  const theme = useTheme()\n  const staticMapColor = '#FFFF75'\n  const highUsageColor = '#FF0000'\n\n  const heatMapColorProps: AnimatedHeatMapColorProps = {\n    highUsageColor,\n    lowUsageColor: '#FFB3B3',\n    staticMapColor,\n  }\n\n  const legendProps: ColorGradientLegendProps = {\n    endColor: highUsageColor,\n    endLabel: 'High',\n    heading: 'Network Usage',\n    startColor: staticMapColor,\n    startLabel: 'Low',\n    textColor: theme.palette.common.white,\n  }\n\n  return { heatMapColorProps, legendProps }\n}\n\nexport { useHeatMapColors }\n","import { compact } from '@xylabs/lodash'\nimport { GeoJson } from '@xyo-network/sdk-geo'\nimport { Feature, Geometry } from 'geojson'\nimport { useEffect, useState } from 'react'\n\nimport { NetworkLocationHeatmapQuadkeyAnswerPayload } from '../types'\n\nconst quadKeyToFeature = ({ density, quadkey }: { density: number; quadkey: string }) => {\n  const polygonFeature = new GeoJson(quadkey).polygonFeature()\n  polygonFeature.properties = {\n    count: density,\n    density,\n  }\n  return polygonFeature\n}\n\nconst setDensity = (feature: Feature) => {\n  if (feature.properties) {\n    feature.properties.value = feature.properties.density / 5\n  }\n  return feature\n}\n\nconst useQuadKeyPayloadsToFeatures = (payloads?: NetworkLocationHeatmapQuadkeyAnswerPayload[] | NetworkLocationHeatmapQuadkeyAnswerPayload) => {\n  const [multipleFeatureSets, setMultipleFeatureSets] = useState<Feature<Geometry>[][]>([[]])\n  const [features, setFeatures] = useState<Feature<Geometry>[]>([])\n  const [error, setError] = useState<Error>()\n\n  useEffect(() => {\n    // Convert Multiple Payloads from Quadkey to GeoJson\n    if (Array.isArray(payloads)) {\n      if (compact(payloads).length !== 0) {\n        const payloadsArray = payloads as (NetworkLocationHeatmapQuadkeyAnswerPayload | null)[]\n        const mappedFeatures = payloadsArray?.map((payload) => payload?.result.map(quadKeyToFeature))\n\n        setMultipleFeatureSets(mappedFeatures.map((features) => features?.map(setDensity) ?? []))\n      } else {\n        setError(new Error('Cannot find payloads for provided hashes'))\n      }\n    }\n\n    // Convert Single Payload from Quadkey to GeoJson\n    if (payloads && (payloads as NetworkLocationHeatmapQuadkeyAnswerPayload).result) {\n      const singlePayload = payloads as NetworkLocationHeatmapQuadkeyAnswerPayload\n      const mappedFeatures = singlePayload.result.map(quadKeyToFeature)\n\n      setFeatures(mappedFeatures.map(setDensity))\n    }\n  }, [payloads])\n\n  return { error, features, multipleFeatureSets }\n}\n\nexport { useQuadKeyPayloadsToFeatures }\n"],"mappings":"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","names":["dependenciesReady","import_react","import_react","import_react","features"]}

package/dist/browser/hooks/index.js

@@ -1,157 +0,0 @@
-// src/hooks/useDynamicMapResize.tsx
-import { useEffect, useMemo, useState } from "react";
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = useState(false);
-  const resizer = useMemo(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  useEffect(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  useEffect(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-
-// src/hooks/useDynamicPositioning.tsx
-import { useWindowSize } from "@xylabs/react-shared";
-import { useEffect as useEffect2, useState as useState2 } from "react";
-var defaultZoom = 1.6;
-var defaultAspectRatioRange = [0.5, 2];
-var latRange = [0.9121644205263664, 1.71785031559439];
-var lngRange = [-81.4742014851959, 12.788958675506933];
-var linearInterpolate = (aspectRatio, degreeRange, aspectRatioRange) => {
-  const [degreeMin, degreeMax] = degreeRange;
-  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange;
-  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin;
-  const degreeRangeSpan = degreeMax - degreeMin;
-  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan;
-  const scaledDegree = percent * degreeRangeSpan + degreeMin;
-  return scaledDegree;
-};
-var useDynamicPositioning = () => {
-  const [options, setOptions] = useState2({});
-  const { width, height } = useWindowSize();
-  useEffect2(() => {
-    if (width && height) {
-      const aspectRatio = width / height;
-      setOptions({
-        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],
-        zoom: defaultZoom
-      });
-    }
-  }, [height, width]);
-  return { options };
-};
-
-// src/hooks/useFindHashes.tsx
-import { useNetwork } from "@xyo-network/react-network";
-import { useMemo as useMemo2 } from "react";
-var animatedAnswerHashesConst = [
-  "79af071f451fc7af10d009dc63236ef9a9b211732c1ee0c06f028fcecf2336c5",
-  "531bfba6d8dfefd3bcc888aca54cdbbd4574ed2b3ec551b230845a1f9a608898",
-  "c874412b4faa4947de81372fd1ba12fdd6f43f5e408622b7f357cb2bcb3f17cb",
-  "29d3f8b882c61a82a1a1675782a27e797ea7196f45a23b4409680ab8b8d5f14e",
-  "cfd20f80ac073fd9518f4ef3f43d2a1f5e4e56e40c2677f38d6f6fecd05df60c",
-  "1354fa73497519a39aed19fc99bdbae78a880a1eafb2f7898d607e07db36528d",
-  "1043b0d25eacfc5013ae9dba780305a6fbf01a43543bd871d7c00537fca142a9",
-  "973dfc5df142851ced258d52d0ac2784e814000ac22e35776f772256b0d4dde9",
-  "463808eb74d3d87e6563970e0301a493577f8cd1b501e6e0ffa5e027ad2cea95",
-  "15b21acea2e3fd9d1ace3768a72636ee7bdf67a6f8e0807bfa2273dea2207555",
-  "32d377bfe7ebe382598c54dd13f8af7510e0a1e2fd2e913311fdd58e517e5e2e,"
-];
-var staticAnswerHashConst = "c7bbf61f61cfd4a1b2def160c28136fc1d100d39fbdb67b227a2c6e558d9d3a5";
-var useFindHashes = () => {
-  const { network } = useNetwork();
-  const exploreMapHashes = network?.nodes?.find((node) => node.type === "archivist")?.explorerMapHashes;
-  const animatedAnswerHashes = exploreMapHashes?.animatedAnswerHashes || animatedAnswerHashesConst;
-  const staticAnswerHash = exploreMapHashes?.staticAnswerHash || staticAnswerHashConst;
-  const foundHashes = useMemo2(() => [staticAnswerHash, ...animatedAnswerHashes], [animatedAnswerHashes, staticAnswerHash]);
-  return foundHashes;
-};
-
-// src/hooks/useHeatMapColors.tsx
-import { useTheme } from "@mui/material";
-var useHeatMapColors = () => {
-  const theme = useTheme();
-  const staticMapColor = "#FFFF75";
-  const highUsageColor = "#FF0000";
-  const heatMapColorProps = {
-    highUsageColor,
-    lowUsageColor: "#FFB3B3",
-    staticMapColor
-  };
-  const legendProps = {
-    endColor: highUsageColor,
-    endLabel: "High",
-    heading: "Network Usage",
-    startColor: staticMapColor,
-    startLabel: "Low",
-    textColor: theme.palette.common.white
-  };
-  return { heatMapColorProps, legendProps };
-};
-
-// src/hooks/useQuadKeyPayloadsToFeatures.tsx
-import { compact } from "@xylabs/lodash";
-import { GeoJson } from "@xyo-network/sdk-geo";
-import { useEffect as useEffect3, useState as useState3 } from "react";
-var quadKeyToFeature = ({ density, quadkey }) => {
-  const polygonFeature = new GeoJson(quadkey).polygonFeature();
-  polygonFeature.properties = {
-    count: density,
-    density
-  };
-  return polygonFeature;
-};
-var setDensity = (feature) => {
-  if (feature.properties) {
-    feature.properties.value = feature.properties.density / 5;
-  }
-  return feature;
-};
-var useQuadKeyPayloadsToFeatures = (payloads) => {
-  const [multipleFeatureSets, setMultipleFeatureSets] = useState3([[]]);
-  const [features, setFeatures] = useState3([]);
-  const [error, setError] = useState3();
-  useEffect3(() => {
-    if (Array.isArray(payloads)) {
-      if (compact(payloads).length !== 0) {
-        const payloadsArray = payloads;
-        const mappedFeatures = payloadsArray?.map((payload) => payload?.result.map(quadKeyToFeature));
-        setMultipleFeatureSets(mappedFeatures.map((features2) => features2?.map(setDensity) ?? []));
-      } else {
-        setError(new Error("Cannot find payloads for provided hashes"));
-      }
-    }
-    if (payloads && payloads.result) {
-      const singlePayload = payloads;
-      const mappedFeatures = singlePayload.result.map(quadKeyToFeature);
-      setFeatures(mappedFeatures.map(setDensity));
-    }
-  }, [payloads]);
-  return { error, features, multipleFeatureSets };
-};
-export {
-  useDynamicMapResize,
-  useDynamicPositioning,
-  useFindHashes,
-  useHeatMapColors,
-  useQuadKeyPayloadsToFeatures
-};
-//# sourceMappingURL=index.js.map

package/dist/browser/hooks/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/useDynamicMapResize.tsx","../../../src/hooks/useDynamicPositioning.tsx","../../../src/hooks/useFindHashes.tsx","../../../src/hooks/useHeatMapColors.tsx","../../../src/hooks/useQuadKeyPayloadsToFeatures.tsx"],"sourcesContent":["import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n","import { useWindowSize } from '@xylabs/react-shared'\nimport { MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useState } from 'react'\n\n/**\n * Zoom level for the map\n *\n * Note: Changing zoom will require changes to Lat/Lng Ranges\n */\nconst defaultZoom = 1.6\n\n/**\n * Range of aspect ratio values (width / height = aspect ratio) to scale against degrees\n * On lower aspect ratios, the width is larger than the height and vice-versa for higher\n */\nconst defaultAspectRatioRange = [0.5, 2]\n\n/**\n * Lat/Lng ranges, the first index is the minimum and the second is the maximum\n * Index 0 is for portrait screens and centers on the Eastern Hemisphere\n * Index 1 is for wider screens near the Prime Meridian and north of the Equator\n *\n * Note: Values are based off the zoom level\n */\nconst latRange = [0.9121644205263664, 1.71785031559439]\nconst lngRange = [-81.4742014851959, 12.788958675506933]\n\n/**\n * Function to interpolate an aspect ratio value across a range of degrees and aspect ratios\n *\n * Inspired by - https://stackoverflow.com/questions/14224535/scaling-between-two-number-ranges\n *\n * @param aspectRatio aspect ratio to scale\n * @param degreeRange A latitude or longitude range (i.e. [minLat, maxLat])\n * @param aspectRatioRange A range of aspect ratios to scale against degreeRange parameter\n * @returns number\n */\nconst linearInterpolate = (aspectRatio: number, degreeRange: number[], aspectRatioRange?: number[]): number => {\n  const [degreeMin, degreeMax] = degreeRange\n  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange\n\n  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin\n  const degreeRangeSpan = degreeMax - degreeMin\n\n  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan\n  const scaledDegree = percent * degreeRangeSpan + degreeMin\n\n  return scaledDegree\n}\n\nconst useDynamicPositioning = () => {\n  const [options, setOptions] = useState<Partial<MapboxOptions>>({})\n  const { width, height } = useWindowSize()\n\n  useEffect(() => {\n    if (width && height) {\n      const aspectRatio = width / height\n\n      setOptions({\n        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],\n        zoom: defaultZoom,\n      })\n    }\n  }, [height, width])\n\n  return { options }\n}\n\nexport { useDynamicPositioning }\n","import { ArchivistPreset, useNetwork } from '@xyo-network/react-network'\nimport { useMemo } from 'react'\n\nconst animatedAnswerHashesConst = [\n  '79af071f451fc7af10d009dc63236ef9a9b211732c1ee0c06f028fcecf2336c5',\n  '531bfba6d8dfefd3bcc888aca54cdbbd4574ed2b3ec551b230845a1f9a608898',\n  'c874412b4faa4947de81372fd1ba12fdd6f43f5e408622b7f357cb2bcb3f17cb',\n  '29d3f8b882c61a82a1a1675782a27e797ea7196f45a23b4409680ab8b8d5f14e',\n  'cfd20f80ac073fd9518f4ef3f43d2a1f5e4e56e40c2677f38d6f6fecd05df60c',\n  '1354fa73497519a39aed19fc99bdbae78a880a1eafb2f7898d607e07db36528d',\n  '1043b0d25eacfc5013ae9dba780305a6fbf01a43543bd871d7c00537fca142a9',\n  '973dfc5df142851ced258d52d0ac2784e814000ac22e35776f772256b0d4dde9',\n  '463808eb74d3d87e6563970e0301a493577f8cd1b501e6e0ffa5e027ad2cea95',\n  '15b21acea2e3fd9d1ace3768a72636ee7bdf67a6f8e0807bfa2273dea2207555',\n  '32d377bfe7ebe382598c54dd13f8af7510e0a1e2fd2e913311fdd58e517e5e2e,',\n]\n\nconst staticAnswerHashConst = 'c7bbf61f61cfd4a1b2def160c28136fc1d100d39fbdb67b227a2c6e558d9d3a5'\n\nexport const useFindHashes = () => {\n  const { network } = useNetwork()\n  const exploreMapHashes = (network?.nodes?.find((node) => node.type === 'archivist') as ArchivistPreset)?.explorerMapHashes\n  const animatedAnswerHashes = exploreMapHashes?.animatedAnswerHashes || animatedAnswerHashesConst\n  const staticAnswerHash = exploreMapHashes?.staticAnswerHash || staticAnswerHashConst\n  const foundHashes = useMemo(() => [staticAnswerHash, ...animatedAnswerHashes], [animatedAnswerHashes, staticAnswerHash])\n  return foundHashes\n}\n","import { useTheme } from '@mui/material'\n\nimport { AnimatedHeatMapColorProps, ColorGradientLegendProps } from '../Colors'\n\nconst useHeatMapColors = () => {\n  const theme = useTheme()\n  const staticMapColor = '#FFFF75'\n  const highUsageColor = '#FF0000'\n\n  const heatMapColorProps: AnimatedHeatMapColorProps = {\n    highUsageColor,\n    lowUsageColor: '#FFB3B3',\n    staticMapColor,\n  }\n\n  const legendProps: ColorGradientLegendProps = {\n    endColor: highUsageColor,\n    endLabel: 'High',\n    heading: 'Network Usage',\n    startColor: staticMapColor,\n    startLabel: 'Low',\n    textColor: theme.palette.common.white,\n  }\n\n  return { heatMapColorProps, legendProps }\n}\n\nexport { useHeatMapColors }\n","import { compact } from '@xylabs/lodash'\nimport { GeoJson } from '@xyo-network/sdk-geo'\nimport { Feature, Geometry } from 'geojson'\nimport { useEffect, useState } from 'react'\n\nimport { NetworkLocationHeatmapQuadkeyAnswerPayload } from '../types'\n\nconst quadKeyToFeature = ({ density, quadkey }: { density: number; quadkey: string }) => {\n  const polygonFeature = new GeoJson(quadkey).polygonFeature()\n  polygonFeature.properties = {\n    count: density,\n    density,\n  }\n  return polygonFeature\n}\n\nconst setDensity = (feature: Feature) => {\n  if (feature.properties) {\n    feature.properties.value = feature.properties.density / 5\n  }\n  return feature\n}\n\nconst useQuadKeyPayloadsToFeatures = (payloads?: NetworkLocationHeatmapQuadkeyAnswerPayload[] | NetworkLocationHeatmapQuadkeyAnswerPayload) => {\n  const [multipleFeatureSets, setMultipleFeatureSets] = useState<Feature<Geometry>[][]>([[]])\n  const [features, setFeatures] = useState<Feature<Geometry>[]>([])\n  const [error, setError] = useState<Error>()\n\n  useEffect(() => {\n    // Convert Multiple Payloads from Quadkey to GeoJson\n    if (Array.isArray(payloads)) {\n      if (compact(payloads).length !== 0) {\n        const payloadsArray = payloads as (NetworkLocationHeatmapQuadkeyAnswerPayload | null)[]\n        const mappedFeatures = payloadsArray?.map((payload) => payload?.result.map(quadKeyToFeature))\n\n        setMultipleFeatureSets(mappedFeatures.map((features) => features?.map(setDensity) ?? []))\n      } else {\n        setError(new Error('Cannot find payloads for provided hashes'))\n      }\n    }\n\n    // Convert Single Payload from Quadkey to GeoJson\n    if (payloads && (payloads as NetworkLocationHeatmapQuadkeyAnswerPayload).result) {\n      const singlePayload = payloads as NetworkLocationHeatmapQuadkeyAnswerPayload\n      const mappedFeatures = singlePayload.result.map(quadKeyToFeature)\n\n      setFeatures(mappedFeatures.map(setDensity))\n    }\n  }, [payloads])\n\n  return { error, features, multipleFeatureSets }\n}\n\nexport { useQuadKeyPayloadsToFeatures }\n"],"mappings":"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","names":["dependenciesReady","useEffect","useState","useMemo","useEffect","useState","features"]}

package/dist/browser/hooks/useDynamicMapResize.cjs

@@ -1,54 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/hooks/useDynamicMapResize.tsx
-var useDynamicMapResize_exports = {};
-__export(useDynamicMapResize_exports, {
-  useDynamicMapResize: () => useDynamicMapResize
-});
-module.exports = __toCommonJS(useDynamicMapResize_exports);
-var import_react = require("react");
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = (0, import_react.useState)(false);
-  const resizer = (0, import_react.useMemo)(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  (0, import_react.useEffect)(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  (0, import_react.useEffect)(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-//# sourceMappingURL=useDynamicMapResize.cjs.map

package/dist/browser/hooks/useDynamicMapResize.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/useDynamicMapResize.tsx"],"sourcesContent":["import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAA+D;AAKxD,IAAM,sBAAsB,CACjC,iBACA,cACA,aACA,SAAS,SACN;AACH,QAAM,CAAC,mBAAmB,oBAAoB,QAAI,uBAAS,KAAK;AAEhE,QAAM,cAAU;AAAA,IACd,MACE,IAAI,eAAe,MAAM;AACvB,YAAM,QAAQ,gBAAgB,SAAS,sBAAsB,EAAE;AAC/D,UAAI,SAAS,aAAa,SAAS;AACjC,qBAAa,QAAQ,MAAM,QAAQ,GAAG,KAAK;AAG3C,mBAAW,MAAM,aAAa,OAAO,CAAC;AAAA,MACxC;AAAA,IACF,CAAC;AAAA,IACH,CAAC,cAAc,iBAAiB,WAAW;AAAA,EAC7C;AAEA,8BAAU,MAAM;AACd,UAAMA,qBAAoB,CAAC,EAAE,UAAU,eAAe,iBAAiB,WAAW,aAAa;AAC/F,yBAAqBA,kBAAiB;AAAA,EACxC,GAAG,CAAC,QAAQ,cAAc,iBAAiB,WAAW,CAAC;AAEvD,8BAAU,MAAM;AACd,QAAI,mBAAmB;AACrB,UAAI,gBAAgB,SAAS;AAC3B,gBAAQ,QAAQ,gBAAgB,OAAO;AAAA,MACzC;AAEA,aAAO,MAAM;AACX,gBAAQ,WAAW;AAAA,MACrB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,mBAAmB,cAAc,iBAAiB,aAAa,OAAO,CAAC;AACrF;","names":["dependenciesReady"]}

package/dist/browser/hooks/useDynamicMapResize.js

@@ -1,33 +0,0 @@
-// src/hooks/useDynamicMapResize.tsx
-import { useEffect, useMemo, useState } from "react";
-var useDynamicMapResize = (mapContainerRef, mapCanvasRef, mapInstance, active = true) => {
-  const [dependenciesReady, setDependenciesReady] = useState(false);
-  const resizer = useMemo(
-    () => new ResizeObserver(() => {
-      const width = mapContainerRef.current?.getBoundingClientRect().width;
-      if (width && mapCanvasRef.current) {
-        mapCanvasRef.current.style.width = `${width}px`;
-        setTimeout(() => mapInstance?.resize());
-      }
-    }),
-    [mapCanvasRef, mapContainerRef, mapInstance]
-  );
-  useEffect(() => {
-    const dependenciesReady2 = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current);
-    setDependenciesReady(dependenciesReady2);
-  }, [active, mapCanvasRef, mapContainerRef, mapInstance]);
-  useEffect(() => {
-    if (dependenciesReady) {
-      if (mapContainerRef.current) {
-        resizer.observe(mapContainerRef.current);
-      }
-      return () => {
-        resizer.disconnect();
-      };
-    }
-  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer]);
-};
-export {
-  useDynamicMapResize
-};
-//# sourceMappingURL=useDynamicMapResize.js.map

package/dist/browser/hooks/useDynamicMapResize.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/useDynamicMapResize.tsx"],"sourcesContent":["import { Map } from 'mapbox-gl'\nimport { MutableRefObject, useEffect, useMemo, useState } from 'react'\n\n/**\n * Inspired by - https://bl.ocks.org/danswick/fc56f37c10d40be62e4feac5984250d2\n */\nexport const useDynamicMapResize = (\n  mapContainerRef: MutableRefObject<HTMLDivElement | null>,\n  mapCanvasRef: MutableRefObject<HTMLCanvasElement | null>,\n  mapInstance?: Map,\n  active = true,\n) => {\n  const [dependenciesReady, setDependenciesReady] = useState(false)\n\n  const resizer = useMemo(\n    () =>\n      new ResizeObserver(() => {\n        const width = mapContainerRef.current?.getBoundingClientRect().width\n        if (width && mapCanvasRef.current) {\n          mapCanvasRef.current.style.width = `${width}px`\n          // setTimeout allows for the smoothest animation (vs requestAnimationFrame, debouce, etc)\n          // likely because it lets mapbox resize once when the event loop is ready?\n          setTimeout(() => mapInstance?.resize())\n        }\n      }),\n    [mapCanvasRef, mapContainerRef, mapInstance],\n  )\n\n  useEffect(() => {\n    const dependenciesReady = !!(active && mapInstance && mapContainerRef?.current && mapCanvasRef.current)\n    setDependenciesReady(dependenciesReady)\n  }, [active, mapCanvasRef, mapContainerRef, mapInstance])\n\n  useEffect(() => {\n    if (dependenciesReady) {\n      if (mapContainerRef.current) {\n        resizer.observe(mapContainerRef.current)\n      }\n\n      return () => {\n        resizer.disconnect()\n      }\n    }\n  }, [active, dependenciesReady, mapCanvasRef, mapContainerRef, mapInstance, resizer])\n}\n"],"mappings":";AACA,SAA2B,WAAW,SAAS,gBAAgB;AAKxD,IAAM,sBAAsB,CACjC,iBACA,cACA,aACA,SAAS,SACN;AACH,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAEhE,QAAM,UAAU;AAAA,IACd,MACE,IAAI,eAAe,MAAM;AACvB,YAAM,QAAQ,gBAAgB,SAAS,sBAAsB,EAAE;AAC/D,UAAI,SAAS,aAAa,SAAS;AACjC,qBAAa,QAAQ,MAAM,QAAQ,GAAG,KAAK;AAG3C,mBAAW,MAAM,aAAa,OAAO,CAAC;AAAA,MACxC;AAAA,IACF,CAAC;AAAA,IACH,CAAC,cAAc,iBAAiB,WAAW;AAAA,EAC7C;AAEA,YAAU,MAAM;AACd,UAAMA,qBAAoB,CAAC,EAAE,UAAU,eAAe,iBAAiB,WAAW,aAAa;AAC/F,yBAAqBA,kBAAiB;AAAA,EACxC,GAAG,CAAC,QAAQ,cAAc,iBAAiB,WAAW,CAAC;AAEvD,YAAU,MAAM;AACd,QAAI,mBAAmB;AACrB,UAAI,gBAAgB,SAAS;AAC3B,gBAAQ,QAAQ,gBAAgB,OAAO;AAAA,MACzC;AAEA,aAAO,MAAM;AACX,gBAAQ,WAAW;AAAA,MACrB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,mBAAmB,cAAc,iBAAiB,aAAa,OAAO,CAAC;AACrF;","names":["dependenciesReady"]}

package/dist/browser/hooks/useDynamicPositioning.cjs

@@ -1,55 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/hooks/useDynamicPositioning.tsx
-var useDynamicPositioning_exports = {};
-__export(useDynamicPositioning_exports, {
-  useDynamicPositioning: () => useDynamicPositioning
-});
-module.exports = __toCommonJS(useDynamicPositioning_exports);
-var import_react_shared = require("@xylabs/react-shared");
-var import_react = require("react");
-var defaultZoom = 1.6;
-var defaultAspectRatioRange = [0.5, 2];
-var latRange = [0.9121644205263664, 1.71785031559439];
-var lngRange = [-81.4742014851959, 12.788958675506933];
-var linearInterpolate = (aspectRatio, degreeRange, aspectRatioRange) => {
-  const [degreeMin, degreeMax] = degreeRange;
-  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange;
-  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin;
-  const degreeRangeSpan = degreeMax - degreeMin;
-  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan;
-  const scaledDegree = percent * degreeRangeSpan + degreeMin;
-  return scaledDegree;
-};
-var useDynamicPositioning = () => {
-  const [options, setOptions] = (0, import_react.useState)({});
-  const { width, height } = (0, import_react_shared.useWindowSize)();
-  (0, import_react.useEffect)(() => {
-    if (width && height) {
-      const aspectRatio = width / height;
-      setOptions({
-        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],
-        zoom: defaultZoom
-      });
-    }
-  }, [height, width]);
-  return { options };
-};
-//# sourceMappingURL=useDynamicPositioning.cjs.map

package/dist/browser/hooks/useDynamicPositioning.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/useDynamicPositioning.tsx"],"sourcesContent":["import { useWindowSize } from '@xylabs/react-shared'\nimport { MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useState } from 'react'\n\n/**\n * Zoom level for the map\n *\n * Note: Changing zoom will require changes to Lat/Lng Ranges\n */\nconst defaultZoom = 1.6\n\n/**\n * Range of aspect ratio values (width / height = aspect ratio) to scale against degrees\n * On lower aspect ratios, the width is larger than the height and vice-versa for higher\n */\nconst defaultAspectRatioRange = [0.5, 2]\n\n/**\n * Lat/Lng ranges, the first index is the minimum and the second is the maximum\n * Index 0 is for portrait screens and centers on the Eastern Hemisphere\n * Index 1 is for wider screens near the Prime Meridian and north of the Equator\n *\n * Note: Values are based off the zoom level\n */\nconst latRange = [0.9121644205263664, 1.71785031559439]\nconst lngRange = [-81.4742014851959, 12.788958675506933]\n\n/**\n * Function to interpolate an aspect ratio value across a range of degrees and aspect ratios\n *\n * Inspired by - https://stackoverflow.com/questions/14224535/scaling-between-two-number-ranges\n *\n * @param aspectRatio aspect ratio to scale\n * @param degreeRange A latitude or longitude range (i.e. [minLat, maxLat])\n * @param aspectRatioRange A range of aspect ratios to scale against degreeRange parameter\n * @returns number\n */\nconst linearInterpolate = (aspectRatio: number, degreeRange: number[], aspectRatioRange?: number[]): number => {\n  const [degreeMin, degreeMax] = degreeRange\n  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange\n\n  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin\n  const degreeRangeSpan = degreeMax - degreeMin\n\n  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan\n  const scaledDegree = percent * degreeRangeSpan + degreeMin\n\n  return scaledDegree\n}\n\nconst useDynamicPositioning = () => {\n  const [options, setOptions] = useState<Partial<MapboxOptions>>({})\n  const { width, height } = useWindowSize()\n\n  useEffect(() => {\n    if (width && height) {\n      const aspectRatio = width / height\n\n      setOptions({\n        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],\n        zoom: defaultZoom,\n      })\n    }\n  }, [height, width])\n\n  return { options }\n}\n\nexport { useDynamicPositioning }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA8B;AAE9B,mBAAoC;AAOpC,IAAM,cAAc;AAMpB,IAAM,0BAA0B,CAAC,KAAK,CAAC;AASvC,IAAM,WAAW,CAAC,oBAAoB,gBAAgB;AACtD,IAAM,WAAW,CAAC,mBAAmB,kBAAkB;AAYvD,IAAM,oBAAoB,CAAC,aAAqB,aAAuB,qBAAwC;AAC7G,QAAM,CAAC,WAAW,SAAS,IAAI;AAC/B,QAAM,CAAC,gBAAgB,cAAc,IAAI,oBAAoB;AAE7D,QAAM,uBAAuB,iBAAiB;AAC9C,QAAM,kBAAkB,YAAY;AAEpC,QAAM,WAAW,cAAc,kBAAkB;AACjD,QAAM,eAAe,UAAU,kBAAkB;AAEjD,SAAO;AACT;AAEA,IAAM,wBAAwB,MAAM;AAClC,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAiC,CAAC,CAAC;AACjE,QAAM,EAAE,OAAO,OAAO,QAAI,mCAAc;AAExC,8BAAU,MAAM;AACd,QAAI,SAAS,QAAQ;AACnB,YAAM,cAAc,QAAQ;AAE5B,iBAAW;AAAA,QACT,QAAQ,CAAC,kBAAkB,aAAa,QAAQ,GAAG,kBAAkB,aAAa,QAAQ,CAAC;AAAA,QAC3F,MAAM;AAAA,MACR,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO,EAAE,QAAQ;AACnB;","names":[]}

package/dist/browser/hooks/useDynamicPositioning.js

@@ -1,34 +0,0 @@
-// src/hooks/useDynamicPositioning.tsx
-import { useWindowSize } from "@xylabs/react-shared";
-import { useEffect, useState } from "react";
-var defaultZoom = 1.6;
-var defaultAspectRatioRange = [0.5, 2];
-var latRange = [0.9121644205263664, 1.71785031559439];
-var lngRange = [-81.4742014851959, 12.788958675506933];
-var linearInterpolate = (aspectRatio, degreeRange, aspectRatioRange) => {
-  const [degreeMin, degreeMax] = degreeRange;
-  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange;
-  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin;
-  const degreeRangeSpan = degreeMax - degreeMin;
-  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan;
-  const scaledDegree = percent * degreeRangeSpan + degreeMin;
-  return scaledDegree;
-};
-var useDynamicPositioning = () => {
-  const [options, setOptions] = useState({});
-  const { width, height } = useWindowSize();
-  useEffect(() => {
-    if (width && height) {
-      const aspectRatio = width / height;
-      setOptions({
-        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],
-        zoom: defaultZoom
-      });
-    }
-  }, [height, width]);
-  return { options };
-};
-export {
-  useDynamicPositioning
-};
-//# sourceMappingURL=useDynamicPositioning.js.map

package/dist/browser/hooks/useDynamicPositioning.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/hooks/useDynamicPositioning.tsx"],"sourcesContent":["import { useWindowSize } from '@xylabs/react-shared'\nimport { MapboxOptions } from 'mapbox-gl'\nimport { useEffect, useState } from 'react'\n\n/**\n * Zoom level for the map\n *\n * Note: Changing zoom will require changes to Lat/Lng Ranges\n */\nconst defaultZoom = 1.6\n\n/**\n * Range of aspect ratio values (width / height = aspect ratio) to scale against degrees\n * On lower aspect ratios, the width is larger than the height and vice-versa for higher\n */\nconst defaultAspectRatioRange = [0.5, 2]\n\n/**\n * Lat/Lng ranges, the first index is the minimum and the second is the maximum\n * Index 0 is for portrait screens and centers on the Eastern Hemisphere\n * Index 1 is for wider screens near the Prime Meridian and north of the Equator\n *\n * Note: Values are based off the zoom level\n */\nconst latRange = [0.9121644205263664, 1.71785031559439]\nconst lngRange = [-81.4742014851959, 12.788958675506933]\n\n/**\n * Function to interpolate an aspect ratio value across a range of degrees and aspect ratios\n *\n * Inspired by - https://stackoverflow.com/questions/14224535/scaling-between-two-number-ranges\n *\n * @param aspectRatio aspect ratio to scale\n * @param degreeRange A latitude or longitude range (i.e. [minLat, maxLat])\n * @param aspectRatioRange A range of aspect ratios to scale against degreeRange parameter\n * @returns number\n */\nconst linearInterpolate = (aspectRatio: number, degreeRange: number[], aspectRatioRange?: number[]): number => {\n  const [degreeMin, degreeMax] = degreeRange\n  const [aspectRatioMin, aspectRatioMax] = aspectRatioRange || defaultAspectRatioRange\n\n  const aspectRatioRangeSpan = aspectRatioMax - aspectRatioMin\n  const degreeRangeSpan = degreeMax - degreeMin\n\n  const percent = (aspectRatio - aspectRatioMin) / aspectRatioRangeSpan\n  const scaledDegree = percent * degreeRangeSpan + degreeMin\n\n  return scaledDegree\n}\n\nconst useDynamicPositioning = () => {\n  const [options, setOptions] = useState<Partial<MapboxOptions>>({})\n  const { width, height } = useWindowSize()\n\n  useEffect(() => {\n    if (width && height) {\n      const aspectRatio = width / height\n\n      setOptions({\n        center: [linearInterpolate(aspectRatio, lngRange), linearInterpolate(aspectRatio, latRange)],\n        zoom: defaultZoom,\n      })\n    }\n  }, [height, width])\n\n  return { options }\n}\n\nexport { useDynamicPositioning }\n"],"mappings":";AAAA,SAAS,qBAAqB;AAE9B,SAAS,WAAW,gBAAgB;AAOpC,IAAM,cAAc;AAMpB,IAAM,0BAA0B,CAAC,KAAK,CAAC;AASvC,IAAM,WAAW,CAAC,oBAAoB,gBAAgB;AACtD,IAAM,WAAW,CAAC,mBAAmB,kBAAkB;AAYvD,IAAM,oBAAoB,CAAC,aAAqB,aAAuB,qBAAwC;AAC7G,QAAM,CAAC,WAAW,SAAS,IAAI;AAC/B,QAAM,CAAC,gBAAgB,cAAc,IAAI,oBAAoB;AAE7D,QAAM,uBAAuB,iBAAiB;AAC9C,QAAM,kBAAkB,YAAY;AAEpC,QAAM,WAAW,cAAc,kBAAkB;AACjD,QAAM,eAAe,UAAU,kBAAkB;AAEjD,SAAO;AACT;AAEA,IAAM,wBAAwB,MAAM;AAClC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiC,CAAC,CAAC;AACjE,QAAM,EAAE,OAAO,OAAO,IAAI,cAAc;AAExC,YAAU,MAAM;AACd,QAAI,SAAS,QAAQ;AACnB,YAAM,cAAc,QAAQ;AAE5B,iBAAW;AAAA,QACT,QAAQ,CAAC,kBAAkB,aAAa,QAAQ,GAAG,kBAAkB,aAAa,QAAQ,CAAC;AAAA,QAC3F,MAAM;AAAA,MACR,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO,EAAE,QAAQ;AACnB;","names":[]}