@macrostrat/column-components/dist/lithology/column-patterns.js

React rendering primitives for stratigraphic columns

import { useState, useCallback, useMemo, useContext, useEffect, createContext } from "react";
import h from "@macrostrat/hyper";
import { GeologicPatternContext, GeologicPattern } from "./patterns.js";
import { UUIDProvider, useUUID } from "../frame.js";
const PatternDefsContext = createContext(null);
const GeologicPatternDefs = function(props) {
  let { patternIDs, scalePattern } = props;
  const UUID = props.UUID ?? useUUID();
  return h(
    "defs",
    Array.from(patternIDs).map(function(id, i) {
      if (id === -1) {
        return null;
      }
      let sz = 100;
      if (scalePattern != null) {
        sz *= scalePattern(id);
      }
      return h(GeologicPattern, {
        key: i,
        prefix: UUID,
        id,
        width: sz,
        height: sz
      });
    })
  );
};
function PatternDefsProvider(props) {
  const { scalePattern, children } = props;
  const [patternIDs, setPatternIDs] = useState(/* @__PURE__ */ new Set());
  const trackPattern = useCallback(
    (p) => {
      if (patternIDs.has(p)) return;
      let newSet = new Set(patternIDs);
      newSet.add(p);
      setPatternIDs(newSet);
    },
    [patternIDs]
  );
  const value = useMemo(() => {
    return { trackPattern };
  }, [trackPattern]);
  return h(
    UUIDProvider,
    h(
      PatternDefsContext.Provider,
      { value },
      h("g.patterns", [
        h(GeologicPatternDefs, { scalePattern, patternIDs }),
        children
      ])
    )
  );
}
function useGeologicPattern(patternID, fallback = "#aaa") {
  const ctx1 = useContext(GeologicPatternContext);
  const ctx = useContext(PatternDefsContext);
  const UUID = useUUID();
  useEffect(() => {
    ctx?.trackPattern(patternID);
  }, [patternID, ctx]);
  let v = ctx1?.resolvePattern(patternID);
  if (v == null) return fallback;
  return `url(#${UUID}-${patternID})`;
}
export {
  PatternDefsProvider,
  useGeologicPattern
};
//# sourceMappingURL=column-patterns.js.map