@macrostrat/column-views 3.11.0 → 3.12.0

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

@@ -1 +1 @@
-{"version":3,"file":"age-range.cjs","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  type IntervalTagProps,\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\";\nimport classNames from \"classnames\";\nimport { useMemo } from \"react\";\n\nexport function AgeField({ unit, children, ...rest }) {\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      ...rest,\n    },\n    children,\n  );\n}\n\nexport function AgeRange({\n  data,\n  className,\n}: {\n  data: {\n    t_age: number;\n    b_age: number;\n  };\n  className?: string;\n}) {\n  const [_b_age, _t_age, _unit] = getAgeRange(data);\n\n  return h(Value, {\n    value: formatRange(_b_age, _t_age),\n    unit: _unit,\n    className,\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\ninterface UnitIntervalConstraints {\n  b_int_id?: number;\n  t_int_id?: number;\n  b_prop?: number;\n  t_prop?: number;\n  b_int_name?: string;\n  t_int_name?: string;\n  b_age?: number;\n  t_age?: number;\n}\n\nexport interface IntervalProportionsProps extends Omit<\n  IntervalTagProps,\n  \"interval\"\n> {\n  unit: UnitIntervalConstraints;\n  showProportions?: boolean;\n  calculateProportionsFromAges?: boolean;\n  onClickItem?: any;\n}\n\nexport function IntervalProportions({\n  unit,\n  className,\n  showProportions,\n  calculateProportionsFromAges = true,\n  ...rest\n}: IntervalProportionsProps) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (unit.b_int_id == null && unit.t_int_id == null) return null;\n\n  let _showProps = showProportions;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n\n  const ints = new Set([i0, i1]);\n\n  /** Get interval information */\n  const intervalMap = useMacrostratDefs(\"intervals\", Array.from(ints), null);\n  const [int0, int1] = useMemo(() => {\n    const int0 = intervalMap?.get(i0) ?? {};\n    if (i0 === i1) {\n      return [int0, int0];\n    }\n    const int1 = intervalMap?.get(i1) ?? {};\n    return [int0, int1];\n  }, [intervalMap, i0, i1]);\n\n  const interval0: IntervalShort = {\n    id: i0,\n    name: unit.b_int_name,\n    ...int0,\n  };\n\n  let b_prop = unit.b_prop;\n  let t_prop = unit.t_prop;\n\n  // If we have b_age and t_age, then we can calculate proportions if they are not given\n  if (b_prop == null && unit.b_age != null && calculateProportionsFromAges) {\n    b_prop = getProportion(unit.b_age, int0);\n  }\n  if (t_prop == null && unit.t_age != null && calculateProportionsFromAges) {\n    t_prop = getProportion(unit.t_age, int1);\n  }\n\n  // If there are no proportions given and we are not explicitly directed to show them,\n  // then we set them to hidden.\n  if (b_prop == null && t_prop == null) {\n    _showProps ??= false;\n  }\n\n  /*\n    Set default proportions to 0 and 1 if they are not given,\n    so that we can display \"base\" and \"top\" labels\n   */\n  b_prop ??= 0;\n  t_prop ??= 1;\n\n  let p0: any = null;\n  let p1: any = null;\n\n  if (_showProps !== false) {\n    p1 = 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\n  return h(\n    ItemList,\n    { className: classNames(\"interval-proportions\", className) },\n    [\n      h(IntervalTag, {\n        interval: interval0,\n        prefix: p0,\n        ...rest,\n      }),\n      h.if(i0 != i1)(\"span.discourage-break\", [\n        h(\"span.sep\", \" to \"),\n        h(IntervalTag, {\n          interval: {\n            id: i1,\n            name: unit.t_int_name,\n            ...int1,\n          },\n          prefix: p1,\n          ...rest,\n        }),\n      ]),\n    ],\n  );\n}\n\nfunction getProportion(age: number, interval: IntervalShort): number | null {\n  /** Get proportion with the age */\n  return (interval.b_age - age) / (interval.b_age - interval.t_age);\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","useMemo","int0","int1","ItemList","classNames","IntervalTag","formatProportion"],"mappings":"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"}
+{"version":3,"file":"age-range.cjs","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  type IntervalTagProps,\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\";\nimport classNames from \"classnames\";\nimport { ReactNode, useMemo } from \"react\";\n\nexport function AgeField({ unit, children, ...rest }) {\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      ...rest,\n    },\n    children,\n  );\n}\n\nexport function AgeRange({\n  data,\n  className,\n}: {\n  data: {\n    t_age: number;\n    b_age: number;\n  };\n  className?: string;\n}) {\n  const [_b_age, _t_age, _unit] = getAgeRange(data);\n\n  return h(Value, {\n    value: formatRange(_b_age, _t_age),\n    unit: _unit,\n    className,\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\ninterface UnitIntervalConstraints {\n  b_int_id?: number;\n  t_int_id?: number;\n  b_prop?: number;\n  t_prop?: number;\n  b_int_name?: string;\n  t_int_name?: string;\n  b_age?: number;\n  t_age?: number;\n}\n\nexport interface IntervalProportionsProps extends Omit<\n  IntervalTagProps,\n  \"interval\"\n> {\n  unit: UnitIntervalConstraints;\n  showProportions?: boolean;\n  calculateProportionsFromAges?: boolean;\n  onClickItem?: any;\n}\n\nexport function IntervalProportions({\n  unit,\n  className,\n  showProportions,\n  calculateProportionsFromAges = true,\n  ...rest\n}: IntervalProportionsProps) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (unit.b_int_id == null && unit.t_int_id == null) return null;\n\n  let _showProps = showProportions;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n\n  const ints = new Set([i0, i1]);\n\n  /** Get interval information */\n  const intervalMap = useMacrostratDefs(\"intervals\", Array.from(ints), null);\n  const [int0, int1] = useMemo(() => {\n    const int0 = intervalMap?.get(i0) ?? {};\n    if (i0 === i1) {\n      return [int0, int0];\n    }\n    const int1 = intervalMap?.get(i1) ?? {};\n    return [int0, int1];\n  }, [intervalMap, i0, i1]);\n\n  const interval0: IntervalShort = {\n    id: i0,\n    name: unit.b_int_name,\n    ...int0,\n  };\n\n  let b_prop = unit.b_prop;\n  let t_prop = unit.t_prop;\n\n  // If we have b_age and t_age, then we can calculate proportions if they are not given\n  if (b_prop == null && unit.b_age != null && calculateProportionsFromAges) {\n    b_prop = getProportion(unit.b_age, int0);\n  }\n  if (t_prop == null && unit.t_age != null && calculateProportionsFromAges) {\n    t_prop = getProportion(unit.t_age, int1);\n  }\n\n  // If there are no proportions given and we are not explicitly directed to show them,\n  // then we set them to hidden.\n  if (b_prop == null && t_prop == null) {\n    _showProps ??= false;\n  }\n\n  /*\n    Set default proportions to 0 and 1 if they are not given,\n    so that we can display \"base\" and \"top\" labels\n   */\n  b_prop ??= 0;\n  t_prop ??= 1;\n\n  let p0: any = null;\n  let p1: any = null;\n\n  if (_showProps !== false) {\n    p1 = 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\n  return h(\n    ItemList,\n    { className: classNames(\"interval-proportions\", className) },\n    [\n      h(IntervalTag, {\n        interval: interval0,\n        prefix: p0,\n        ...rest,\n      }),\n      h.if(i0 != i1)(\"span.discourage-break\", [\n        h(\"span.sep\", \" to \"),\n        h(IntervalTag, {\n          interval: {\n            id: i1,\n            name: unit.t_int_name,\n            ...int1,\n          },\n          prefix: p1,\n          ...rest,\n        }),\n      ]),\n    ],\n  );\n}\n\nfunction getProportion(age: number, interval: IntervalShort): number | null {\n  /** Get proportion with the age */\n  return (interval.b_age - age) / (interval.b_age - interval.t_age);\n}\n\nexport function Proportion({ value }: { value: number }) {\n  let content: ReactNode | null = 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","useMemo","int0","int1","ItemList","classNames","IntervalTag","formatProportion"],"mappings":"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"}

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

