@macrostrat/column-views 3.2.0 → 3.2.2

package/dist/unit-details/age-range.cjs

@@ -0,0 +1,153 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const dataComponents = require("@macrostrat/data-components");
+const dataProvider = require("@macrostrat/data-provider");
+const ageRange_module = require("./age-range.module.sass.cjs");
+const utils = require("./utils.cjs");
+function AgeField({ unit, children }) {
+  const [b_age, t_age, _unit] = getAgeRange(unit);
+  return ageRange_module.default(
+    dataComponents.DataField,
+    {
+      label: "Age",
+      value: utils.formatRange(b_age, t_age),
+      unit: _unit
+    },
+    children
+  );
+}
+function AgeLabel({
+  age,
+  maximumFractionDigits = 2,
+  minimumFractionDigits = 0,
+  className
+}) {
+  const [value, unit] = getAge(age);
+  const _value = value.toLocaleString("en-US", {
+    maximumFractionDigits,
+    minimumFractionDigits
+  });
+  return ageRange_module.default(dataComponents.Value, { value: _value, unit, className });
+}
+function Duration({
+  value,
+  maximumFractionDigits = 2,
+  minimumFractionDigits = 0
+}) {
+  let unit = "Myr";
+  if (value < 0.8) {
+    unit = "kyr";
+    value *= 1e3;
+    if (value < 5) {
+      unit = "yr";
+      value *= 1e3;
+    }
+  } else if (value > 1e3) {
+    unit = "Gyr";
+    value /= 1e3;
+  }
+  let _value = value.toLocaleString("en-US", {
+    maximumFractionDigits,
+    minimumFractionDigits
+  });
+  return ageRange_module.default(dataComponents.Value, { value: _value, unit });
+}
+function IntervalProportions({ unit, onClickItem }) {
+  if (unit.b_int_id == null && unit.t_int_id == null && unit.b_prop == null && unit.t_prop == null)
+    return null;
+  const i0 = unit.b_int_id;
+  const i1 = unit.t_int_id;
+  let b_prop = unit.b_prop ?? 0;
+  let t_prop = unit.t_prop ?? 1;
+  const intervalMap = dataProvider.useMacrostratDefs("intervals");
+  const int0 = intervalMap?.get(i0) ?? {};
+  const interval0 = {
+    ...int0,
+    id: i0,
+    name: unit.b_int_name
+  };
+  let p0 = null;
+  const int1 = intervalMap?.get(i1) ?? {};
+  const p1 = ageRange_module.default(Proportion, { value: t_prop });
+  if (i0 !== i1 || b_prop !== 0 || t_prop !== 1) {
+    p0 = ageRange_module.default(Proportion, { value: b_prop });
+  }
+  if (i0 === i1 && (b_prop !== 0 || t_prop !== 1)) {
+    p0 = ageRange_module.default("span.joint-proportion", [p0, " ", ageRange_module.default("span.sep", "to"), " ", p1]);
+  }
+  const clickable = onClickItem != null;
+  const handleClick = (event) => {
+    if (onClickItem) {
+      onClickItem(event, interval0);
+    }
+  };
+  return ageRange_module.default(dataComponents.ItemList, { className: "interval-proportions" }, [
+    ageRange_module.default(dataComponents.IntervalTag, {
+      className: clickable ? "clickable" : "",
+      onClick: clickable ? handleClick : void 0,
+      interval: interval0,
+      prefix: p0
+    }),
+    ageRange_module.default.if(i0 != i1)("span.discourage-break", [
+      ageRange_module.default("span.sep", " to "),
+      ageRange_module.default(dataComponents.IntervalTag, {
+        className: clickable ? "clickable" : "",
+        onClick: clickable ? handleClick : void 0,
+        interval: {
+          ...int1,
+          id: i1,
+          name: unit.t_int_name
+        },
+        prefix: p1
+      })
+    ])
+  ]);
+}
+function Proportion({ value }) {
+  let content = null;
+  if (value == 0) {
+    content = "base";
+  } else if (value == 1) {
+    content = "top";
+  } else {
+    content = utils.formatProportion(value * 100) + "%";
+  }
+  return ageRange_module.default("span.proportion", content);
+}
+function getAgeRange(_unit) {
+  let b_age = _unit.b_age;
+  let t_age = _unit.t_age;
+  let unit = "Ma";
+  if (b_age < 0.8 && t_age < 1.2) {
+    b_age *= 1e3;
+    t_age *= 1e3;
+    unit = "ka";
+  } else if (b_age > 800 && t_age > 1200) {
+    b_age /= 1e3;
+    t_age /= 1e3;
+    unit = "Ga";
+  }
+  return [b_age, t_age, unit];
+}
+function getAge(value) {
+  let unit = "Ma";
+  if (value < 0.8) {
+    unit = "ka";
+    value *= 1e3;
+    if (value < 5) {
+      unit = "yr";
+      value *= 1e3;
+    }
+  } else if (value > 1e3) {
+    unit = "Ga";
+    value /= 1e3;
+  }
+  return [value, unit];
+}
+exports.AgeField = AgeField;
+exports.AgeLabel = AgeLabel;
+exports.Duration = Duration;
+exports.IntervalProportions = IntervalProportions;
+exports.getAge = getAge;
+exports.getAgeRange = getAgeRange;
+//# sourceMappingURL=age-range.cjs.map

