@macrostrat/column-components
Version:
React rendering primitives for stratigraphic columns
183 lines (174 loc) • 7.36 kB
JavaScript
import {ColumnLayoutContext as $g4hEl$ColumnLayoutContext, useColumnLayout as $g4hEl$useColumnLayout} from "./column-components.0ccab336.js";
import {drawZigZagAtConstantHeight as $g4hEl$drawZigZagAtConstantHeight} from "./column-components.b2db531d.js";
import {Component as $g4hEl$Component, createContext as $g4hEl$createContext, useRef as $g4hEl$useRef, useContext as $g4hEl$useContext, createElement as $g4hEl$createElement} from "react";
import $g4hEl$macrostrathyper from "@macrostrat/hyper";
import {path as $g4hEl$path} from "d3-path";
let $78cda86e161567e8$var$sequence = 0; // Initialize a sequence counter
function $78cda86e161567e8$var$getUniqueIdentifier() {
// Generate a unique identifier using a sequential method that is stable across repeated
// re-renders. This evolves from a UUID-based approach for SSR (server-side rendering) compatibility.
const id = `uuid-${$78cda86e161567e8$var$sequence}`;
$78cda86e161567e8$var$sequence += 1; // Increment the sequence for the next call
return id;
}
class $78cda86e161567e8$export$748c8bb116429550 extends (0, $g4hEl$Component) {
constructor(props){
super(props);
this.UUID = $78cda86e161567e8$var$getUniqueIdentifier();
}
}
const $78cda86e161567e8$var$UUIDContext = (0, $g4hEl$createContext)(null);
function $78cda86e161567e8$var$useBasicUUID() {
const ref = (0, $g4hEl$useRef)($78cda86e161567e8$var$getUniqueIdentifier());
return ref.current;
}
const $78cda86e161567e8$export$b53193151b894db6 = function() {
const uuid = (0, $g4hEl$useContext)($78cda86e161567e8$var$UUIDContext);
if (uuid == null) return $78cda86e161567e8$var$useBasicUUID();
return uuid;
};
function $78cda86e161567e8$export$1d23684b3f3271ac({ children: children }) {
const ref = (0, $g4hEl$useRef)($78cda86e161567e8$var$getUniqueIdentifier());
return (0, $g4hEl$macrostrathyper)($78cda86e161567e8$var$UUIDContext.Provider, {
value: ref.current,
children: children
});
}
function $78cda86e161567e8$export$5e9808bef3bd64be(props) {
const { pixelHeight: height, width: width } = (0, $g4hEl$useContext)((0, $g4hEl$ColumnLayoutContext));
let { id: frameID, className: className } = props;
if (frameID.startsWith("#")) frameID = frameID.slice(1);
return (0, $g4hEl$macrostrathyper)("rect", {
id: frameID,
x: 0,
y: 0,
width: width,
height: height,
className: className
});
}
function $78cda86e161567e8$export$686c342f9382ceb9(props) {
let { id: frameID, zigZagBottom: zigZagBottom = false, zigZagTop: zigZagTop = false } = props;
const { scale: scale, divisions: divisions, grainsizeScale: gs } = (0, $g4hEl$useColumnLayout)();
if (frameID.startsWith("#")) frameID = frameID.slice(1);
if (divisions.length === 0) return null;
const [bottomOfSection, topOfSection] = scale.domain();
const topOf = function(d) {
let { top: top } = d;
if (top > topOfSection) top = topOfSection;
return scale(top);
};
const bottomOf = function(d) {
let { bottom: bottom } = d;
if (bottom < bottomOfSection) bottom = bottomOfSection;
return scale(bottom);
};
const filteredDivisions = Array.from(divisions).filter(function(d) {
if (d.top <= bottomOfSection) return false;
if (d.bottom > topOfSection) return false;
return true;
});
let d = (0, $g4hEl$path)();
let currentGrainsize = "m";
let i = 0;
for (const div of filteredDivisions){
if (i === 0) {
// First division
// start the path at the bottom
const y = bottomOf(div);
d.moveTo(0, y);
}
if (div.grainsize != null) currentGrainsize = div.grainsize;
const x1 = gs(currentGrainsize);
if (i === 0 && zigZagBottom) // Draw zig-zag at bottom
(0, $g4hEl$drawZigZagAtConstantHeight)(d, 0, x1, bottomOf(div));
else // Draw a normal line
d.lineTo(x1, bottomOf(div));
d.lineTo(x1, bottomOf(div));
d.lineTo(x1, topOf(div));
if (i === filteredDivisions.length - 1) {
// Last division
// Draw top
if (zigZagTop) (0, $g4hEl$drawZigZagAtConstantHeight)(d, x1, 0, topOf(div));
else d.lineTo(0, topOf(div));
}
i++;
}
d.closePath();
return (0, $g4hEl$macrostrathyper)("path", {
id: frameID,
key: frameID,
d: d.toString()
});
}
const $78cda86e161567e8$export$407988c5e190497b = function(props) {
let { id: id, children: children, ...rest } = props;
if (id.startsWith("#")) id = id.slice(1);
return (0, $g4hEl$createElement)("clipPath", {
id: id,
key: id,
...rest
}, children);
};
const $78cda86e161567e8$var$UseFrame = function(props) {
const { id: frameID, ...rest } = props;
return (0, $g4hEl$macrostrathyper)("use.frame", {
xlinkHref: frameID,
fill: "transparent",
key: "frame",
...rest
});
};
const $78cda86e161567e8$var$prefixID = function(uuid, prefixes) {
const res = {};
for (let prefix of Array.from(prefixes))res[prefix + "ID"] = `#${uuid}-${prefix}`;
return res;
};
function $78cda86e161567e8$export$708d3f2ecf132c6c(props) {
const { left: left = 0, shiftY: shiftY = 0, className: className, onClick: onClick, children: children, frame: frame = $78cda86e161567e8$export$5e9808bef3bd64be, clip: clip = true } = props;
const uuid = $78cda86e161567e8$export$b53193151b894db6();
const { frameID: frameID, clipID: clipID } = $78cda86e161567e8$var$prefixID(uuid, [
"frame",
"clip"
]);
let transform = null;
if (left != null) transform = `translate(${left} ${shiftY})`;
const frameClassName = "clip-frame column-clip-frame";
let _frame = (0, $g4hEl$macrostrathyper)(frame, {
id: frameID,
className: frameClassName
});
let defs = null;
let clipPath = null;
if (clip) {
defs = (0, $g4hEl$macrostrathyper)("defs", {
key: "defs"
}, [
_frame,
(0, $g4hEl$macrostrathyper)($78cda86e161567e8$export$407988c5e190497b, {
id: clipID
}, (0, $g4hEl$macrostrathyper)($78cda86e161567e8$var$UseFrame, {
id: frameID
}))
]);
clipPath = `url(${clipID})`;
_frame = (0, $g4hEl$macrostrathyper)($78cda86e161567e8$var$UseFrame, {
id: frameID,
className: frameClassName
});
}
return (0, $g4hEl$macrostrathyper)("g", {
className: className,
transform: transform,
onClick: onClick
}, [
defs,
(0, $g4hEl$macrostrathyper)("g.inner", {
clipPath: clipPath
}, children),
// Frame must go last
_frame
]);
}
export {$78cda86e161567e8$export$748c8bb116429550 as UUIDComponent, $78cda86e161567e8$export$b53193151b894db6 as useUUID, $78cda86e161567e8$export$1d23684b3f3271ac as UUIDProvider, $78cda86e161567e8$export$5e9808bef3bd64be as SimpleFrame, $78cda86e161567e8$export$686c342f9382ceb9 as GrainsizeFrame, $78cda86e161567e8$export$407988c5e190497b as ClipPath, $78cda86e161567e8$export$708d3f2ecf132c6c as ClippingFrame};
//# sourceMappingURL=column-components.8e5c665a.js.map