@macrostrat/column-views 3.0.3 → 3.2.0

package/dist/maps/units-overlay/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/maps/units-overlay/index.ts"],"sourcesContent":["import {\n  useLithologies,\n  useMacrostratColumns,\n} from \"@macrostrat/data-provider\";\nimport { useAPIResult } from \"@macrostrat/ui-components\";\nimport { useMapStyleOperator } from \"@macrostrat/mapbox-react\";\nimport { FeatureCollection } from \"geojson\";\nimport { useMemo } from \"react\";\nimport { mergeStyles, setGeoJSON } from \"@macrostrat/mapbox-utils\";\nimport { UnitLithology, UnitLong } from \"@macrostrat/api-types\";\nimport { flattenLithologies, getMixedColorForData } from \"../../units\";\nimport { getBestFGDCPatternForLithologyList } from \"../../units/resolvers\";\nimport {\n  setupStyleImageManager,\n  loadStyleImage,\n  StyleFragment,\n} from \"@macrostrat/map-styles\";\nimport { asChromaColor, getCSSVariable } from \"@macrostrat/color-utils\";\nimport { buildGeoJSONSource } from \"@macrostrat/mapbox-utils\";\nimport pMap from \"p-map\";\n\nexport interface UnitsOverlayProps {\n  time: number;\n  ageSpan?: number;\n  project?: number | number[];\n  patterns?: boolean;\n}\n\nexport function MacrostratUnitsOverlay(props: UnitsOverlayProps) {\n  const { time, ageSpan = 0.05, patterns = false } = props;\n  const lithMap = useLithologies();\n\n  useMapStyleOperator(\n    (map) => {\n      if (!patterns) return;\n      setupStyleImageManager(map, { verbose: false });\n    },\n    [patterns],\n  );\n\n  const params = useMemo(() => {\n    let project: number[] | undefined;\n    if (Number.isFinite(props.project)) {\n      project = [props.project as number];\n    } else if (!Array.isArray(props.project)) {\n      project = undefined;\n    }\n    // Project can only be a single project for now\n    const projectCompat =\n      project != null && project.length > 0 ? project[0] : undefined;\n\n    return {\n      age_bottom: time + ageSpan / 2,\n      age_top: time - ageSpan / 2,\n      response: \"long\",\n      project: projectCompat,\n    };\n  }, [time, ageSpan, props.project]);\n\n  const units: UnitLong[] = useAPIResult(\"/units\", params);\n  const columns = useMacrostratColumns(params.project, false);\n\n  // Set up basic columns layer\n  useMapStyleOperator(\n    (map) => {\n      if (columns == null) {\n        return;\n      }\n      const data: FeatureCollection = {\n        type: \"FeatureCollection\",\n        features: columns,\n      };\n      setGeoJSON(map, \"columns\", data);\n    },\n    [columns],\n  );\n\n  useMapStyleOperator(\n    (map) => {\n      if (units == null || columns == null || lithMap == null) {\n        return;\n      }\n\n      const getColorForLithology = (data: UnitLithology): string | null => {\n        return lithMap?.get(data.lith_id)?.color ?? null;\n      };\n\n      const unitsMap = postProcessUnits(units, getColorForLithology);\n      handleUnitsLayerUpdate(map, unitsMap, columns);\n      if (patterns) {\n        handlePatternOverlayUpdate(\n          map,\n          unitsMap,\n          columns,\n          getColorForLithology,\n        ).then(() => {});\n      }\n    },\n    [units, lithMap, columns, patterns],\n  );\n\n  return null;\n}\n\nfunction handleUnitsLayerUpdate(\n  map,\n  unitsMap: Map<number, UnitsDisplayInfo>,\n  columns: any[],\n) {\n  // Update feature states\n  for (const column of columns) {\n    const col_id = column.properties.col_id;\n    const info = unitsMap.get(Number(col_id));\n    const color = info?.color;\n    map.setFeatureState(\n      { source: \"columns\", id: col_id },\n      {\n        color,\n        shown: color != null,\n      },\n    );\n  }\n}\n\nasync function handlePatternOverlayUpdate(\n  map,\n  unitsMap: Map<number, UnitsDisplayInfo>,\n  columns: any[],\n  getColor: LithologyColorGetter,\n) {\n  // synthesize patterns not yet in cache\n\n  const colsWithPatterns = [];\n  const patternIDs = new Set<string>();\n  // Update feature states\n  for (const column of columns) {\n    const col_id = column.properties.col_id;\n    const info = unitsMap.get(Number(col_id));\n    if (info == null) continue;\n    const pattern = getPatternSpec(info?.liths, getColor);\n    if (pattern == null) continue;\n\n    colsWithPatterns.push({\n      type: \"Feature\",\n      geometry: column.geometry,\n      properties: {\n        col_id,\n        pattern,\n      },\n    });\n    patternIDs.add(pattern);\n  }\n\n  const patternsToLoad = patternIDs.values().filter((d) => !map.hasImage(d));\n\n  const mapper = async (patternID) => {\n    try {\n      await loadStyleImage(map, patternID, { pixelRatio: 10 });\n    } catch (e) {}\n  };\n  // Load all pattern images\n  await pMap(patternsToLoad, mapper, { concurrency: 5 });\n\n  // Set data for pattern layer\n  // This is inefficient but the only way to set per-feature patterns in Mapbox\n  const patternData: FeatureCollection = {\n    type: \"FeatureCollection\",\n    features: colsWithPatterns,\n  };\n  setGeoJSON(map, \"column-patterns\", patternData);\n}\n\nconst cachedColors = new Map<string, string>();\n\nfunction getDarkenedColor(color: string): string {\n  /** Memoized function to get a darkened version of a color for pattern use */\n  if (cachedColors.has(color)) {\n    return cachedColors.get(color);\n  }\n  const c1 = asChromaColor(color).set(\"hsl.l\", 0.4).set(\"hsl.s\", 0.8).hex();\n  cachedColors.set(color, c1);\n  return c1;\n}\n\ninterface UnitsDisplayInfo {\n  col_id: number;\n  units: UnitLong[];\n  color: string;\n  liths: UnitLithology[];\n}\n\ntype LithologyColorGetter = (val: UnitLithology) => string | null;\n\nfunction postProcessUnits(\n  units: UnitLong[],\n  getColor: LithologyColorGetter,\n): Map<number, UnitsDisplayInfo> {\n  // Group by col_id\n  const unitsByColumn: Map<number, UnitLong[]> = new Map();\n  for (const unit of units) {\n    const col_id = Number(unit.col_id);\n    if (!unitsByColumn.has(col_id)) {\n      unitsByColumn.set(col_id, [unit]);\n    } else {\n      unitsByColumn.set(col_id, [...unitsByColumn.get(col_id), unit]);\n    }\n  }\n\n  // Summarize units for display\n  const res = new Map<number, UnitsDisplayInfo>();\n  for (const [col_id, unitList] of unitsByColumn.entries()) {\n    const liths = flattenLithologies(unitList.map((u) => u.lith));\n    res.set(col_id, {\n      col_id,\n      units: unitList,\n      liths,\n      color: getMixedColorForData(liths, getColor),\n    });\n  }\n\n  return res;\n}\n\nfunction getPatternSpec(\n  liths: UnitLithology[],\n  getColor: LithologyColorGetter,\n): string | null {\n  const patternData = getBestFGDCPatternForLithologyList(liths);\n  if (patternData == null) return null;\n  let { patternID, lith } = patternData;\n  const color = getDarkenedColor(getColor(lith));\n  return `fgdc:${patternID}:${color}:transparent`;\n}\n\ntype UnitsStyleOptions = {\n  color?: string;\n  patterns?: boolean;\n};\n\nexport function buildUnitsStyle(opts: UnitsStyleOptions = {}): StyleFragment {\n  const { color = null, patterns = false } = opts;\n\n  let columnBaseColor: any =\n    color ?? getCSSVariable(\"--text-subtle-color\", \"black\");\n  const columnSelectedColor = getCSSVariable(\"--selection-color\", \"purple\");\n\n  // If color is in the feature state or geojson properties, use that as second choice\n\n  let columnColor: any = [\n    \"coalesce\",\n    [\"feature-state\", \"color\"],\n    [\"get\", \"color\"],\n    columnBaseColor,\n  ];\n\n  const baseStyle: StyleFragment = {\n    sources: {\n      columns: buildGeoJSONSource(),\n    },\n    version: 8,\n    layers: [\n      {\n        id: \"columns-fill\",\n        type: \"fill\",\n        source: \"columns\",\n        paint: {\n          \"fill-color\": columnColor,\n          \"fill-opacity\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            0.8,\n            [\"boolean\", [\"feature-state\", \"hover\"], false],\n            0.3,\n            0.1,\n          ],\n        },\n      },\n      {\n        id: \"columns-line\",\n        type: \"line\",\n        source: \"columns\",\n        paint: {\n          \"line-color\": columnColor,\n          \"line-width\": 1,\n          \"line-opacity\": 0.5,\n        },\n      },\n      {\n        id: \"columns-points\",\n        type: \"circle\",\n        source: \"columns\",\n        paint: {\n          \"circle-radius\": 4,\n          \"circle-color\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            columnColor,\n            columnBaseColor,\n          ],\n          \"circle-opacity\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            0.8,\n            [\"boolean\", [\"feature-state\", \"hover\"], false],\n            0.3,\n            0.1,\n          ],\n        },\n        filter: [\"==\", \"$type\", \"Point\"],\n      },\n    ],\n  };\n\n  if (!patterns) {\n    return baseStyle;\n  }\n\n  const patternStyle: StyleFragment = {\n    sources: {\n      \"column-patterns\": buildGeoJSONSource(),\n    },\n    layers: [\n      {\n        id: \"columns-fill-pattern\",\n        type: \"fill\",\n        source: \"column-patterns\",\n        paint: {\n          \"fill-pattern\": [\"get\", \"pattern\"],\n          \"fill-opacity\": 1,\n        },\n      },\n    ],\n  };\n\n  return mergeStyles(baseStyle, patternStyle);\n}\n"],"names":["useLithologies","useMapStyleOperator","setupStyleImageManager","useMemo","useAPIResult","useMacrostratColumns","setGeoJSON","loadStyleImage","pMap","asChromaColor","flattenLithologies","getMixedColorForData","getBestFGDCPatternForLithologyList","getCSSVariable","buildGeoJSONSource","mergeStyles"],"mappings":"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"}