package/dist/unit-details/age-range.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"age-range.cjs","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  ItemList,\n  Value,\n} from \"@macrostrat/data-components\";\nimport { useMacrostratDefs } from \"@macrostrat/data-provider\";\nimport h from \"./age-range.module.sass\";\nimport { formatProportion, formatRange } from \"./utils\";\n\nexport function AgeField({ unit, children }) {\n  const [b_age, t_age, _unit] = getAgeRange(unit);\n\n  return h(\n    DataField,\n    {\n      label: \"Age\",\n      value: formatRange(b_age, t_age),\n      unit: _unit,\n    },\n    children,\n  );\n}\n\nexport function AgeLabel({\n  age,\n  maximumFractionDigits = 2,\n  minimumFractionDigits = 0,\n  className,\n}: {\n  age: number;\n  className?: string;\n  maximumFractionDigits?: number;\n  minimumFractionDigits?: number;\n}) {\n  /** Component to display a single age value with unit conversion from\n   * Ma to ka or Ga as appropriate.\n   */\n  const [value, unit] = getAge(age);\n\n  const _value = value.toLocaleString(\"en-US\", {\n    maximumFractionDigits,\n    minimumFractionDigits,\n  });\n\n  return h(Value, { value: _value, unit, className });\n}\n\nexport function Duration({\n  value,\n  maximumFractionDigits = 2,\n  minimumFractionDigits = 0,\n}) {\n  let unit = \"Myr\";\n  if (value < 0.8) {\n    unit = \"kyr\";\n    value *= 1000;\n    if (value < 5) {\n      unit = \"yr\";\n      value *= 1000;\n    }\n  } else if (value > 1000) {\n    unit = \"Gyr\";\n    value /= 1000;\n  }\n\n  let _value = value.toLocaleString(\"en-US\", {\n    maximumFractionDigits,\n    minimumFractionDigits,\n  });\n\n  return h(Value, { value: _value, unit });\n}\n\nexport function IntervalProportions({ unit, onClickItem }) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (\n    unit.b_int_id == null &&\n    unit.t_int_id == null &&\n    unit.b_prop == null &&\n    unit.t_prop == null\n  )\n    return null;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n  let b_prop = unit.b_prop ?? 0;\n  let t_prop = unit.t_prop ?? 1;\n\n  const intervalMap = useMacrostratDefs(\"intervals\");\n  const int0 = intervalMap?.get(i0) ?? {};\n\n  const interval0: IntervalShort = {\n    ...int0,\n    id: i0,\n    name: unit.b_int_name,\n  };\n\n  let p0: any = null;\n  const int1 = intervalMap?.get(i1) ?? {};\n  const p1: any = h(Proportion, { value: t_prop });\n\n  if (i0 !== i1 || b_prop !== 0 || t_prop !== 1) {\n    // We have a single interval with undefined proportions\n    p0 = h(Proportion, { value: b_prop });\n  }\n\n  if (i0 === i1 && (b_prop !== 0 || t_prop !== 1)) {\n    p0 = h(\"span.joint-proportion\", [p0, \" \", h(\"span.sep\", \"to\"), \" \", p1]);\n  }\n\n  const clickable = onClickItem != null;\n\n  const handleClick = (event: MouseEvent) => {\n    if (onClickItem) {\n      onClickItem(event, interval0);\n    }\n  };\n\n  return h(ItemList, { className: \"interval-proportions\" }, [\n    h(IntervalTag, {\n      className: clickable ? \"clickable\" : \"\",\n      onClick: clickable ? handleClick : undefined,\n      interval: interval0,\n      prefix: p0,\n    }),\n    h.if(i0 != i1)(\"span.discourage-break\", [\n      h(\"span.sep\", \" to \"),\n      h(IntervalTag, {\n        className: clickable ? \"clickable\" : \"\",\n        onClick: clickable ? handleClick : undefined,\n        interval: {\n          ...int1,\n          id: i1,\n          name: unit.t_int_name,\n        },\n        prefix: p1,\n      }),\n    ]),\n  ]);\n}\n\nfunction Proportion({ value }) {\n  let content = null;\n  if (value == 0) {\n    content = \"base\";\n  } else if (value == 1) {\n    content = \"top\";\n  } else {\n    content = formatProportion(value * 100) + \"%\";\n  }\n\n  return h(\"span.proportion\", content);\n}\n\nexport function getAgeRange(_unit) {\n  let b_age = _unit.b_age;\n  let t_age = _unit.t_age;\n  let unit = \"Ma\";\n\n  if (b_age < 0.8 && t_age < 1.2) {\n    b_age *= 1000;\n    t_age *= 1000;\n    unit = \"ka\";\n  } else if (b_age > 800 && t_age > 1200) {\n    b_age /= 1000;\n    t_age /= 1000;\n    unit = \"Ga\";\n  }\n\n  return [b_age, t_age, unit];\n}\n\nexport function getAge(value) {\n  /** Get the age value in Ma, ka, or Ga as appropriate */\n  let unit = \"Ma\";\n  if (value < 0.8) {\n    unit = \"ka\";\n    value *= 1000;\n    if (value < 5) {\n      unit = \"yr\";\n      value *= 1000;\n    }\n  } else if (value > 1000) {\n    unit = \"Ga\";\n    value /= 1000;\n  }\n\n  return [value, unit];\n}\n"],"names":["h","DataField","formatRange","Value","useMacrostratDefs","ItemList","IntervalTag","formatProportion"],"mappings":"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"}