@@ -1,4 +1,5 @@
 import { IntervalTagProps } from '@macrostrat/data-components';
+import { ReactNode } from 'react';
 export declare function AgeField({ unit, children, ...rest }: {
     [x: string]: any;
     unit: any;
@@ -63,9 +64,12 @@ export interface IntervalProportionsProps extends Omit<IntervalTagProps, "interv
     onClickItem?: any;
 }
 export declare function IntervalProportions({ unit, className, showProportions, calculateProportionsFromAges, ...rest }: IntervalProportionsProps): import('react').FunctionComponentElement<{
-    children?: import('react').ReactNode;
+    children?: ReactNode;
     className: string;
 }> | null;
+export declare function Proportion({ value }: {
+    value: number;
+}): import('react').DOMElement<import('react').DOMAttributes<Element>, Element>;
 export declare function getAgeRange(_unit: any): any[];
 export declare function getAge(value: any): any[];
 export {};

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

@@ -188,6 +188,7 @@ export {
   AgeRange,
   Duration,
   IntervalProportions,
+  Proportion,
   getAge,
   getAgeRange
 };

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

@@ -1 +1 @@
-{"version":3,"file":"age-range.js","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  type IntervalTagProps,\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\";\nimport classNames from \"classnames\";\nimport { useMemo } from \"react\";\n\nexport function AgeField({ unit, children, ...rest }) {\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      ...rest,\n    },\n    children,\n  );\n}\n\nexport function AgeRange({\n  data,\n  className,\n}: {\n  data: {\n    t_age: number;\n    b_age: number;\n  };\n  className?: string;\n}) {\n  const [_b_age, _t_age, _unit] = getAgeRange(data);\n\n  return h(Value, {\n    value: formatRange(_b_age, _t_age),\n    unit: _unit,\n    className,\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\ninterface UnitIntervalConstraints {\n  b_int_id?: number;\n  t_int_id?: number;\n  b_prop?: number;\n  t_prop?: number;\n  b_int_name?: string;\n  t_int_name?: string;\n  b_age?: number;\n  t_age?: number;\n}\n\nexport interface IntervalProportionsProps extends Omit<\n  IntervalTagProps,\n  \"interval\"\n> {\n  unit: UnitIntervalConstraints;\n  showProportions?: boolean;\n  calculateProportionsFromAges?: boolean;\n  onClickItem?: any;\n}\n\nexport function IntervalProportions({\n  unit,\n  className,\n  showProportions,\n  calculateProportionsFromAges = true,\n  ...rest\n}: IntervalProportionsProps) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (unit.b_int_id == null && unit.t_int_id == null) return null;\n\n  let _showProps = showProportions;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n\n  const ints = new Set([i0, i1]);\n\n  /** Get interval information */\n  const intervalMap = useMacrostratDefs(\"intervals\", Array.from(ints), null);\n  const [int0, int1] = useMemo(() => {\n    const int0 = intervalMap?.get(i0) ?? {};\n    if (i0 === i1) {\n      return [int0, int0];\n    }\n    const int1 = intervalMap?.get(i1) ?? {};\n    return [int0, int1];\n  }, [intervalMap, i0, i1]);\n\n  const interval0: IntervalShort = {\n    id: i0,\n    name: unit.b_int_name,\n    ...int0,\n  };\n\n  let b_prop = unit.b_prop;\n  let t_prop = unit.t_prop;\n\n  // If we have b_age and t_age, then we can calculate proportions if they are not given\n  if (b_prop == null && unit.b_age != null && calculateProportionsFromAges) {\n    b_prop = getProportion(unit.b_age, int0);\n  }\n  if (t_prop == null && unit.t_age != null && calculateProportionsFromAges) {\n    t_prop = getProportion(unit.t_age, int1);\n  }\n\n  // If there are no proportions given and we are not explicitly directed to show them,\n  // then we set them to hidden.\n  if (b_prop == null && t_prop == null) {\n    _showProps ??= false;\n  }\n\n  /*\n    Set default proportions to 0 and 1 if they are not given,\n    so that we can display \"base\" and \"top\" labels\n   */\n  b_prop ??= 0;\n  t_prop ??= 1;\n\n  let p0: any = null;\n  let p1: any = null;\n\n  if (_showProps !== false) {\n    p1 = 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\n  return h(\n    ItemList,\n    { className: classNames(\"interval-proportions\", className) },\n    [\n      h(IntervalTag, {\n        interval: interval0,\n        prefix: p0,\n        ...rest,\n      }),\n      h.if(i0 != i1)(\"span.discourage-break\", [\n        h(\"span.sep\", \" to \"),\n        h(IntervalTag, {\n          interval: {\n            id: i1,\n            name: unit.t_int_name,\n            ...int1,\n          },\n          prefix: p1,\n          ...rest,\n        }),\n      ]),\n    ],\n  );\n}\n\nfunction getProportion(age: number, interval: IntervalShort): number | null {\n  /** Get proportion with the age */\n  return (interval.b_age - age) / (interval.b_age - interval.t_age);\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":["int0","int1"],"mappings":"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"}
+{"version":3,"file":"age-range.js","sources":["../../src/unit-details/age-range.ts"],"sourcesContent":["import {\n  DataField,\n  IntervalShort,\n  IntervalTag,\n  type IntervalTagProps,\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\";\nimport classNames from \"classnames\";\nimport { ReactNode, useMemo } from \"react\";\n\nexport function AgeField({ unit, children, ...rest }) {\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      ...rest,\n    },\n    children,\n  );\n}\n\nexport function AgeRange({\n  data,\n  className,\n}: {\n  data: {\n    t_age: number;\n    b_age: number;\n  };\n  className?: string;\n}) {\n  const [_b_age, _t_age, _unit] = getAgeRange(data);\n\n  return h(Value, {\n    value: formatRange(_b_age, _t_age),\n    unit: _unit,\n    className,\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\ninterface UnitIntervalConstraints {\n  b_int_id?: number;\n  t_int_id?: number;\n  b_prop?: number;\n  t_prop?: number;\n  b_int_name?: string;\n  t_int_name?: string;\n  b_age?: number;\n  t_age?: number;\n}\n\nexport interface IntervalProportionsProps extends Omit<\n  IntervalTagProps,\n  \"interval\"\n> {\n  unit: UnitIntervalConstraints;\n  showProportions?: boolean;\n  calculateProportionsFromAges?: boolean;\n  onClickItem?: any;\n}\n\nexport function IntervalProportions({\n  unit,\n  className,\n  showProportions,\n  calculateProportionsFromAges = true,\n  ...rest\n}: IntervalProportionsProps) {\n  /** Display the proportions of the unit that belong to the base and top intervals, if they are different */\n  if (unit.b_int_id == null && unit.t_int_id == null) return null;\n\n  let _showProps = showProportions;\n\n  const i0 = unit.b_int_id;\n  const i1 = unit.t_int_id;\n\n  const ints = new Set([i0, i1]);\n\n  /** Get interval information */\n  const intervalMap = useMacrostratDefs(\"intervals\", Array.from(ints), null);\n  const [int0, int1] = useMemo(() => {\n    const int0 = intervalMap?.get(i0) ?? {};\n    if (i0 === i1) {\n      return [int0, int0];\n    }\n    const int1 = intervalMap?.get(i1) ?? {};\n    return [int0, int1];\n  }, [intervalMap, i0, i1]);\n\n  const interval0: IntervalShort = {\n    id: i0,\n    name: unit.b_int_name,\n    ...int0,\n  };\n\n  let b_prop = unit.b_prop;\n  let t_prop = unit.t_prop;\n\n  // If we have b_age and t_age, then we can calculate proportions if they are not given\n  if (b_prop == null && unit.b_age != null && calculateProportionsFromAges) {\n    b_prop = getProportion(unit.b_age, int0);\n  }\n  if (t_prop == null && unit.t_age != null && calculateProportionsFromAges) {\n    t_prop = getProportion(unit.t_age, int1);\n  }\n\n  // If there are no proportions given and we are not explicitly directed to show them,\n  // then we set them to hidden.\n  if (b_prop == null && t_prop == null) {\n    _showProps ??= false;\n  }\n\n  /*\n    Set default proportions to 0 and 1 if they are not given,\n    so that we can display \"base\" and \"top\" labels\n   */\n  b_prop ??= 0;\n  t_prop ??= 1;\n\n  let p0: any = null;\n  let p1: any = null;\n\n  if (_showProps !== false) {\n    p1 = 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\n  return h(\n    ItemList,\n    { className: classNames(\"interval-proportions\", className) },\n    [\n      h(IntervalTag, {\n        interval: interval0,\n        prefix: p0,\n        ...rest,\n      }),\n      h.if(i0 != i1)(\"span.discourage-break\", [\n        h(\"span.sep\", \" to \"),\n        h(IntervalTag, {\n          interval: {\n            id: i1,\n            name: unit.t_int_name,\n            ...int1,\n          },\n          prefix: p1,\n          ...rest,\n        }),\n      ]),\n    ],\n  );\n}\n\nfunction getProportion(age: number, interval: IntervalShort): number | null {\n  /** Get proportion with the age */\n  return (interval.b_age - age) / (interval.b_age - interval.t_age);\n}\n\nexport function Proportion({ value }: { value: number }) {\n  let content: ReactNode | null = 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":["int0","int1"],"mappings":"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"}

package/dist/units/composite.cjs

@@ -83,13 +83,15 @@ function AnnotatedUnitsColumn(props) {
   }, []);
   return null;
 }