package/dist/maps/units-overlay/index.d.ts

@@ -0,0 +1,14 @@
+import { StyleFragment } from '@macrostrat/map-styles';
+export interface UnitsOverlayProps {
+    time: number;
+    ageSpan?: number;
+    project?: number | number[];
+    patterns?: boolean;
+}
+export declare function MacrostratUnitsOverlay(props: UnitsOverlayProps): any;
+type UnitsStyleOptions = {
+    color?: string;
+    patterns?: boolean;
+};
+export declare function buildUnitsStyle(opts?: UnitsStyleOptions): StyleFragment;
+export {};

package/dist/maps/units-overlay/index.js

@@ -0,0 +1,252 @@
+import { useLithologies, useMacrostratColumns } from "@macrostrat/data-provider";
+import { useAPIResult } from "@macrostrat/ui-components";
+import { useMapStyleOperator } from "@macrostrat/mapbox-react";
+import { useMemo } from "react";
+import { setGeoJSON, buildGeoJSONSource, mergeStyles } from "@macrostrat/mapbox-utils";
+import { getBestFGDCPatternForLithologyList } from "../../units/resolvers.js";
+import { setupStyleImageManager, loadStyleImage } from "@macrostrat/map-styles";
+import { getCSSVariable, asChromaColor } from "@macrostrat/color-utils";
+import pMap from "p-map";
+import { flattenLithologies, getMixedColorForData } from "../../units/colors.js";
+function MacrostratUnitsOverlay(props) {
+  const { time, ageSpan = 0.05, patterns = false } = props;
+  const lithMap = useLithologies();
+  useMapStyleOperator(
+    (map) => {
+      if (!patterns) return;
+      setupStyleImageManager(map, { verbose: false });
+    },
+    [patterns]
+  );
+  const params = useMemo(() => {
+    let project;
+    if (Number.isFinite(props.project)) {
+      project = [props.project];
+    } else if (!Array.isArray(props.project)) {
+      project = void 0;
+    }
+    const projectCompat = project != null && project.length > 0 ? project[0] : void 0;
+    return {
+      age_bottom: time + ageSpan / 2,
+      age_top: time - ageSpan / 2,
+      response: "long",
+      project: projectCompat
+    };
+  }, [time, ageSpan, props.project]);
+  const units = useAPIResult("/units", params);
+  const columns = useMacrostratColumns(params.project, false);
+  useMapStyleOperator(
+    (map) => {
+      if (columns == null) {
+        return;
+      }
+      const data = {
+        type: "FeatureCollection",
+        features: columns
+      };
+      setGeoJSON(map, "columns", data);
+    },
+    [columns]
+  );
+  useMapStyleOperator(
+    (map) => {
+      if (units == null || columns == null || lithMap == null) {
+        return;
+      }
+      const getColorForLithology = (data) => {
+        return lithMap?.get(data.lith_id)?.color ?? null;
+      };
+      const unitsMap = postProcessUnits(units, getColorForLithology);
+      handleUnitsLayerUpdate(map, unitsMap, columns);
+      if (patterns) {
+        handlePatternOverlayUpdate(
+          map,
+          unitsMap,
+          columns,
+          getColorForLithology
+        ).then(() => {
+        });
+      }
+    },
+    [units, lithMap, columns, patterns]
+  );
+  return null;
+}
+function handleUnitsLayerUpdate(map, unitsMap, columns) {
+  for (const column of columns) {
+    const col_id = column.properties.col_id;
+    const info = unitsMap.get(Number(col_id));
+    const color = info?.color;
+    map.setFeatureState(
+      { source: "columns", id: col_id },
+      {
+        color,
+        shown: color != null
+      }
+    );
+  }
+}
+async function handlePatternOverlayUpdate(map, unitsMap, columns, getColor) {
+  const colsWithPatterns = [];
+  const patternIDs = /* @__PURE__ */ new Set();
+  for (const column of columns) {
+    const col_id = column.properties.col_id;
+    const info = unitsMap.get(Number(col_id));
+    if (info == null) continue;
+    const pattern = getPatternSpec(info?.liths, getColor);
+    if (pattern == null) continue;
+    colsWithPatterns.push({
+      type: "Feature",
+      geometry: column.geometry,
+      properties: {
+        col_id,
+        pattern
+      }
+    });
+    patternIDs.add(pattern);
+  }
+  const patternsToLoad = patternIDs.values().filter((d) => !map.hasImage(d));
+  const mapper = async (patternID) => {
+    try {
+      await loadStyleImage(map, patternID, { pixelRatio: 10 });
+    } catch (e) {
+    }
+  };
+  await pMap(patternsToLoad, mapper, { concurrency: 5 });
+  const patternData = {
+    type: "FeatureCollection",
+    features: colsWithPatterns
+  };
+  setGeoJSON(map, "column-patterns", patternData);
+}
+const cachedColors = /* @__PURE__ */ new Map();
+function getDarkenedColor(color) {
+  if (cachedColors.has(color)) {
+    return cachedColors.get(color);
+  }
+  const c1 = asChromaColor(color).set("hsl.l", 0.4).set("hsl.s", 0.8).hex();
+  cachedColors.set(color, c1);
+  return c1;
+}
+function postProcessUnits(units, getColor) {
+  const unitsByColumn = /* @__PURE__ */ new Map();
+  for (const unit of units) {
+    const col_id = Number(unit.col_id);
+    if (!unitsByColumn.has(col_id)) {
+      unitsByColumn.set(col_id, [unit]);
+    } else {
+      unitsByColumn.set(col_id, [...unitsByColumn.get(col_id), unit]);
+    }
+  }
+  const res = /* @__PURE__ */ new Map();
+  for (const [col_id, unitList] of unitsByColumn.entries()) {
+    const liths = flattenLithologies(unitList.map((u) => u.lith));
+    res.set(col_id, {
+      col_id,
+      units: unitList,
+      liths,
+      color: getMixedColorForData(liths, getColor)
+    });
+  }
+  return res;
+}
+function getPatternSpec(liths, getColor) {
+  const patternData = getBestFGDCPatternForLithologyList(liths);
+  if (patternData == null) return null;
+  let { patternID, lith } = patternData;
+  const color = getDarkenedColor(getColor(lith));
+  return `fgdc:${patternID}:${color}:transparent`;
+}
+function buildUnitsStyle(opts = {}) {
+  const { color = null, patterns = false } = opts;
+  let columnBaseColor = color ?? getCSSVariable("--text-subtle-color", "black");
+  getCSSVariable("--selection-color", "purple");
+  let columnColor = [
+    "coalesce",
+    ["feature-state", "color"],
+    ["get", "color"],
+    columnBaseColor
+  ];
+  const baseStyle = {
+    sources: {
+      columns: buildGeoJSONSource()
+    },
+    version: 8,
+    layers: [
+      {
+        id: "columns-fill",
+        type: "fill",
+        source: "columns",
+        paint: {
+          "fill-color": columnColor,
+          "fill-opacity": [
+            "case",
+            ["boolean", ["feature-state", "shown"], false],
+            0.8,
+            ["boolean", ["feature-state", "hover"], false],
+            0.3,
+            0.1
+          ]
+        }
+      },
+      {
+        id: "columns-line",
+        type: "line",
+        source: "columns",
+        paint: {
+          "line-color": columnColor,
+          "line-width": 1,
+          "line-opacity": 0.5
+        }
+      },
+      {
+        id: "columns-points",
+        type: "circle",
+        source: "columns",
+        paint: {
+          "circle-radius": 4,
+          "circle-color": [
+            "case",
+            ["boolean", ["feature-state", "shown"], false],
+            columnColor,
+            columnBaseColor
+          ],
+          "circle-opacity": [
+            "case",
+            ["boolean", ["feature-state", "shown"], false],
+            0.8,
+            ["boolean", ["feature-state", "hover"], false],
+            0.3,
+            0.1
+          ]
+        },
+        filter: ["==", "$type", "Point"]
+      }
+    ]
+  };
+  if (!patterns) {
+    return baseStyle;
+  }
+  const patternStyle = {
+    sources: {
+      "column-patterns": buildGeoJSONSource()
+    },
+    layers: [
+      {
+        id: "columns-fill-pattern",
+        type: "fill",
+        source: "column-patterns",
+        paint: {
+          "fill-pattern": ["get", "pattern"],
+          "fill-opacity": 1
+        }
+      }
+    ]
+  };
+  return mergeStyles(baseStyle, patternStyle);
+}
+export {
+  MacrostratUnitsOverlay,
+  buildUnitsStyle
+};
+//# sourceMappingURL=index.js.map