package/dist/unit-details/age-range.d.ts

@@ -0,0 +1,43 @@
+export declare function AgeField({ unit, children }: {
+    unit: any;
+    children: any;
+}): import('react').FunctionComponentElement<{
+    label?: string;
+    value?: any;
+    inline?: boolean;
+    showIfEmpty?: boolean;
+    className?: string;
+    children?: any;
+    unit?: string;
+    row?: boolean;
+}>;
+export declare function AgeLabel({ age, maximumFractionDigits, minimumFractionDigits, className, }: {
+    age: number;
+    className?: string;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+}): import('react').FunctionComponentElement<{
+    value?: any;
+    unit?: string;
+    children?: any;
+    className?: string;
+}>;
+export declare function Duration({ value, maximumFractionDigits, minimumFractionDigits, }: {
+    value: any;
+    maximumFractionDigits?: number;
+    minimumFractionDigits?: number;
+}): import('react').FunctionComponentElement<{
+    value?: any;
+    unit?: string;
+    children?: any;
+    className?: string;
+}>;
+export declare function IntervalProportions({ unit, onClickItem }: {
+    unit: any;
+    onClickItem: any;
+}): import('react').FunctionComponentElement<{
+    children?: import('react').ReactNode;
+    className: string;
+}>;
+export declare function getAgeRange(_unit: any): any[];
+export declare function getAge(value: any): any[];

