Skip to content

Commit abc432b

Browse files
JackWilbJackWilb
authored
Merge pull request #635 from visdesignlab/fix-vega6-peer-resolution
Fix Vega 6 peer dependency compatibility
2 parents 08518bd + ad9669c commit abc432b

3 files changed

Lines changed: 77 additions & 116 deletions

File tree

‎packages/upset/package.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -49,13 +49,13 @@
4949
"@mui/x-data-grid": "^8.1.0",
5050
"@trrack/core": "^1.6.1",
5151
"@trrack/vis-react": "^1.6.1",
52-
"react": "^18.3.1 || ^19.0.0",
53-
"react-dom": "^18.3.1 || ^19.0.0",
52+
"react": "^18.0.0 || ^19.0.0",
53+
"react-dom": "^18.0.0 || ^19.0.0",
5454
"react-vega": "^8.0.0",
5555
"recoil": "^0.5.2",
5656
"vega": "^6.2.0",
5757
"vega-embed": "^7.0.2",
58-
"vega-lite": "^5.2.0"
58+
"vega-lite": "^6.0.1"
5959
},
6060
"peerDependenciesMeta": {
6161
"@trrack/vis-react": {
@@ -89,7 +89,7 @@
8989
"typescript": "^5.9.3",
9090
"vega": "^6.2.0",
9191
"vega-embed": "^7.0.2",
92-
"vega-lite": "^5.2.0"
92+
"vega-lite": "^6.4.3"
9393
},
9494
"dependencies": {
9595
"@dnd-kit/core": "^6.3.1",

‎packages/upset/src/components/ElementView/generatePlotSpec.ts‎

Lines changed: 43 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -6,22 +6,32 @@ import {
66
Scatterplot,
77
SelectionType,
88
} from '@visdesignlab/upset2-core';
9-
import { SelectionParameter } from 'vega-lite/build/src/selection';
10-
import { Predicate } from 'vega-lite/build/src/predicate';
11-
import { LogicalComposition } from 'vega-lite/build/src/logical';
12-
import { AnyMark } from 'vega-lite/build/src/mark';
13-
import { Aggregate } from 'vega-lite/build/src/aggregate';
14-
import { StandardType } from 'vega-lite/build/src/type';
159
import { VisualizationSpec } from 'vega-embed/build/embed';
1610
import { DEFAULT_ELEMENT_COLOR, vegaSelectionColor } from '../../utils/styles';
1711

12+
type IntervalSelectionParameter = {
13+
name: string;
14+
select: {
15+
type: 'interval';
16+
encodings?: Array<'x' | 'y'>;
17+
clear?: string;
18+
};
19+
};
20+
21+
type BrushLogicalComposition =
22+
| { and: BrushLogicalComposition[] }
23+
| { or: BrushLogicalComposition[] }
24+
| { not: BrushLogicalComposition }
25+
| { param: string; empty?: boolean }
26+
| { field: string; equal: string | boolean };
27+
1828
/**
1929
* Janky gadget which can be inserted into a condition and returns TRUE if the brush param is empty
2030
* @private The left-side predicate evaluates to true if the brush is empty OR the item is in the brush;
2131
* the right-side predicate evaluates to true if the item is selected OR the brush is empty.
2232
* This creates a logical gadget that evaluates to true if the brush is empty regardless of the item state.
2333
*/
24-
const BRUSH_EMPTY: LogicalComposition<Predicate> = {
34+
const BRUSH_EMPTY: BrushLogicalComposition = {
2535
and: [{ not: { param: 'brush', empty: false } }, { param: 'brush' }],
2636
};
2737

@@ -59,12 +69,12 @@ export function createAddScatterplotSpec(
5969
encoding: {
6070
x: {
6171
field: x.attribute,
62-
type: 'quantitative',
72+
type: 'quantitative' as const,
6373
scale: { zero: false, type: x.logScale ? 'log' : 'linear' },
6474
},
6575
y: {
6676
field: y.attribute,
67-
type: 'quantitative',
77+
type: 'quantitative' as const,
6878
scale: { zero: false, type: y.logScale ? 'log' : 'linear' },
6979
},
7080
},
@@ -98,13 +108,13 @@ export function generateScatterplotSpec(spec: Scatterplot): VisualizationSpec {
98108
x: {
99109
field: spec.x,
100110
title: spec.x,
101-
type: 'quantitative',
111+
type: 'quantitative' as const,
102112
scale: { zero: false, type: spec.xScaleLog ? 'log' : 'linear' },
103113
},
104114
y: {
105115
field: spec.y,
106116
title: spec.y,
107-
type: 'quantitative',
117+
type: 'quantitative' as const,
108118
scale: { zero: false, type: spec.yScaleLog ? 'log' : 'linear' },
109119
},
110120
color: {
@@ -227,8 +237,8 @@ export function createAddHistogramSpec(
227237
],
228238
mark: 'line',
229239
encoding: {
230-
x: { field: 'value', type: 'quantitative' },
231-
y: { field: 'density', type: 'quantitative' },
240+
x: { field: 'value', type: 'quantitative' as const },
241+
y: { field: 'density', type: 'quantitative' as const },
232242
},
233243
};
234244

@@ -247,7 +257,7 @@ export function createAddHistogramSpec(
247257
bin: { maxbins: bins },
248258
field: attribute,
249259
},
250-
y: { aggregate: 'count' },
260+
y: { aggregate: 'count' as const },
251261
},
252262
};
253263

@@ -275,7 +285,7 @@ export function generateHistogramSpec(
275285
clear: 'mousedown',
276286
},
277287
},
278-
] as SelectionParameter[];
288+
] as IntervalSelectionParameter[];
279289

