@macrostrat/column-views 3.6.1 → 3.8.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.
Files changed (96) hide show
  1. package/CHANGELOG.md +44 -0
  2. package/dist/column-views.css +118 -89
  3. package/dist/column.cjs +1 -2
  4. package/dist/column.cjs.map +1 -1
  5. package/dist/column.js +1 -2
  6. package/dist/column.js.map +1 -1
  7. package/dist/column.module.sass.cjs +15 -15
  8. package/dist/column.module.sass.js +15 -15
  9. package/dist/correlation-chart/main.cjs +136 -34
  10. package/dist/correlation-chart/main.cjs.map +1 -1
  11. package/dist/correlation-chart/main.d.ts +33 -2
  12. package/dist/correlation-chart/main.js +118 -15
  13. package/dist/correlation-chart/main.js.map +1 -1
  14. package/dist/correlation-chart/main.module.sass.cjs +23 -20
  15. package/dist/correlation-chart/main.module.sass.cjs.map +1 -1
  16. package/dist/correlation-chart/main.module.sass.js +23 -20
  17. package/dist/correlation-chart/main.module.sass.js.map +1 -1
  18. package/dist/correlation-chart/prepare-data.cjs +0 -1
  19. package/dist/correlation-chart/prepare-data.cjs.map +1 -1
  20. package/dist/correlation-chart/prepare-data.js +0 -1
  21. package/dist/correlation-chart/prepare-data.js.map +1 -1
  22. package/dist/data-provider/unit-selection.cjs +4 -1
  23. package/dist/data-provider/unit-selection.cjs.map +1 -1
  24. package/dist/data-provider/unit-selection.d.ts +1 -1
  25. package/dist/data-provider/unit-selection.js +4 -1
  26. package/dist/data-provider/unit-selection.js.map +1 -1
  27. package/dist/index.cjs +14 -4
  28. package/dist/index.cjs.map +1 -1
  29. package/dist/index.js +3 -2
  30. package/dist/maps/column-correlation/core.cjs +127 -6
  31. package/dist/maps/column-correlation/core.cjs.map +1 -1
  32. package/dist/maps/column-correlation/core.js +128 -7
  33. package/dist/maps/column-correlation/core.js.map +1 -1
  34. package/dist/maps/column-correlation/state.cjs +63 -2
  35. package/dist/maps/column-correlation/state.cjs.map +1 -1
  36. package/dist/maps/column-correlation/state.d.ts +31 -1
  37. package/dist/maps/column-correlation/state.js +63 -2
  38. package/dist/maps/column-correlation/state.js.map +1 -1
  39. package/dist/maps/layers/columns.cjs +5 -1
  40. package/dist/maps/layers/columns.cjs.map +1 -1
  41. package/dist/maps/layers/columns.js +5 -1
  42. package/dist/maps/layers/columns.js.map +1 -1
  43. package/dist/section.cjs +8 -2
  44. package/dist/section.cjs.map +1 -1
  45. package/dist/section.d.ts +2 -0
  46. package/dist/section.js +8 -2
  47. package/dist/section.js.map +1 -1
  48. package/dist/unit-details/age-range.cjs +2 -1
  49. package/dist/unit-details/age-range.cjs.map +1 -1
  50. package/dist/unit-details/age-range.js +2 -1
  51. package/dist/unit-details/age-range.js.map +1 -1
  52. package/dist/unit-details/index.d.ts +1 -1
  53. package/dist/unit-details/panel.cjs +2 -3
  54. package/dist/unit-details/panel.cjs.map +1 -1
  55. package/dist/unit-details/panel.js +1 -2
  56. package/dist/unit-details/panel.js.map +1 -1
  57. package/dist/unit-details/panel.module.sass.cjs +18 -22
  58. package/dist/unit-details/panel.module.sass.cjs.map +1 -1
  59. package/dist/unit-details/panel.module.sass.js +18 -22
  60. package/dist/unit-details/panel.module.sass.js.map +1 -1
  61. package/dist/unit-details/strat-names.cjs +1 -2
  62. package/dist/unit-details/strat-names.cjs.map +1 -1
  63. package/dist/unit-details/strat-names.js +1 -2
  64. package/dist/unit-details/strat-names.js.map +1 -1
  65. package/dist/units/boxes.cjs +2 -1
  66. package/dist/units/boxes.cjs.map +1 -1
  67. package/dist/units/boxes.js +2 -1
  68. package/dist/units/boxes.js.map +1 -1
  69. package/package.json +7 -7
  70. package/src/column.module.sass +6 -0
  71. package/src/correlation-chart/main.module.sass +46 -2
  72. package/src/correlation-chart/main.ts +180 -9
  73. package/src/correlation-chart/prepare-data.ts +0 -1
  74. package/src/data-provider/unit-selection.ts +13 -2
  75. package/src/maps/column-correlation/column-correlation-map.stories.ts +12 -0
  76. package/src/maps/column-correlation/core.ts +155 -9
  77. package/src/maps/column-correlation/state.ts +110 -2
  78. package/src/maps/layers/columns.ts +7 -1
  79. package/src/section.ts +9 -1
  80. package/src/unit-details/age-range.ts +3 -1
  81. package/src/unit-details/index.ts +7 -1
  82. package/src/unit-details/panel.module.sass +0 -8
  83. package/src/unit-details/panel.ts +6 -6
  84. package/src/unit-details/strat-names.ts +1 -1
  85. package/src/units/boxes.ts +4 -2
  86. package/dist/correlation-chart/stories/utils.d.ts +0 -6
  87. package/dist/unit-details/identifiers.cjs +0 -56
  88. package/dist/unit-details/identifiers.cjs.map +0 -1
  89. package/dist/unit-details/identifiers.d.ts +0 -31
  90. package/dist/unit-details/identifiers.js +0 -54
  91. package/dist/unit-details/identifiers.js.map +0 -1
  92. package/src/correlation-chart/stories/correlation-chart.stories.ts +0 -228
  93. package/src/correlation-chart/stories/namibia-correlation.stories.ts +0 -151
  94. package/src/correlation-chart/stories/stories.module.sass +0 -18
  95. package/src/correlation-chart/stories/utils.ts +0 -24
  96. package/src/unit-details/identifiers.ts +0 -67