+const DEFAULT_LABEL_SUPPRESS_HEIGHT = 2;
 function SectionLabelsColumn(props) {
   const {
     width = 300,
     noteMode = "unlabeled",
     labelOffset = 30,
     noteComponent,
-    shouldRenderNote
+    shouldRenderNote,
+    labelSuppressHeight = DEFAULT_LABEL_SUPPRESS_HEIGHT
   } = props;
   const { totalHeight, axisType } = store.useMacrostratColumnData();
   const _compositeScale = store.useCompositeScale();
@@ -117,6 +119,7 @@ function SectionLabelsColumn(props) {
           divisions: unitsToLabel,
           paddingLeft: labelOffset,
           width,
+          minimumHeight: labelSuppressHeight,
           noteComponent,
           shouldRenderNote,
           scale: _compositeScale,

package/dist/units/composite.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"composite.cjs","sources":["../../src/units/composite.ts"],"sourcesContent":["import { hyperStyled } from \"@macrostrat/hyper\";\nimport {\n  ColumnContext,\n  LithologyColumn,\n  SVG,\n} from \"@macrostrat/column-components\";\nimport { defaultNameFunction, UnitNamesColumn } from \"./names\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { LabeledUnit, UnitBoxes } from \"./boxes\";\nimport styles from \"./composite.module.sass\";\nimport {\n  useCompositeScale,\n  useMacrostratColumnData,\n  useUnitSelectionDispatch,\n} from \"../data-provider\";\n\nconst h = hyperStyled(styles);\n\ninterface LabelTracker {\n  [key: number]: boolean;\n}\n\nconst LabelTrackerContext = createContext(null);\nconst UnlabeledDivisionsContext = createContext(null);\n\nconst findMacrostratUnitID = (u) => u.unit_id;\n\nexport function LabelTrackerProvider(props) {\n  /** Tracker for units to handle state for whether their labels fit inline or not.\n   * Designed to work for single or composite columns.\n   */\n  const { children, units, findUnitID = findMacrostratUnitID } = props;\n  const [unlabeledDivisions, setUnlabeledDivisions] = useState<\n    BaseUnit[] | null\n  >(null);\n  const labelTrackerRef = useRef<LabelTracker>({});\n\n  const recompute = useCallback(() => {\n    // Recompute over the *current* unit set (which changes as the column zooms).\n    // The tracker ref accumulates entries for units seen at any zoom level, so\n    // we gate on whether every currently-visible unit has reported — not on the\n    // total number of tracked units, which would go stale and freeze the notes.\n    const tracker = labelTrackerRef.current;\n    const allReported = units.every((d) => findUnitID(d) in tracker);\n    if (!allReported) return;\n    setUnlabeledDivisions(units.filter((d) => tracker[findUnitID(d)] === false));\n  }, [units, findUnitID]);\n\n  const trackLabelVisibility = useCallback(\n    (div, visible) => {\n      labelTrackerRef.current[findUnitID(div)] = visible;\n      recompute();\n    },\n    [recompute, findUnitID],\n  );\n\n  // Re-sync when the visible unit set changes (e.g. on zoom), so a unit whose\n  // label now fits inline stops also rendering as a note, and vice versa.\n  useEffect(() => {\n    recompute();\n  }, [recompute]);\n\n  const value = trackLabelVisibility;\n  return h(\n    LabelTrackerContext.Provider,\n    { value },\n    h(\n      UnlabeledDivisionsContext.Provider,\n      { value: unlabeledDivisions },\n      children,\n    ),\n  );\n}\n\nfunction TrackedLabeledUnit({\n  division,\n  nameForDivision = defaultNameFunction,\n  ...rest\n}) {\n  const trackLabelVisibility = useContext(LabelTrackerContext);\n  return h(LabeledUnit, {\n    division,\n    label: nameForDivision(division),\n    onLabelUpdated(label, visible) {\n      // If there is al LabelTrackerContext, update the label visibility\n      trackLabelVisibility?.(division, visible);\n    },\n    ...rest,\n  });\n}\n\nexport const CompositeUnitComponent = TrackedLabeledUnit;\n\ntype BaseUnitProps = {\n  width: number;\n  showLabels?: boolean;\n  columnWidth?: number;\n  clipToFrame?: boolean;\n};\n\ntype ICompositeUnitProps = BaseUnitProps & {\n  gutterWidth?: number;\n  labelOffset?: number;\n  paddingLeft?: number;\n  nameForDivision?: (division: BaseUnit) => string;\n  children?: React.ReactNode;\n  unitComponent?: React.FC<any>;\n  unitComponentProps?: any;\n  noteMode?: \"labeled\" | \"unlabeled\";\n  showLabelColumn?: boolean;\n  noteComponent?: React.FC<any>;\n  shouldRenderNote?: (d: any) => boolean;\n};\n\ninterface CompositeUnitProps {\n  unitComponent: React.FC<any>;\n  unitComponentProps?: any;\n  width: number;\n  showLabels?: boolean;\n  clipToFrame?: boolean;\n}\n\nexport function CompositeUnitsColumn(props: CompositeUnitProps) {\n  /*\n  A column with units and names either\n  overlapping or offset to the right\n  */\n  const {\n    width,\n    unitComponent = TrackedLabeledUnit,\n    unitComponentProps,\n    clipToFrame,\n    ...rest\n  } = props;\n\n  return h(LithologyColumn, { width, clipToFrame }, [\n    h(UnitBoxes, {\n      unitComponent,\n      unitComponentProps,\n      ...rest,\n    }),\n  ]);\n}\n\nexport function AnnotatedUnitsColumn(props: ICompositeUnitProps) {\n  useEffect(() => {\n    console.warn(\n      \"AnnotatedUnitsColumn is deprecated and currently renders a no-op for transition purposes\",\n    );\n  }, []);\n  return null;\n}\n\nexport function SectionLabelsColumn(props: ICompositeUnitProps) {\n  // Section with \"squishy\" time scale\n  const {\n    width = 300,\n    noteMode = \"unlabeled\",\n    labelOffset = 30,\n    noteComponent,\n    shouldRenderNote,\n  } = props;\n\n  const { totalHeight, axisType } = useMacrostratColumnData();\n  const _compositeScale = useCompositeScale();\n\n  const unlabeledUnits = useContext(UnlabeledDivisionsContext);\n  const unitsToLabel = noteMode == \"unlabeled\" ? unlabeledUnits : undefined;\n\n  const selectUnit = useUnitSelectionDispatch();\n\n  return h(\"div.section-labels-column\", [\n    h(\n      ColumnNotesProvider,\n      {\n        units: [],\n        scale: _compositeScale,\n        totalHeight,\n        axisType,\n      },\n      h(\n        SVG,\n        {\n          height: totalHeight,\n          innerWidth: width - 4,\n          paddingH: 1,\n          paddingLeft: 3,\n        },\n        h(UnitNamesColumn, {\n          divisions: unitsToLabel,\n          paddingLeft: labelOffset,\n          width,\n          noteComponent,\n          shouldRenderNote,\n          scale: _compositeScale,\n          onClickNote(note) {\n            selectUnit(note.data, null, null);\n          },\n        }),\n      ),\n    ),\n  ]);\n}\n\nexport function ColumnNotesProvider(props) {\n  // A fake column axis provider that allows scales to cross\n  const { children, scale, totalHeight, pixelScale } = props;\n\n  const { axisType } = useMacrostratColumnData();\n\n  return h(\n    ColumnContext.Provider,\n    {\n      value: {\n        divisions: [],\n        scale,\n        scaleClamped: scale,\n        pixelHeight: totalHeight,\n        pixelsPerMeter: pixelScale,\n        axisType,\n        zoom: 1,\n      },\n    },\n    children,\n  );\n}\n\nexport { TrackedLabeledUnit, ICompositeUnitProps };\n"],"names":["hyperStyled","styles","createContext","useState","useRef","useCallback","useEffect","defaultNameFunction","useContext","LabeledUnit","LithologyColumn","UnitBoxes","useMacrostratColumnData","useCompositeScale","useUnitSelectionDispatch","SVG","UnitNamesColumn","ColumnContext"],"mappings":"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"}
+{"version":3,"file":"composite.cjs","sources":["../../src/units/composite.ts"],"sourcesContent":["import { hyperStyled } from \"@macrostrat/hyper\";\nimport {\n  ColumnContext,\n  LithologyColumn,\n  SVG,\n} from \"@macrostrat/column-components\";\nimport { defaultNameFunction, UnitNamesColumn } from \"./names\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { LabeledUnit, UnitBoxes } from \"./boxes\";\nimport styles from \"./composite.module.sass\";\nimport {\n  useCompositeScale,\n  useMacrostratColumnData,\n  useUnitSelectionDispatch,\n} from \"../data-provider\";\n\nconst h = hyperStyled(styles);\n\ninterface LabelTracker {\n  [key: number]: boolean;\n}\n\nconst LabelTrackerContext = createContext(null);\nconst UnlabeledDivisionsContext = createContext(null);\n\nconst findMacrostratUnitID = (u) => u.unit_id;\n\nexport function LabelTrackerProvider(props) {\n  /** Tracker for units to handle state for whether their labels fit inline or not.\n   * Designed to work for single or composite columns.\n   */\n  const { children, units, findUnitID = findMacrostratUnitID } = props;\n  const [unlabeledDivisions, setUnlabeledDivisions] = useState<\n    BaseUnit[] | null\n  >(null);\n  const labelTrackerRef = useRef<LabelTracker>({});\n\n  const recompute = useCallback(() => {\n    // Recompute over the *current* unit set (which changes as the column zooms).\n    // The tracker ref accumulates entries for units seen at any zoom level, so\n    // we gate on whether every currently-visible unit has reported — not on the\n    // total number of tracked units, which would go stale and freeze the notes.\n    const tracker = labelTrackerRef.current;\n    const allReported = units.every((d) => findUnitID(d) in tracker);\n    if (!allReported) return;\n    setUnlabeledDivisions(units.filter((d) => tracker[findUnitID(d)] === false));\n  }, [units, findUnitID]);\n\n  const trackLabelVisibility = useCallback(\n    (div, visible) => {\n      labelTrackerRef.current[findUnitID(div)] = visible;\n      recompute();\n    },\n    [recompute, findUnitID],\n  );\n\n  // Re-sync when the visible unit set changes (e.g. on zoom), so a unit whose\n  // label now fits inline stops also rendering as a note, and vice versa.\n  useEffect(() => {\n    recompute();\n  }, [recompute]);\n\n  const value = trackLabelVisibility;\n  return h(\n    LabelTrackerContext.Provider,\n    { value },\n    h(\n      UnlabeledDivisionsContext.Provider,\n      { value: unlabeledDivisions },\n      children,\n    ),\n  );\n}\n\nfunction TrackedLabeledUnit({\n  division,\n  nameForDivision = defaultNameFunction,\n  ...rest\n}) {\n  const trackLabelVisibility = useContext(LabelTrackerContext);\n  return h(LabeledUnit, {\n    division,\n    label: nameForDivision(division),\n    onLabelUpdated(label, visible) {\n      // If there is al LabelTrackerContext, update the label visibility\n      trackLabelVisibility?.(division, visible);\n    },\n    ...rest,\n  });\n}\n\nexport const CompositeUnitComponent = TrackedLabeledUnit;\n\ntype BaseUnitProps = {\n  width: number;\n  showLabels?: boolean;\n  columnWidth?: number;\n  clipToFrame?: boolean;\n};\n\ntype ICompositeUnitProps = BaseUnitProps & {\n  gutterWidth?: number;\n  labelOffset?: number;\n  paddingLeft?: number;\n  nameForDivision?: (division: BaseUnit) => string;\n  children?: React.ReactNode;\n  unitComponent?: React.FC<any>;\n  unitComponentProps?: any;\n  noteMode?: \"labeled\" | \"unlabeled\";\n  showLabelColumn?: boolean;\n  noteComponent?: React.FC<any>;\n  shouldRenderNote?: (d: any) => boolean;\n  /** Suppress the label for a unit drawn thinner than this many pixels */\n  labelSuppressHeight?: number;\n};\n\ninterface CompositeUnitProps {\n  unitComponent: React.FC<any>;\n  unitComponentProps?: any;\n  width: number;\n  showLabels?: boolean;\n  clipToFrame?: boolean;\n}\n\nexport function CompositeUnitsColumn(props: CompositeUnitProps) {\n  /*\n  A column with units and names either\n  overlapping or offset to the right\n  */\n  const {\n    width,\n    unitComponent = TrackedLabeledUnit,\n    unitComponentProps,\n    clipToFrame,\n    ...rest\n  } = props;\n\n  return h(LithologyColumn, { width, clipToFrame }, [\n    h(UnitBoxes, {\n      unitComponent,\n      unitComponentProps,\n      ...rest,\n    }),\n  ]);\n}\n\nexport function AnnotatedUnitsColumn(props: ICompositeUnitProps) {\n  useEffect(() => {\n    console.warn(\n      \"AnnotatedUnitsColumn is deprecated and currently renders a no-op for transition purposes\",\n    );\n  }, []);\n  return null;\n}\n\n/** A unit drawn thinner than this gets no label. The notes column can place\n * a label away from its unit and run a leader line back, so a thin unit is\n * labelable in principle — but below a pixel or two there is nothing on the\n * page to lead back to, and a dense column spends its labels on units the\n * reader cannot see. */\nconst DEFAULT_LABEL_SUPPRESS_HEIGHT = 2;\n\nexport function SectionLabelsColumn(props: ICompositeUnitProps) {\n  // Section with \"squishy\" time scale\n  const {\n    width = 300,\n    noteMode = \"unlabeled\",\n    labelOffset = 30,\n    noteComponent,\n    shouldRenderNote,\n    labelSuppressHeight = DEFAULT_LABEL_SUPPRESS_HEIGHT,\n  } = props;\n\n  const { totalHeight, axisType } = useMacrostratColumnData();\n  const _compositeScale = useCompositeScale();\n\n  const unlabeledUnits = useContext(UnlabeledDivisionsContext);\n  const unitsToLabel = noteMode == \"unlabeled\" ? unlabeledUnits : undefined;\n\n  const selectUnit = useUnitSelectionDispatch();\n\n  return h(\"div.section-labels-column\", [\n    h(\n      ColumnNotesProvider,\n      {\n        units: [],\n        scale: _compositeScale,\n        totalHeight,\n        axisType,\n      },\n      h(\n        SVG,\n        {\n          height: totalHeight,\n          innerWidth: width - 4,\n          paddingH: 1,\n          paddingLeft: 3,\n        },\n        h(UnitNamesColumn, {\n          divisions: unitsToLabel,\n          paddingLeft: labelOffset,\n          width,\n          minimumHeight: labelSuppressHeight,\n          noteComponent,\n          shouldRenderNote,\n          scale: _compositeScale,\n          onClickNote(note) {\n            selectUnit(note.data, null, null);\n          },\n        }),\n      ),\n    ),\n  ]);\n}\n\nexport function ColumnNotesProvider(props) {\n  // A fake column axis provider that allows scales to cross\n  const { children, scale, totalHeight, pixelScale } = props;\n\n  const { axisType } = useMacrostratColumnData();\n\n  return h(\n    ColumnContext.Provider,\n    {\n      value: {\n        divisions: [],\n        scale,\n        scaleClamped: scale,\n        pixelHeight: totalHeight,\n        pixelsPerMeter: pixelScale,\n        axisType,\n        zoom: 1,\n      },\n    },\n    children,\n  );\n}\n\nexport { TrackedLabeledUnit, ICompositeUnitProps };\n"],"names":["hyperStyled","styles","createContext","useState","useRef","useCallback","useEffect","defaultNameFunction","useContext","LabeledUnit","LithologyColumn","UnitBoxes","useMacrostratColumnData","useCompositeScale","useUnitSelectionDispatch","SVG","UnitNamesColumn","ColumnContext"],"mappings":"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"}

package/dist/units/composite.d.ts

@@ -24,6 +24,8 @@ type ICompositeUnitProps = BaseUnitProps & {
     showLabelColumn?: boolean;
     noteComponent?: React.FC<any>;
     shouldRenderNote?: (d: any) => boolean;
+    /** Suppress the label for a unit drawn thinner than this many pixels */
+    labelSuppressHeight?: number;
 };
 interface CompositeUnitProps {
     unitComponent: React.FC<any>;

package/dist/units/composite.js

@@ -81,13 +81,15 @@ function AnnotatedUnitsColumn(props) {
   }, []);
   return null;
 }
