@macrostrat/column-views 3.9.0 → 3.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +44 -0
- package/dist/column-views.css +10 -0
- package/dist/correlation-chart/main.cjs +11 -3
- package/dist/correlation-chart/main.cjs.map +1 -1
- package/dist/correlation-chart/main.d.ts +1 -1
- package/dist/correlation-chart/main.js +11 -3
- package/dist/correlation-chart/main.js.map +1 -1
- package/dist/index.cjs +18 -42
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +4 -34
- package/dist/index.js.map +1 -1
- package/dist/unit-details/age-window-tag.cjs +68 -0
- package/dist/unit-details/age-window-tag.cjs.map +1 -0
- package/dist/unit-details/age-window-tag.d.ts +26 -0
- package/dist/unit-details/age-window-tag.js +66 -0
- package/dist/unit-details/age-window-tag.js.map +1 -0
- package/dist/unit-details/age-window-tag.module.sass.cjs +12 -0
- package/dist/unit-details/age-window-tag.module.sass.cjs.map +1 -0
- package/dist/unit-details/age-window-tag.module.sass.js +11 -0
- package/dist/unit-details/age-window-tag.module.sass.js.map +1 -0
- package/dist/unit-details/index.d.ts +1 -0
- package/dist/units/boxes.cjs +3 -3
- package/dist/units/boxes.cjs.map +1 -1
- package/dist/units/boxes.js +3 -3
- package/dist/units/boxes.js.map +1 -1
- package/dist/units/index.cjs +7 -11
- package/dist/units/index.cjs.map +1 -1
- package/dist/units/index.d.ts +0 -1
- package/dist/units/index.js +4 -9
- package/dist/units/index.js.map +1 -1
- package/package.json +6 -27
- package/src/correlation-chart/main.ts +14 -2
- package/src/index.ts +3 -1
- package/src/unit-details/age-window-tag.module.sass +10 -0
- package/src/unit-details/age-window-tag.ts +102 -0
- package/src/unit-details/index.ts +1 -0
- package/src/units/boxes.ts +7 -4
- package/src/units/index.ts +9 -26
- package/dist/maps/column-correlation/core.cjs +0 -288
- package/dist/maps/column-correlation/core.cjs.map +0 -1
- package/dist/maps/column-correlation/core.d.ts +0 -9
- package/dist/maps/column-correlation/core.js +0 -286
- package/dist/maps/column-correlation/core.js.map +0 -1
- package/dist/maps/column-correlation/index.d.ts +0 -2
- package/dist/maps/column-correlation/state.cjs +0 -193
- package/dist/maps/column-correlation/state.cjs.map +0 -1
- package/dist/maps/column-correlation/state.d.ts +0 -62
- package/dist/maps/column-correlation/state.js +0 -190
- package/dist/maps/column-correlation/state.js.map +0 -1
- package/dist/maps/column-navigation/index.d.ts +0 -2
- package/dist/maps/column-navigation/mapbox/index.cjs +0 -215
- package/dist/maps/column-navigation/mapbox/index.cjs.map +0 -1
- package/dist/maps/column-navigation/mapbox/index.d.ts +0 -38
- package/dist/maps/column-navigation/mapbox/index.js +0 -213
- package/dist/maps/column-navigation/mapbox/index.js.map +0 -1
- package/dist/maps/column-navigation/mapbox/keyboard-navigation.cjs +0 -105
- package/dist/maps/column-navigation/mapbox/keyboard-navigation.cjs.map +0 -1
- package/dist/maps/column-navigation/mapbox/keyboard-navigation.d.ts +0 -8
- package/dist/maps/column-navigation/mapbox/keyboard-navigation.js +0 -105
- package/dist/maps/column-navigation/mapbox/keyboard-navigation.js.map +0 -1
- package/dist/maps/column-navigation/mapbox/state.cjs +0 -73
- package/dist/maps/column-navigation/mapbox/state.cjs.map +0 -1
- package/dist/maps/column-navigation/mapbox/state.d.ts +0 -23
- package/dist/maps/column-navigation/mapbox/state.js +0 -71
- package/dist/maps/column-navigation/mapbox/state.js.map +0 -1
- package/dist/maps/column-navigation/svg/animated.d.ts +0 -1
- package/dist/maps/column-navigation/svg/data-fetcher.cjs +0 -25
- package/dist/maps/column-navigation/svg/data-fetcher.cjs.map +0 -1
- package/dist/maps/column-navigation/svg/data-fetcher.d.ts +0 -6
- package/dist/maps/column-navigation/svg/data-fetcher.js +0 -25
- package/dist/maps/column-navigation/svg/data-fetcher.js.map +0 -1
- package/dist/maps/column-navigation/svg/index.cjs +0 -94
- package/dist/maps/column-navigation/svg/index.cjs.map +0 -1
- package/dist/maps/column-navigation/svg/index.d.ts +0 -9
- package/dist/maps/column-navigation/svg/index.js +0 -93
- package/dist/maps/column-navigation/svg/index.js.map +0 -1
- package/dist/maps/column-navigation/svg/layers.cjs +0 -177
- package/dist/maps/column-navigation/svg/layers.cjs.map +0 -1
- package/dist/maps/column-navigation/svg/layers.d.ts +0 -54
- package/dist/maps/column-navigation/svg/layers.js +0 -174
- package/dist/maps/column-navigation/svg/layers.js.map +0 -1
- package/dist/maps/column-navigation/utils/keyboard-navigation.cjs +0 -50
- package/dist/maps/column-navigation/utils/keyboard-navigation.cjs.map +0 -1
- package/dist/maps/column-navigation/utils/keyboard-navigation.d.ts +0 -10
- package/dist/maps/column-navigation/utils/keyboard-navigation.js +0 -50
- package/dist/maps/column-navigation/utils/keyboard-navigation.js.map +0 -1
- package/dist/maps/index.d.ts +0 -4
- package/dist/maps/inset-map/index.cjs +0 -71
- package/dist/maps/inset-map/index.cjs.map +0 -1
- package/dist/maps/inset-map/index.d.ts +0 -16
- package/dist/maps/inset-map/index.js +0 -69
- package/dist/maps/inset-map/index.js.map +0 -1
- package/dist/maps/layers/columns.cjs +0 -165
- package/dist/maps/layers/columns.cjs.map +0 -1
- package/dist/maps/layers/columns.d.ts +0 -28
- package/dist/maps/layers/columns.js +0 -165
- package/dist/maps/layers/columns.js.map +0 -1
- package/dist/maps/layers/index.d.ts +0 -2
- package/dist/maps/layers/units.cjs +0 -207
- package/dist/maps/layers/units.cjs.map +0 -1
- package/dist/maps/layers/units.d.ts +0 -14
- package/dist/maps/layers/units.js +0 -204
- package/dist/maps/layers/units.js.map +0 -1
- package/dist/units/colors.cjs +0 -115
- package/dist/units/colors.cjs.map +0 -1
- package/dist/units/colors.d.ts +0 -20
- package/dist/units/colors.js +0 -113
- package/dist/units/colors.js.map +0 -1
- package/dist/units/resolvers.cjs +0 -125
- package/dist/units/resolvers.cjs.map +0 -1
- package/dist/units/resolvers.d.ts +0 -8
- package/dist/units/resolvers.js +0 -125
- package/dist/units/resolvers.js.map +0 -1
- package/src/maps/column-correlation/column-correlation-map.stories.ts +0 -108
- package/src/maps/column-correlation/core.ts +0 -342
- package/src/maps/column-correlation/index.ts +0 -2
- package/src/maps/column-correlation/state.ts +0 -315
- package/src/maps/column-navigation/index.ts +0 -2
- package/src/maps/column-navigation/mapbox/column-navigation-map.stories.ts +0 -278
- package/src/maps/column-navigation/mapbox/index.ts +0 -276
- package/src/maps/column-navigation/mapbox/keyboard-navigation.ts +0 -133
- package/src/maps/column-navigation/mapbox/state.ts +0 -119
- package/src/maps/column-navigation/svg/animated.ts +0 -78
- package/src/maps/column-navigation/svg/column-navigation-svg-map.stories.ts +0 -46
- package/src/maps/column-navigation/svg/data-fetcher.ts +0 -34
- package/src/maps/column-navigation/svg/index.ts +0 -96
- package/src/maps/column-navigation/svg/layers.ts +0 -233
- package/src/maps/column-navigation/utils/keyboard-navigation.ts +0 -58
- package/src/maps/index.ts +0 -4
- package/src/maps/inset-map/index.ts +0 -87
- package/src/maps/inset-map/inset-map.stories.ts +0 -20
- package/src/maps/layers/columns.ts +0 -216
- package/src/maps/layers/index.ts +0 -2
- package/src/maps/layers/units.ts +0 -286
- package/src/maps/unit-map.stories.ts +0 -79
- package/src/units/colors.ts +0 -183
- package/src/units/resolvers.ts +0 -141
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,49 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [3.11.0] - 2026-09-04 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.10.0...@macrostrat/column-views-v3.11.0)
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- Add `AgeWindowTag`, a compact, clearable indicator of the age window a column
|
|
8
|
+
or
|
|
9
|
+
[0dfa4399](https://github.com/UW-Macrostrat/web-components/commit/0dfa4399e47298a2cb37aafa5785149a5f5b994d)
|
|
10
|
+
correlation chart is focused on — an interval tag with its range (or the
|
|
11
|
+
refined range when the window is narrower than the interval), or a bare age
|
|
12
|
+
range — for use in a chart's `axisTopContent` or page chrome.
|
|
13
|
+
|
|
14
|
+
Add `intervalShortFromTimescale`, adapting the `Interval` delivered by a
|
|
15
|
+
`Timescale` click (`eag`/`lag`/`nam`/`col`) to the `IntervalShort` shape the
|
|
16
|
+
`@macrostrat/data-components` tags take.
|
|
17
|
+
|
|
18
|
+
Add `timescaleIntervalStyle` to `CorrelationChart`, forwarding a per-interval
|
|
19
|
+
style to its timescale so the selected interval can be highlighted, matching
|
|
20
|
+
the existing `Column` prop.
|
|
21
|
+
|
|
22
|
+
## [3.10.0] - 2026-09-01 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.9.0...@macrostrat/column-views-v3.10.0)
|
|
23
|
+
|
|
24
|
+
### Minor Changes
|
|
25
|
+
|
|
26
|
+
- Improve the internal structure of the correlation map store
|
|
27
|
+
[4738d3df](https://github.com/UW-Macrostrat/web-components/commit/4738d3df1bdec8f4b233af215cadc0422ed562e8)
|
|
28
|
+
- Created the @macrostrat/map-views module for specific map interactions and
|
|
29
|
+
[4738d3df](https://github.com/UW-Macrostrat/web-components/commit/4738d3df1bdec8f4b233af215cadc0422ed562e8)
|
|
30
|
+
high-level views around Macrostrat maps.
|
|
31
|
+
|
|
32
|
+
### Patch Changes
|
|
33
|
+
|
|
34
|
+
- Improve the rendering of correlation chart units
|
|
35
|
+
[4738d3df](https://github.com/UW-Macrostrat/web-components/commit/4738d3df1bdec8f4b233af215cadc0422ed562e8)
|
|
36
|
+
- Updated dependencies
|
|
37
|
+
[4738d3df](https://github.com/UW-Macrostrat/web-components/commit/4738d3df1bdec8f4b233af215cadc0422ed562e8)
|
|
38
|
+
- Updated dependencies
|
|
39
|
+
[03860266](https://github.com/UW-Macrostrat/web-components/commit/038602669f6d71fed4b847cd55c9d7c32885c054)
|
|
40
|
+
- Updated dependencies
|
|
41
|
+
[4738d3df](https://github.com/UW-Macrostrat/web-components/commit/4738d3df1bdec8f4b233af215cadc0422ed562e8)
|
|
42
|
+
- @macrostrat/map-views@1.0.0
|
|
43
|
+
- @macrostrat/scoped-store@1.1.0
|
|
44
|
+
- @macrostrat/stratigraphy-utils@1.4.0
|
|
45
|
+
- @macrostrat/api-types@1.3.0
|
|
46
|
+
|
|
3
47
|
## [3.9.0] - 2026-08-25 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.8.0...@macrostrat/column-views-v3.9.0)
|
|
4
48
|
|
|
5
49
|
### Minor Changes
|
package/dist/column-views.css
CHANGED
|
@@ -441,6 +441,16 @@ body.dark-mode ._column-container_1j8hh_1 svg pattern image {
|
|
|
441
441
|
right: 0;
|
|
442
442
|
position: absolute;
|
|
443
443
|
border-top: 1px solid lightgreen;
|
|
444
|
+
}._age-window-tag_1tskh_1 {
|
|
445
|
+
display: inline-flex;
|
|
446
|
+
align-items: center;
|
|
447
|
+
gap: 0.15em;
|
|
448
|
+
white-space: nowrap;
|
|
449
|
+
vertical-align: middle;
|
|
450
|
+
}
|
|
451
|
+
._age-window-tag_1tskh_1 ._clear-button_1tskh_8 {
|
|
452
|
+
min-width: 0;
|
|
453
|
+
min-height: 0;
|
|
444
454
|
}._truncated-list_120po_1 {
|
|
445
455
|
padding-left: 0.2em;
|
|
446
456
|
font-size: 0.9em;
|
|
@@ -47,6 +47,7 @@ function CorrelationChart({
|
|
|
47
47
|
columnHeaderComponent,
|
|
48
48
|
axisTopContent,
|
|
49
49
|
onClickTimescaleInterval,
|
|
50
|
+
timescaleIntervalStyle,
|
|
50
51
|
onColumnMouseOver,
|
|
51
52
|
onColumnClick,
|
|
52
53
|
isTransitioning = false,
|
|
@@ -82,7 +83,8 @@ function CorrelationChart({
|
|
|
82
83
|
main_module.default(TimescaleColumn, {
|
|
83
84
|
scaleInfo,
|
|
84
85
|
unconformityLabels,
|
|
85
|
-
onClickInterval: onClickTimescaleInterval
|
|
86
|
+
onClickInterval: onClickTimescaleInterval,
|
|
87
|
+
intervalStyle: timescaleIntervalStyle
|
|
86
88
|
}),
|
|
87
89
|
main_module.default(MainChartArea, [
|
|
88
90
|
main_module.default(
|
|
@@ -305,13 +307,19 @@ function ColumnHeaderCell({
|
|
|
305
307
|
);
|
|
306
308
|
}
|
|
307
309
|
function TimescaleColumn(props) {
|
|
308
|
-
const {
|
|
310
|
+
const {
|
|
311
|
+
scaleInfo,
|
|
312
|
+
unconformityLabels = true,
|
|
313
|
+
onClickInterval,
|
|
314
|
+
intervalStyle
|
|
315
|
+
} = props;
|
|
309
316
|
return main_module.default("div.column-container.age-axis-container", [
|
|
310
317
|
main_module.default(ageAxis.CompositeAgeAxisCore, { ...scaleInfo }),
|
|
311
318
|
main_module.default(section.CompositeTimescaleCore, {
|
|
312
319
|
...scaleInfo,
|
|
313
320
|
unconformityLabels,
|
|
314
|
-
onClickInterval
|
|
321
|
+
onClickInterval,
|
|
322
|
+
intervalStyle
|
|
315
323
|
})
|
|
316
324
|
]);
|
|
317
325
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.cjs","sources":["../../src/correlation-chart/main.ts"],"sourcesContent":["/** Correlation chart */\nimport {\n UnitSelectionProvider,\n UnitKeyboardNavigation,\n useUnitSelectionDispatch,\n useColumnRef,\n} from \"../data-provider\";\nimport { UnitDetailsFeature, UnitSelectionPopover } from \"../unit-details\";\nimport h from \"./main.module.sass\";\nimport { useMemo } from \"react\";\nimport { useInDarkMode } from \"@macrostrat/ui-components\";\nimport { CompositeTimescaleCore } from \"../section\";\nimport classNames from \"classnames\";\nimport {\n findLaterallyExtensiveUnits,\n splitStratIntoBoxes,\n UnitGroupBox,\n CorrelationChartSettings,\n buildCorrelationChartData,\n} from \"./prepare-data\";\nimport {\n CompositeAgeAxisCore,\n CompositeStratigraphicScaleInfo,\n} from \"../age-axis\";\nimport {\n ColumnAxisType,\n ColumnProvider,\n SVG,\n} from \"@macrostrat/column-components\";\nimport { ColoredUnitComponent } from \"../units\";\nimport { UnitBoxes } from \"../units/boxes\";\nimport { ColumnContainer } from \"../column\";\nimport type { ColumnData } from \"@macrostrat/data-provider\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { ScaleContinuousNumeric } from \"d3-scale\";\nimport { ExtUnit } from \"../prepare-units/types\";\nimport type { TimescaleClickHandler } from \"@macrostrat/timescale\";\nimport { useMacrostratColumnInfo } from \"@macrostrat/data-provider\";\n\n/** Standard props passed to a `columnHeaderComponent`. Everything a header\n * needs is provided here, so the component can be a pure function of its props\n * (no hooks required). Column-level hover/click are handled by the chart. */\nexport interface ColumnHeaderProps {\n /** The column data (units + identifier) for this column */\n column: ColumnData;\n /** The column's ID (col_id) */\n columnID: number;\n /** The column's index (left-to-right) within the chart */\n columnIndex: number;\n /** The units within the column */\n units: ExtUnit[];\n /** The rendered width of the column, in pixels */\n width: number;\n /** The column's name, resolved from column metadata when available */\n columnName?: string | null;\n}\n\nexport interface CorrelationChartProps extends CorrelationChartSettings {\n data: ColumnData[];\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n unconformityLabels?: boolean;\n selectedUnit?: number | null;\n showUnitPopover?: boolean;\n unitComponent?: any;\n /** Arbitrary content (e.g. column title and/or ID) rendered above each column */\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n /** Content rendered above the timescale axis (top-left), beside the column\n * headers — e.g. a zoom/filter indicator. */\n axisTopContent?: React.ReactNode;\n /** True while the age window is animating (e.g. from `useAnimatedAgeWindow`).\n * Propagated to each column's context so per-frame label/pattern work can be\n * skipped during the transition. */\n isTransitioning?: boolean;\n /** Hide unit labels while transitioning (perf escape hatch; default false —\n * labels stay visible through the animation). */\n hideLabelsWhileTransitioning?: boolean;\n onUnitSelected?: (unitID: number | null, unit: BaseUnit | null) => void;\n /** Called when a timescale interval is clicked (e.g. to zoom the age range) */\n onClickTimescaleInterval?: TimescaleClickHandler;\n /** Called when the pointer enters/leaves a column (header or body). Passes\n * the column ID, or null on leave. */\n onColumnMouseOver?: (columnID: number | null) => void;\n /** Called when a column header is clicked (e.g. to frame it on a map) */\n onColumnClick?: (columnID: number) => void;\n}\n\n/** Horizontal padding of the main chart SVG. Column headers are aligned to\n * this so that they line up with the columns beneath them. */\nconst chartPaddingH = 4;\n\n/** Default scale settings for the correlation chart. */\nconst defaultCorrelationChartScaleProps = {\n targetUnitHeight: 10,\n unconformityHeight: 60,\n minSectionHeight: 60,\n collapseSmallUnconformities: true,\n};\n\nfunction MainChartArea({ children }) {\n const columnRef = useColumnRef();\n return h(\"div.main-chart\", { ref: columnRef }, children);\n}\n\nconst unitPopoverFeatures = new Set([\n UnitDetailsFeature.AdjacentUnits,\n UnitDetailsFeature.OutcropType,\n UnitDetailsFeature.DepthRange,\n UnitDetailsFeature.ColumnName,\n]);\n\nexport function CorrelationChart({\n data,\n columnSpacing = 0,\n columnWidth = 130,\n unconformityLabels = true,\n showUnitPopover = true,\n selectedUnit,\n onUnitSelected,\n unitComponent,\n columnHeaderComponent,\n axisTopContent,\n onClickTimescaleInterval,\n onColumnMouseOver,\n onColumnClick,\n isTransitioning = false,\n hideLabelsWhileTransitioning = false,\n ...scaleProps\n}: CorrelationChartProps) {\n const chartData = useMemo(() => {\n if (!data) return null;\n return buildCorrelationChartData(data, {\n ...defaultCorrelationChartScaleProps,\n ...scaleProps,\n });\n }, [data, ...Object.values(scaleProps)]);\n\n // A flattened units array is used to support keyboard navigation\n const units = useMemo(() => {\n return data?.map((d0) => d0.units).flat() ?? [];\n }, [data]);\n\n const inDarkMode = useInDarkMode();\n\n const className = classNames({\n \"dark-mode\": inDarkMode,\n });\n\n if (chartData == null) {\n return null;\n }\n\n const { packages, scaleInfo, nColumns } = chartData;\n\n const mainWidth = (columnWidth + columnSpacing) * nColumns;\n\n return h(\n ColumnContainer,\n { className: \"correlation-diagram\" },\n h(\n UnitSelectionProvider,\n { selectedUnit, onUnitSelected, units },\n h(ChartArea, [\n h(TimescaleColumn, {\n scaleInfo,\n unconformityLabels,\n onClickInterval: onClickTimescaleInterval,\n }),\n h(MainChartArea, [\n h(\n SVG,\n {\n className,\n innerWidth: mainWidth,\n height: scaleInfo.totalHeight,\n paddingH: chartPaddingH,\n },\n packages.map((pkg, i) => {\n const { offset, domain, pixelScale, scale, key } =\n scaleInfo.packages[i];\n return h(Package, {\n columnData: pkg.columnData,\n key,\n columnWidth,\n columnSpacing,\n offset,\n domain,\n pixelScale,\n scale,\n unitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ),\n h.if(showUnitPopover)(UnitSelectionPopover, {\n features: unitPopoverFeatures,\n }),\n // Navigation only works within a column for now...\n h(UnitKeyboardNavigation, { columnData: data }),\n ]),\n // Rendered last so the sticky header paints above the unit boxes\n // (positioned siblings paint in document order at the same z-index)\n h(ColumnHeaderRow, {\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n }),\n ]),\n ),\n );\n}\n\nfunction Package({\n columnData,\n columnSpacing,\n columnWidth,\n unitComponent,\n offset,\n domain,\n pixelScale,\n scale,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n}) {\n return h(\"g.package\", { transform: `translate(0 ${offset})` }, [\n // Disable the SVG overlay for now\n //h(PackageSVGOverlay, { columnData, columnSpacing }),\n h(\"g.column-units\", [\n columnData.map((data, i) => {\n return h(Column, {\n units: data.units,\n columnID: data.columnID,\n unitComponent,\n width: columnWidth,\n key: i,\n domain,\n pixelScale,\n scale,\n offsetLeft: i * (columnWidth + columnSpacing),\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ]),\n ]);\n}\n\ninterface ColumnProps {\n units: ExtUnit[];\n columnID?: number;\n unitComponent?: React.FunctionComponent<any>;\n unitComponentProps?: any;\n showLabels?: boolean;\n width?: number;\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n offsetLeft?: number;\n domain: [number, number];\n pixelScale: number;\n scale?: ScaleContinuousNumeric<number, number>;\n onColumnMouseOver?: (columnID: number | null) => void;\n isTransitioning?: boolean;\n hideLabelsWhileTransitioning?: boolean;\n}\n\nfunction Column(props: ColumnProps) {\n const {\n units,\n columnID,\n width = 150,\n offsetLeft,\n domain,\n pixelScale,\n scale,\n unitComponent = ColoredUnitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n } = props;\n\n const columnWidth = width;\n\n if (units.length == 0) {\n return null;\n }\n\n const hoverHandlers =\n onColumnMouseOver != null && columnID != null\n ? {\n onMouseEnter: () => onColumnMouseOver(columnID),\n onMouseLeave: () => onColumnMouseOver(null),\n }\n : {};\n\n return h(\n \"g.section\",\n {\n transform: `translate(${offsetLeft} 0)`,\n ...hoverHandlers,\n },\n h(\n ColumnProvider,\n {\n // Need to tighten up types here...\n divisions: units as any[],\n range: domain,\n scale,\n pixelsPerMeter: pixelScale, // Actually pixels per myr\n axisType: ColumnAxisType.AGE,\n isTransitioning,\n hideLabelsWhileTransitioning,\n },\n h(UnitBoxes, {\n unitComponent,\n unitComponentProps: {\n width: columnWidth,\n showLabel: true,\n },\n }),\n ),\n );\n}\n\nfunction PackageSVGOverlay({ data, columnWidth = 100, columnSpacing = 0 }) {\n const { b_age, t_age, bestPixelScale, columnData } = data;\n\n const width = (columnWidth + columnSpacing) * columnData.length;\n const height = Math.ceil((b_age - t_age) * bestPixelScale) + 2;\n\n const extensiveUnits = findLaterallyExtensiveUnits(data);\n\n const scale = (val: number) => {\n return (val - t_age) * bestPixelScale;\n };\n\n return h(\n \"div.package-overlay\",\n { style: { width, height } },\n extensiveUnits.map((d) => {\n return h(LaterallyExtensiveUnit, {\n data: d,\n scale,\n pixelScale: bestPixelScale,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction LaterallyExtensiveUnit({ data, scale, pixelScale, columnSpacing }) {\n const { b_age, t_age, strat_name_long, units } = data;\n // Build boxes by column groups\n const boxes: UnitGroupBox[] = splitStratIntoBoxes(data);\n\n return h(\n \"div.laterally-extensive-unit\",\n boxes.map((d, i) => {\n return h(StratColSpan, {\n scale,\n data: d,\n pixelScale,\n key: i,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction StratColSpan({\n data,\n scale,\n columnWidth = 100,\n columnSpacing = 0,\n pixelScale = 1,\n}) {\n const { startCol, endCol, strat_name_long, t_age, b_age } = data;\n const top = scale(t_age);\n const left = startCol * (columnWidth + columnSpacing);\n const width = (endCol - startCol + 1) * (columnWidth + columnSpacing);\n const height = (b_age - t_age) * pixelScale;\n return h(\n \"div.strat-col-span\",\n { style: { top, height, width, left } },\n strat_name_long,\n );\n}\n\nfunction ChartArea({ children }) {\n const setSelectedUnit = useUnitSelectionDispatch();\n\n return h(\n \"div.correlation-chart-inner\",\n {\n onClick() {\n setSelectedUnit(null, null);\n },\n },\n children,\n );\n}\n\ninterface ColumnHeaderRowProps {\n data: ColumnData[];\n columnWidth: number;\n columnSpacing: number;\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n axisTopContent?: React.ReactNode;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}\n\nfunction ColumnHeaderRow({\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n}: ColumnHeaderRowProps) {\n /** The top grid row: arbitrary content above the timescale axis (top-left)\n * and, when a header component is provided, per-column headers aligned with\n * the columns. Collapses to nothing when neither is present. */\n const Component = columnHeaderComponent;\n if (Component == null && axisTopContent == null) {\n return null;\n }\n\n return h([\n h(\"div.column-header-spacer\", axisTopContent),\n h.if(Component != null)(\n \"div.column-header-row\",\n {\n style: {\n paddingLeft: chartPaddingH,\n paddingRight: chartPaddingH,\n gap: columnSpacing,\n },\n },\n data.map((column, i) => {\n return h(ColumnHeaderCell, {\n key: column.columnID ?? i,\n column,\n columnIndex: i,\n columnWidth,\n Component: Component!,\n onColumnMouseOver,\n onColumnClick,\n });\n }),\n ),\n ]);\n}\n\nfunction ColumnHeaderCell({\n column,\n columnIndex,\n columnWidth,\n Component,\n onColumnMouseOver,\n onColumnClick,\n}: {\n column: ColumnData;\n columnIndex: number;\n columnWidth: number;\n Component: React.ComponentType<ColumnHeaderProps>;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}) {\n /** Resolves the column name and wires column-level hover/click so the header\n * component itself can stay a pure function of props. */\n const columnID = column.columnID;\n const info = useMacrostratColumnInfo(columnID);\n\n return h(\n \"div.column-header-cell\",\n {\n style: {\n width: columnWidth,\n minWidth: columnWidth,\n maxWidth: columnWidth,\n },\n onMouseEnter: () => onColumnMouseOver?.(columnID),\n onMouseLeave: () => onColumnMouseOver?.(null),\n onClick: onColumnClick\n ? (e: React.MouseEvent) => {\n e.stopPropagation();\n onColumnClick(columnID);\n }\n : undefined,\n },\n h(Component, {\n column,\n columnID,\n columnIndex,\n units: column.units as ExtUnit[],\n width: columnWidth,\n columnName: info?.col_name ?? null,\n }),\n );\n}\n\ninterface TimescaleColumnProps {\n scaleInfo: CompositeStratigraphicScaleInfo;\n showLabels?: boolean;\n unconformityLabels?: boolean;\n onClickInterval?: TimescaleClickHandler;\n}\n\nfunction TimescaleColumn(props: TimescaleColumnProps) {\n const { scaleInfo, unconformityLabels = true, onClickInterval } = props;\n return h(\"div.column-container.age-axis-container\", [\n h(CompositeAgeAxisCore, { ...scaleInfo }),\n h(CompositeTimescaleCore, {\n ...scaleInfo,\n unconformityLabels,\n onClickInterval,\n }),\n ]);\n}\n"],"names":["useColumnRef","h","UnitDetailsFeature","useMemo","buildCorrelationChartData","useInDarkMode","classNames","ColumnContainer","UnitSelectionProvider","SVG","UnitSelectionPopover","UnitKeyboardNavigation","ColoredUnitComponent","ColumnProvider","ColumnAxisType","UnitBoxes","useUnitSelectionDispatch","column","useMacrostratColumnInfo","CompositeAgeAxisCore","CompositeTimescaleCore"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"main.cjs","sources":["../../src/correlation-chart/main.ts"],"sourcesContent":["/** Correlation chart */\nimport {\n UnitSelectionProvider,\n UnitKeyboardNavigation,\n useUnitSelectionDispatch,\n useColumnRef,\n} from \"../data-provider\";\nimport { UnitDetailsFeature, UnitSelectionPopover } from \"../unit-details\";\nimport h from \"./main.module.sass\";\nimport { useMemo } from \"react\";\nimport { useInDarkMode } from \"@macrostrat/ui-components\";\nimport { CompositeTimescaleCore } from \"../section\";\nimport classNames from \"classnames\";\nimport {\n findLaterallyExtensiveUnits,\n splitStratIntoBoxes,\n UnitGroupBox,\n CorrelationChartSettings,\n buildCorrelationChartData,\n} from \"./prepare-data\";\nimport {\n CompositeAgeAxisCore,\n CompositeStratigraphicScaleInfo,\n} from \"../age-axis\";\nimport {\n ColumnAxisType,\n ColumnProvider,\n SVG,\n} from \"@macrostrat/column-components\";\nimport { ColoredUnitComponent } from \"../units\";\nimport { UnitBoxes } from \"../units/boxes\";\nimport { ColumnContainer } from \"../column\";\nimport type { ColumnData } from \"@macrostrat/data-provider\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { ScaleContinuousNumeric } from \"d3-scale\";\nimport { ExtUnit } from \"../prepare-units/types\";\nimport type {\n IntervalStyleBuilder,\n TimescaleClickHandler,\n} from \"@macrostrat/timescale\";\nimport { useMacrostratColumnInfo } from \"@macrostrat/data-provider\";\n\n/** Standard props passed to a `columnHeaderComponent`. Everything a header\n * needs is provided here, so the component can be a pure function of its props\n * (no hooks required). Column-level hover/click are handled by the chart. */\nexport interface ColumnHeaderProps {\n /** The column data (units + identifier) for this column */\n column: ColumnData;\n /** The column's ID (col_id) */\n columnID: number;\n /** The column's index (left-to-right) within the chart */\n columnIndex: number;\n /** The units within the column */\n units: ExtUnit[];\n /** The rendered width of the column, in pixels */\n width: number;\n /** The column's name, resolved from column metadata when available */\n columnName?: string | null;\n}\n\nexport interface CorrelationChartProps extends CorrelationChartSettings {\n data: ColumnData[];\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n unconformityLabels?: boolean;\n selectedUnit?: number | null;\n showUnitPopover?: boolean;\n unitComponent?: any;\n /** Arbitrary content (e.g. column title and/or ID) rendered above each column */\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n /** Content rendered above the timescale axis (top-left), beside the column\n * headers — e.g. a zoom/filter indicator. */\n axisTopContent?: React.ReactNode;\n /** True while the age window is animating (e.g. from `useAnimatedAgeWindow`).\n * Propagated to each column's context so per-frame label/pattern work can be\n * skipped during the transition. */\n isTransitioning?: boolean;\n /** Hide unit labels while transitioning (perf escape hatch; default false —\n * labels stay visible through the animation). */\n hideLabelsWhileTransitioning?: boolean;\n onUnitSelected?: (unitID: number | null, unit: BaseUnit | null) => void;\n /** Called when a timescale interval is clicked (e.g. to zoom the age range) */\n onClickTimescaleInterval?: TimescaleClickHandler;\n /** Called when the pointer enters/leaves a column (header or body). Passes\n * the column ID, or null on leave. */\n onColumnMouseOver?: (columnID: number | null) => void;\n /** Called when a column header is clicked (e.g. to frame it on a map) */\n onColumnClick?: (columnID: number) => void;\n}\n\n/** Horizontal padding of the main chart SVG. Column headers are aligned to\n * this so that they line up with the columns beneath them. */\nconst chartPaddingH = 4;\n\n/** Default scale settings for the correlation chart. */\nconst defaultCorrelationChartScaleProps = {\n targetUnitHeight: 10,\n unconformityHeight: 60,\n minSectionHeight: 60,\n collapseSmallUnconformities: true,\n};\n\nfunction MainChartArea({ children }) {\n const columnRef = useColumnRef();\n return h(\"div.main-chart\", { ref: columnRef }, children);\n}\n\nconst unitPopoverFeatures = new Set([\n UnitDetailsFeature.AdjacentUnits,\n UnitDetailsFeature.OutcropType,\n UnitDetailsFeature.DepthRange,\n UnitDetailsFeature.ColumnName,\n]);\n\nexport function CorrelationChart({\n data,\n columnSpacing = 0,\n columnWidth = 130,\n unconformityLabels = true,\n showUnitPopover = true,\n selectedUnit,\n onUnitSelected,\n unitComponent,\n columnHeaderComponent,\n axisTopContent,\n onClickTimescaleInterval,\n timescaleIntervalStyle,\n onColumnMouseOver,\n onColumnClick,\n isTransitioning = false,\n hideLabelsWhileTransitioning = false,\n ...scaleProps\n}: CorrelationChartProps) {\n const chartData = useMemo(() => {\n if (!data) return null;\n return buildCorrelationChartData(data, {\n ...defaultCorrelationChartScaleProps,\n ...scaleProps,\n });\n }, [data, ...Object.values(scaleProps)]);\n\n // A flattened units array is used to support keyboard navigation\n const units = useMemo(() => {\n return data?.map((d0) => d0.units).flat() ?? [];\n }, [data]);\n\n const inDarkMode = useInDarkMode();\n\n const className = classNames({\n \"dark-mode\": inDarkMode,\n });\n\n if (chartData == null) {\n return null;\n }\n\n const { packages, scaleInfo, nColumns } = chartData;\n\n const mainWidth = (columnWidth + columnSpacing) * nColumns;\n\n return h(\n ColumnContainer,\n { className: \"correlation-diagram\" },\n h(\n UnitSelectionProvider,\n { selectedUnit, onUnitSelected, units },\n h(ChartArea, [\n h(TimescaleColumn, {\n scaleInfo,\n unconformityLabels,\n onClickInterval: onClickTimescaleInterval,\n intervalStyle: timescaleIntervalStyle,\n }),\n h(MainChartArea, [\n h(\n SVG,\n {\n className,\n innerWidth: mainWidth,\n height: scaleInfo.totalHeight,\n paddingH: chartPaddingH,\n },\n packages.map((pkg, i) => {\n const { offset, domain, pixelScale, scale, key } =\n scaleInfo.packages[i];\n return h(Package, {\n columnData: pkg.columnData,\n key,\n columnWidth,\n columnSpacing,\n offset,\n domain,\n pixelScale,\n scale,\n unitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ),\n h.if(showUnitPopover)(UnitSelectionPopover, {\n features: unitPopoverFeatures,\n }),\n // Navigation only works within a column for now...\n h(UnitKeyboardNavigation, { columnData: data }),\n ]),\n // Rendered last so the sticky header paints above the unit boxes\n // (positioned siblings paint in document order at the same z-index)\n h(ColumnHeaderRow, {\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n }),\n ]),\n ),\n );\n}\n\nfunction Package({\n columnData,\n columnSpacing,\n columnWidth,\n unitComponent,\n offset,\n domain,\n pixelScale,\n scale,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n}) {\n return h(\"g.package\", { transform: `translate(0 ${offset})` }, [\n // Disable the SVG overlay for now\n //h(PackageSVGOverlay, { columnData, columnSpacing }),\n h(\"g.column-units\", [\n columnData.map((data, i) => {\n return h(Column, {\n units: data.units,\n columnID: data.columnID,\n unitComponent,\n width: columnWidth,\n key: i,\n domain,\n pixelScale,\n scale,\n offsetLeft: i * (columnWidth + columnSpacing),\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ]),\n ]);\n}\n\ninterface ColumnProps {\n units: ExtUnit[];\n columnID?: number;\n unitComponent?: React.FunctionComponent<any>;\n unitComponentProps?: any;\n showLabels?: boolean;\n width?: number;\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n offsetLeft?: number;\n domain: [number, number];\n pixelScale: number;\n scale?: ScaleContinuousNumeric<number, number>;\n onColumnMouseOver?: (columnID: number | null) => void;\n isTransitioning?: boolean;\n hideLabelsWhileTransitioning?: boolean;\n}\n\nfunction Column(props: ColumnProps) {\n const {\n units,\n columnID,\n width = 150,\n offsetLeft,\n domain,\n pixelScale,\n scale,\n unitComponent = ColoredUnitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n } = props;\n\n const columnWidth = width;\n\n if (units.length == 0) {\n return null;\n }\n\n const hoverHandlers =\n onColumnMouseOver != null && columnID != null\n ? {\n onMouseEnter: () => onColumnMouseOver(columnID),\n onMouseLeave: () => onColumnMouseOver(null),\n }\n : {};\n\n return h(\n \"g.section\",\n {\n transform: `translate(${offsetLeft} 0)`,\n ...hoverHandlers,\n },\n h(\n ColumnProvider,\n {\n // Need to tighten up types here...\n divisions: units as any[],\n range: domain,\n scale,\n pixelsPerMeter: pixelScale, // Actually pixels per myr\n axisType: ColumnAxisType.AGE,\n isTransitioning,\n hideLabelsWhileTransitioning,\n },\n h(UnitBoxes, {\n unitComponent,\n unitComponentProps: {\n width: columnWidth,\n showLabel: true,\n },\n }),\n ),\n );\n}\n\nfunction PackageSVGOverlay({ data, columnWidth = 100, columnSpacing = 0 }) {\n const { b_age, t_age, bestPixelScale, columnData } = data;\n\n const width = (columnWidth + columnSpacing) * columnData.length;\n const height = Math.ceil((b_age - t_age) * bestPixelScale) + 2;\n\n const extensiveUnits = findLaterallyExtensiveUnits(data);\n\n const scale = (val: number) => {\n return (val - t_age) * bestPixelScale;\n };\n\n return h(\n \"div.package-overlay\",\n { style: { width, height } },\n extensiveUnits.map((d) => {\n return h(LaterallyExtensiveUnit, {\n data: d,\n scale,\n pixelScale: bestPixelScale,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction LaterallyExtensiveUnit({ data, scale, pixelScale, columnSpacing }) {\n const { b_age, t_age, strat_name_long, units } = data;\n // Build boxes by column groups\n const boxes: UnitGroupBox[] = splitStratIntoBoxes(data);\n\n return h(\n \"div.laterally-extensive-unit\",\n boxes.map((d, i) => {\n return h(StratColSpan, {\n scale,\n data: d,\n pixelScale,\n key: i,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction StratColSpan({\n data,\n scale,\n columnWidth = 100,\n columnSpacing = 0,\n pixelScale = 1,\n}) {\n const { startCol, endCol, strat_name_long, t_age, b_age } = data;\n const top = scale(t_age);\n const left = startCol * (columnWidth + columnSpacing);\n const width = (endCol - startCol + 1) * (columnWidth + columnSpacing);\n const height = (b_age - t_age) * pixelScale;\n return h(\n \"div.strat-col-span\",\n { style: { top, height, width, left } },\n strat_name_long,\n );\n}\n\nfunction ChartArea({ children }) {\n const setSelectedUnit = useUnitSelectionDispatch();\n\n return h(\n \"div.correlation-chart-inner\",\n {\n onClick() {\n setSelectedUnit(null, null);\n },\n },\n children,\n );\n}\n\ninterface ColumnHeaderRowProps {\n data: ColumnData[];\n columnWidth: number;\n columnSpacing: number;\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n axisTopContent?: React.ReactNode;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}\n\nfunction ColumnHeaderRow({\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n}: ColumnHeaderRowProps) {\n /** The top grid row: arbitrary content above the timescale axis (top-left)\n * and, when a header component is provided, per-column headers aligned with\n * the columns. Collapses to nothing when neither is present. */\n const Component = columnHeaderComponent;\n if (Component == null && axisTopContent == null) {\n return null;\n }\n\n return h([\n h(\"div.column-header-spacer\", axisTopContent),\n h.if(Component != null)(\n \"div.column-header-row\",\n {\n style: {\n paddingLeft: chartPaddingH,\n paddingRight: chartPaddingH,\n gap: columnSpacing,\n },\n },\n data.map((column, i) => {\n return h(ColumnHeaderCell, {\n key: column.columnID ?? i,\n column,\n columnIndex: i,\n columnWidth,\n Component: Component!,\n onColumnMouseOver,\n onColumnClick,\n });\n }),\n ),\n ]);\n}\n\nfunction ColumnHeaderCell({\n column,\n columnIndex,\n columnWidth,\n Component,\n onColumnMouseOver,\n onColumnClick,\n}: {\n column: ColumnData;\n columnIndex: number;\n columnWidth: number;\n Component: React.ComponentType<ColumnHeaderProps>;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}) {\n /** Resolves the column name and wires column-level hover/click so the header\n * component itself can stay a pure function of props. */\n const columnID = column.columnID;\n const info = useMacrostratColumnInfo(columnID);\n\n return h(\n \"div.column-header-cell\",\n {\n style: {\n width: columnWidth,\n minWidth: columnWidth,\n maxWidth: columnWidth,\n },\n onMouseEnter: () => onColumnMouseOver?.(columnID),\n onMouseLeave: () => onColumnMouseOver?.(null),\n onClick: onColumnClick\n ? (e: React.MouseEvent) => {\n e.stopPropagation();\n onColumnClick(columnID);\n }\n : undefined,\n },\n h(Component, {\n column,\n columnID,\n columnIndex,\n units: column.units as ExtUnit[],\n width: columnWidth,\n columnName: info?.col_name ?? null,\n }),\n );\n}\n\ninterface TimescaleColumnProps {\n scaleInfo: CompositeStratigraphicScaleInfo;\n showLabels?: boolean;\n unconformityLabels?: boolean;\n onClickInterval?: TimescaleClickHandler;\n intervalStyle?: IntervalStyleBuilder;\n}\n\nfunction TimescaleColumn(props: TimescaleColumnProps) {\n const {\n scaleInfo,\n unconformityLabels = true,\n onClickInterval,\n intervalStyle,\n } = props;\n return h(\"div.column-container.age-axis-container\", [\n h(CompositeAgeAxisCore, { ...scaleInfo }),\n h(CompositeTimescaleCore, {\n ...scaleInfo,\n unconformityLabels,\n onClickInterval,\n intervalStyle,\n }),\n ]);\n}\n"],"names":["useColumnRef","h","UnitDetailsFeature","useMemo","buildCorrelationChartData","useInDarkMode","classNames","ColumnContainer","UnitSelectionProvider","SVG","UnitSelectionPopover","UnitKeyboardNavigation","ColoredUnitComponent","ColumnProvider","ColumnAxisType","UnitBoxes","useUnitSelectionDispatch","column","useMacrostratColumnInfo","CompositeAgeAxisCore","CompositeTimescaleCore"],"mappings":"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"}
|
|
@@ -50,4 +50,4 @@ export interface CorrelationChartProps extends CorrelationChartSettings {
|
|
|
50
50
|
/** Called when a column header is clicked (e.g. to frame it on a map) */
|
|
51
51
|
onColumnClick?: (columnID: number) => void;
|
|
52
52
|
}
|
|
53
|
-
export declare function CorrelationChart({ data, columnSpacing, columnWidth, unconformityLabels, showUnitPopover, selectedUnit, onUnitSelected, unitComponent, columnHeaderComponent, axisTopContent, onClickTimescaleInterval, onColumnMouseOver, onColumnClick, isTransitioning, hideLabelsWhileTransitioning, ...scaleProps }: CorrelationChartProps): import('react').FunctionComponentElement<import('..').ColumnContainerProps> | null;
|
|
53
|
+
export declare function CorrelationChart({ data, columnSpacing, columnWidth, unconformityLabels, showUnitPopover, selectedUnit, onUnitSelected, unitComponent, columnHeaderComponent, axisTopContent, onClickTimescaleInterval, timescaleIntervalStyle, onColumnMouseOver, onColumnClick, isTransitioning, hideLabelsWhileTransitioning, ...scaleProps }: CorrelationChartProps): import('react').FunctionComponentElement<import('..').ColumnContainerProps> | null;
|
|
@@ -43,6 +43,7 @@ function CorrelationChart({
|
|
|
43
43
|
columnHeaderComponent,
|
|
44
44
|
axisTopContent,
|
|
45
45
|
onClickTimescaleInterval,
|
|
46
|
+
timescaleIntervalStyle,
|
|
46
47
|
onColumnMouseOver,
|
|
47
48
|
onColumnClick,
|
|
48
49
|
isTransitioning = false,
|
|
@@ -78,7 +79,8 @@ function CorrelationChart({
|
|
|
78
79
|
h(TimescaleColumn, {
|
|
79
80
|
scaleInfo,
|
|
80
81
|
unconformityLabels,
|
|
81
|
-
onClickInterval: onClickTimescaleInterval
|
|
82
|
+
onClickInterval: onClickTimescaleInterval,
|
|
83
|
+
intervalStyle: timescaleIntervalStyle
|
|
82
84
|
}),
|
|
83
85
|
h(MainChartArea, [
|
|
84
86
|
h(
|
|
@@ -301,13 +303,19 @@ function ColumnHeaderCell({
|
|
|
301
303
|
);
|
|
302
304
|
}
|
|
303
305
|
function TimescaleColumn(props) {
|
|
304
|
-
const {
|
|
306
|
+
const {
|
|
307
|
+
scaleInfo,
|
|
308
|
+
unconformityLabels = true,
|
|
309
|
+
onClickInterval,
|
|
310
|
+
intervalStyle
|
|
311
|
+
} = props;
|
|
305
312
|
return h("div.column-container.age-axis-container", [
|
|
306
313
|
h(CompositeAgeAxisCore, { ...scaleInfo }),
|
|
307
314
|
h(CompositeTimescaleCore, {
|
|
308
315
|
...scaleInfo,
|
|
309
316
|
unconformityLabels,
|
|
310
|
-
onClickInterval
|
|
317
|
+
onClickInterval,
|
|
318
|
+
intervalStyle
|
|
311
319
|
})
|
|
312
320
|
]);
|
|
313
321
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../../src/correlation-chart/main.ts"],"sourcesContent":["/** Correlation chart */\nimport {\n UnitSelectionProvider,\n UnitKeyboardNavigation,\n useUnitSelectionDispatch,\n useColumnRef,\n} from \"../data-provider\";\nimport { UnitDetailsFeature, UnitSelectionPopover } from \"../unit-details\";\nimport h from \"./main.module.sass\";\nimport { useMemo } from \"react\";\nimport { useInDarkMode } from \"@macrostrat/ui-components\";\nimport { CompositeTimescaleCore } from \"../section\";\nimport classNames from \"classnames\";\nimport {\n findLaterallyExtensiveUnits,\n splitStratIntoBoxes,\n UnitGroupBox,\n CorrelationChartSettings,\n buildCorrelationChartData,\n} from \"./prepare-data\";\nimport {\n CompositeAgeAxisCore,\n CompositeStratigraphicScaleInfo,\n} from \"../age-axis\";\nimport {\n ColumnAxisType,\n ColumnProvider,\n SVG,\n} from \"@macrostrat/column-components\";\nimport { ColoredUnitComponent } from \"../units\";\nimport { UnitBoxes } from \"../units/boxes\";\nimport { ColumnContainer } from \"../column\";\nimport type { ColumnData } from \"@macrostrat/data-provider\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { ScaleContinuousNumeric } from \"d3-scale\";\nimport { ExtUnit } from \"../prepare-units/types\";\nimport type { TimescaleClickHandler } from \"@macrostrat/timescale\";\nimport { useMacrostratColumnInfo } from \"@macrostrat/data-provider\";\n\n/** Standard props passed to a `columnHeaderComponent`. Everything a header\n * needs is provided here, so the component can be a pure function of its props\n * (no hooks required). Column-level hover/click are handled by the chart. */\nexport interface ColumnHeaderProps {\n /** The column data (units + identifier) for this column */\n column: ColumnData;\n /** The column's ID (col_id) */\n columnID: number;\n /** The column's index (left-to-right) within the chart */\n columnIndex: number;\n /** The units within the column */\n units: ExtUnit[];\n /** The rendered width of the column, in pixels */\n width: number;\n /** The column's name, resolved from column metadata when available */\n columnName?: string | null;\n}\n\nexport interface CorrelationChartProps extends CorrelationChartSettings {\n data: ColumnData[];\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n unconformityLabels?: boolean;\n selectedUnit?: number | null;\n showUnitPopover?: boolean;\n unitComponent?: any;\n /** Arbitrary content (e.g. column title and/or ID) rendered above each column */\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n /** Content rendered above the timescale axis (top-left), beside the column\n * headers — e.g. a zoom/filter indicator. */\n axisTopContent?: React.ReactNode;\n /** True while the age window is animating (e.g. from `useAnimatedAgeWindow`).\n * Propagated to each column's context so per-frame label/pattern work can be\n * skipped during the transition. */\n isTransitioning?: boolean;\n /** Hide unit labels while transitioning (perf escape hatch; default false —\n * labels stay visible through the animation). */\n hideLabelsWhileTransitioning?: boolean;\n onUnitSelected?: (unitID: number | null, unit: BaseUnit | null) => void;\n /** Called when a timescale interval is clicked (e.g. to zoom the age range) */\n onClickTimescaleInterval?: TimescaleClickHandler;\n /** Called when the pointer enters/leaves a column (header or body). Passes\n * the column ID, or null on leave. */\n onColumnMouseOver?: (columnID: number | null) => void;\n /** Called when a column header is clicked (e.g. to frame it on a map) */\n onColumnClick?: (columnID: number) => void;\n}\n\n/** Horizontal padding of the main chart SVG. Column headers are aligned to\n * this so that they line up with the columns beneath them. */\nconst chartPaddingH = 4;\n\n/** Default scale settings for the correlation chart. */\nconst defaultCorrelationChartScaleProps = {\n targetUnitHeight: 10,\n unconformityHeight: 60,\n minSectionHeight: 60,\n collapseSmallUnconformities: true,\n};\n\nfunction MainChartArea({ children }) {\n const columnRef = useColumnRef();\n return h(\"div.main-chart\", { ref: columnRef }, children);\n}\n\nconst unitPopoverFeatures = new Set([\n UnitDetailsFeature.AdjacentUnits,\n UnitDetailsFeature.OutcropType,\n UnitDetailsFeature.DepthRange,\n UnitDetailsFeature.ColumnName,\n]);\n\nexport function CorrelationChart({\n data,\n columnSpacing = 0,\n columnWidth = 130,\n unconformityLabels = true,\n showUnitPopover = true,\n selectedUnit,\n onUnitSelected,\n unitComponent,\n columnHeaderComponent,\n axisTopContent,\n onClickTimescaleInterval,\n onColumnMouseOver,\n onColumnClick,\n isTransitioning = false,\n hideLabelsWhileTransitioning = false,\n ...scaleProps\n}: CorrelationChartProps) {\n const chartData = useMemo(() => {\n if (!data) return null;\n return buildCorrelationChartData(data, {\n ...defaultCorrelationChartScaleProps,\n ...scaleProps,\n });\n }, [data, ...Object.values(scaleProps)]);\n\n // A flattened units array is used to support keyboard navigation\n const units = useMemo(() => {\n return data?.map((d0) => d0.units).flat() ?? [];\n }, [data]);\n\n const inDarkMode = useInDarkMode();\n\n const className = classNames({\n \"dark-mode\": inDarkMode,\n });\n\n if (chartData == null) {\n return null;\n }\n\n const { packages, scaleInfo, nColumns } = chartData;\n\n const mainWidth = (columnWidth + columnSpacing) * nColumns;\n\n return h(\n ColumnContainer,\n { className: \"correlation-diagram\" },\n h(\n UnitSelectionProvider,\n { selectedUnit, onUnitSelected, units },\n h(ChartArea, [\n h(TimescaleColumn, {\n scaleInfo,\n unconformityLabels,\n onClickInterval: onClickTimescaleInterval,\n }),\n h(MainChartArea, [\n h(\n SVG,\n {\n className,\n innerWidth: mainWidth,\n height: scaleInfo.totalHeight,\n paddingH: chartPaddingH,\n },\n packages.map((pkg, i) => {\n const { offset, domain, pixelScale, scale, key } =\n scaleInfo.packages[i];\n return h(Package, {\n columnData: pkg.columnData,\n key,\n columnWidth,\n columnSpacing,\n offset,\n domain,\n pixelScale,\n scale,\n unitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ),\n h.if(showUnitPopover)(UnitSelectionPopover, {\n features: unitPopoverFeatures,\n }),\n // Navigation only works within a column for now...\n h(UnitKeyboardNavigation, { columnData: data }),\n ]),\n // Rendered last so the sticky header paints above the unit boxes\n // (positioned siblings paint in document order at the same z-index)\n h(ColumnHeaderRow, {\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n }),\n ]),\n ),\n );\n}\n\nfunction Package({\n columnData,\n columnSpacing,\n columnWidth,\n unitComponent,\n offset,\n domain,\n pixelScale,\n scale,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n}) {\n return h(\"g.package\", { transform: `translate(0 ${offset})` }, [\n // Disable the SVG overlay for now\n //h(PackageSVGOverlay, { columnData, columnSpacing }),\n h(\"g.column-units\", [\n columnData.map((data, i) => {\n return h(Column, {\n units: data.units,\n columnID: data.columnID,\n unitComponent,\n width: columnWidth,\n key: i,\n domain,\n pixelScale,\n scale,\n offsetLeft: i * (columnWidth + columnSpacing),\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ]),\n ]);\n}\n\ninterface ColumnProps {\n units: ExtUnit[];\n columnID?: number;\n unitComponent?: React.FunctionComponent<any>;\n unitComponentProps?: any;\n showLabels?: boolean;\n width?: number;\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n offsetLeft?: number;\n domain: [number, number];\n pixelScale: number;\n scale?: ScaleContinuousNumeric<number, number>;\n onColumnMouseOver?: (columnID: number | null) => void;\n isTransitioning?: boolean;\n hideLabelsWhileTransitioning?: boolean;\n}\n\nfunction Column(props: ColumnProps) {\n const {\n units,\n columnID,\n width = 150,\n offsetLeft,\n domain,\n pixelScale,\n scale,\n unitComponent = ColoredUnitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n } = props;\n\n const columnWidth = width;\n\n if (units.length == 0) {\n return null;\n }\n\n const hoverHandlers =\n onColumnMouseOver != null && columnID != null\n ? {\n onMouseEnter: () => onColumnMouseOver(columnID),\n onMouseLeave: () => onColumnMouseOver(null),\n }\n : {};\n\n return h(\n \"g.section\",\n {\n transform: `translate(${offsetLeft} 0)`,\n ...hoverHandlers,\n },\n h(\n ColumnProvider,\n {\n // Need to tighten up types here...\n divisions: units as any[],\n range: domain,\n scale,\n pixelsPerMeter: pixelScale, // Actually pixels per myr\n axisType: ColumnAxisType.AGE,\n isTransitioning,\n hideLabelsWhileTransitioning,\n },\n h(UnitBoxes, {\n unitComponent,\n unitComponentProps: {\n width: columnWidth,\n showLabel: true,\n },\n }),\n ),\n );\n}\n\nfunction PackageSVGOverlay({ data, columnWidth = 100, columnSpacing = 0 }) {\n const { b_age, t_age, bestPixelScale, columnData } = data;\n\n const width = (columnWidth + columnSpacing) * columnData.length;\n const height = Math.ceil((b_age - t_age) * bestPixelScale) + 2;\n\n const extensiveUnits = findLaterallyExtensiveUnits(data);\n\n const scale = (val: number) => {\n return (val - t_age) * bestPixelScale;\n };\n\n return h(\n \"div.package-overlay\",\n { style: { width, height } },\n extensiveUnits.map((d) => {\n return h(LaterallyExtensiveUnit, {\n data: d,\n scale,\n pixelScale: bestPixelScale,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction LaterallyExtensiveUnit({ data, scale, pixelScale, columnSpacing }) {\n const { b_age, t_age, strat_name_long, units } = data;\n // Build boxes by column groups\n const boxes: UnitGroupBox[] = splitStratIntoBoxes(data);\n\n return h(\n \"div.laterally-extensive-unit\",\n boxes.map((d, i) => {\n return h(StratColSpan, {\n scale,\n data: d,\n pixelScale,\n key: i,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction StratColSpan({\n data,\n scale,\n columnWidth = 100,\n columnSpacing = 0,\n pixelScale = 1,\n}) {\n const { startCol, endCol, strat_name_long, t_age, b_age } = data;\n const top = scale(t_age);\n const left = startCol * (columnWidth + columnSpacing);\n const width = (endCol - startCol + 1) * (columnWidth + columnSpacing);\n const height = (b_age - t_age) * pixelScale;\n return h(\n \"div.strat-col-span\",\n { style: { top, height, width, left } },\n strat_name_long,\n );\n}\n\nfunction ChartArea({ children }) {\n const setSelectedUnit = useUnitSelectionDispatch();\n\n return h(\n \"div.correlation-chart-inner\",\n {\n onClick() {\n setSelectedUnit(null, null);\n },\n },\n children,\n );\n}\n\ninterface ColumnHeaderRowProps {\n data: ColumnData[];\n columnWidth: number;\n columnSpacing: number;\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n axisTopContent?: React.ReactNode;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}\n\nfunction ColumnHeaderRow({\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n}: ColumnHeaderRowProps) {\n /** The top grid row: arbitrary content above the timescale axis (top-left)\n * and, when a header component is provided, per-column headers aligned with\n * the columns. Collapses to nothing when neither is present. */\n const Component = columnHeaderComponent;\n if (Component == null && axisTopContent == null) {\n return null;\n }\n\n return h([\n h(\"div.column-header-spacer\", axisTopContent),\n h.if(Component != null)(\n \"div.column-header-row\",\n {\n style: {\n paddingLeft: chartPaddingH,\n paddingRight: chartPaddingH,\n gap: columnSpacing,\n },\n },\n data.map((column, i) => {\n return h(ColumnHeaderCell, {\n key: column.columnID ?? i,\n column,\n columnIndex: i,\n columnWidth,\n Component: Component!,\n onColumnMouseOver,\n onColumnClick,\n });\n }),\n ),\n ]);\n}\n\nfunction ColumnHeaderCell({\n column,\n columnIndex,\n columnWidth,\n Component,\n onColumnMouseOver,\n onColumnClick,\n}: {\n column: ColumnData;\n columnIndex: number;\n columnWidth: number;\n Component: React.ComponentType<ColumnHeaderProps>;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}) {\n /** Resolves the column name and wires column-level hover/click so the header\n * component itself can stay a pure function of props. */\n const columnID = column.columnID;\n const info = useMacrostratColumnInfo(columnID);\n\n return h(\n \"div.column-header-cell\",\n {\n style: {\n width: columnWidth,\n minWidth: columnWidth,\n maxWidth: columnWidth,\n },\n onMouseEnter: () => onColumnMouseOver?.(columnID),\n onMouseLeave: () => onColumnMouseOver?.(null),\n onClick: onColumnClick\n ? (e: React.MouseEvent) => {\n e.stopPropagation();\n onColumnClick(columnID);\n }\n : undefined,\n },\n h(Component, {\n column,\n columnID,\n columnIndex,\n units: column.units as ExtUnit[],\n width: columnWidth,\n columnName: info?.col_name ?? null,\n }),\n );\n}\n\ninterface TimescaleColumnProps {\n scaleInfo: CompositeStratigraphicScaleInfo;\n showLabels?: boolean;\n unconformityLabels?: boolean;\n onClickInterval?: TimescaleClickHandler;\n}\n\nfunction TimescaleColumn(props: TimescaleColumnProps) {\n const { scaleInfo, unconformityLabels = true, onClickInterval } = props;\n return h(\"div.column-container.age-axis-container\", [\n h(CompositeAgeAxisCore, { ...scaleInfo }),\n h(CompositeTimescaleCore, {\n ...scaleInfo,\n unconformityLabels,\n onClickInterval,\n }),\n ]);\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../../src/correlation-chart/main.ts"],"sourcesContent":["/** Correlation chart */\nimport {\n UnitSelectionProvider,\n UnitKeyboardNavigation,\n useUnitSelectionDispatch,\n useColumnRef,\n} from \"../data-provider\";\nimport { UnitDetailsFeature, UnitSelectionPopover } from \"../unit-details\";\nimport h from \"./main.module.sass\";\nimport { useMemo } from \"react\";\nimport { useInDarkMode } from \"@macrostrat/ui-components\";\nimport { CompositeTimescaleCore } from \"../section\";\nimport classNames from \"classnames\";\nimport {\n findLaterallyExtensiveUnits,\n splitStratIntoBoxes,\n UnitGroupBox,\n CorrelationChartSettings,\n buildCorrelationChartData,\n} from \"./prepare-data\";\nimport {\n CompositeAgeAxisCore,\n CompositeStratigraphicScaleInfo,\n} from \"../age-axis\";\nimport {\n ColumnAxisType,\n ColumnProvider,\n SVG,\n} from \"@macrostrat/column-components\";\nimport { ColoredUnitComponent } from \"../units\";\nimport { UnitBoxes } from \"../units/boxes\";\nimport { ColumnContainer } from \"../column\";\nimport type { ColumnData } from \"@macrostrat/data-provider\";\nimport { BaseUnit } from \"@macrostrat/api-types\";\nimport { ScaleContinuousNumeric } from \"d3-scale\";\nimport { ExtUnit } from \"../prepare-units/types\";\nimport type {\n IntervalStyleBuilder,\n TimescaleClickHandler,\n} from \"@macrostrat/timescale\";\nimport { useMacrostratColumnInfo } from \"@macrostrat/data-provider\";\n\n/** Standard props passed to a `columnHeaderComponent`. Everything a header\n * needs is provided here, so the component can be a pure function of its props\n * (no hooks required). Column-level hover/click are handled by the chart. */\nexport interface ColumnHeaderProps {\n /** The column data (units + identifier) for this column */\n column: ColumnData;\n /** The column's ID (col_id) */\n columnID: number;\n /** The column's index (left-to-right) within the chart */\n columnIndex: number;\n /** The units within the column */\n units: ExtUnit[];\n /** The rendered width of the column, in pixels */\n width: number;\n /** The column's name, resolved from column metadata when available */\n columnName?: string | null;\n}\n\nexport interface CorrelationChartProps extends CorrelationChartSettings {\n data: ColumnData[];\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n unconformityLabels?: boolean;\n selectedUnit?: number | null;\n showUnitPopover?: boolean;\n unitComponent?: any;\n /** Arbitrary content (e.g. column title and/or ID) rendered above each column */\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n /** Content rendered above the timescale axis (top-left), beside the column\n * headers — e.g. a zoom/filter indicator. */\n axisTopContent?: React.ReactNode;\n /** True while the age window is animating (e.g. from `useAnimatedAgeWindow`).\n * Propagated to each column's context so per-frame label/pattern work can be\n * skipped during the transition. */\n isTransitioning?: boolean;\n /** Hide unit labels while transitioning (perf escape hatch; default false —\n * labels stay visible through the animation). */\n hideLabelsWhileTransitioning?: boolean;\n onUnitSelected?: (unitID: number | null, unit: BaseUnit | null) => void;\n /** Called when a timescale interval is clicked (e.g. to zoom the age range) */\n onClickTimescaleInterval?: TimescaleClickHandler;\n /** Called when the pointer enters/leaves a column (header or body). Passes\n * the column ID, or null on leave. */\n onColumnMouseOver?: (columnID: number | null) => void;\n /** Called when a column header is clicked (e.g. to frame it on a map) */\n onColumnClick?: (columnID: number) => void;\n}\n\n/** Horizontal padding of the main chart SVG. Column headers are aligned to\n * this so that they line up with the columns beneath them. */\nconst chartPaddingH = 4;\n\n/** Default scale settings for the correlation chart. */\nconst defaultCorrelationChartScaleProps = {\n targetUnitHeight: 10,\n unconformityHeight: 60,\n minSectionHeight: 60,\n collapseSmallUnconformities: true,\n};\n\nfunction MainChartArea({ children }) {\n const columnRef = useColumnRef();\n return h(\"div.main-chart\", { ref: columnRef }, children);\n}\n\nconst unitPopoverFeatures = new Set([\n UnitDetailsFeature.AdjacentUnits,\n UnitDetailsFeature.OutcropType,\n UnitDetailsFeature.DepthRange,\n UnitDetailsFeature.ColumnName,\n]);\n\nexport function CorrelationChart({\n data,\n columnSpacing = 0,\n columnWidth = 130,\n unconformityLabels = true,\n showUnitPopover = true,\n selectedUnit,\n onUnitSelected,\n unitComponent,\n columnHeaderComponent,\n axisTopContent,\n onClickTimescaleInterval,\n timescaleIntervalStyle,\n onColumnMouseOver,\n onColumnClick,\n isTransitioning = false,\n hideLabelsWhileTransitioning = false,\n ...scaleProps\n}: CorrelationChartProps) {\n const chartData = useMemo(() => {\n if (!data) return null;\n return buildCorrelationChartData(data, {\n ...defaultCorrelationChartScaleProps,\n ...scaleProps,\n });\n }, [data, ...Object.values(scaleProps)]);\n\n // A flattened units array is used to support keyboard navigation\n const units = useMemo(() => {\n return data?.map((d0) => d0.units).flat() ?? [];\n }, [data]);\n\n const inDarkMode = useInDarkMode();\n\n const className = classNames({\n \"dark-mode\": inDarkMode,\n });\n\n if (chartData == null) {\n return null;\n }\n\n const { packages, scaleInfo, nColumns } = chartData;\n\n const mainWidth = (columnWidth + columnSpacing) * nColumns;\n\n return h(\n ColumnContainer,\n { className: \"correlation-diagram\" },\n h(\n UnitSelectionProvider,\n { selectedUnit, onUnitSelected, units },\n h(ChartArea, [\n h(TimescaleColumn, {\n scaleInfo,\n unconformityLabels,\n onClickInterval: onClickTimescaleInterval,\n intervalStyle: timescaleIntervalStyle,\n }),\n h(MainChartArea, [\n h(\n SVG,\n {\n className,\n innerWidth: mainWidth,\n height: scaleInfo.totalHeight,\n paddingH: chartPaddingH,\n },\n packages.map((pkg, i) => {\n const { offset, domain, pixelScale, scale, key } =\n scaleInfo.packages[i];\n return h(Package, {\n columnData: pkg.columnData,\n key,\n columnWidth,\n columnSpacing,\n offset,\n domain,\n pixelScale,\n scale,\n unitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ),\n h.if(showUnitPopover)(UnitSelectionPopover, {\n features: unitPopoverFeatures,\n }),\n // Navigation only works within a column for now...\n h(UnitKeyboardNavigation, { columnData: data }),\n ]),\n // Rendered last so the sticky header paints above the unit boxes\n // (positioned siblings paint in document order at the same z-index)\n h(ColumnHeaderRow, {\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n }),\n ]),\n ),\n );\n}\n\nfunction Package({\n columnData,\n columnSpacing,\n columnWidth,\n unitComponent,\n offset,\n domain,\n pixelScale,\n scale,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n}) {\n return h(\"g.package\", { transform: `translate(0 ${offset})` }, [\n // Disable the SVG overlay for now\n //h(PackageSVGOverlay, { columnData, columnSpacing }),\n h(\"g.column-units\", [\n columnData.map((data, i) => {\n return h(Column, {\n units: data.units,\n columnID: data.columnID,\n unitComponent,\n width: columnWidth,\n key: i,\n domain,\n pixelScale,\n scale,\n offsetLeft: i * (columnWidth + columnSpacing),\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n });\n }),\n ]),\n ]);\n}\n\ninterface ColumnProps {\n units: ExtUnit[];\n columnID?: number;\n unitComponent?: React.FunctionComponent<any>;\n unitComponentProps?: any;\n showLabels?: boolean;\n width?: number;\n columnWidth?: number;\n columnSpacing?: number;\n targetUnitHeight?: number;\n offsetLeft?: number;\n domain: [number, number];\n pixelScale: number;\n scale?: ScaleContinuousNumeric<number, number>;\n onColumnMouseOver?: (columnID: number | null) => void;\n isTransitioning?: boolean;\n hideLabelsWhileTransitioning?: boolean;\n}\n\nfunction Column(props: ColumnProps) {\n const {\n units,\n columnID,\n width = 150,\n offsetLeft,\n domain,\n pixelScale,\n scale,\n unitComponent = ColoredUnitComponent,\n onColumnMouseOver,\n isTransitioning,\n hideLabelsWhileTransitioning,\n } = props;\n\n const columnWidth = width;\n\n if (units.length == 0) {\n return null;\n }\n\n const hoverHandlers =\n onColumnMouseOver != null && columnID != null\n ? {\n onMouseEnter: () => onColumnMouseOver(columnID),\n onMouseLeave: () => onColumnMouseOver(null),\n }\n : {};\n\n return h(\n \"g.section\",\n {\n transform: `translate(${offsetLeft} 0)`,\n ...hoverHandlers,\n },\n h(\n ColumnProvider,\n {\n // Need to tighten up types here...\n divisions: units as any[],\n range: domain,\n scale,\n pixelsPerMeter: pixelScale, // Actually pixels per myr\n axisType: ColumnAxisType.AGE,\n isTransitioning,\n hideLabelsWhileTransitioning,\n },\n h(UnitBoxes, {\n unitComponent,\n unitComponentProps: {\n width: columnWidth,\n showLabel: true,\n },\n }),\n ),\n );\n}\n\nfunction PackageSVGOverlay({ data, columnWidth = 100, columnSpacing = 0 }) {\n const { b_age, t_age, bestPixelScale, columnData } = data;\n\n const width = (columnWidth + columnSpacing) * columnData.length;\n const height = Math.ceil((b_age - t_age) * bestPixelScale) + 2;\n\n const extensiveUnits = findLaterallyExtensiveUnits(data);\n\n const scale = (val: number) => {\n return (val - t_age) * bestPixelScale;\n };\n\n return h(\n \"div.package-overlay\",\n { style: { width, height } },\n extensiveUnits.map((d) => {\n return h(LaterallyExtensiveUnit, {\n data: d,\n scale,\n pixelScale: bestPixelScale,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction LaterallyExtensiveUnit({ data, scale, pixelScale, columnSpacing }) {\n const { b_age, t_age, strat_name_long, units } = data;\n // Build boxes by column groups\n const boxes: UnitGroupBox[] = splitStratIntoBoxes(data);\n\n return h(\n \"div.laterally-extensive-unit\",\n boxes.map((d, i) => {\n return h(StratColSpan, {\n scale,\n data: d,\n pixelScale,\n key: i,\n columnSpacing,\n });\n }),\n );\n}\n\nfunction StratColSpan({\n data,\n scale,\n columnWidth = 100,\n columnSpacing = 0,\n pixelScale = 1,\n}) {\n const { startCol, endCol, strat_name_long, t_age, b_age } = data;\n const top = scale(t_age);\n const left = startCol * (columnWidth + columnSpacing);\n const width = (endCol - startCol + 1) * (columnWidth + columnSpacing);\n const height = (b_age - t_age) * pixelScale;\n return h(\n \"div.strat-col-span\",\n { style: { top, height, width, left } },\n strat_name_long,\n );\n}\n\nfunction ChartArea({ children }) {\n const setSelectedUnit = useUnitSelectionDispatch();\n\n return h(\n \"div.correlation-chart-inner\",\n {\n onClick() {\n setSelectedUnit(null, null);\n },\n },\n children,\n );\n}\n\ninterface ColumnHeaderRowProps {\n data: ColumnData[];\n columnWidth: number;\n columnSpacing: number;\n columnHeaderComponent?: React.ComponentType<ColumnHeaderProps>;\n axisTopContent?: React.ReactNode;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}\n\nfunction ColumnHeaderRow({\n data,\n columnWidth,\n columnSpacing,\n columnHeaderComponent,\n axisTopContent,\n onColumnMouseOver,\n onColumnClick,\n}: ColumnHeaderRowProps) {\n /** The top grid row: arbitrary content above the timescale axis (top-left)\n * and, when a header component is provided, per-column headers aligned with\n * the columns. Collapses to nothing when neither is present. */\n const Component = columnHeaderComponent;\n if (Component == null && axisTopContent == null) {\n return null;\n }\n\n return h([\n h(\"div.column-header-spacer\", axisTopContent),\n h.if(Component != null)(\n \"div.column-header-row\",\n {\n style: {\n paddingLeft: chartPaddingH,\n paddingRight: chartPaddingH,\n gap: columnSpacing,\n },\n },\n data.map((column, i) => {\n return h(ColumnHeaderCell, {\n key: column.columnID ?? i,\n column,\n columnIndex: i,\n columnWidth,\n Component: Component!,\n onColumnMouseOver,\n onColumnClick,\n });\n }),\n ),\n ]);\n}\n\nfunction ColumnHeaderCell({\n column,\n columnIndex,\n columnWidth,\n Component,\n onColumnMouseOver,\n onColumnClick,\n}: {\n column: ColumnData;\n columnIndex: number;\n columnWidth: number;\n Component: React.ComponentType<ColumnHeaderProps>;\n onColumnMouseOver?: (columnID: number | null) => void;\n onColumnClick?: (columnID: number) => void;\n}) {\n /** Resolves the column name and wires column-level hover/click so the header\n * component itself can stay a pure function of props. */\n const columnID = column.columnID;\n const info = useMacrostratColumnInfo(columnID);\n\n return h(\n \"div.column-header-cell\",\n {\n style: {\n width: columnWidth,\n minWidth: columnWidth,\n maxWidth: columnWidth,\n },\n onMouseEnter: () => onColumnMouseOver?.(columnID),\n onMouseLeave: () => onColumnMouseOver?.(null),\n onClick: onColumnClick\n ? (e: React.MouseEvent) => {\n e.stopPropagation();\n onColumnClick(columnID);\n }\n : undefined,\n },\n h(Component, {\n column,\n columnID,\n columnIndex,\n units: column.units as ExtUnit[],\n width: columnWidth,\n columnName: info?.col_name ?? null,\n }),\n );\n}\n\ninterface TimescaleColumnProps {\n scaleInfo: CompositeStratigraphicScaleInfo;\n showLabels?: boolean;\n unconformityLabels?: boolean;\n onClickInterval?: TimescaleClickHandler;\n intervalStyle?: IntervalStyleBuilder;\n}\n\nfunction TimescaleColumn(props: TimescaleColumnProps) {\n const {\n scaleInfo,\n unconformityLabels = true,\n onClickInterval,\n intervalStyle,\n } = props;\n return h(\"div.column-container.age-axis-container\", [\n h(CompositeAgeAxisCore, { ...scaleInfo }),\n h(CompositeTimescaleCore, {\n ...scaleInfo,\n unconformityLabels,\n onClickInterval,\n intervalStyle,\n }),\n ]);\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.cjs
CHANGED
|
@@ -2,41 +2,34 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const index = require("./units/index.cjs");
|
|
4
4
|
const ageAxis = require("./age-axis.cjs");
|
|
5
|
-
const index$
|
|
5
|
+
const index$3 = require("./prepare-units/index.cjs");
|
|
6
6
|
const animatedAgeWindow = require("./animated-age-window.cjs");
|
|
7
7
|
const column = require("./column.cjs");
|
|
8
8
|
const ageModelOverlay = require("./age-model-overlay.cjs");
|
|
9
9
|
const notes = require("./notes.cjs");
|
|
10
|
+
const mapViews = require("@macrostrat/map-views");
|
|
10
11
|
const ageRange = require("./unit-details/age-range.cjs");
|
|
12
|
+
const ageWindowTag = require("./unit-details/age-window-tag.cjs");
|
|
11
13
|
const composite = require("./units/composite.cjs");
|
|
12
|
-
const columns = require("./maps/layers/columns.cjs");
|
|
13
14
|
const base = require("./facets/measurements/base.cjs");
|
|
14
15
|
const dataComponents = require("@macrostrat/data-components");
|
|
15
|
-
const layers = require("./maps/column-navigation/svg/layers.cjs");
|
|
16
|
-
const core = require("./maps/column-correlation/core.cjs");
|
|
17
|
-
const state = require("./maps/column-correlation/state.cjs");
|
|
18
|
-
const index$1 = require("./maps/column-navigation/mapbox/index.cjs");
|
|
19
16
|
const columnNav = require("./data-provider/column-nav.cjs");
|
|
20
|
-
const index$2 = require("./maps/column-navigation/svg/index.cjs");
|
|
21
17
|
const main = require("./correlation-chart/main.cjs");
|
|
22
|
-
const index$
|
|
18
|
+
const index$1 = require("./facets/detrital-zircon/index.cjs");
|
|
23
19
|
const provider = require("./facets/fossils/provider.cjs");
|
|
24
20
|
const types = require("./prepare-units/types.cjs");
|
|
25
|
-
const index$4 = require("./maps/inset-map/index.cjs");
|
|
26
21
|
const isotopesColumn = require("./facets/carbon-isotopes/isotopes-column.cjs");
|
|
27
22
|
const panel = require("./unit-details/panel.cjs");
|
|
28
23
|
const store = require("./data-provider/store.cjs");
|
|
29
|
-
const units = require("./maps/layers/units.cjs");
|
|
30
24
|
const dataProvider = require("./facets/carbon-isotopes/data-provider.cjs");
|
|
31
25
|
const utils = require("./prepare-units/utils.cjs");
|
|
32
|
-
const index$
|
|
26
|
+
const index$2 = require("./facets/fossils/index.cjs");
|
|
33
27
|
const taxonRanges = require("./facets/fossils/taxon-ranges.cjs");
|
|
34
28
|
const sgp = require("./facets/measurements/sgp.cjs");
|
|
35
29
|
const stratNames = require("./unit-details/strat-names.cjs");
|
|
36
30
|
const modalPanel = require("./unit-details/modal-panel.cjs");
|
|
37
31
|
const popover = require("./unit-details/popover.cjs");
|
|
38
32
|
const unitSelection = require("./data-provider/unit-selection.cjs");
|
|
39
|
-
const colors = require("./units/colors.cjs");
|
|
40
33
|
const hashString = require("./correlation-chart/hash-string.cjs");
|
|
41
34
|
const helpers = require("./prepare-units/helpers.cjs");
|
|
42
35
|
exports.BasicUnitComponent = index.BasicUnitComponent;
|
|
@@ -52,8 +45,8 @@ exports.ApproximateHeightAxis = ageAxis.ApproximateHeightAxis;
|
|
|
52
45
|
exports.CompositeAgeAxis = ageAxis.CompositeAgeAxis;
|
|
53
46
|
exports.CompositeAgeAxisCore = ageAxis.CompositeAgeAxisCore;
|
|
54
47
|
exports.VerticalAxisLabel = ageAxis.VerticalAxisLabel;
|
|
55
|
-
exports.prepareColumnUnits = index$
|
|
56
|
-
exports.usePreparedColumnUnits = index$
|
|
48
|
+
exports.prepareColumnUnits = index$3.prepareColumnUnits;
|
|
49
|
+
exports.usePreparedColumnUnits = index$3.usePreparedColumnUnits;
|
|
57
50
|
exports.useAnimatedAgeWindow = animatedAgeWindow.useAnimatedAgeWindow;
|
|
58
51
|
exports.Column = column.Column;
|
|
59
52
|
exports.ColumnBasicInfo = column.ColumnBasicInfo;
|
|
@@ -68,6 +61,8 @@ exports.Duration = ageRange.Duration;
|
|
|
68
61
|
exports.IntervalProportions = ageRange.IntervalProportions;
|
|
69
62
|
exports.getAge = ageRange.getAge;
|
|
70
63
|
exports.getAgeRange = ageRange.getAgeRange;
|
|
64
|
+
exports.AgeWindowTag = ageWindowTag.AgeWindowTag;
|
|
65
|
+
exports.intervalShortFromTimescale = ageWindowTag.intervalShortFromTimescale;
|
|
71
66
|
exports.AnnotatedUnitsColumn = composite.AnnotatedUnitsColumn;
|
|
72
67
|
exports.ColumnNotesProvider = composite.ColumnNotesProvider;
|
|
73
68
|
exports.CompositeUnitComponent = composite.CompositeUnitComponent;
|
|
@@ -75,9 +70,6 @@ exports.CompositeUnitsColumn = composite.CompositeUnitsColumn;
|
|
|
75
70
|
exports.LabelTrackerProvider = composite.LabelTrackerProvider;
|
|
76
71
|
exports.SectionLabelsColumn = composite.SectionLabelsColumn;
|
|
77
72
|
exports.TrackedLabeledUnit = composite.TrackedLabeledUnit;
|
|
78
|
-
exports.BaseColumnsLayer = columns.BaseColumnsLayer;
|
|
79
|
-
exports.SelectedColumnOverlay = columns.SelectedColumnOverlay;
|
|
80
|
-
exports.buildColumnsStyle = columns.buildColumnsStyle;
|
|
81
73
|
exports.BaseMeasurementsColumn = base.BaseMeasurementsColumn;
|
|
82
74
|
exports.TruncatedList = base.TruncatedList;
|
|
83
75
|
exports.groupNotesByPixelDistance = base.groupNotesByPixelDistance;
|
|
@@ -95,32 +87,15 @@ Object.defineProperty(exports, "UnitIdentifier", {
|
|
|
95
87
|
enumerable: true,
|
|
96
88
|
get: () => dataComponents.UnitIdentifier
|
|
97
89
|
});
|
|
98
|
-
exports.ColumnCenters = layers.ColumnCenters;
|
|
99
|
-
exports.ColumnFeatures = layers.ColumnFeatures;
|
|
100
|
-
exports.ColumnKeyboardNavigation = layers.ColumnKeyboardNavigation;
|
|
101
|
-
exports.Columns = layers.Columns;
|
|
102
|
-
exports.CurrentColumn = layers.CurrentColumn;
|
|
103
|
-
exports.MeasurementsLayer = layers.MeasurementsLayer;
|
|
104
|
-
exports.ColumnCorrelationMap = core.ColumnCorrelationMap;
|
|
105
|
-
exports.ColumnCorrelationProvider = state.ColumnCorrelationProvider;
|
|
106
|
-
exports.useColumnMapLink = state.useColumnMapLink;
|
|
107
|
-
exports.useCorrelationMapStore = state.useCorrelationMapStore;
|
|
108
|
-
exports.ColumnHoverInteraction = index$1.ColumnHoverInteraction;
|
|
109
|
-
exports.ColumnNavigationMap = index$1.ColumnNavigationMap;
|
|
110
|
-
exports.ColumnSelectionManager = index$1.ColumnSelectionManager;
|
|
111
|
-
exports.ColumnsNavigationLayer = index$1.ColumnsNavigationLayer;
|
|
112
90
|
exports.ColumnNavProvider = columnNav.ColumnNavProvider;
|
|
113
91
|
exports.useColumnNav = columnNav.useColumnNav;
|
|
114
|
-
exports.ColumnNavigationSVGMap = index$2.ColumnNavigationSVGMap;
|
|
115
|
-
exports.ResizableMapFrame = index$2.ResizableMapFrame;
|
|
116
92
|
exports.CorrelationChart = main.CorrelationChart;
|
|
117
|
-
exports.DetritalColumn = index$
|
|
118
|
-
exports.DetritalGroup = index$
|
|
93
|
+
exports.DetritalColumn = index$1.DetritalColumn;
|
|
94
|
+
exports.DetritalGroup = index$1.DetritalGroup;
|
|
119
95
|
exports.FossilDataType = provider.FossilDataType;
|
|
120
96
|
exports.useFossilData = provider.useFossilData;
|
|
121
97
|
exports.HeightMethod = types.HeightMethod;
|
|
122
98
|
exports.HybridScaleType = types.HybridScaleType;
|
|
123
|
-
exports.InsetMap = index$4.InsetMap;
|
|
124
99
|
exports.IsotopesColumn = isotopesColumn.IsotopesColumn;
|
|
125
100
|
exports.IsotopesDataset = isotopesColumn.IsotopesDataset;
|
|
126
101
|
exports.LegendPanelHeader = panel.LegendPanelHeader;
|
|
@@ -140,8 +115,6 @@ exports.useColumnUnitsMap = store.useColumnUnitsMap;
|
|
|
140
115
|
exports.useCompositeScale = store.useCompositeScale;
|
|
141
116
|
exports.useMacrostratColumnData = store.useMacrostratColumnData;
|
|
142
117
|
exports.useMacrostratUnits = store.useMacrostratUnits;
|
|
143
|
-
exports.MacrostratUnitsOverlay = units.MacrostratUnitsOverlay;
|
|
144
|
-
exports.buildUnitsStyle = units.buildUnitsStyle;
|
|
145
118
|
exports.MeasurementDataContext = dataProvider.MeasurementDataContext;
|
|
146
119
|
exports.MeasurementDataProvider = dataProvider.MeasurementDataProvider;
|
|
147
120
|
exports.useMeasurementData = dataProvider.useMeasurementData;
|
|
@@ -153,7 +126,7 @@ exports.ensureRealFloat = utils.ensureRealFloat;
|
|
|
153
126
|
exports.getPositionWithinUnit = utils.getPositionWithinUnit;
|
|
154
127
|
exports.getUnitHeightRange = utils.getUnitHeightRange;
|
|
155
128
|
exports.unitsOverlap = utils.unitsOverlap;
|
|
156
|
-
exports.PBDBFossilsColumn = index$
|
|
129
|
+
exports.PBDBFossilsColumn = index$2.PBDBFossilsColumn;
|
|
157
130
|
exports.PBDBOccurrencesMatrix = taxonRanges.PBDBOccurrencesMatrix;
|
|
158
131
|
exports.SGPMeasurementsColumn = sgp.SGPMeasurementsColumn;
|
|
159
132
|
exports.StratNameField = stratNames.StratNameField;
|
|
@@ -171,10 +144,13 @@ exports.useSelectedUnit = unitSelection.useSelectedUnit;
|
|
|
171
144
|
exports.useUnitSelection = unitSelection.useUnitSelection;
|
|
172
145
|
exports.useUnitSelectionDispatch = unitSelection.useUnitSelectionDispatch;
|
|
173
146
|
exports.useUnitSelectionTarget = unitSelection.useUnitSelectionTarget;
|
|
174
|
-
exports.flattenLithologies = colors.flattenLithologies;
|
|
175
|
-
exports.getMixedColorForData = colors.getMixedColorForData;
|
|
176
|
-
exports.getMixedUnitColor = colors.getMixedUnitColor;
|
|
177
147
|
exports.parseLineFromString = hashString.parseLineFromString;
|
|
178
148
|
exports.stringifyLine = hashString.stringifyLine;
|
|
179
149
|
exports.preprocessUnits = helpers.preprocessUnits;
|
|
150
|
+
Object.keys(mapViews).forEach((k) => {
|
|
151
|
+
if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
|
|
152
|
+
enumerable: true,
|
|
153
|
+
get: () => mapViews[k]
|
|
154
|
+
});
|
|
155
|
+
});
|
|
180
156
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -5,8 +5,9 @@ export * from './prepare-units';
|
|
|
5
5
|
export * from './animated-age-window';
|
|
6
6
|
export * from './column';
|
|
7
7
|
export * from './unit-details';
|
|
8
|
-
export * from './maps';
|
|
9
8
|
export * from './age-model-overlay';
|
|
10
9
|
export * from './correlation-chart';
|
|
11
10
|
export * from './notes';
|
|
12
11
|
export * from './facets';
|
|
12
|
+
/** Legacy views */
|
|
13
|
+
export * from '@macrostrat/map-views';
|