280290
/** Color for layers showing all elements (not selection layers) */
281291
const COLOR = {
@@ -312,14 +322,14 @@ export function generateHistogramSpec(
312322
as: hist.attribute,
313323
},
314324
],
315-
mark: 'line',
325+
mark: 'line' as const,
316326
encoding: {
317327
x: {
318328
field: hist.attribute,
319-
type: 'quantitative',
329+
type: 'quantitative' as const,
320330
title: hist.attribute,
321331
},
322-
y: { field: 'density', type: 'quantitative', title: 'Probability' },
332+
y: { field: 'density', type: 'quantitative' as const, title: 'Probability' },
323333
color: { value: DEFAULT_ELEMENT_COLOR },
324334
opacity: selectionTypeRow ? { value: 0.4 } : OPACITY,
325335
},
@@ -332,14 +342,14 @@ export function generateHistogramSpec(
332342
{ density: hist.attribute, groupby: ['subset', 'color'] },
333343
{ calculate: 'datum["value"]', as: hist.attribute },
334344
],
335-
mark: 'line',
345+
mark: 'line' as const,
336346
encoding: {
337347
x: {
338348
field: hist.attribute,
339-
type: 'quantitative',
349+
type: 'quantitative' as const,
340350
title: hist.attribute,
341351
},
342-
y: { field: 'density', type: 'quantitative', title: 'Probability' },
352+
y: { field: 'density', type: 'quantitative' as const, title: 'Probability' },
343353
color: COLOR,
344354
opacity: selectionTypeRow ? { value: 0.4 } : OPACITY,
345355
},
@@ -351,14 +361,14 @@ export function generateHistogramSpec(
351361
{ density: hist.attribute },
352362
{ calculate: 'datum["value"]', as: hist.attribute },
353363
],
354-
mark: 'line',
364+
mark: 'line' as const,
355365
encoding: {
356366
x: {
357367
field: hist.attribute,
358-
type: 'quantitative',
368+
type: 'quantitative' as const,
359369
title: hist.attribute,
360370
},
361-
y: { field: 'density', type: 'quantitative' },
371+
y: { field: 'density', type: 'quantitative' as const },
362372
color: { value: vegaSelectionColor },
363373
opacity: { value: selectionTypeRow ? 0.4 : 1 },
364374
},
@@ -371,15 +381,15 @@ export function generateHistogramSpec(
371381
{ density: hist.attribute, groupby: ['subset', 'color'] },
372382
{ calculate: 'datum["value"]', as: hist.attribute },
373383
],
374-
mark: 'line' as AnyMark, // Vega is weird about some types in destructured objects
384+
mark: 'line' as const,
375385
encoding: {
376386
// More vega weirdness
377387
x: {
378388
field: hist.attribute,
379-
type: 'quantitative' as StandardType,
389+
type: 'quantitative' as const,
380390
title: hist.attribute,
381391
},
382-
y: { field: 'density', type: 'quantitative' as StandardType },
392+
y: { field: 'density', type: 'quantitative' as const },
383393
color: COLOR,
384394
opacity: { value: 1 },
385395
},
@@ -397,10 +407,10 @@ export function generateHistogramSpec(
397407
layer: [
398408
{
399409
params,
400-
mark: 'bar',
410+
mark: 'bar' as const,
401411
encoding: {
402412
x: { bin: { maxbins: hist.bins }, field: hist.attribute },
403-
y: { aggregate: 'count', title: 'Frequency' },
413+
y: { aggregate: 'count' as const, title: 'Frequency' },
404414
color: COLOR,
405415
opacity: OPACITY,
406416
},
@@ -411,14 +421,14 @@ export function generateHistogramSpec(
411421
filter: { param: 'brush', empty: false },
412422
},
413423
],
414-
mark: 'bar',
424+
mark: 'bar' as const,
415425
encoding: {
416426
x: {
417427
field: hist.attribute,
418428
bin: { maxbins: hist.bins },
419429
title: hist.attribute,
420430
},
421-
y: { aggregate: 'count', title: 'Frequency' },
431+
y: { aggregate: 'count' as const, title: 'Frequency' },
422432
color: { value: vegaSelectionColor },
423433
opacity: { value: 1 },
424434
},
@@ -427,10 +437,10 @@ export function generateHistogramSpec(
427437
? [
428438
{
429439
transform: [{ filter: { field: 'isCurrent', equal: true } }],
430-
mark: 'bar' as AnyMark, // Vega is weird about some types in destructured objects
440+
mark: 'bar' as const,
431441
encoding: {
432442
x: { field: hist.attribute, bin: { maxbins: hist.bins } },
433-
y: { aggregate: 'count' as Aggregate, title: 'Frequency' },
443+
y: { aggregate: 'count' as const, title: 'Frequency' },
434444
color: COLOR,
435445
opacity: { value: 1 },
436446
},

0 commit comments

Comments
 (0)