+const DEFAULT_LABEL_SUPPRESS_HEIGHT = 2;
 function SectionLabelsColumn(props) {
   const {
     width = 300,
     noteMode = "unlabeled",
     labelOffset = 30,
     noteComponent,
-    shouldRenderNote
+    shouldRenderNote,
+    labelSuppressHeight = DEFAULT_LABEL_SUPPRESS_HEIGHT
   } = props;
   const { totalHeight, axisType } = useMacrostratColumnData();
   const _compositeScale = useCompositeScale();
@@ -115,6 +117,7 @@ function SectionLabelsColumn(props) {
           divisions: unitsToLabel,
           paddingLeft: labelOffset,
           width,
+          minimumHeight: labelSuppressHeight,
           noteComponent,
           shouldRenderNote,
           scale: _compositeScale,

package/dist/units/composite.js.map

@@ -1 +1 @@
-{"version":3,"file":"composite.js","sources":["../../src/units/composite.ts"],"sourcesContent":["import { hyperStyled } from \"@macrostrat/hyper\";\nimport {\n  ColumnContext,\n  LithologyColumn,\n  SVG,\n} from \"@macrostrat/column-components\";\nimport { defaultNameFunction, UnitNamesColumn } from \"./names\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { LabeledUnit, UnitBoxes } from \"./boxes\";\nimport styles from \"./composite.module.sass\";\nimport {\n  useCompositeScale,\n  useMacrostratColumnData,\n  useUnitSelectionDispatch,\n} from \"../data-provider\";\n\nconst h = hyperStyled(styles);\n\ninterface LabelTracker {\n  [key: number]: boolean;\n}\n\nconst LabelTrackerContext = createContext(null);\nconst UnlabeledDivisionsContext = createContext(null);\n\nconst findMacrostratUnitID = (u) => u.unit_id;\n\nexport function LabelTrackerProvider(props) {\n  /** Tracker for units to handle state for whether their labels fit inline or not.\n   * Designed to work for single or composite columns.\n   */\n  const { children, units, findUnitID = findMacrostratUnitID } = props;\n  const [unlabeledDivisions, setUnlabeledDivisions] = useState<\n    BaseUnit[] | null\n  >(null);\n  const labelTrackerRef = useRef<LabelTracker>({});\n\n  const recompute = useCallback(() => {\n    // Recompute over the *current* unit set (which changes as the column zooms).\n    // The tracker ref accumulates entries for units seen at any zoom level, so\n    // we gate on whether every currently-visible unit has reported — not on the\n    // total number of tracked units, which would go stale and freeze the notes.\n    const tracker = labelTrackerRef.current;\n    const allReported = units.every((d) => findUnitID(d) in tracker);\n    if (!allReported) return;\n    setUnlabeledDivisions(units.filter((d) => tracker[findUnitID(d)] === false));\n  }, [units, findUnitID]);\n\n  const trackLabelVisibility = useCallback(\n    (div, visible) => {\n      labelTrackerRef.current[findUnitID(div)] = visible;\n      recompute();\n    },\n    [recompute, findUnitID],\n  );\n\n  // Re-sync when the visible unit set changes (e.g. on zoom), so a unit whose\n  // label now fits inline stops also rendering as a note, and vice versa.\n  useEffect(() => {\n    recompute();\n  }, [recompute]);\n\n  const value = trackLabelVisibility;\n  return h(\n    LabelTrackerContext.Provider,\n    { value },\n    h(\n      UnlabeledDivisionsContext.Provider,\n      { value: unlabeledDivisions },\n      children,\n    ),\n  );\n}\n\nfunction TrackedLabeledUnit({\n  division,\n  nameForDivision = defaultNameFunction,\n  ...rest\n}) {\n  const trackLabelVisibility = useContext(LabelTrackerContext);\n  return h(LabeledUnit, {\n    division,\n    label: nameForDivision(division),\n    onLabelUpdated(label, visible) {\n      // If there is al LabelTrackerContext, update the label visibility\n      trackLabelVisibility?.(division, visible);\n    },\n    ...rest,\n  });\n}\n\nexport const CompositeUnitComponent = TrackedLabeledUnit;\n\ntype BaseUnitProps = {\n  width: number;\n  showLabels?: boolean;\n  columnWidth?: number;\n  clipToFrame?: boolean;\n};\n\ntype ICompositeUnitProps = BaseUnitProps & {\n  gutterWidth?: number;\n  labelOffset?: number;\n  paddingLeft?: number;\n  nameForDivision?: (division: BaseUnit) => string;\n  children?: React.ReactNode;\n  unitComponent?: React.FC<any>;\n  unitComponentProps?: any;\n  noteMode?: \"labeled\" | \"unlabeled\";\n  showLabelColumn?: boolean;\n  noteComponent?: React.FC<any>;\n  shouldRenderNote?: (d: any) => boolean;\n};\n\ninterface CompositeUnitProps {\n  unitComponent: React.FC<any>;\n  unitComponentProps?: any;\n  width: number;\n  showLabels?: boolean;\n  clipToFrame?: boolean;\n}\n\nexport function CompositeUnitsColumn(props: CompositeUnitProps) {\n  /*\n  A column with units and names either\n  overlapping or offset to the right\n  */\n  const {\n    width,\n    unitComponent = TrackedLabeledUnit,\n    unitComponentProps,\n    clipToFrame,\n    ...rest\n  } = props;\n\n  return h(LithologyColumn, { width, clipToFrame }, [\n    h(UnitBoxes, {\n      unitComponent,\n      unitComponentProps,\n      ...rest,\n    }),\n  ]);\n}\n\nexport function AnnotatedUnitsColumn(props: ICompositeUnitProps) {\n  useEffect(() => {\n    console.warn(\n      \"AnnotatedUnitsColumn is deprecated and currently renders a no-op for transition purposes\",\n    );\n  }, []);\n  return null;\n}\n\nexport function SectionLabelsColumn(props: ICompositeUnitProps) {\n  // Section with \"squishy\" time scale\n  const {\n    width = 300,\n    noteMode = \"unlabeled\",\n    labelOffset = 30,\n    noteComponent,\n    shouldRenderNote,\n  } = props;\n\n  const { totalHeight, axisType } = useMacrostratColumnData();\n  const _compositeScale = useCompositeScale();\n\n  const unlabeledUnits = useContext(UnlabeledDivisionsContext);\n  const unitsToLabel = noteMode == \"unlabeled\" ? unlabeledUnits : undefined;\n\n  const selectUnit = useUnitSelectionDispatch();\n\n  return h(\"div.section-labels-column\", [\n    h(\n      ColumnNotesProvider,\n      {\n        units: [],\n        scale: _compositeScale,\n        totalHeight,\n        axisType,\n      },\n      h(\n        SVG,\n        {\n          height: totalHeight,\n          innerWidth: width - 4,\n          paddingH: 1,\n          paddingLeft: 3,\n        },\n        h(UnitNamesColumn, {\n          divisions: unitsToLabel,\n          paddingLeft: labelOffset,\n          width,\n          noteComponent,\n          shouldRenderNote,\n          scale: _compositeScale,\n          onClickNote(note) {\n            selectUnit(note.data, null, null);\n          },\n        }),\n      ),\n    ),\n  ]);\n}\n\nexport function ColumnNotesProvider(props) {\n  // A fake column axis provider that allows scales to cross\n  const { children, scale, totalHeight, pixelScale } = props;\n\n  const { axisType } = useMacrostratColumnData();\n\n  return h(\n    ColumnContext.Provider,\n    {\n      value: {\n        divisions: [],\n        scale,\n        scaleClamped: scale,\n        pixelHeight: totalHeight,\n        pixelsPerMeter: pixelScale,\n        axisType,\n        zoom: 1,\n      },\n    },\n    children,\n  );\n}\n\nexport { TrackedLabeledUnit, ICompositeUnitProps };\n"],"names":["styles"],"mappings":"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"}
+{"version":3,"file":"composite.js","sources":["../../src/units/composite.ts"],"sourcesContent":["import { hyperStyled } from \"@macrostrat/hyper\";\nimport {\n  ColumnContext,\n  LithologyColumn,\n  SVG,\n} from \"@macrostrat/column-components\";\nimport { defaultNameFunction, UnitNamesColumn } from \"./names\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { LabeledUnit, UnitBoxes } from \"./boxes\";\nimport styles from \"./composite.module.sass\";\nimport {\n  useCompositeScale,\n  useMacrostratColumnData,\n  useUnitSelectionDispatch,\n} from \"../data-provider\";\n\nconst h = hyperStyled(styles);\n\ninterface LabelTracker {\n  [key: number]: boolean;\n}\n\nconst LabelTrackerContext = createContext(null);\nconst UnlabeledDivisionsContext = createContext(null);\n\nconst findMacrostratUnitID = (u) => u.unit_id;\n\nexport function LabelTrackerProvider(props) {\n  /** Tracker for units to handle state for whether their labels fit inline or not.\n   * Designed to work for single or composite columns.\n   */\n  const { children, units, findUnitID = findMacrostratUnitID } = props;\n  const [unlabeledDivisions, setUnlabeledDivisions] = useState<\n    BaseUnit[] | null\n  >(null);\n  const labelTrackerRef = useRef<LabelTracker>({});\n\n  const recompute = useCallback(() => {\n    // Recompute over the *current* unit set (which changes as the column zooms).\n    // The tracker ref accumulates entries for units seen at any zoom level, so\n    // we gate on whether every currently-visible unit has reported — not on the\n    // total number of tracked units, which would go stale and freeze the notes.\n    const tracker = labelTrackerRef.current;\n    const allReported = units.every((d) => findUnitID(d) in tracker);\n    if (!allReported) return;\n    setUnlabeledDivisions(units.filter((d) => tracker[findUnitID(d)] === false));\n  }, [units, findUnitID]);\n\n  const trackLabelVisibility = useCallback(\n    (div, visible) => {\n      labelTrackerRef.current[findUnitID(div)] = visible;\n      recompute();\n    },\n    [recompute, findUnitID],\n  );\n\n  // Re-sync when the visible unit set changes (e.g. on zoom), so a unit whose\n  // label now fits inline stops also rendering as a note, and vice versa.\n  useEffect(() => {\n    recompute();\n  }, [recompute]);\n\n  const value = trackLabelVisibility;\n  return h(\n    LabelTrackerContext.Provider,\n    { value },\n    h(\n      UnlabeledDivisionsContext.Provider,\n      { value: unlabeledDivisions },\n      children,\n    ),\n  );\n}\n\nfunction TrackedLabeledUnit({\n  division,\n  nameForDivision = defaultNameFunction,\n  ...rest\n}) {\n  const trackLabelVisibility = useContext(LabelTrackerContext);\n  return h(LabeledUnit, {\n    division,\n    label: nameForDivision(division),\n    onLabelUpdated(label, visible) {\n      // If there is al LabelTrackerContext, update the label visibility\n      trackLabelVisibility?.(division, visible);\n    },\n    ...rest,\n  });\n}\n\nexport const CompositeUnitComponent = TrackedLabeledUnit;\n\ntype BaseUnitProps = {\n  width: number;\n  showLabels?: boolean;\n  columnWidth?: number;\n  clipToFrame?: boolean;\n};\n\ntype ICompositeUnitProps = BaseUnitProps & {\n  gutterWidth?: number;\n  labelOffset?: number;\n  paddingLeft?: number;\n  nameForDivision?: (division: BaseUnit) => string;\n  children?: React.ReactNode;\n  unitComponent?: React.FC<any>;\n  unitComponentProps?: any;\n  noteMode?: \"labeled\" | \"unlabeled\";\n  showLabelColumn?: boolean;\n  noteComponent?: React.FC<any>;\n  shouldRenderNote?: (d: any) => boolean;\n  /** Suppress the label for a unit drawn thinner than this many pixels */\n  labelSuppressHeight?: number;\n};\n\ninterface CompositeUnitProps {\n  unitComponent: React.FC<any>;\n  unitComponentProps?: any;\n  width: number;\n  showLabels?: boolean;\n  clipToFrame?: boolean;\n}\n\nexport function CompositeUnitsColumn(props: CompositeUnitProps) {\n  /*\n  A column with units and names either\n  overlapping or offset to the right\n  */\n  const {\n    width,\n    unitComponent = TrackedLabeledUnit,\n    unitComponentProps,\n    clipToFrame,\n    ...rest\n  } = props;\n\n  return h(LithologyColumn, { width, clipToFrame }, [\n    h(UnitBoxes, {\n      unitComponent,\n      unitComponentProps,\n      ...rest,\n    }),\n  ]);\n}\n\nexport function AnnotatedUnitsColumn(props: ICompositeUnitProps) {\n  useEffect(() => {\n    console.warn(\n      \"AnnotatedUnitsColumn is deprecated and currently renders a no-op for transition purposes\",\n    );\n  }, []);\n  return null;\n}\n\n/** A unit drawn thinner than this gets no label. The notes column can place\n * a label away from its unit and run a leader line back, so a thin unit is\n * labelable in principle — but below a pixel or two there is nothing on the\n * page to lead back to, and a dense column spends its labels on units the\n * reader cannot see. */\nconst DEFAULT_LABEL_SUPPRESS_HEIGHT = 2;\n\nexport function SectionLabelsColumn(props: ICompositeUnitProps) {\n  // Section with \"squishy\" time scale\n  const {\n    width = 300,\n    noteMode = \"unlabeled\",\n    labelOffset = 30,\n    noteComponent,\n    shouldRenderNote,\n    labelSuppressHeight = DEFAULT_LABEL_SUPPRESS_HEIGHT,\n  } = props;\n\n  const { totalHeight, axisType } = useMacrostratColumnData();\n  const _compositeScale = useCompositeScale();\n\n  const unlabeledUnits = useContext(UnlabeledDivisionsContext);\n  const unitsToLabel = noteMode == \"unlabeled\" ? unlabeledUnits : undefined;\n\n  const selectUnit = useUnitSelectionDispatch();\n\n  return h(\"div.section-labels-column\", [\n    h(\n      ColumnNotesProvider,\n      {\n        units: [],\n        scale: _compositeScale,\n        totalHeight,\n        axisType,\n      },\n      h(\n        SVG,\n        {\n          height: totalHeight,\n          innerWidth: width - 4,\n          paddingH: 1,\n          paddingLeft: 3,\n        },\n        h(UnitNamesColumn, {\n          divisions: unitsToLabel,\n          paddingLeft: labelOffset,\n          width,\n          minimumHeight: labelSuppressHeight,\n          noteComponent,\n          shouldRenderNote,\n          scale: _compositeScale,\n          onClickNote(note) {\n            selectUnit(note.data, null, null);\n          },\n        }),\n      ),\n    ),\n  ]);\n}\n\nexport function ColumnNotesProvider(props) {\n  // A fake column axis provider that allows scales to cross\n  const { children, scale, totalHeight, pixelScale } = props;\n\n  const { axisType } = useMacrostratColumnData();\n\n  return h(\n    ColumnContext.Provider,\n    {\n      value: {\n        divisions: [],\n        scale,\n        scaleClamped: scale,\n        pixelHeight: totalHeight,\n        pixelsPerMeter: pixelScale,\n        axisType,\n        zoom: 1,\n      },\n    },\n    children,\n  );\n}\n\nexport { TrackedLabeledUnit, ICompositeUnitProps };\n"],"names":["styles"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@macrostrat/column-views",
-  "version": "3.11.0",
+  "version": "3.12.0",
   "description": "Data views for Macrostrat stratigraphic columns",
   "repository": {
     "type": "git",
@@ -46,16 +46,16 @@
   },
   "dependencies": {
     "@blueprintjs/core": "^6.14.0",
-    "@macrostrat/api-types": "^1.3.0",
+    "@macrostrat/api-types": "^1.4.0",
     "@macrostrat/color-utils": "^1.2.2",
-    "@macrostrat/column-components": "^2.1.0",
+    "@macrostrat/column-components": "^2.2.0",
     "@macrostrat/data-components": "^1.5.1",
-    "@macrostrat/data-provider": "^1.2.0",
+    "@macrostrat/data-provider": "^1.3.1",
     "@macrostrat/hyper": "^3.1.1",
-    "@macrostrat/map-views": "^1.0.0",
+    "@macrostrat/map-views": "^1.1.1",
     "@macrostrat/scoped-store": "^1.1.0",
-    "@macrostrat/stratigraphy-utils": "^1.4.0",
-    "@macrostrat/timescale": "^3.2.0",
+    "@macrostrat/stratigraphy-utils": "^1.4.2",
+    "@macrostrat/timescale": "^3.3.0",
     "@macrostrat/ui-components": "^5.2.0",
     "@types/chroma-js": "^3.1.1",
     "@types/d3-format": "^3.0.4",

package/src/age-model/data.ts

@@ -0,0 +1,98 @@
+/** Data hooks for a column's age model. */
+import { useMemo } from "react";
+import { useAPIResult } from "@macrostrat/ui-components";
+import { useMacrostratBaseURL } from "@macrostrat/data-provider";
+import type { UnitLong } from "@macrostrat/api-types";
+import { useMacrostratColumnData, useMacrostratUnits } from "../data-provider";
+import {
+  type AgeModelBoundary,
+  type ColumnSurface,
+  surfacesFromBoundaries,
+  surfacesFromUnits,
+} from "./types";
+
+export const AGE_MODEL_ROUTE = "/age_model";
+
+/** The age-model boundaries of a column, from `/age_model?col_id=` on the
+ * API the enclosing `MacrostratDataProvider` points at (production when there
+ * is none). `null` while loading or when `col_id` is not set. */
+export function useColumnAgeModel(
+  col_id: number | null | undefined,
+): AgeModelBoundary[] | null {
+  const baseURL = useMacrostratBaseURL();
+  const params = useMemo(() => ({ col_id }), [col_id]);
+  let route: string | null = null;
+  if (col_id != null) {
+    route = baseURL + AGE_MODEL_ROUTE;
+  }
+  return useAPIResult(route, params, unwrapAgeModel) ?? null;
+}
+
+function unwrapAgeModel(res: any): AgeModelBoundary[] {
+  return res?.success?.data ?? [];
+}
+
+/** Where a column's surfaces came from */
+export type SurfacesSource = "provided" | "age-model" | "derived" | "loading";
+
+export interface UseColumnSurfacesOptions {
+  /** Surfaces to show. When given, nothing is fetched. */
+  surfaces?: ColumnSurface[] | null;
+  /** The column whose age model to fetch. Defaults to the column being
+   * rendered (read from its units). */
+  col_id?: number | null;
+  /** When the age model has no boundaries, derive surfaces from the units
+   * instead (default `true`). */
+  fallbackToUnits?: boolean;
+  /** Promote `modeled` surfaces that must in fact constrain the age model to
+   * `relative` (default `true`) — see `inferTiePointStatuses`. */
+  inferTiePoints?: boolean;
+}
+
+export interface ColumnSurfacesData {
+  surfaces: ColumnSurface[];
+  source: SurfacesSource;
+}
+
+/** Resolve the surfaces to show for the enclosing `Column`: the ones passed
+ * in, else the column's age model, else (optionally) surfaces derived from
+ * its units. Must be used inside a `Column`. */
+export function useColumnSurfaces(
+  options: UseColumnSurfacesOptions = {},
+): ColumnSurfacesData {
+  const {
+    surfaces: provided,
+    col_id,
+    fallbackToUnits = true,
+    inferTiePoints = true,
+  } = options;
+  const units = useMacrostratUnits() as UnitLong[] | undefined;
+  const { axisType } = useMacrostratColumnData();
+
+  let fetchID: number | null = null;
+  if (provided == null) {
+    fetchID = col_id ?? units?.[0]?.col_id ?? null;
+  }
+  const boundaries = useColumnAgeModel(fetchID);
+
+  const fromAgeModel = useMemo(
+    () => surfacesFromBoundaries(boundaries, { inferTiePoints }),
+    [boundaries, inferTiePoints],
+  );
+
+  const derived = useMemo(() => {
+    if (!fallbackToUnits) return [];
+    return surfacesFromUnits(units, { axisType });
+  }, [units, axisType, fallbackToUnits]);
+
+  if (provided != null) {
+    return { surfaces: provided, source: "provided" };
+  }
+  if (fetchID != null && boundaries == null) {
+    return { surfaces: [], source: "loading" };
+  }
+  if (fromAgeModel.length > 0) {
+    return { surfaces: fromAgeModel, source: "age-model" };
+  }
+  return { surfaces: derived, source: "derived" };
+}

package/src/age-model/details.module.sass

@@ -0,0 +1,108 @@
+.surface-details-panel
+  display: flex
+  flex-direction: column
+  min-width: 0
+
+.surface-details-header
+  display: flex
+  flex-direction: row
+  align-items: center
+  flex-wrap: wrap
+  gap: 0.5em
+  padding: 0.5em 0
+  border-bottom: 1px solid var(--pz-panel-rule-color, var(--panel-rule-color, #ddd))
+  .spacer
+    flex: 1
+
+.surface-details-title
+  margin: 0
+  font-size: 1.1em
+  .surface-id
+    font-size: 0.85em
+    color: var(--text-subtle-color, var(--pz-text-subtle-color))
+
+.surface-details-tags
+  display: flex
+  gap: 0.3em
+
+.surface-details-content
+  padding: 0.5em 0
+
+.no-surface .placeholder
+  color: var(--text-subtle-color, var(--pz-text-subtle-color))
+  margin: 0
+
+.surface-tag
+  // A colored dot leading the status label
+  &:before
+    content: ''
+    display: inline-block
+    width: 0.6em
+    height: 0.6em
+    border-radius: 50%
+    margin-right: 0.4em
+    background-color: var(--surface-color, currentColor)
+  &.surface-type-tag:before
+    display: none
+  // An inferred status is marked, so the tag doesn't pass for a recorded one
+  &.inferred
+    font-style: italic
+
+.inferred-marker
+  margin-left: 0.15em
+  opacity: 0.7
+
+.calibration-interval
+  display: flex
+  align-items: baseline
+  gap: 0.5em
+  flex-wrap: wrap
+
+.calibration-range
+  color: var(--text-subtle-color, var(--pz-text-subtle-color))
+  font-size: 0.9em
+
+.calibration-proportion
+  margin-top: 0.2em
+
+.surface-units-list
+  list-style: none
+  margin: 0
+  padding: 0
+  li
+    display: inline
+    &:after
+      content: ', '
+    &:last-child:after
+      content: ''
+
+.no-units, .no-calibration
+  color: var(--text-subtle-color, var(--pz-text-subtle-color))
+
+.surface-status-legend
+  list-style: none
+  margin: 0
+  padding: 0
+  display: flex
+  flex-direction: column
+  gap: 0.3em
+  font-size: 0.85em
+  &.with-descriptions
+    gap: 0.6em
+
+.legend-item
+  display: flex
+  flex-direction: row
+  align-items: baseline
+  gap: 0.6em
+  .surface-label-marker
+    flex: none
+    width: 24px
+    align-self: center
+
+.legend-label
+  font-weight: 500
+
+.legend-description
+  color: var(--text-subtle-color, var(--pz-text-subtle-color))
+  font-size: 0.9em