package/dist/unit-details/age-range.js

@@ -0,0 +1,153 @@
+import { DataField, Value, ItemList, IntervalTag } from "@macrostrat/data-components";
+import { useMacrostratDefs } from "@macrostrat/data-provider";
+import h from "./age-range.module.sass.js";
+import { formatRange, formatProportion } from "./utils.js";
+function AgeField({ unit, children }) {
+  const [b_age, t_age, _unit] = getAgeRange(unit);
+  return h(
+    DataField,
+    {
+      label: "Age",
+      value: formatRange(b_age, t_age),
+      unit: _unit
+    },
+    children
+  );
+}
+function AgeLabel({
+  age,
+  maximumFractionDigits = 2,
+  minimumFractionDigits = 0,
+  className
+}) {
+  const [value, unit] = getAge(age);
+  const _value = value.toLocaleString("en-US", {
+    maximumFractionDigits,
+    minimumFractionDigits
+  });
+  return h(Value, { value: _value, unit, className });
+}
+function Duration({
+  value,
+  maximumFractionDigits = 2,
+  minimumFractionDigits = 0
+}) {
+  let unit = "Myr";
+  if (value < 0.8) {
+    unit = "kyr";
+    value *= 1e3;
+    if (value < 5) {
+      unit = "yr";
+      value *= 1e3;
+    }
+  } else if (value > 1e3) {
+    unit = "Gyr";
+    value /= 1e3;
+  }
+  let _value = value.toLocaleString("en-US", {
+    maximumFractionDigits,
+    minimumFractionDigits
+  });
+  return h(Value, { value: _value, unit });
+}
+function IntervalProportions({ unit, onClickItem }) {
+  if (unit.b_int_id == null && unit.t_int_id == null && unit.b_prop == null && unit.t_prop == null)
+    return null;
+  const i0 = unit.b_int_id;
+  const i1 = unit.t_int_id;
+  let b_prop = unit.b_prop ?? 0;
+  let t_prop = unit.t_prop ?? 1;
+  const intervalMap = useMacrostratDefs("intervals");
+  const int0 = intervalMap?.get(i0) ?? {};
+  const interval0 = {
+    ...int0,
+    id: i0,
+    name: unit.b_int_name
+  };
+  let p0 = null;
+  const int1 = intervalMap?.get(i1) ?? {};
+  const p1 = h(Proportion, { value: t_prop });
+  if (i0 !== i1 || b_prop !== 0 || t_prop !== 1) {
+    p0 = h(Proportion, { value: b_prop });
+  }
+  if (i0 === i1 && (b_prop !== 0 || t_prop !== 1)) {
+    p0 = h("span.joint-proportion", [p0, " ", h("span.sep", "to"), " ", p1]);
+  }
+  const clickable = onClickItem != null;
+  const handleClick = (event) => {
+    if (onClickItem) {
+      onClickItem(event, interval0);
+    }
+  };
+  return h(ItemList, { className: "interval-proportions" }, [
+    h(IntervalTag, {
+      className: clickable ? "clickable" : "",
+      onClick: clickable ? handleClick : void 0,
+      interval: interval0,
+      prefix: p0
+    }),
+    h.if(i0 != i1)("span.discourage-break", [
+      h("span.sep", " to "),
+      h(IntervalTag, {
+        className: clickable ? "clickable" : "",
+        onClick: clickable ? handleClick : void 0,
+        interval: {
+          ...int1,
+          id: i1,
+          name: unit.t_int_name
+        },
+        prefix: p1
+      })
+    ])
+  ]);
+}
+function Proportion({ value }) {
+  let content = null;
+  if (value == 0) {
+    content = "base";
+  } else if (value == 1) {
+    content = "top";
+  } else {
+    content = formatProportion(value * 100) + "%";
+  }
+  return h("span.proportion", content);
+}
+function getAgeRange(_unit) {
+  let b_age = _unit.b_age;
+  let t_age = _unit.t_age;
+  let unit = "Ma";
+  if (b_age < 0.8 && t_age < 1.2) {
+    b_age *= 1e3;
+    t_age *= 1e3;
+    unit = "ka";
+  } else if (b_age > 800 && t_age > 1200) {
+    b_age /= 1e3;
+    t_age /= 1e3;
+    unit = "Ga";
+  }
+  return [b_age, t_age, unit];
+}
+function getAge(value) {
+  let unit = "Ma";
+  if (value < 0.8) {
+    unit = "ka";
+    value *= 1e3;
+    if (value < 5) {
+      unit = "yr";
+      value *= 1e3;
+    }
+  } else if (value > 1e3) {
+    unit = "Ga";
+    value /= 1e3;
+  }
+  return [value, unit];
+}
+export {
+  AgeField,
+  AgeLabel,
+  Duration,
+  IntervalProportions,
+  getAge,
+  getAgeRange
+};
+//# sourceMappingURL=age-range.js.map