package/dist/maps/units-overlay/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/maps/units-overlay/index.ts"],"sourcesContent":["import {\n  useLithologies,\n  useMacrostratColumns,\n} from \"@macrostrat/data-provider\";\nimport { useAPIResult } from \"@macrostrat/ui-components\";\nimport { useMapStyleOperator } from \"@macrostrat/mapbox-react\";\nimport { FeatureCollection } from \"geojson\";\nimport { useMemo } from \"react\";\nimport { mergeStyles, setGeoJSON } from \"@macrostrat/mapbox-utils\";\nimport { UnitLithology, UnitLong } from \"@macrostrat/api-types\";\nimport { flattenLithologies, getMixedColorForData } from \"../../units\";\nimport { getBestFGDCPatternForLithologyList } from \"../../units/resolvers\";\nimport {\n  setupStyleImageManager,\n  loadStyleImage,\n  StyleFragment,\n} from \"@macrostrat/map-styles\";\nimport { asChromaColor, getCSSVariable } from \"@macrostrat/color-utils\";\nimport { buildGeoJSONSource } from \"@macrostrat/mapbox-utils\";\nimport pMap from \"p-map\";\n\nexport interface UnitsOverlayProps {\n  time: number;\n  ageSpan?: number;\n  project?: number | number[];\n  patterns?: boolean;\n}\n\nexport function MacrostratUnitsOverlay(props: UnitsOverlayProps) {\n  const { time, ageSpan = 0.05, patterns = false } = props;\n  const lithMap = useLithologies();\n\n  useMapStyleOperator(\n    (map) => {\n      if (!patterns) return;\n      setupStyleImageManager(map, { verbose: false });\n    },\n    [patterns],\n  );\n\n  const params = useMemo(() => {\n    let project: number[] | undefined;\n    if (Number.isFinite(props.project)) {\n      project = [props.project as number];\n    } else if (!Array.isArray(props.project)) {\n      project = undefined;\n    }\n    // Project can only be a single project for now\n    const projectCompat =\n      project != null && project.length > 0 ? project[0] : undefined;\n\n    return {\n      age_bottom: time + ageSpan / 2,\n      age_top: time - ageSpan / 2,\n      response: \"long\",\n      project: projectCompat,\n    };\n  }, [time, ageSpan, props.project]);\n\n  const units: UnitLong[] = useAPIResult(\"/units\", params);\n  const columns = useMacrostratColumns(params.project, false);\n\n  // Set up basic columns layer\n  useMapStyleOperator(\n    (map) => {\n      if (columns == null) {\n        return;\n      }\n      const data: FeatureCollection = {\n        type: \"FeatureCollection\",\n        features: columns,\n      };\n      setGeoJSON(map, \"columns\", data);\n    },\n    [columns],\n  );\n\n  useMapStyleOperator(\n    (map) => {\n      if (units == null || columns == null || lithMap == null) {\n        return;\n      }\n\n      const getColorForLithology = (data: UnitLithology): string | null => {\n        return lithMap?.get(data.lith_id)?.color ?? null;\n      };\n\n      const unitsMap = postProcessUnits(units, getColorForLithology);\n      handleUnitsLayerUpdate(map, unitsMap, columns);\n      if (patterns) {\n        handlePatternOverlayUpdate(\n          map,\n          unitsMap,\n          columns,\n          getColorForLithology,\n        ).then(() => {});\n      }\n    },\n    [units, lithMap, columns, patterns],\n  );\n\n  return null;\n}\n\nfunction handleUnitsLayerUpdate(\n  map,\n  unitsMap: Map<number, UnitsDisplayInfo>,\n  columns: any[],\n) {\n  // Update feature states\n  for (const column of columns) {\n    const col_id = column.properties.col_id;\n    const info = unitsMap.get(Number(col_id));\n    const color = info?.color;\n    map.setFeatureState(\n      { source: \"columns\", id: col_id },\n      {\n        color,\n        shown: color != null,\n      },\n    );\n  }\n}\n\nasync function handlePatternOverlayUpdate(\n  map,\n  unitsMap: Map<number, UnitsDisplayInfo>,\n  columns: any[],\n  getColor: LithologyColorGetter,\n) {\n  // synthesize patterns not yet in cache\n\n  const colsWithPatterns = [];\n  const patternIDs = new Set<string>();\n  // Update feature states\n  for (const column of columns) {\n    const col_id = column.properties.col_id;\n    const info = unitsMap.get(Number(col_id));\n    if (info == null) continue;\n    const pattern = getPatternSpec(info?.liths, getColor);\n    if (pattern == null) continue;\n\n    colsWithPatterns.push({\n      type: \"Feature\",\n      geometry: column.geometry,\n      properties: {\n        col_id,\n        pattern,\n      },\n    });\n    patternIDs.add(pattern);\n  }\n\n  const patternsToLoad = patternIDs.values().filter((d) => !map.hasImage(d));\n\n  const mapper = async (patternID) => {\n    try {\n      await loadStyleImage(map, patternID, { pixelRatio: 10 });\n    } catch (e) {}\n  };\n  // Load all pattern images\n  await pMap(patternsToLoad, mapper, { concurrency: 5 });\n\n  // Set data for pattern layer\n  // This is inefficient but the only way to set per-feature patterns in Mapbox\n  const patternData: FeatureCollection = {\n    type: \"FeatureCollection\",\n    features: colsWithPatterns,\n  };\n  setGeoJSON(map, \"column-patterns\", patternData);\n}\n\nconst cachedColors = new Map<string, string>();\n\nfunction getDarkenedColor(color: string): string {\n  /** Memoized function to get a darkened version of a color for pattern use */\n  if (cachedColors.has(color)) {\n    return cachedColors.get(color);\n  }\n  const c1 = asChromaColor(color).set(\"hsl.l\", 0.4).set(\"hsl.s\", 0.8).hex();\n  cachedColors.set(color, c1);\n  return c1;\n}\n\ninterface UnitsDisplayInfo {\n  col_id: number;\n  units: UnitLong[];\n  color: string;\n  liths: UnitLithology[];\n}\n\ntype LithologyColorGetter = (val: UnitLithology) => string | null;\n\nfunction postProcessUnits(\n  units: UnitLong[],\n  getColor: LithologyColorGetter,\n): Map<number, UnitsDisplayInfo> {\n  // Group by col_id\n  const unitsByColumn: Map<number, UnitLong[]> = new Map();\n  for (const unit of units) {\n    const col_id = Number(unit.col_id);\n    if (!unitsByColumn.has(col_id)) {\n      unitsByColumn.set(col_id, [unit]);\n    } else {\n      unitsByColumn.set(col_id, [...unitsByColumn.get(col_id), unit]);\n    }\n  }\n\n  // Summarize units for display\n  const res = new Map<number, UnitsDisplayInfo>();\n  for (const [col_id, unitList] of unitsByColumn.entries()) {\n    const liths = flattenLithologies(unitList.map((u) => u.lith));\n    res.set(col_id, {\n      col_id,\n      units: unitList,\n      liths,\n      color: getMixedColorForData(liths, getColor),\n    });\n  }\n\n  return res;\n}\n\nfunction getPatternSpec(\n  liths: UnitLithology[],\n  getColor: LithologyColorGetter,\n): string | null {\n  const patternData = getBestFGDCPatternForLithologyList(liths);\n  if (patternData == null) return null;\n  let { patternID, lith } = patternData;\n  const color = getDarkenedColor(getColor(lith));\n  return `fgdc:${patternID}:${color}:transparent`;\n}\n\ntype UnitsStyleOptions = {\n  color?: string;\n  patterns?: boolean;\n};\n\nexport function buildUnitsStyle(opts: UnitsStyleOptions = {}): StyleFragment {\n  const { color = null, patterns = false } = opts;\n\n  let columnBaseColor: any =\n    color ?? getCSSVariable(\"--text-subtle-color\", \"black\");\n  const columnSelectedColor = getCSSVariable(\"--selection-color\", \"purple\");\n\n  // If color is in the feature state or geojson properties, use that as second choice\n\n  let columnColor: any = [\n    \"coalesce\",\n    [\"feature-state\", \"color\"],\n    [\"get\", \"color\"],\n    columnBaseColor,\n  ];\n\n  const baseStyle: StyleFragment = {\n    sources: {\n      columns: buildGeoJSONSource(),\n    },\n    version: 8,\n    layers: [\n      {\n        id: \"columns-fill\",\n        type: \"fill\",\n        source: \"columns\",\n        paint: {\n          \"fill-color\": columnColor,\n          \"fill-opacity\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            0.8,\n            [\"boolean\", [\"feature-state\", \"hover\"], false],\n            0.3,\n            0.1,\n          ],\n        },\n      },\n      {\n        id: \"columns-line\",\n        type: \"line\",\n        source: \"columns\",\n        paint: {\n          \"line-color\": columnColor,\n          \"line-width\": 1,\n          \"line-opacity\": 0.5,\n        },\n      },\n      {\n        id: \"columns-points\",\n        type: \"circle\",\n        source: \"columns\",\n        paint: {\n          \"circle-radius\": 4,\n          \"circle-color\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            columnColor,\n            columnBaseColor,\n          ],\n          \"circle-opacity\": [\n            \"case\",\n            [\"boolean\", [\"feature-state\", \"shown\"], false],\n            0.8,\n            [\"boolean\", [\"feature-state\", \"hover\"], false],\n            0.3,\n            0.1,\n          ],\n        },\n        filter: [\"==\", \"$type\", \"Point\"],\n      },\n    ],\n  };\n\n  if (!patterns) {\n    return baseStyle;\n  }\n\n  const patternStyle: StyleFragment = {\n    sources: {\n      \"column-patterns\": buildGeoJSONSource(),\n    },\n    layers: [\n      {\n        id: \"columns-fill-pattern\",\n        type: \"fill\",\n        source: \"column-patterns\",\n        paint: {\n          \"fill-pattern\": [\"get\", \"pattern\"],\n          \"fill-opacity\": 1,\n        },\n      },\n    ],\n  };\n\n  return mergeStyles(baseStyle, patternStyle);\n}\n"],"names":[],"mappings":"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"}