package/CHANGELOG.md CHANGED
@@ -1,5 +1,49 @@
1
1
  # Changelog
2
2
 
3
+ ## [3.8.0] - 2026-08-02 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.7.0...@macrostrat/column-views-v3.8.0)
4
+
5
+ ### Minor Changes
6
+
7
+ - Move Identifier and UnitIdentifier to `@macrostrat/data-components`
8
+ [91fcea53](https://github.com/UW-Macrostrat/web-components/commit/91fcea536dd55e387b6f5bce1da0c07395da4635)
9
+
10
+ ### Patch Changes
11
+
12
+ - Remove some unnecessarily bundled packages
13
+ [930edeae](https://github.com/UW-Macrostrat/web-components/commit/930edeaef23d42d62ee3f533d2e20c75dbf9ea42)
14
+ - Updated dependencies
15
+ [1961f84a](https://github.com/UW-Macrostrat/web-components/commit/1961f84a397a341ce92eb032dcdc77c79f957707)
16
+ - Updated dependencies
17
+ [930edeae](https://github.com/UW-Macrostrat/web-components/commit/930edeaef23d42d62ee3f533d2e20c75dbf9ea42)
18
+ - Updated dependencies
19
+ [91fcea53](https://github.com/UW-Macrostrat/web-components/commit/91fcea536dd55e387b6f5bce1da0c07395da4635)
20
+ - @macrostrat/data-components@1.5.0
21
+ - @macrostrat/column-components@2.0.10
22
+ - @macrostrat/mapbox-react@3.3.3
23
+
24
+ ## [3.7.0] - 2026-07-30 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.6.1...@macrostrat/column-views-v3.7.0)
25
+
26
+ ### Minor Changes
27
+
28
+ - - Improve column correlation chart to support more options
29
+ [b21ea1fc](https://github.com/UW-Macrostrat/web-components/commit/b21ea1fc297a5449a91997b3d97ff3509e8cd824)
30
+ - Create a new column reorganization draggable control
31
+ - Update data provider for intervals fetching
32
+
33
+ ### Patch Changes
34
+
35
+ - Updated dependencies
36
+ [b21ea1fc](https://github.com/UW-Macrostrat/web-components/commit/b21ea1fc297a5449a91997b3d97ff3509e8cd824)
37
+ - Updated dependencies
38
+ [b21ea1fc](https://github.com/UW-Macrostrat/web-components/commit/b21ea1fc297a5449a91997b3d97ff3509e8cd824)
39
+ - Updated dependencies
40
+ [b21ea1fc](https://github.com/UW-Macrostrat/web-components/commit/b21ea1fc297a5449a91997b3d97ff3509e8cd824)
41
+ - @macrostrat/map-interface@2.3.1
42
+ - @macrostrat/mapbox-react@3.3.2
43
+ - @macrostrat/data-components@1.4.1
44
+ - @macrostrat/data-provider@1.2.0
45
+ - @macrostrat/timescale@3.1.6
46
+
3
47
  ## [3.6.1] - 2026-07-28 [_changes_](https://github.com/UW-Macrostrat/web-components/compare/@macrostrat/column-views-v3.6.0...@macrostrat/column-views-v3.6.1)
4
48
 
5
49
  ### Patch Changes
@@ -91,7 +91,7 @@
91
91
 
92
92
  ._sep_1ibvp_16 {
93
93
  color: var(--secondary-color);
94
- }._column-container_15bga_1, body.light-mode ._column-container_15bga_1 {
94
+ }._column-container_1j8hh_1, body.light-mode ._column-container_1j8hh_1 {
95
95
  --column-background-color: var(--background-color, #fff);
96
96
  --column-stroke-color: var(--text-emphasized-color, #000);
97
97
  --column-text-color: var(--text-emphasized-color, #000);
@@ -103,132 +103,137 @@
103
103
  * If dark mode is explicitly enabled, we want to override
104
104
  * the media query. */
105
105
  @media (prefers-color-scheme: dark) {
106
- body:not(.light-mode) ._column-container_15bga_1 {
106
+ body:not(.light-mode) ._column-container_1j8hh_1 {
107
107
  --column-background-color: var(--background-color, #000);
108
108
  --column-stroke-color: var(--text-emphasized-color, #fff);
109
109
  --column-text-color: var(--text-emphasized-color, #fff);
110
110
  color-scheme: dark;
111
111
  color: var(--column-text-color);
112
112
  }
113
- body:not(.light-mode) ._column-container_15bga_1 .timescale {
113
+ body:not(.light-mode) ._column-container_1j8hh_1 .timescale {
114
114
  color: #000;
115
115
  }
116
- body:not(.light-mode) ._column-container_15bga_1 svg pattern image {
116
+ body:not(.light-mode) ._column-container_1j8hh_1 svg pattern image {
117
117
  filter: invert(100%);
118
118
  }
119
119
  }
120
- body.dark-mode ._column-container_15bga_1 {
120
+ body.dark-mode ._column-container_1j8hh_1 {
121
121
  --column-background-color: var(--background-color, #000);
122
122
  --column-stroke-color: var(--text-emphasized-color, #fff);
123
123
  --column-text-color: var(--text-emphasized-color, #fff);
124
124
  color-scheme: dark;
125
125
  color: var(--column-text-color);
126
126
  }
127
- body.dark-mode ._column-container_15bga_1 .timescale {
127
+ body.dark-mode ._column-container_1j8hh_1 .timescale {
128
128
  color: #000;
129
129
  }
130
- body.dark-mode ._column-container_15bga_1 svg pattern image {
130
+ body.dark-mode ._column-container_1j8hh_1 svg pattern image {
131
131
  filter: invert(100%);
132
132
  }
133
133
 
134
- ._column-container_15bga_1 {
134
+ ._column-container_1j8hh_1 {
135
135
  padding-top: var(--column-padding-top);
136
136
  padding-bottom: var(--column-padding-bottom);
137
137
  padding-left: var(--column-padding-left);
138
138
  padding-right: var(--column-padding-right);
139
139
  }
140
140
 
141
- ._column-container_15bga_1 .column {
141
+ ._column-container_1j8hh_1 .column {
142
142
  display: flex;
143
143
  flex-direction: row;
144
144
  position: relative;
145
145
  height: fit-content;
146
146
  }
147
- ._column-container_15bga_1 g.lithology-column .column-clip-frame {
147
+ ._column-container_1j8hh_1 g.lithology-column .column-clip-frame {
148
148
  stroke: none;
149
149
  }
150
- ._column-container_15bga_1 .unit {
150
+ ._column-container_1j8hh_1 .unit {
151
151
  stroke: var(--column-stroke-color);
152
152
  stroke-width: 1px;
153
153
  }
154
- ._column-container_15bga_1 .selection-overlay {
154
+ ._column-container_1j8hh_1 .selection-overlay {
155
155
  fill: var(--selection-overlay-color, red);
156
156
  fill-opacity: var(--selection-overlay-opacity, 0.5);
157
157
  }
158
- ._column-container_15bga_1 g.lithology-column use.frame {
158
+ ._column-container_1j8hh_1 .linked-overlay {
159
+ fill: var(--linked-overlay-color, var(--selection-overlay-color, red));
160
+ fill-opacity: var(--linked-overlay-opacity, 0.18);
161
+ pointer-events: none;
162
+ }
163
+ ._column-container_1j8hh_1 g.lithology-column use.frame {
159
164
  stroke: var(--column-stroke-color);
160
165
  stroke-width: 1.5px !important;
161
166
  pointer-events: none;
162
167
  }
163
168
 
164
- ._column-container_15bga_1 .unit-label {
169
+ ._column-container_1j8hh_1 .unit-label {
165
170
  text-align: center;
166
171
  }
167
172
 
168
- ._column-container_15bga_1 .col-note-label {
173
+ ._column-container_1j8hh_1 .col-note-label {
169
174
  font-size: 10px;
170
175
  line-height: 9px;
171
176
  border-left: none !important;
172
177
  margin: 1px 0;
173
178
  }
174
179
 
175
- ._column-container_15bga_1 g.height-range {
180
+ ._column-container_1j8hh_1 g.height-range {
176
181
  display: none;
177
182
  }
178
183
 
179
- ._column-container_15bga_1 .note-inner {
184
+ ._column-container_1j8hh_1 .note-inner {
180
185
  border: none;
181
186
  padding: 1px;
182
187
  }
183
188
 
184
- ._column-container_15bga_1 .frame rect {
189
+ ._column-container_1j8hh_1 .frame rect {
185
190
  fill: transparent;
186
191
  }
187
192
 
188
- ._column-container_15bga_1 .default-buttons {
193
+ ._column-container_1j8hh_1 .default-buttons {
189
194
  width: 100%;
190
195
  margin: 0 -10px;
191
196
  }
192
197
 
193
- ._column-container_15bga_1 div.section {
198
+ ._column-container_1j8hh_1 div.section {
194
199
  display: flex;
195
200
  flex-direction: row;
196
201
  }
197
202
 
198
- ._column-container_15bga_1 .section .divisions .unit {
203
+ ._column-container_1j8hh_1 .section .divisions .unit {
199
204
  cursor: pointer;
200
205
  }
201
206
 
202
- ._column-container_15bga_1 .timescale {
207
+ ._column-container_1j8hh_1 .timescale {
203
208
  width: calc((1.5em + 1.5px) * var(--timescale-level-count, 4));
204
209
  --timescale-level-size: 1.5em;
205
210
  }
206
211
 
207
- ._timescale-column_15bga_114 {
212
+ ._timescale-column_1j8hh_119 {
208
213
  position: relative;
209
214
  }
210
215
 
211
- ._section-main_15bga_118 {
216
+ ._section-main_1j8hh_123 {
212
217
  position: relative;
213
218
  margin-bottom: -4px;
214
219
  }
215
220
 
216
- ._section-units-container_15bga_123 {
221
+ ._section-units-container_1j8hh_128 {
217
222
  position: relative;
218
223
  }
219
224
 
220
- ._main-column_15bga_127 {
225
+ ._main-column_1j8hh_132 {
221
226
  position: relative;
222
227
  }
223
228
 
224
- ._unconformity-labels_15bga_131 {
229
+ ._unconformity-labels_1j8hh_136 {
225
230
  position: absolute;
226
231
  top: 0;
227
232
  left: 0;
228
233
  pointer-events: none;
229
234
  }
230
235
 
231
- ._unconformity_15bga_131 {
236
+ ._unconformity_1j8hh_136 {
232
237
  position: absolute;
233
238
  font-family: var(--label-font-family, sans-serif);
234
239
  top: 0px;
@@ -236,20 +241,20 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
236
241
  font-size: 0.8em;
237
242
  --unit-font-weight: 400;
238
243
  }
239
- ._unconformity_15bga_131._giga_15bga_146 {
244
+ ._unconformity_1j8hh_136._giga_1j8hh_151 {
240
245
  font-weight: 800;
241
246
  }
242
- ._unconformity_15bga_131._mega_15bga_149 {
247
+ ._unconformity_1j8hh_136._mega_1j8hh_154 {
243
248
  font-weight: 700;
244
249
  }
245
- ._unconformity_15bga_131._large_15bga_152 {
250
+ ._unconformity_1j8hh_136._large_1j8hh_157 {
246
251
  font-weight: 500;
247
252
  }
248
- ._unconformity_15bga_131._small_15bga_155 {
253
+ ._unconformity_1j8hh_136._small_1j8hh_160 {
249
254
  font-weight: 300;
250
255
  }
251
256
 
252
- ._unconformity-inner_15bga_159 {
257
+ ._unconformity-inner_1j8hh_164 {
253
258
  position: absolute;
254
259
  top: 3px;
255
260
  bottom: 3px;
@@ -261,21 +266,21 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
261
266
  text-align: center;
262
267
  }
263
268
 
264
- ._unconformity-text_15bga_171 {
269
+ ._unconformity-text_1j8hh_176 {
265
270
  width: var(--column-width);
266
271
  --unit-font-style: normal;
267
272
  }
268
- ._unconformity-text_15bga_171 ._prefix_15bga_175 {
273
+ ._unconformity-text_1j8hh_176 ._prefix_1j8hh_180 {
269
274
  font-weight: 400;
270
275
  color: var(--secondary-color);
271
276
  }
272
277
 
273
- ._timescale-column_15bga_114 ._unconformity-inner_15bga_159 {
278
+ ._timescale-column_1j8hh_119 ._unconformity-inner_1j8hh_164 {
274
279
  border-left: 1.5px dotted var(--secondary-color);
275
280
  left: -3px;
276
281
  }
277
282
 
278
- ._column-title-row_15bga_185 {
283
+ ._column-title-row_1j8hh_190 {
279
284
  display: flex;
280
285
  flex-direction: row;
281
286
  gap: 1em;
@@ -313,7 +318,7 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
313
318
  ._legend-json-view_4jzei_30 {
314
319
  padding-left: 0;
315
320
  margin-left: -0.5em;
316
- }._legend-panel-header_ue390_1 {
321
+ }._legend-panel-header_arfxf_1 {
317
322
  display: flex;
318
323
  justify-content: space-between;
319
324
  align-items: center;
@@ -327,74 +332,65 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
327
332
  min-height: 45px;
328
333
  overflow: hidden;
329
334
  }
330
- ._legend-panel-header_ue390_1 ._title-container_ue390_15 {
335
+ ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 {
331
336
  gap: 0.5em;
332
337
  align-items: baseline;
333
338
  margin: 0;
334
339
  flex-grow: 1;
335
340
  z-index: 5;
336
341
  }
337
- ._legend-panel-header_ue390_1 ._title-container_ue390_15:hover ._hidden-actions-container_ue390_22 {
342
+ ._legend-panel-header_arfxf_1 ._title-container_arfxf_15:hover ._hidden-actions-container_arfxf_22 {
338
343
  visibility: visible;
339
344
  }
340
- ._legend-panel-header_ue390_1 ._title-container_ue390_15 h1, ._legend-panel-header_ue390_1 ._title-container_ue390_15 h2, ._legend-panel-header_ue390_1 ._title-container_ue390_15 h3 {
345
+ ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 h1, ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 h2, ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 h3 {
341
346
  display: inline;
342
347
  margin: 0;
343
348
  }
344
- ._legend-panel-header_ue390_1 ._title-container_ue390_15 ._hidden-actions-container_ue390_22 {
349
+ ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 ._hidden-actions-container_arfxf_22 {
345
350
  visibility: hidden;
346
351
  }
347
- ._legend-panel-header_ue390_1 ._title-container_ue390_15 button {
352
+ ._legend-panel-header_arfxf_1 ._title-container_arfxf_15 button {
348
353
  transform: translateY(0px);
349
354
  }
350
- ._legend-panel-header_ue390_1 code {
355
+ ._legend-panel-header_arfxf_1 code {
351
356
  font-size: 0.9em;
352
357
  color: var(--secondary-color);
353
358
  }
354
- ._legend-panel-header_ue390_1 ._unit-id_ue390_39:before {
359
+ ._legend-panel-header_arfxf_1 ._unit-id_arfxf_39:before {
355
360
  content: "#";
356
361
  color: var(--secondary-color);
357
362
  }
358
- ._legend-panel-header_ue390_1 ._spacer_ue390_43 {
363
+ ._legend-panel-header_arfxf_1 ._spacer_arfxf_43 {
359
364
  flex: 1;
360
365
  }
361
366
 
362
- ._unit-details-panel_ue390_47 {
367
+ ._unit-details-panel_arfxf_47 {
363
368
  display: flex;
364
369
  flex-direction: column;
365
370
  }
366
- ._unit-details-panel_ue390_47 ._unit-details-content-holder_ue390_51 {
371
+ ._unit-details-panel_arfxf_47 ._unit-details-content-holder_arfxf_51 {
367
372
  flex: 1;
368
373
  overflow-y: scroll;
369
374
  }
370
375
 
371
- ._unit-details-content_ue390_51 {
376
+ ._unit-details-content_arfxf_51 {
372
377
  position: relative;
373
378
  margin: 1em;
374
379
  }
375
380
 
376
- ._units-list_ue390_61 ._item_ue390_61:after {
381
+ ._units-list_arfxf_61 ._item_arfxf_61:after {
377
382
  content: ", ";
378
383
  }
379
- ._units-list_ue390_61 ._item_ue390_61:last-child:after {
384
+ ._units-list_arfxf_61 ._item_arfxf_61:last-child:after {
380
385
  content: "";
381
386
  }
382
387
 
383
- ._proportion_ue390_68, ._sep_ue390_68, ._no-units_ue390_68, ._strat-name-text_ue390_68 {
388
+ ._proportion_arfxf_68, ._sep_arfxf_68, ._no-units_arfxf_68, ._strat-name-text_arfxf_68 {
384
389
  color: var(--secondary-color);
385
390
  font-style: italic;
386
391
  }
387
392
 
388
- ._strat-name-id_ue390_73, ._identifier_ue390_73 {
389
- font-family: var(--monospace-font);
390
- color: var(--secondary-color);
391
- }
392
- ._strat-name-id_ue390_73::before, ._identifier_ue390_73::before {
393
- content: "#";
394
- color: var(--tertiary-color);
395
- }
396
-
397
- ._color-swatch_ue390_82 {
393
+ ._color-swatch_arfxf_73 {
398
394
  width: 1em;
399
395
  height: 1em;
400
396
  border-radius: 0.2em;
@@ -403,24 +399,24 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
403
399
  display: inline-block;
404
400
  }
405
401
 
406
- ._refs_ue390_91 {
402
+ ._refs_arfxf_82 {
407
403
  list-style: none;
408
404
  margin: 0;
409
405
  padding-left: 0;
410
406
  }
411
407
 
412
- ._clickable_ue390_97 {
408
+ ._clickable_arfxf_88 {
413
409
  cursor: pointer;
414
410
  }
415
411
 
416
- ._hidden-actions-container_ue390_22 {
412
+ ._hidden-actions-container_arfxf_22 {
417
413
  min-width: 0;
418
414
  display: inline-block;
419
415
  width: 0;
420
416
  position: relative;
421
417
  }
422
418
 
423
- ._hidden-actions_ue390_22 {
419
+ ._hidden-actions_arfxf_22 {
424
420
  padding-left: 1em;
425
421
  width: fit-content;
426
422
  display: flex;
@@ -431,7 +427,7 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
431
427
  position: relative;
432
428
  bottom: 0;
433
429
  }
434
- ._hidden-actions_ue390_22 button {
430
+ ._hidden-actions_arfxf_22 button {
435
431
  color: var(--secondary-color) !important;
436
432
  }._boundary-age-model_16scl_1 {
437
433
  top: 0;
@@ -463,20 +459,20 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
463
459
  ._truncated-list_120po_1 li._too-many_120po_16 {
464
460
  color: var(--secondary-color);
465
461
  font-style: italic;
466
- }._page-header_jnc7r_1 {
462
+ }._page-header_17ryg_1 {
467
463
  display: flex;
468
464
  flex-direction: row;
469
465
  justify-content: space-between;
470
466
  margin-bottom: 1em;
471
467
  }
472
468
 
473
- ._diagram-container_jnc7r_8 {
469
+ ._diagram-container_17ryg_8 {
474
470
  flex: 1;
475
471
  position: relative;
476
472
  min-height: 0;
477
473
  display: flex;
478
474
  }
479
- ._diagram-container_jnc7r_8._map-inset_jnc7r_14 ._column-selection-map_jnc7r_14 {
475
+ ._diagram-container_17ryg_8._map-inset_17ryg_14 ._column-selection-map_17ryg_14 {
480
476
  position: absolute;
481
477
  top: 1em;
482
478
  right: 1em;
@@ -484,21 +480,21 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
484
480
  width: 12em;
485
481
  z-index: 1000;
486
482
  }
487
- ._diagram-container_jnc7r_8._map-expanded_jnc7r_22 {
483
+ ._diagram-container_17ryg_8._map-expanded_17ryg_22 {
488
484
  flex-direction: row;
489
485
  gap: 1em;
490
486
  }
491
- ._diagram-container_jnc7r_8._map-expanded_jnc7r_22 ._assistant_jnc7r_26 {
487
+ ._diagram-container_17ryg_8._map-expanded_17ryg_22 ._assistant_17ryg_26 {
492
488
  width: 40em;
493
489
  position: relative;
494
490
  }
495
491
 
496
- ._column-selection-map_jnc7r_14, ._unit-details-panel_jnc7r_31, ._main-area_jnc7r_31 {
492
+ ._column-selection-map_17ryg_14, ._unit-details-panel_17ryg_31, ._main-area_17ryg_31 {
497
493
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
498
494
  border-radius: 6px;
499
495
  }
500
496
 
501
- ._column-selection-map_jnc7r_14 {
497
+ ._column-selection-map_17ryg_14 {
502
498
  overflow: hidden;
503
499
  flex: 1;
504
500
  min-height: 12em;
@@ -508,12 +504,12 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
508
504
  top: 0;
509
505
  right: 0;
510
506
  }
511
- ._column-selection-map_jnc7r_14 ._correlation-map_jnc7r_46 {
507
+ ._column-selection-map_17ryg_14 ._correlation-map_17ryg_46 {
512
508
  height: 100%;
513
509
  position: relative;
514
510
  }
515
511
 
516
- ._unit-details-panel_jnc7r_31 {
512
+ ._unit-details-panel_17ryg_31 {
517
513
  overflow: scroll;
518
514
  background: var(--panel-secondary-background-color);
519
515
  flex: 2;
@@ -521,7 +517,7 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
521
517
  max-width: 100%;
522
518
  }
523
519
 
524
- ._main-area_jnc7r_31 {
520
+ ._main-area_17ryg_31 {
525
521
  position: relative;
526
522
  flex: 1;
527
523
  min-height: 0;
@@ -530,7 +526,7 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
530
526
  background-color: var(--panel-secondary-background-color);
531
527
  }
532
528
 
533
- ._correlation-diagram_jnc7r_68 {
529
+ ._correlation-diagram_17ryg_68 {
534
530
  padding: 1em;
535
531
  padding-left: 0;
536
532
  background-color: var(--panel-secondary-background-color);
@@ -538,57 +534,90 @@ body.dark-mode ._column-container_15bga_1 svg pattern image {
538
534
  --column-stroke-color: var(--text-color);
539
535
  }
540
536
 
541
- ._package_jnc7r_76 {
537
+ ._package_17ryg_76 {
542
538
  position: relative;
543
539
  }
544
- ._package_jnc7r_76 ._package-overlay_jnc7r_79 {
540
+ ._package_17ryg_76 ._package-overlay_17ryg_79 {
545
541
  position: absolute;
546
542
  top: 9px;
547
543
  left: 0;
548
544
  border: 2px solid red;
549
545
  }
550
- ._package_jnc7r_76 ._laterally-extensive-unit_jnc7r_85 ._strat-col-span_jnc7r_85 {
546
+ ._package_17ryg_76 ._laterally-extensive-unit_17ryg_85 ._strat-col-span_17ryg_85 {
551
547
  position: absolute;
552
548
  border: 2px solid red;
553
549
  }
554
- ._package_jnc7r_76 ._column-container_jnc7r_89 {
550
+ ._package_17ryg_76 ._column-container_17ryg_89 {
555
551
  display: flex;
556
552
  flex-direction: row;
557
553
  }
558
554
 
559
- ._map-expanded-button_jnc7r_94 {
555
+ ._map-expanded-button_17ryg_94 {
560
556
  position: absolute;
561
557
  top: 0.5em;
562
558
  right: 0.5em;
563
559
  z-index: 100;
564
560
  }
565
561
 
566
- ._main-panel_jnc7r_101 {
562
+ ._main-panel_17ryg_101 {
567
563
  position: relative;
568
564
  height: 100%;
569
565
  display: flex;
570
566
  flex-direction: column;
571
567
  }
572
568
 
573
- ._main-chart_jnc7r_108 {
569
+ ._main-chart_17ryg_108 {
574
570
  position: relative;
571
+ grid-column: 2;
572
+ grid-row: 2;
575
573
  }
576
574
 
577
- ._correlation-chart-inner_jnc7r_112 {
578
- display: flex;
579
- flex-direction: row;
575
+ ._correlation-chart-inner_17ryg_114 {
576
+ display: grid;
577
+ grid-template-columns: auto auto;
578
+ grid-template-rows: auto auto;
580
579
  position: relative;
580
+ width: fit-content;
581
581
  }
582
582
 
583
- ._age-axis-container_jnc7r_118 {
583
+ ._age-axis-container_17ryg_122 {
584
584
  display: flex;
585
585
  flex-direction: row;
586
586
  position: sticky;
587
587
  left: 0;
588
588
  z-index: 100;
589
+ grid-column: 1;
590
+ grid-row: 2;
589
591
  padding-left: 1em;
590
592
  padding-right: 2px;
591
593
  background-color: var(--panel-secondary-background-color);
594
+ }
595
+
596
+ ._column-header-spacer_17ryg_135 {
597
+ grid-column: 1;
598
+ grid-row: 1;
599
+ position: relative;
600
+ }
601
+
602
+ ._column-header-row_17ryg_141 {
603
+ grid-column: 2;
604
+ grid-row: 1;
605
+ display: flex;
606
+ flex-direction: row;
607
+ align-items: flex-end;
608
+ position: sticky;
609
+ top: 0;
610
+ border-bottom: 1px solid var(--column-stroke-color, var(--text-color));
611
+ background-color: var(--panel-secondary-background-color);
612
+ }
613
+ ._column-header-row_17ryg_141 ._column-header-cell_17ryg_152 {
614
+ box-sizing: border-box;
615
+ display: flex;
616
+ flex-direction: column;
617
+ justify-content: flex-end;
618
+ align-items: stretch;
619
+ max-height: var(--column-header-max-height, 300px);
620
+ overflow: hidden;
592
621
  }._depositional-age_ngsgr_1 {
593
622
  fill: var(--column-stroke-color);
594
623
  fill-opacity: 0.25;
package/dist/column.cjs CHANGED
@@ -15,7 +15,6 @@ const types = require("./prepare-units/types.cjs");
15
15
  const store = require("./data-provider/store.cjs");
16
16
  const popover = require("./unit-details/popover.cjs");
17
17
  const unitSelection = require("./data-provider/unit-selection.cjs");
18
- const identifiers = require("./unit-details/identifiers.cjs");
19
18
  const panel = require("./unit-details/panel.cjs");
20
19
  const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
21
20
  const classNames__default = /* @__PURE__ */ _interopDefault(classNames);
@@ -233,7 +232,7 @@ function ColumnBasicInfo({
233
232
  return column_module.default("div.column-info", [
234
233
  column_module.default("div.column-title-row", [
235
234
  column_module.default("h2", data.col_name),
236
- column_module.default.if(showColumnID)("h4", column_module.default(identifiers.Identifier, { id: data.col_id }))
235
+ column_module.default.if(showColumnID)("h4", column_module.default(dataComponents.Identifier, { id: data.col_id }))
237
236
  ]),
238
237
  column_module.default(dataComponents.DataField, { row: true, label: "Group", value: data.col_group }),
239
238
  column_module.default.if(showReferences)(panel.ReferencesField, {