@macrostrat/column-components
Version:
React rendering primitives for stratigraphic columns
140 lines (133 loc) • 5.26 kB
JavaScript
import {createContext as $2l6fO$createContext, useContext as $2l6fO$useContext, useRef as $2l6fO$useRef} from "react";
import $2l6fO$macrostrathyper from "@macrostrat/hyper";
import {useAsyncEffect as $2l6fO$useAsyncEffect, geologyPatternURL as $2l6fO$geologyPatternURL} from "@macrostrat/ui-components";
const $de566d6021709f60$export$f8a3ff1b6bcec62 = (0, $2l6fO$createContext)(null);
const $de566d6021709f60$export$2926ceaa6d8d8b07 = (props)=>{
const { resolvePattern: resolvePattern, children: children } = props;
return (0, $2l6fO$macrostrathyper)($de566d6021709f60$export$f8a3ff1b6bcec62.Provider, {
value: {
resolvePattern: resolvePattern
},
children: children
});
};
var $de566d6021709f60$export$3d750f4e9f4d0fc8 = /*#__PURE__*/ function(PatternType) {
PatternType["Vector"] = "vector";
PatternType["Raster"] = "raster";
return PatternType;
}($de566d6021709f60$export$3d750f4e9f4d0fc8 || {});
const $de566d6021709f60$var$RasterGeologicPattern = (props)=>{
const { resolvePattern: resolvePattern } = (0, $2l6fO$useContext)($de566d6021709f60$export$f8a3ff1b6bcec62);
let { prefix: prefix, backgroundColor: backgroundColor, color: color, width: width, height: height, id: id, name: name, ...rest } = props;
const patternSize = {
width: width,
height: height
};
const patternBounds = {
x: 0,
y: 0,
...patternSize
};
const patternID = `${prefix}-${name ?? id}`;
const maskID = `${patternID}-mask`;
const ref = (0, $2l6fO$useRef)();
(0, $2l6fO$useAsyncEffect)(async ()=>{
const { current: img } = ref;
if (img == null) return;
try {
const uri = await (0, $2l6fO$geologyPatternURL)(id, backgroundColor, color);
img.crossOrigin = "anonymous";
img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", uri);
} catch (err) {
console.error(err);
}
}, [
id,
ref
]);
return (0, $2l6fO$macrostrathyper)("pattern", {
id: patternID,
patternUnits: "userSpaceOnUse",
...patternSize,
...rest
}, (0, $2l6fO$macrostrathyper)("image", {
ref: ref,
...patternSize
}));
};
const $de566d6021709f60$var$VectorGeologicPattern = (props)=>{
const { resolvePattern: resolvePattern } = (0, $2l6fO$useContext)($de566d6021709f60$export$f8a3ff1b6bcec62) ?? {};
if (resolvePattern == null) return null;
let { prefix: prefix, backgroundColor: backgroundColor, color: color, width: width = 100, height: height = 100, id: id, name: name, ...rest } = props;
const patternSize = {
width: width,
height: height
};
const patternBounds = {
x: 0,
y: 0,
...patternSize
};
const href = resolvePattern(id);
if (href == null) return null;
// Compositing if we want to set overlay color
// let overlayStyles = {}
// if (color != null) {
// overlayStyles = {mixB}
// }
const patternID = `${prefix}-${name ?? id}`;
const maskID = `${patternID}-mask`;
return (0, $2l6fO$macrostrathyper)("pattern", {
id: patternID,
patternUnits: "userSpaceOnUse",
shapeRendering: "crispEdges",
...patternSize,
...rest
}, [
(0, $2l6fO$macrostrathyper)("g", {
style: {
isolation: "isolate"
}
}, [
// Mask, if required
(0, $2l6fO$macrostrathyper).if(color != null && id != null)("mask", {
id: maskID
}, [
(0, $2l6fO$macrostrathyper)("image", {
xlinkHref: href,
...patternBounds
})
]),
(0, $2l6fO$macrostrathyper).if(backgroundColor != null)("rect", {
...patternBounds,
fill: backgroundColor
}),
// Render a masked colored image
(0, $2l6fO$macrostrathyper).if(color != null)("rect", {
...patternBounds,
fill: color,
mask: `url(#${maskID})`
}),
// Or render the image as normal
(0, $2l6fO$macrostrathyper).if(id != null && color == null)("image", {
xlinkHref: href,
...patternBounds
})
])
]);
};
const $de566d6021709f60$export$9e9c2df1189db669 = (props)=>{
let { type: type = "vector", invert: invert, ...rest } = props;
if (invert ?? false) {
rest.color = props.backgroundColor;
rest.backgroundColor = props.color;
}
switch(type){
case "vector":
return (0, $2l6fO$macrostrathyper)($de566d6021709f60$var$VectorGeologicPattern, rest);
case "raster":
return (0, $2l6fO$macrostrathyper)($de566d6021709f60$var$RasterGeologicPattern, rest);
}
};
export {$de566d6021709f60$export$f8a3ff1b6bcec62 as GeologicPatternContext, $de566d6021709f60$export$2926ceaa6d8d8b07 as GeologicPatternProvider, $de566d6021709f60$export$3d750f4e9f4d0fc8 as PatternType, $de566d6021709f60$export$9e9c2df1189db669 as GeologicPattern};
//# sourceMappingURL=column-components.944fb3f5.js.map