package/dist/unit-details/age-range.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"age-range.js","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  ItemList,\n  Value,\n} from \"@macrostrat/data-components\";\nimport { useMacrostratDefs } from \"@macrostrat/data-provider\";\nimport h from \"./age-range.module.sass\";\nimport { formatProportion, formatRange } from \"./utils\";\n\nexport function AgeField({ unit, children }) {\n  const [b_age, t_age, _unit] = getAgeRange(unit);\n\n  return h(\n    DataField,\n    {\n      label: \"Age\",\n      value: formatRange(b_age, t_age),\n      unit: _unit,\n    },\n    children,\n  );\n}\n\nexport function AgeLabel({\n  age,\n  maximumFractionDigits = 2,\n  minimumFractionDigits = 0,\n  className,\n}: {\n  age: number;\n  className?: string;\n  maximumFractionDigits?: number;\n  minimumFractionDigits?: number;\n}) {\n  /** Component to display a single age value with unit conversion from\n   * Ma to ka or Ga as appropriate.\n   */\n  const [value, unit] = getAge(age);\n\n  const _value = value.toLocaleString(\"en-US\", {\n    maximumFractionDigits,\n    minimumFractionDigits,\n  });\n\n  return h(Value, { value: _value, unit, className });\n}\n\nexport function Duration({\n  value,\n  maximumFractionDigits = 2,\n  minimumFractionDigits = 0,\n}) {\n  let unit = \"Myr\";\n  if (value < 0.8) {\n    unit = \"kyr\";\n    value *= 1000;\n    if (value < 5) {\n      unit = \"yr\";\n      value *= 1000;\n    }\n  } else if (value > 1000) {\n    unit = \"Gyr\";\n    value /= 1000;\n  }\n\n  let _value = value.toLocaleString(\"en-US\", {\n    maximumFractionDigits,\n    minimumFractionDigits,\n  });\n\n  return h(Value, { value: _value, unit });\n}\n\nexport function IntervalProportions({ unit, onClickItem }) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (\n    unit.b_int_id == null &&\n    unit.t_int_id == null &&\n    unit.b_prop == null &&\n    unit.t_prop == null\n  )\n    return null;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n  let b_prop = unit.b_prop ?? 0;\n  let t_prop = unit.t_prop ?? 1;\n\n  const intervalMap = useMacrostratDefs(\"intervals\");\n  const int0 = intervalMap?.get(i0) ?? {};\n\n  const interval0: IntervalShort = {\n    ...int0,\n    id: i0,\n    name: unit.b_int_name,\n  };\n\n  let p0: any = null;\n  const int1 = intervalMap?.get(i1) ?? {};\n  const p1: any = h(Proportion, { value: t_prop });\n\n  if (i0 !== i1 || b_prop !== 0 || t_prop !== 1) {\n    // We have a single interval with undefined proportions\n    p0 = h(Proportion, { value: b_prop });\n  }\n\n  if (i0 === i1 && (b_prop !== 0 || t_prop !== 1)) {\n    p0 = h(\"span.joint-proportion\", [p0, \" \", h(\"span.sep\", \"to\"), \" \", p1]);\n  }\n\n  const clickable = onClickItem != null;\n\n  const handleClick = (event: MouseEvent) => {\n    if (onClickItem) {\n      onClickItem(event, interval0);\n    }\n  };\n\n  return h(ItemList, { className: \"interval-proportions\" }, [\n    h(IntervalTag, {\n      className: clickable ? \"clickable\" : \"\",\n      onClick: clickable ? handleClick : undefined,\n      interval: interval0,\n      prefix: p0,\n    }),\n    h.if(i0 != i1)(\"span.discourage-break\", [\n      h(\"span.sep\", \" to \"),\n      h(IntervalTag, {\n        className: clickable ? \"clickable\" : \"\",\n        onClick: clickable ? handleClick : undefined,\n        interval: {\n          ...int1,\n          id: i1,\n          name: unit.t_int_name,\n        },\n        prefix: p1,\n      }),\n    ]),\n  ]);\n}\n\nfunction Proportion({ value }) {\n  let content = null;\n  if (value == 0) {\n    content = \"base\";\n  } else if (value == 1) {\n    content = \"top\";\n  } else {\n    content = formatProportion(value * 100) + \"%\";\n  }\n\n  return h(\"span.proportion\", content);\n}\n\nexport function getAgeRange(_unit) {\n  let b_age = _unit.b_age;\n  let t_age = _unit.t_age;\n  let unit = \"Ma\";\n\n  if (b_age < 0.8 && t_age < 1.2) {\n    b_age *= 1000;\n    t_age *= 1000;\n    unit = \"ka\";\n  } else if (b_age > 800 && t_age > 1200) {\n    b_age /= 1000;\n    t_age /= 1000;\n    unit = \"Ga\";\n  }\n\n  return [b_age, t_age, unit];\n}\n\nexport function getAge(value) {\n  /** Get the age value in Ma, ka, or Ga as appropriate */\n  let unit = \"Ma\";\n  if (value < 0.8) {\n    unit = \"ka\";\n    value *= 1000;\n    if (value < 5) {\n      unit = \"yr\";\n      value *= 1000;\n    }\n  } else if (value > 1000) {\n    unit = \"Ga\";\n    value /= 1000;\n  }\n\n  return [value, unit];\n}\n"],"names":[],"mappings":"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"}