package/dist/section.cjs

@@ -5,10 +5,10 @@ const timescale = require("@macrostrat/timescale");
 const columnComponents = require("@macrostrat/column-components");
 const h$1 = require("@macrostrat/hyper");
 const column_module = require("./column.module.sass.cjs");
+const dataProvider = require("@macrostrat/data-provider");
 const dataComponents = require("@macrostrat/data-components");
 const store = require("./data-provider/store.cjs");
 const composite = require("./units/composite.cjs");
-const base = require("./data-provider/base.cjs");
 const panel = require("./unit-details/panel.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const h__default = /* @__PURE__ */ _interopDefault(h$1);
@@ -126,7 +126,7 @@ function SectionUnits(props) {
     "g.section",
     { className, style, transform: `translate(0 ${scaleInfo.offset})` },
     h(
-      base.MacrostratColumnProvider,
+      store.MacrostratColumnProvider,
       {
         units,
         domain,
@@ -156,7 +156,7 @@ function CompositeTimescale(props) {
 }
 function CompositeTimescaleCore(props) {
   const { levels = 3, packages, unconformityLabels = false } = props;
-  const baseURL = base.useMacrostratBaseURL();
+  const baseURL = dataProvider.useMacrostratBaseURL();
   const intervals = timescale.useMacrostratIntervals(baseURL);
   let _levels;
   if (typeof levels === "number") {

package/dist/section.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"section.cjs","sources":["../src/section.ts"],"sourcesContent":["import {\n  CompositeUnitsColumn,\n  LabelTrackerProvider,\n  SectionLabelsColumn,\n} from \"./units\";\nimport { ReactNode, FunctionComponent, useMemo } from \"react\";\nimport {\n  Timescale,\n  TimescaleOrientation,\n  useMacrostratIntervals,\n} from \"@macrostrat/timescale\";\nimport { ColumnAxisType, SVG } from \"@macrostrat/column-components\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./column.module.sass\";\nimport {\n  useMacrostratColumnData,\n  useMacrostratUnits,\n  MacrostratColumnProvider,\n  useMacrostratBaseURL,\n} from \"./data-provider\";\nimport { Duration } from \"./unit-details\";\nimport { Value } from \"@macrostrat/data-components\";\nimport type { ExtUnit, PackageScaleLayoutData } from \"./prepare-units/types\";\n\nconst h = hyper.styled(styles);\n\nexport interface SectionSharedProps {\n  unitComponent?: FunctionComponent<any>;\n  unitComponentProps?: any;\n  showLabels?: boolean;\n  width?: number;\n  columnWidth?: number;\n  children?: ReactNode;\n  showLabelColumn?: boolean;\n  axisType?: ColumnAxisType;\n  className?: string;\n  clipUnits?: boolean;\n  maxInternalColumns?: number;\n  // Space between sections\n  verticalSpacing?: number;\n  // Whether to render unconformity labels\n  unconformityLabels?: boolean;\n}\n\nexport interface SectionProps extends SectionSharedProps {\n  units: ExtUnit[];\n  scaleInfo: PackageScaleLayoutData;\n}\n\nexport function SectionsColumn(props: SectionSharedProps) {\n  const {\n    unconformityLabels = true,\n    unitComponent,\n    unitComponentProps,\n    showLabels = true,\n    width = 300,\n    columnWidth = 150,\n    showLabelColumn = true,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const units = useMacrostratUnits();\n\n  // Get a unique key for the column\n  const key = units[0]?.col_id;\n\n  return h(LabelTrackerProvider, { units, key }, [\n    h(SectionUnitsColumn, {\n      width: columnWidth,\n      unitComponent,\n      unitComponentProps,\n      showLabels,\n      clipUnits,\n      maxInternalColumns,\n      unconformityLabels,\n    }),\n    h.if(showLabelColumn)(SectionLabelsColumn, {\n      width: width - columnWidth,\n    }),\n  ]);\n}\n\nfunction SectionUnitsColumn(props: SectionSharedProps) {\n  const {\n    width,\n    showLabels,\n    unitComponent,\n    unitComponentProps,\n    clipUnits,\n    maxInternalColumns,\n    axisType,\n    unconformityLabels = true,\n  } = props;\n\n  const { sections, totalHeight } = useMacrostratColumnData();\n\n  const scaleData: PackageScaleLayoutData[] = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  const innerWidth = width - 2;\n\n  return h(\"div.section-units-container\", { style: { width } }, [\n    h(\n      SVG,\n      {\n        className: \"sections\",\n        height: totalHeight,\n        innerWidth,\n        paddingH: 1,\n      },\n      sections.map((group) => {\n        const { units, scaleInfo, section_id } = group;\n\n        const key = `section-${section_id}`;\n        return h(\n          SectionUnits,\n          {\n            units,\n            scaleInfo,\n            key,\n            unitComponent,\n            unitComponentProps,\n            showLabels,\n            width: innerWidth,\n            clipUnits,\n            maxInternalColumns,\n          }, // This unconformity is with the section _above_\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width,\n      sections: scaleData,\n      verbose: false,\n    }),\n  ]);\n}\n\nfunction SectionUnits(props: SectionProps) {\n  // Section with \"squishy\" timescale\n  const {\n    units,\n    scaleInfo,\n    unitComponent,\n    showLabels = true,\n    width = 300,\n    unitComponentProps,\n    className,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const { domain, pixelScale, pixelHeight, scale } = scaleInfo;\n\n  /** Ensure that we can arrange units into the maximum number\n   * of columns defined by unitComponentProps, but that we don't\n   * use more than necessary.\n   */\n  const _unitComponentProps = useMemo(() => {\n    return {\n      ...unitComponentProps,\n      nColumns: Math.min(\n        maxInternalColumns ?? Math.floor(width / 10),\n        unitComponentProps?.nColumns ?? Infinity,\n        Math.max(...units.map((d) => d.column)) + 1,\n      ),\n      //axisType,\n    };\n  }, [units, unitComponentProps, maxInternalColumns, width]);\n\n  const style = {\n    \"--section-height\": `${pixelHeight}px`,\n    \"--section-width\": `${width}px`,\n  };\n\n  return h(\n    \"g.section\",\n    { className, style, transform: `translate(0 ${scaleInfo.offset})` },\n    h(\n      MacrostratColumnProvider,\n      {\n        units,\n        domain,\n        pixelScale, // Actually pixels per myr,\n        scale,\n      },\n      h(CompositeUnitsColumn, {\n        width,\n        showLabels,\n        unitComponent,\n        unitComponentProps: _unitComponentProps,\n        clipToFrame: clipUnits,\n      }),\n    ),\n  );\n}\n\ninterface CompositeTimescaleProps {\n  levels?: [number, number] | number;\n  unconformityLabels?: boolean;\n}\n\nexport function CompositeTimescale(props: CompositeTimescaleProps) {\n  const { sections } = useMacrostratColumnData();\n  const sectionScales = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  return h(CompositeTimescaleCore, {\n    packages: sectionScales,\n    ...props,\n  });\n}\n\ntype CompositeTimescaleCoreProps = CompositeTimescaleProps & {\n  packages: PackageScaleLayoutData[];\n};\n\nexport function CompositeTimescaleCore(props: CompositeTimescaleCoreProps) {\n  const { levels = 3, packages, unconformityLabels = false } = props;\n\n  // Use intervals from Macrostrat API\n  const baseURL = useMacrostratBaseURL();\n  const intervals = useMacrostratIntervals(baseURL);\n\n  let _levels: [number, number];\n  if (typeof levels === \"number\") {\n    // If levels is a number, use the most common starting level\n    _levels = [2, Math.max(2 + Math.min(levels, 5) - 1, 1)];\n  } else {\n    _levels = levels;\n  }\n\n  const nCols = _levels[1] - _levels[0] + 1;\n\n  return h(\"div.timescale-column\", [\n    h(\n      \"div.timescales\",\n      packages.map((group) => {\n        const { pixelHeight, paddingTop, key, scale } = group;\n        return h(\n          \"div.timescale-container\",\n          { style: { paddingTop, \"--timescale-level-count\": nCols }, key },\n          [\n            h(Timescale, {\n              orientation: TimescaleOrientation.VERTICAL,\n              length: pixelHeight,\n              levels: _levels,\n              absoluteAgeScale: true,\n              showAgeAxis: false,\n              scale,\n              intervals,\n            }),\n          ],\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width: \"100%\",\n      sections: packages,\n      className: \"unconformity-labels\",\n      axisType: ColumnAxisType.AGE,\n    }),\n  ]);\n}\n\nexport function UnconformityLabels(props: {\n  width: string | number;\n  sections: PackageScaleLayoutData[];\n  axisType?: ColumnAxisType;\n  className?: string;\n  verbose?: boolean;\n}) {\n  const { width, sections, className, axisType, verbose } = props;\n\n  return h(\n    \"div.unconformity-labels\",\n    {\n      style: {\n        width,\n      },\n      className,\n    },\n    sections.map((scaleInfo, i) => {\n      const lastGroup = sections[i - 1];\n      const top = scaleInfo.offset - scaleInfo.paddingTop;\n      const upperAge = lastGroup?.domain[0];\n      const lowerAge = scaleInfo.domain[1];\n      return h(Unconformity, {\n        axisType,\n        upperAge,\n        lowerAge,\n        style: {\n          width,\n          height: scaleInfo.paddingTop,\n          top,\n        },\n        verbose,\n      });\n    }),\n  );\n}\n\nfunction Unconformity({\n  upperAge,\n  lowerAge,\n  style,\n  axisType,\n  verbose = false,\n}) {\n  if (upperAge == null || lowerAge == null) {\n    return null;\n  }\n\n  const ageGap = Math.abs(upperAge - lowerAge);\n\n  let maximumFractionDigits = 0;\n\n  let className: string = null;\n  if (ageGap > 1000) {\n    className = \"giga\";\n  } else if (ageGap > 100) {\n    className = \"mega\";\n  } else if (ageGap > 10) {\n    className = \"large\";\n  } else if (ageGap < 1) {\n    className = \"small\";\n    maximumFractionDigits = 2;\n  } else {\n    maximumFractionDigits = 1;\n  }\n\n  let val: ReactNode;\n  if (axisType === ColumnAxisType.DEPTH || axisType === ColumnAxisType.HEIGHT) {\n    const _txt = ageGap.toLocaleString(\"en-US\", { maximumFractionDigits });\n    val = h(Value, { value: _txt, unit: \"m\" });\n  } else {\n    val = h(Duration, { value: ageGap, maximumFractionDigits });\n  }\n\n  let prefix: ReactNode = null;\n  if (verbose) {\n    prefix = h([\" \", h(\"span.prefix\", \" gap\")]);\n  }\n\n  return h(\"div.unconformity\", { style, className }, [\n    h(\"div.unconformity-inner\", h(\"div.unconformity-text\", [val, prefix])),\n  ]);\n}\n"],"names":["hyper","styles","useMacrostratUnits","LabelTrackerProvider","SectionLabelsColumn","useMacrostratColumnData","SVG","useMemo","MacrostratColumnProvider","CompositeUnitsColumn","useMacrostratBaseURL","useMacrostratIntervals","Timescale","TimescaleOrientation","ColumnAxisType","Value","Duration"],"mappings":"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"}
+{"version":3,"file":"section.cjs","sources":["../src/section.ts"],"sourcesContent":["import {\n  CompositeUnitsColumn,\n  LabelTrackerProvider,\n  SectionLabelsColumn,\n} from \"./units\";\nimport { ReactNode, FunctionComponent, useMemo } from \"react\";\nimport {\n  Timescale,\n  TimescaleOrientation,\n  useMacrostratIntervals,\n} from \"@macrostrat/timescale\";\nimport { ColumnAxisType, SVG } from \"@macrostrat/column-components\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./column.module.sass\";\nimport {\n  useMacrostratColumnData,\n  useMacrostratUnits,\n  MacrostratColumnProvider,\n} from \"./data-provider\";\nimport { useMacrostratBaseURL } from \"@macrostrat/data-provider\";\nimport { Duration } from \"./unit-details\";\nimport { Value } from \"@macrostrat/data-components\";\nimport type { ExtUnit, PackageScaleLayoutData } from \"./prepare-units/types\";\n\nconst h = hyper.styled(styles);\n\nexport interface SectionSharedProps {\n  unitComponent?: FunctionComponent<any>;\n  unitComponentProps?: any;\n  showLabels?: boolean;\n  width?: number;\n  columnWidth?: number;\n  children?: ReactNode;\n  showLabelColumn?: boolean;\n  axisType?: ColumnAxisType;\n  className?: string;\n  clipUnits?: boolean;\n  maxInternalColumns?: number;\n  // Space between sections\n  verticalSpacing?: number;\n  // Whether to render unconformity labels\n  unconformityLabels?: boolean;\n}\n\nexport interface SectionProps extends SectionSharedProps {\n  units: ExtUnit[];\n  scaleInfo: PackageScaleLayoutData;\n}\n\nexport function SectionsColumn(props: SectionSharedProps) {\n  const {\n    unconformityLabels = true,\n    unitComponent,\n    unitComponentProps,\n    showLabels = true,\n    width = 300,\n    columnWidth = 150,\n    showLabelColumn = true,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const units = useMacrostratUnits();\n\n  // Get a unique key for the column\n  const key = units[0]?.col_id;\n\n  return h(LabelTrackerProvider, { units, key }, [\n    h(SectionUnitsColumn, {\n      width: columnWidth,\n      unitComponent,\n      unitComponentProps,\n      showLabels,\n      clipUnits,\n      maxInternalColumns,\n      unconformityLabels,\n    }),\n    h.if(showLabelColumn)(SectionLabelsColumn, {\n      width: width - columnWidth,\n    }),\n  ]);\n}\n\nfunction SectionUnitsColumn(props: SectionSharedProps) {\n  const {\n    width,\n    showLabels,\n    unitComponent,\n    unitComponentProps,\n    clipUnits,\n    maxInternalColumns,\n    axisType,\n    unconformityLabels = true,\n  } = props;\n\n  const { sections, totalHeight } = useMacrostratColumnData();\n\n  const scaleData: PackageScaleLayoutData[] = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  const innerWidth = width - 2;\n\n  return h(\"div.section-units-container\", { style: { width } }, [\n    h(\n      SVG,\n      {\n        className: \"sections\",\n        height: totalHeight,\n        innerWidth,\n        paddingH: 1,\n      },\n      sections.map((group) => {\n        const { units, scaleInfo, section_id } = group;\n\n        const key = `section-${section_id}`;\n        return h(\n          SectionUnits,\n          {\n            units,\n            scaleInfo,\n            key,\n            unitComponent,\n            unitComponentProps,\n            showLabels,\n            width: innerWidth,\n            clipUnits,\n            maxInternalColumns,\n          }, // This unconformity is with the section _above_\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width,\n      sections: scaleData,\n      verbose: false,\n    }),\n  ]);\n}\n\nfunction SectionUnits(props: SectionProps) {\n  // Section with \"squishy\" timescale\n  const {\n    units,\n    scaleInfo,\n    unitComponent,\n    showLabels = true,\n    width = 300,\n    unitComponentProps,\n    className,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const { domain, pixelScale, pixelHeight, scale } = scaleInfo;\n\n  /** Ensure that we can arrange units into the maximum number\n   * of columns defined by unitComponentProps, but that we don't\n   * use more than necessary.\n   */\n  const _unitComponentProps = useMemo(() => {\n    return {\n      ...unitComponentProps,\n      nColumns: Math.min(\n        maxInternalColumns ?? Math.floor(width / 10),\n        unitComponentProps?.nColumns ?? Infinity,\n        Math.max(...units.map((d) => d.column)) + 1,\n      ),\n      //axisType,\n    };\n  }, [units, unitComponentProps, maxInternalColumns, width]);\n\n  const style = {\n    \"--section-height\": `${pixelHeight}px`,\n    \"--section-width\": `${width}px`,\n  };\n\n  return h(\n    \"g.section\",\n    { className, style, transform: `translate(0 ${scaleInfo.offset})` },\n    h(\n      MacrostratColumnProvider,\n      {\n        units,\n        domain,\n        pixelScale, // Actually pixels per myr,\n        scale,\n      },\n      h(CompositeUnitsColumn, {\n        width,\n        showLabels,\n        unitComponent,\n        unitComponentProps: _unitComponentProps,\n        clipToFrame: clipUnits,\n      }),\n    ),\n  );\n}\n\ninterface CompositeTimescaleProps {\n  levels?: [number, number] | number;\n  unconformityLabels?: boolean;\n}\n\nexport function CompositeTimescale(props: CompositeTimescaleProps) {\n  const { sections } = useMacrostratColumnData();\n  const sectionScales = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  return h(CompositeTimescaleCore, {\n    packages: sectionScales,\n    ...props,\n  });\n}\n\ntype CompositeTimescaleCoreProps = CompositeTimescaleProps & {\n  packages: PackageScaleLayoutData[];\n};\n\nexport function CompositeTimescaleCore(props: CompositeTimescaleCoreProps) {\n  const { levels = 3, packages, unconformityLabels = false } = props;\n\n  // Use intervals from Macrostrat API\n  const baseURL = useMacrostratBaseURL();\n  const intervals = useMacrostratIntervals(baseURL);\n\n  let _levels: [number, number];\n  if (typeof levels === \"number\") {\n    // If levels is a number, use the most common starting level\n    _levels = [2, Math.max(2 + Math.min(levels, 5) - 1, 1)];\n  } else {\n    _levels = levels;\n  }\n\n  const nCols = _levels[1] - _levels[0] + 1;\n\n  return h(\"div.timescale-column\", [\n    h(\n      \"div.timescales\",\n      packages.map((group) => {\n        const { pixelHeight, paddingTop, key, scale } = group;\n        return h(\n          \"div.timescale-container\",\n          { style: { paddingTop, \"--timescale-level-count\": nCols }, key },\n          [\n            h(Timescale, {\n              orientation: TimescaleOrientation.VERTICAL,\n              length: pixelHeight,\n              levels: _levels,\n              absoluteAgeScale: true,\n              showAgeAxis: false,\n              scale,\n              intervals,\n            }),\n          ],\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width: \"100%\",\n      sections: packages,\n      className: \"unconformity-labels\",\n      axisType: ColumnAxisType.AGE,\n    }),\n  ]);\n}\n\nexport function UnconformityLabels(props: {\n  width: string | number;\n  sections: PackageScaleLayoutData[];\n  axisType?: ColumnAxisType;\n  className?: string;\n  verbose?: boolean;\n}) {\n  const { width, sections, className, axisType, verbose } = props;\n\n  return h(\n    \"div.unconformity-labels\",\n    {\n      style: {\n        width,\n      },\n      className,\n    },\n    sections.map((scaleInfo, i) => {\n      const lastGroup = sections[i - 1];\n      const top = scaleInfo.offset - scaleInfo.paddingTop;\n      const upperAge = lastGroup?.domain[0];\n      const lowerAge = scaleInfo.domain[1];\n      return h(Unconformity, {\n        axisType,\n        upperAge,\n        lowerAge,\n        style: {\n          width,\n          height: scaleInfo.paddingTop,\n          top,\n        },\n        verbose,\n      });\n    }),\n  );\n}\n\nfunction Unconformity({\n  upperAge,\n  lowerAge,\n  style,\n  axisType,\n  verbose = false,\n}) {\n  if (upperAge == null || lowerAge == null) {\n    return null;\n  }\n\n  const ageGap = Math.abs(upperAge - lowerAge);\n\n  let maximumFractionDigits = 0;\n\n  let className: string = null;\n  if (ageGap > 1000) {\n    className = \"giga\";\n  } else if (ageGap > 100) {\n    className = \"mega\";\n  } else if (ageGap > 10) {\n    className = \"large\";\n  } else if (ageGap < 1) {\n    className = \"small\";\n    maximumFractionDigits = 2;\n  } else {\n    maximumFractionDigits = 1;\n  }\n\n  let val: ReactNode;\n  if (axisType === ColumnAxisType.DEPTH || axisType === ColumnAxisType.HEIGHT) {\n    const _txt = ageGap.toLocaleString(\"en-US\", { maximumFractionDigits });\n    val = h(Value, { value: _txt, unit: \"m\" });\n  } else {\n    val = h(Duration, { value: ageGap, maximumFractionDigits });\n  }\n\n  let prefix: ReactNode = null;\n  if (verbose) {\n    prefix = h([\" \", h(\"span.prefix\", \" gap\")]);\n  }\n\n  return h(\"div.unconformity\", { style, className }, [\n    h(\"div.unconformity-inner\", h(\"div.unconformity-text\", [val, prefix])),\n  ]);\n}\n"],"names":["hyper","styles","useMacrostratUnits","LabelTrackerProvider","SectionLabelsColumn","useMacrostratColumnData","SVG","useMemo","MacrostratColumnProvider","CompositeUnitsColumn","useMacrostratBaseURL","useMacrostratIntervals","Timescale","TimescaleOrientation","ColumnAxisType","Value","Duration"],"mappings":"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"}

package/dist/section.js

@@ -2,13 +2,13 @@ import { useMemo } from "react";
 import { useMacrostratIntervals, Timescale, TimescaleOrientation } from "@macrostrat/timescale";
 import { ColumnAxisType, SVG } from "@macrostrat/column-components";
 import h$1 from "@macrostrat/hyper";
-import styles from "./column.module.sass.js";
+import h$2 from "./column.module.sass.js";
+import { useMacrostratBaseURL } from "@macrostrat/data-provider";
 import { Value } from "@macrostrat/data-components";
-import { useMacrostratColumnData, useMacrostratUnits } from "./data-provider/store.js";
+import { useMacrostratColumnData, useMacrostratUnits, MacrostratColumnProvider } from "./data-provider/store.js";
 import { LabelTrackerProvider, SectionLabelsColumn, CompositeUnitsColumn } from "./units/composite.js";
-import { useMacrostratBaseURL, MacrostratColumnProvider } from "./data-provider/base.js";
 import { Duration } from "./unit-details/panel.js";
-const h = h$1.styled(styles);
+const h = h$1.styled(h$2);
 function SectionsColumn(props) {
   const {
     unconformityLabels = true,

package/dist/section.js.map

@@ -1 +1 @@
-{"version":3,"file":"section.js","sources":["../src/section.ts"],"sourcesContent":["import {\n  CompositeUnitsColumn,\n  LabelTrackerProvider,\n  SectionLabelsColumn,\n} from \"./units\";\nimport { ReactNode, FunctionComponent, useMemo } from \"react\";\nimport {\n  Timescale,\n  TimescaleOrientation,\n  useMacrostratIntervals,\n} from \"@macrostrat/timescale\";\nimport { ColumnAxisType, SVG } from \"@macrostrat/column-components\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./column.module.sass\";\nimport {\n  useMacrostratColumnData,\n  useMacrostratUnits,\n  MacrostratColumnProvider,\n  useMacrostratBaseURL,\n} from \"./data-provider\";\nimport { Duration } from \"./unit-details\";\nimport { Value } from \"@macrostrat/data-components\";\nimport type { ExtUnit, PackageScaleLayoutData } from \"./prepare-units/types\";\n\nconst h = hyper.styled(styles);\n\nexport interface SectionSharedProps {\n  unitComponent?: FunctionComponent<any>;\n  unitComponentProps?: any;\n  showLabels?: boolean;\n  width?: number;\n  columnWidth?: number;\n  children?: ReactNode;\n  showLabelColumn?: boolean;\n  axisType?: ColumnAxisType;\n  className?: string;\n  clipUnits?: boolean;\n  maxInternalColumns?: number;\n  // Space between sections\n  verticalSpacing?: number;\n  // Whether to render unconformity labels\n  unconformityLabels?: boolean;\n}\n\nexport interface SectionProps extends SectionSharedProps {\n  units: ExtUnit[];\n  scaleInfo: PackageScaleLayoutData;\n}\n\nexport function SectionsColumn(props: SectionSharedProps) {\n  const {\n    unconformityLabels = true,\n    unitComponent,\n    unitComponentProps,\n    showLabels = true,\n    width = 300,\n    columnWidth = 150,\n    showLabelColumn = true,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const units = useMacrostratUnits();\n\n  // Get a unique key for the column\n  const key = units[0]?.col_id;\n\n  return h(LabelTrackerProvider, { units, key }, [\n    h(SectionUnitsColumn, {\n      width: columnWidth,\n      unitComponent,\n      unitComponentProps,\n      showLabels,\n      clipUnits,\n      maxInternalColumns,\n      unconformityLabels,\n    }),\n    h.if(showLabelColumn)(SectionLabelsColumn, {\n      width: width - columnWidth,\n    }),\n  ]);\n}\n\nfunction SectionUnitsColumn(props: SectionSharedProps) {\n  const {\n    width,\n    showLabels,\n    unitComponent,\n    unitComponentProps,\n    clipUnits,\n    maxInternalColumns,\n    axisType,\n    unconformityLabels = true,\n  } = props;\n\n  const { sections, totalHeight } = useMacrostratColumnData();\n\n  const scaleData: PackageScaleLayoutData[] = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  const innerWidth = width - 2;\n\n  return h(\"div.section-units-container\", { style: { width } }, [\n    h(\n      SVG,\n      {\n        className: \"sections\",\n        height: totalHeight,\n        innerWidth,\n        paddingH: 1,\n      },\n      sections.map((group) => {\n        const { units, scaleInfo, section_id } = group;\n\n        const key = `section-${section_id}`;\n        return h(\n          SectionUnits,\n          {\n            units,\n            scaleInfo,\n            key,\n            unitComponent,\n            unitComponentProps,\n            showLabels,\n            width: innerWidth,\n            clipUnits,\n            maxInternalColumns,\n          }, // This unconformity is with the section _above_\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width,\n      sections: scaleData,\n      verbose: false,\n    }),\n  ]);\n}\n\nfunction SectionUnits(props: SectionProps) {\n  // Section with \"squishy\" timescale\n  const {\n    units,\n    scaleInfo,\n    unitComponent,\n    showLabels = true,\n    width = 300,\n    unitComponentProps,\n    className,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const { domain, pixelScale, pixelHeight, scale } = scaleInfo;\n\n  /** Ensure that we can arrange units into the maximum number\n   * of columns defined by unitComponentProps, but that we don't\n   * use more than necessary.\n   */\n  const _unitComponentProps = useMemo(() => {\n    return {\n      ...unitComponentProps,\n      nColumns: Math.min(\n        maxInternalColumns ?? Math.floor(width / 10),\n        unitComponentProps?.nColumns ?? Infinity,\n        Math.max(...units.map((d) => d.column)) + 1,\n      ),\n      //axisType,\n    };\n  }, [units, unitComponentProps, maxInternalColumns, width]);\n\n  const style = {\n    \"--section-height\": `${pixelHeight}px`,\n    \"--section-width\": `${width}px`,\n  };\n\n  return h(\n    \"g.section\",\n    { className, style, transform: `translate(0 ${scaleInfo.offset})` },\n    h(\n      MacrostratColumnProvider,\n      {\n        units,\n        domain,\n        pixelScale, // Actually pixels per myr,\n        scale,\n      },\n      h(CompositeUnitsColumn, {\n        width,\n        showLabels,\n        unitComponent,\n        unitComponentProps: _unitComponentProps,\n        clipToFrame: clipUnits,\n      }),\n    ),\n  );\n}\n\ninterface CompositeTimescaleProps {\n  levels?: [number, number] | number;\n  unconformityLabels?: boolean;\n}\n\nexport function CompositeTimescale(props: CompositeTimescaleProps) {\n  const { sections } = useMacrostratColumnData();\n  const sectionScales = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  return h(CompositeTimescaleCore, {\n    packages: sectionScales,\n    ...props,\n  });\n}\n\ntype CompositeTimescaleCoreProps = CompositeTimescaleProps & {\n  packages: PackageScaleLayoutData[];\n};\n\nexport function CompositeTimescaleCore(props: CompositeTimescaleCoreProps) {\n  const { levels = 3, packages, unconformityLabels = false } = props;\n\n  // Use intervals from Macrostrat API\n  const baseURL = useMacrostratBaseURL();\n  const intervals = useMacrostratIntervals(baseURL);\n\n  let _levels: [number, number];\n  if (typeof levels === \"number\") {\n    // If levels is a number, use the most common starting level\n    _levels = [2, Math.max(2 + Math.min(levels, 5) - 1, 1)];\n  } else {\n    _levels = levels;\n  }\n\n  const nCols = _levels[1] - _levels[0] + 1;\n\n  return h(\"div.timescale-column\", [\n    h(\n      \"div.timescales\",\n      packages.map((group) => {\n        const { pixelHeight, paddingTop, key, scale } = group;\n        return h(\n          \"div.timescale-container\",\n          { style: { paddingTop, \"--timescale-level-count\": nCols }, key },\n          [\n            h(Timescale, {\n              orientation: TimescaleOrientation.VERTICAL,\n              length: pixelHeight,\n              levels: _levels,\n              absoluteAgeScale: true,\n              showAgeAxis: false,\n              scale,\n              intervals,\n            }),\n          ],\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width: \"100%\",\n      sections: packages,\n      className: \"unconformity-labels\",\n      axisType: ColumnAxisType.AGE,\n    }),\n  ]);\n}\n\nexport function UnconformityLabels(props: {\n  width: string | number;\n  sections: PackageScaleLayoutData[];\n  axisType?: ColumnAxisType;\n  className?: string;\n  verbose?: boolean;\n}) {\n  const { width, sections, className, axisType, verbose } = props;\n\n  return h(\n    \"div.unconformity-labels\",\n    {\n      style: {\n        width,\n      },\n      className,\n    },\n    sections.map((scaleInfo, i) => {\n      const lastGroup = sections[i - 1];\n      const top = scaleInfo.offset - scaleInfo.paddingTop;\n      const upperAge = lastGroup?.domain[0];\n      const lowerAge = scaleInfo.domain[1];\n      return h(Unconformity, {\n        axisType,\n        upperAge,\n        lowerAge,\n        style: {\n          width,\n          height: scaleInfo.paddingTop,\n          top,\n        },\n        verbose,\n      });\n    }),\n  );\n}\n\nfunction Unconformity({\n  upperAge,\n  lowerAge,\n  style,\n  axisType,\n  verbose = false,\n}) {\n  if (upperAge == null || lowerAge == null) {\n    return null;\n  }\n\n  const ageGap = Math.abs(upperAge - lowerAge);\n\n  let maximumFractionDigits = 0;\n\n  let className: string = null;\n  if (ageGap > 1000) {\n    className = \"giga\";\n  } else if (ageGap > 100) {\n    className = \"mega\";\n  } else if (ageGap > 10) {\n    className = \"large\";\n  } else if (ageGap < 1) {\n    className = \"small\";\n    maximumFractionDigits = 2;\n  } else {\n    maximumFractionDigits = 1;\n  }\n\n  let val: ReactNode;\n  if (axisType === ColumnAxisType.DEPTH || axisType === ColumnAxisType.HEIGHT) {\n    const _txt = ageGap.toLocaleString(\"en-US\", { maximumFractionDigits });\n    val = h(Value, { value: _txt, unit: \"m\" });\n  } else {\n    val = h(Duration, { value: ageGap, maximumFractionDigits });\n  }\n\n  let prefix: ReactNode = null;\n  if (verbose) {\n    prefix = h([\" \", h(\"span.prefix\", \" gap\")]);\n  }\n\n  return h(\"div.unconformity\", { style, className }, [\n    h(\"div.unconformity-inner\", h(\"div.unconformity-text\", [val, prefix])),\n  ]);\n}\n"],"names":["hyper"],"mappings":"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"}
+{"version":3,"file":"section.js","sources":["../src/section.ts"],"sourcesContent":["import {\n  CompositeUnitsColumn,\n  LabelTrackerProvider,\n  SectionLabelsColumn,\n} from \"./units\";\nimport { ReactNode, FunctionComponent, useMemo } from \"react\";\nimport {\n  Timescale,\n  TimescaleOrientation,\n  useMacrostratIntervals,\n} from \"@macrostrat/timescale\";\nimport { ColumnAxisType, SVG } from \"@macrostrat/column-components\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./column.module.sass\";\nimport {\n  useMacrostratColumnData,\n  useMacrostratUnits,\n  MacrostratColumnProvider,\n} from \"./data-provider\";\nimport { useMacrostratBaseURL } from \"@macrostrat/data-provider\";\nimport { Duration } from \"./unit-details\";\nimport { Value } from \"@macrostrat/data-components\";\nimport type { ExtUnit, PackageScaleLayoutData } from \"./prepare-units/types\";\n\nconst h = hyper.styled(styles);\n\nexport interface SectionSharedProps {\n  unitComponent?: FunctionComponent<any>;\n  unitComponentProps?: any;\n  showLabels?: boolean;\n  width?: number;\n  columnWidth?: number;\n  children?: ReactNode;\n  showLabelColumn?: boolean;\n  axisType?: ColumnAxisType;\n  className?: string;\n  clipUnits?: boolean;\n  maxInternalColumns?: number;\n  // Space between sections\n  verticalSpacing?: number;\n  // Whether to render unconformity labels\n  unconformityLabels?: boolean;\n}\n\nexport interface SectionProps extends SectionSharedProps {\n  units: ExtUnit[];\n  scaleInfo: PackageScaleLayoutData;\n}\n\nexport function SectionsColumn(props: SectionSharedProps) {\n  const {\n    unconformityLabels = true,\n    unitComponent,\n    unitComponentProps,\n    showLabels = true,\n    width = 300,\n    columnWidth = 150,\n    showLabelColumn = true,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const units = useMacrostratUnits();\n\n  // Get a unique key for the column\n  const key = units[0]?.col_id;\n\n  return h(LabelTrackerProvider, { units, key }, [\n    h(SectionUnitsColumn, {\n      width: columnWidth,\n      unitComponent,\n      unitComponentProps,\n      showLabels,\n      clipUnits,\n      maxInternalColumns,\n      unconformityLabels,\n    }),\n    h.if(showLabelColumn)(SectionLabelsColumn, {\n      width: width - columnWidth,\n    }),\n  ]);\n}\n\nfunction SectionUnitsColumn(props: SectionSharedProps) {\n  const {\n    width,\n    showLabels,\n    unitComponent,\n    unitComponentProps,\n    clipUnits,\n    maxInternalColumns,\n    axisType,\n    unconformityLabels = true,\n  } = props;\n\n  const { sections, totalHeight } = useMacrostratColumnData();\n\n  const scaleData: PackageScaleLayoutData[] = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  const innerWidth = width - 2;\n\n  return h(\"div.section-units-container\", { style: { width } }, [\n    h(\n      SVG,\n      {\n        className: \"sections\",\n        height: totalHeight,\n        innerWidth,\n        paddingH: 1,\n      },\n      sections.map((group) => {\n        const { units, scaleInfo, section_id } = group;\n\n        const key = `section-${section_id}`;\n        return h(\n          SectionUnits,\n          {\n            units,\n            scaleInfo,\n            key,\n            unitComponent,\n            unitComponentProps,\n            showLabels,\n            width: innerWidth,\n            clipUnits,\n            maxInternalColumns,\n          }, // This unconformity is with the section _above_\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width,\n      sections: scaleData,\n      verbose: false,\n    }),\n  ]);\n}\n\nfunction SectionUnits(props: SectionProps) {\n  // Section with \"squishy\" timescale\n  const {\n    units,\n    scaleInfo,\n    unitComponent,\n    showLabels = true,\n    width = 300,\n    unitComponentProps,\n    className,\n    clipUnits = true,\n    maxInternalColumns,\n  } = props;\n\n  const { domain, pixelScale, pixelHeight, scale } = scaleInfo;\n\n  /** Ensure that we can arrange units into the maximum number\n   * of columns defined by unitComponentProps, but that we don't\n   * use more than necessary.\n   */\n  const _unitComponentProps = useMemo(() => {\n    return {\n      ...unitComponentProps,\n      nColumns: Math.min(\n        maxInternalColumns ?? Math.floor(width / 10),\n        unitComponentProps?.nColumns ?? Infinity,\n        Math.max(...units.map((d) => d.column)) + 1,\n      ),\n      //axisType,\n    };\n  }, [units, unitComponentProps, maxInternalColumns, width]);\n\n  const style = {\n    \"--section-height\": `${pixelHeight}px`,\n    \"--section-width\": `${width}px`,\n  };\n\n  return h(\n    \"g.section\",\n    { className, style, transform: `translate(0 ${scaleInfo.offset})` },\n    h(\n      MacrostratColumnProvider,\n      {\n        units,\n        domain,\n        pixelScale, // Actually pixels per myr,\n        scale,\n      },\n      h(CompositeUnitsColumn, {\n        width,\n        showLabels,\n        unitComponent,\n        unitComponentProps: _unitComponentProps,\n        clipToFrame: clipUnits,\n      }),\n    ),\n  );\n}\n\ninterface CompositeTimescaleProps {\n  levels?: [number, number] | number;\n  unconformityLabels?: boolean;\n}\n\nexport function CompositeTimescale(props: CompositeTimescaleProps) {\n  const { sections } = useMacrostratColumnData();\n  const sectionScales = sections.map((section) => {\n    return section.scaleInfo;\n  });\n\n  return h(CompositeTimescaleCore, {\n    packages: sectionScales,\n    ...props,\n  });\n}\n\ntype CompositeTimescaleCoreProps = CompositeTimescaleProps & {\n  packages: PackageScaleLayoutData[];\n};\n\nexport function CompositeTimescaleCore(props: CompositeTimescaleCoreProps) {\n  const { levels = 3, packages, unconformityLabels = false } = props;\n\n  // Use intervals from Macrostrat API\n  const baseURL = useMacrostratBaseURL();\n  const intervals = useMacrostratIntervals(baseURL);\n\n  let _levels: [number, number];\n  if (typeof levels === \"number\") {\n    // If levels is a number, use the most common starting level\n    _levels = [2, Math.max(2 + Math.min(levels, 5) - 1, 1)];\n  } else {\n    _levels = levels;\n  }\n\n  const nCols = _levels[1] - _levels[0] + 1;\n\n  return h(\"div.timescale-column\", [\n    h(\n      \"div.timescales\",\n      packages.map((group) => {\n        const { pixelHeight, paddingTop, key, scale } = group;\n        return h(\n          \"div.timescale-container\",\n          { style: { paddingTop, \"--timescale-level-count\": nCols }, key },\n          [\n            h(Timescale, {\n              orientation: TimescaleOrientation.VERTICAL,\n              length: pixelHeight,\n              levels: _levels,\n              absoluteAgeScale: true,\n              showAgeAxis: false,\n              scale,\n              intervals,\n            }),\n          ],\n        );\n      }),\n    ),\n    h.if(unconformityLabels)(UnconformityLabels, {\n      width: \"100%\",\n      sections: packages,\n      className: \"unconformity-labels\",\n      axisType: ColumnAxisType.AGE,\n    }),\n  ]);\n}\n\nexport function UnconformityLabels(props: {\n  width: string | number;\n  sections: PackageScaleLayoutData[];\n  axisType?: ColumnAxisType;\n  className?: string;\n  verbose?: boolean;\n}) {\n  const { width, sections, className, axisType, verbose } = props;\n\n  return h(\n    \"div.unconformity-labels\",\n    {\n      style: {\n        width,\n      },\n      className,\n    },\n    sections.map((scaleInfo, i) => {\n      const lastGroup = sections[i - 1];\n      const top = scaleInfo.offset - scaleInfo.paddingTop;\n      const upperAge = lastGroup?.domain[0];\n      const lowerAge = scaleInfo.domain[1];\n      return h(Unconformity, {\n        axisType,\n        upperAge,\n        lowerAge,\n        style: {\n          width,\n          height: scaleInfo.paddingTop,\n          top,\n        },\n        verbose,\n      });\n    }),\n  );\n}\n\nfunction Unconformity({\n  upperAge,\n  lowerAge,\n  style,\n  axisType,\n  verbose = false,\n}) {\n  if (upperAge == null || lowerAge == null) {\n    return null;\n  }\n\n  const ageGap = Math.abs(upperAge - lowerAge);\n\n  let maximumFractionDigits = 0;\n\n  let className: string = null;\n  if (ageGap > 1000) {\n    className = \"giga\";\n  } else if (ageGap > 100) {\n    className = \"mega\";\n  } else if (ageGap > 10) {\n    className = \"large\";\n  } else if (ageGap < 1) {\n    className = \"small\";\n    maximumFractionDigits = 2;\n  } else {\n    maximumFractionDigits = 1;\n  }\n\n  let val: ReactNode;\n  if (axisType === ColumnAxisType.DEPTH || axisType === ColumnAxisType.HEIGHT) {\n    const _txt = ageGap.toLocaleString(\"en-US\", { maximumFractionDigits });\n    val = h(Value, { value: _txt, unit: \"m\" });\n  } else {\n    val = h(Duration, { value: ageGap, maximumFractionDigits });\n  }\n\n  let prefix: ReactNode = null;\n  if (verbose) {\n    prefix = h([\" \", h(\"span.prefix\", \" gap\")]);\n  }\n\n  return h(\"div.unconformity\", { style, className }, [\n    h(\"div.unconformity-inner\", h(\"div.unconformity-text\", [val, prefix])),\n  ]);\n}\n"],"names":["hyper","styles"],"mappings":"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"}