package/dist/unit-details/age-range.module.sass.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const h$1 = require("@macrostrat/hyper");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const h__default = /* @__PURE__ */ _interopDefault(h$1);
+const sep = "_sep_1ibvp_16";
+const styles = {
+  "interval-proportions": "_interval-proportions_1ibvp_1",
+  "discourage-break": "_discourage-break_1ibvp_9",
+  sep
+};
+let h = h__default.default.styled(styles);
+Object.assign(h, styles);
+exports.default = h;
+exports.sep = sep;
+//# sourceMappingURL=age-range.module.sass.cjs.map

package/dist/unit-details/age-range.module.sass.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"age-range.module.sass.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}

package/dist/unit-details/age-range.module.sass.js

@@ -0,0 +1,14 @@
+import h$1 from "@macrostrat/hyper";
+const sep = "_sep_1ibvp_16";
+const styles = {
+  "interval-proportions": "_interval-proportions_1ibvp_1",
+  "discourage-break": "_discourage-break_1ibvp_9",
+  sep
+};
+let h = h$1.styled(styles);
+Object.assign(h, styles);
+export {
+  h as default,
+  sep
+};
+//# sourceMappingURL=age-range.module.sass.js.map

package/dist/unit-details/age-range.module.sass.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"age-range.module.sass.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/unit-details/index.d.ts

@@ -1,3 +1,4 @@
 export * from './panel';
 export * from './popover';
 export * from './modal-panel';
+export * from './age-range';

package/dist/unit-details/panel.cjs

@@ -9,6 +9,8 @@ const dataComponents = require("@macrostrat/data-components");
 const dataProvider = require("@macrostrat/data-provider");
 const names = require("../units/names.cjs");
 const classNames = require("classnames");
+const ageRange = require("./age-range.cjs");
+const utils = require("./utils.cjs");
 const store = require("../data-provider/store.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const h__default = /* @__PURE__ */ _interopDefault(h$1);
@@ -178,7 +180,7 @@ function UnitDetailsContent({
     thicknessOrHeightRange = h(dataComponents.DataField, {
       unit: u1,
       label,
-      value: formatRange(unit.b_pos, unit.t_pos),
+      value: utils.formatRange(unit.b_pos, unit.t_pos),
       children: h(
         dataComponents.Parenthetical,
         h(dataComponents.Value, { value: thickness, unit: thicknessUnit })
@@ -213,9 +215,9 @@ function UnitDetailsContent({
       lithologies,
       features: lithologyFeatures
     }),
-    h(AgeField, { unit }, [
-      h(dataComponents.Parenthetical, h(Duration, { value: unit.b_age - unit.t_age })),
-      h(IntervalProportions, {
+    h(ageRange.AgeField, { unit }, [
+      h(dataComponents.Parenthetical, h(ageRange.Duration, { value: unit.b_age - unit.t_age })),
+      h(ageRange.IntervalProportions, {
         unit,
         onClickItem
       })
@@ -337,9 +339,17 @@ function getThickness(unit) {
     _unit = "km";
   }
   if (minThickness == maxThickness) {
-    return [formatSignificance(minThickness), _unit];
+    return [utils.formatSignificance(minThickness), _unit];
   }
-  return [formatRange(minThickness, maxThickness), _unit];
+  return [utils.formatRange(minThickness, maxThickness), _unit];
+}
+function ThicknessField({ unit, label = "Thickness" }) {
+  const [value, thicknessUnit] = getThickness(unit);
+  return h(dataComponents.DataField, {
+    label,
+    value,
+    unit: thicknessUnit
+  });
 }
 function BibInfo({ refs }) {
   const refData = dataProvider.useMacrostratData("refs", refs);
@@ -369,84 +379,6 @@ function Citation({ data, tag = "p" }) {
     h("span.title", data.ref)
   ]);
 }
-function AgeField({ unit, children }) {
-  const [b_age, t_age, _unit] = getAgeRange(unit);
-  return h(
-    dataComponents.DataField,
-    {
-      label: "Age",
-      value: formatRange(b_age, t_age),
-      unit: _unit
-    },
-    children
-  );
-}
-function getAgeRange(_unit) {
-  let b_age = _unit.b_age;
-  let t_age = _unit.t_age;
-  let unit = "Ma";
-  if (b_age < 0.8 && t_age < 1.2) {
-    b_age *= 1e3;
-    t_age *= 1e3;
-    unit = "ka";
-  } else if (b_age > 800 && t_age > 1200) {
-    b_age /= 1e3;
-    t_age /= 1e3;
-    unit = "Ga";
-  }
-  return [b_age, t_age, unit];
-}
-function getAge(value) {
-  let unit = "Ma";
-  if (value < 0.8) {
-    unit = "ka";
-    value *= 1e3;
-    if (value < 5) {
-      unit = "yr";
-      value *= 1e3;
-    }
-  } else if (value > 1e3) {
-    unit = "Ga";
-    value /= 1e3;
-  }
-  return [value, unit];
-}
-function AgeLabel({
-  age,
-  maximumFractionDigits = 2,
-  minimumFractionDigits = 0,
-  className
-}) {
-  const [value, unit] = getAge(age);
-  const _value = value.toLocaleString("en-US", {
-    maximumFractionDigits,
-    minimumFractionDigits
-  });
-  return h(dataComponents.Value, { value: _value, unit, className });
-}
-function Duration({
-  value,
-  maximumFractionDigits = 2,
-  minimumFractionDigits = 0
-}) {
-  let unit = "Myr";
-  if (value < 0.8) {
-    unit = "kyr";
-    value *= 1e3;
-    if (value < 5) {
-      unit = "yr";
-      value *= 1e3;
-    }
-  } else if (value > 1e3) {
-    unit = "Gyr";
-    value /= 1e3;
-  }
-  let _value = value.toLocaleString("en-US", {
-    maximumFractionDigits,
-    minimumFractionDigits
-  });
-  return h(dataComponents.Value, { value: _value, unit });
-}
 function enhanceEnvironments(environments, envMap) {
   return environments?.map((env) => {
     return {
@@ -551,99 +483,11 @@ function UnitIdentifier({
     ...interactionProps
   });
 }
-function IntervalProportions({ unit, onClickItem }) {
-  if (unit.b_int_id == null && unit.t_int_id == null && unit.b_prop == null && unit.t_prop == null)
-    return null;
-  const i0 = unit.b_int_id;
-  const i1 = unit.t_int_id;
-  let b_prop = unit.b_prop ?? 0;
-  let t_prop = unit.t_prop ?? 1;
-  const intervalMap = dataProvider.useMacrostratDefs("intervals");
-  const int0 = intervalMap?.get(i0) ?? {};
-  const interval0 = {
-    ...int0,
-    id: i0,
-    name: unit.b_int_name
-  };
-  let p0 = null;
-  const int1 = intervalMap?.get(i1) ?? {};
-  const p1 = h(Proportion, { value: t_prop });
-  if (i0 !== i1 || b_prop !== 0 || t_prop !== 1) {
-    p0 = h(Proportion, { value: b_prop });
-  }
-  if (i0 === i1 && (b_prop !== 0 || t_prop !== 1)) {
-    p0 = h("span.joint-proportion", [p0, h("span.sep", "to"), p1]);
-  }
-  const clickable = onClickItem != null;
-  const handleClick = (event) => {
-    if (onClickItem) {
-      onClickItem(event, interval0);
-    }
-  };
-  return h("div.interval-proportions", [
-    h(dataComponents.IntervalTag, {
-      className: clickable ? "clickable" : "",
-      onClick: clickable ? handleClick : void 0,
-      interval: interval0,
-      prefix: p0
-    }),
-    h.if(i0 != i1)("span.discourage-break", [
-      h("span.sep", "to"),
-      h(dataComponents.IntervalTag, {
-        className: clickable ? "clickable" : "",
-        onClick: clickable ? handleClick : void 0,
-        interval: {
-          ...int1,
-          id: i1,
-          name: unit.t_int_name
-        },
-        prefix: p1
-      })
-    ])
-  ]);
-}
-const formatProportion = (d) => {
-  if (d == null) return null;
-  return d.toFixed(1);
-};
-function Proportion({ value }) {
-  let content = null;
-  if (value == 0) {
-    content = "base";
-  } else if (value == 1) {
-    content = "top";
-  } else {
-    content = formatProportion(value * 100) + "%";
-  }
-  return h("span.proportion", content);
-}
-function formatRange(min, max, precision = null) {
-  if (min == null || max == null) return null;
-  if (min === max) {
-    return min.toFixed(precision);
-  }
-  return `${formatSignificance(min, precision)}–${formatSignificance(
-    max,
-    precision
-  )}`;
-}
-function formatSignificance(value, precision = null) {
-  if (precision == null) {
-    return value.toLocaleString();
-  }
-  if (precision >= 0) {
-    return value.toFixed(precision);
-  }
-  if (precision < 0) {
-    return (value / Math.pow(10, -precision)).toFixed(0) + "0".repeat(-precision);
-  }
-}
-exports.AgeLabel = AgeLabel;
 exports.ClickableText = ClickableText;
-exports.Duration = Duration;
 exports.Identifier = Identifier;
 exports.LegendPanelHeader = LegendPanelHeader;
 exports.ReferencesField = ReferencesField;
+exports.ThicknessField = ThicknessField;
 exports.UnitDetailsFeature = UnitDetailsFeature;
 exports.UnitDetailsPanel = UnitDetailsPanel;
 //# sourceMappingURL=panel.cjs.map