start adding js extension

vega · Feb 11, 2025 · 098d99e · 098d99e
1 parent 000c5d5
commit 098d99e
Show file tree

Hide file tree

Showing 320 changed files with 8,540 additions and 9,243 deletions.
diff --git a/eslint.config.js b/eslint.config.js
@@ -19,13 +19,13 @@ export default [
   {
     languageOptions: {
       parserOptions: {
-        project: './tsconfig.eslint.json',
+        project: './tsconfig.json',
         tsconfigRootDir: import.meta.dirname,
       },
     },
   },
   {
-    files: ['**/*.ts'],
+    files: ['src/**/*.ts'],
     plugins: {
       vitest,
     },

diff --git a/examples/examples.test.ts b/examples/examples.test.ts
@@ -6,17 +6,17 @@ import path from 'path';
 import {Spec as VgSpec} from 'vega';
 import vgSchema from 'vega/build/vega-schema.json';
 import vlSchema from '../build/vega-lite-schema.json';
-import {compile} from '../src/compile/compile';
-import * as log from '../src/log';
-import {TopLevelSpec} from '../src/spec';
-import {duplicate} from '../src/util';
+import {compile} from '../src/compile/compile.js';
+import * as log from '../src/log/index.js';
+import {TopLevelSpec} from '../src/spec/index.js';
+import {duplicate} from '../src/util.js';
 
 // import {inspect} from 'util';
 
 const ajv = new Ajv({
   allowUnionTypes: true,
   strictTypes: false,
-  strictTuples: false
+  strictTuples: false,
 });
 
 ajv.addFormat('color-hex', () => true);
@@ -59,8 +59,10 @@ function validateVega(vegaSpec: VgSpec) {
 const BROKEN_SUFFIX = '_broken.vl.json';
 const FUTURE_SUFFIX = '_future.vl.json';
 
-const examples = fs.readdirSync('examples/specs').map(file => `examples/specs/${file}`);
-const normalizedExamples = fs.readdirSync('examples/specs/normalized').map(file => `examples/specs/normalized/${file}`);
+const examples = fs.readdirSync('examples/specs').map((file) => `examples/specs/${file}`);
+const normalizedExamples = fs
+  .readdirSync('examples/specs/normalized')
+  .map((file) => `examples/specs/normalized/${file}`);
 
 for (const example of [...examples, ...normalizedExamples]) {
   if (path.extname(example) !== '.json') {
@@ -72,7 +74,7 @@ for (const example of [...examples, ...normalizedExamples]) {
   describe(
     // eslint-disable-next-line jest/valid-describe-callback, jest/valid-title
     example,
-    log.wrap(localLogger => {
+    log.wrap((localLogger) => {
       const vegaSpec: VgSpec = compile(jsonSpec).spec;
 
       it('should not cause any side effects', () => {
@@ -103,6 +105,6 @@ for (const example of [...examples, ...normalizedExamples]) {
 
         validateVega(vegaSpec);
       });
-    })
+    }),
   );
 }
diff --git a/package.json b/package.json
@@ -104,6 +104,7 @@
     "eslint-config-prettier": "^10.0.1",
     "eslint-plugin-jest": "^28.11.0",
     "eslint-plugin-prettier": "^5.2.3",
+    "eslint-plugin-vitest": "^0.5.4",
     "fast-json-stable-stringify": "~2.1.0",
     "highlight.js": "^11.11.1",
     "jest": "^29.7.0",
@@ -120,6 +121,7 @@
     "ts-jest": "^29.2.5",
     "ts-json-schema-generator": "^2.3.0",
     "typescript": "~5.7.3",
+    "typescript-eslint": "^8.24.0",
     "vega-cli": "^5.31.0",
     "vega-datasets": "^2.11.0",
     "vega-embed": "^6.29.0",

diff --git a/site/static/index.ts b/site/static/index.ts
@@ -16,9 +16,9 @@ import xml from 'highlight.js/lib/languages/xml';
 import compactStringify from 'json-stringify-pretty-compact';
 import * as vega from 'vega';
 import {Handler} from 'vega-tooltip';
-import {compile, TopLevelSpec} from '../../src';
-import {post} from './post';
-import {runStreamingExample} from './streaming';
+import {compile, TopLevelSpec} from '../../src/index.js';
+import {post} from './post.js';
+import {runStreamingExample} from './streaming.js';
 
 (window as any)['runStreamingExample'] = runStreamingExample;
 (window as any)['embedExample'] = embedExample;
@@ -36,7 +36,7 @@ hljs.highlightAll();
 declare const BASEURL: string;
 
 const loader = vega.loader({
-  baseURL: BASEURL
+  baseURL: BASEURL,
 });
 
 const editorURL = 'https://vega.github.io/editor/';
@@ -93,14 +93,14 @@ export function embedExample($target: any, spec: TopLevelSpec, actions = true, t
       .append('a')
       .text('Open in Vega Editor')
       .attr('href', '#')
-      .on('click mouseup', event => {
+      .on('click mouseup', (event) => {
         // Check if it's a regular left click or middle mouse click
         if (event.type === 'click' || (event.type === 'mouseup' && event.button === MIDDLE_MOUSE_CLICK)) {
           post(window, editorURL, {
             mode: 'vega-lite',
             spec: compactStringify(spec),
             config: vgSpec.config,
-            renderer: 'svg'
+            renderer: 'svg',
           });
         }
         // remove as any when d3 typings are updated
@@ -125,7 +125,7 @@ async function getSpec(el: d3.BaseType) {
     } catch (e) {
       sel
         .html(
-          `Could not load spec: ${e}. Please report this issue on <a href="https://github.com/vega/vega-lite/issues/new/choose">GitHub</a>.`
+          `Could not load spec: ${e}. Please report this issue on <a href="https://github.com/vega/vega-lite/issues/new/choose">GitHub</a>.`,
         )
         .classed('error', true);
       console.error(e);
@@ -198,7 +198,7 @@ function setSlide(
   slides: NodeListOf<Element>,
   indicators: NodeListOf<Element>,
   links: NodeListOf<any>,
-  active: number
+  active: number,
 ) {
   return () => {
     // Reset all slides

diff --git a/site/static/streaming.ts b/site/static/streaming.ts
@@ -1,20 +1,20 @@
-import {embedExample} from '.';
-import {TopLevelSpec} from '../../src';
+import {embedExample} from './index.js';
+import {TopLevelSpec} from '../../src/index.js';
 
 export function runStreamingExample(eleId: string) {
   const vlSpec: TopLevelSpec = {
     $schema: 'https://vega.github.io/schema/vega-lite/v5.json',
     data: {name: 'table'},
     autosize: {
-      resize: true
+      resize: true,
     },
     width: 400,
     mark: 'line',
     encoding: {
       x: {field: 'x', type: 'quantitative', scale: {zero: false}},
       y: {field: 'y', type: 'quantitative'},
-      color: {field: 'category', type: 'nominal'}
-    }
+      color: {field: 'category', type: 'nominal'},
+    },
   };
 
   const view = embedExample(eleId, vlSpec, false, false);
@@ -30,9 +30,9 @@ export function runStreamingExample(eleId: string) {
       const newVals = previousY.map((v, category) => ({
         x: counter,
         y: v + Math.round(Math.random() * 10 - category * 3),
-        category
+        category,
       }));
-      previousY = newVals.map(v => v.y);
+      previousY = newVals.map((v) => v.y);
       return newVals;
     };
   }

diff --git a/src/aggregate.ts b/src/aggregate.ts
@@ -1,7 +1,7 @@
 import type {AggregateOp} from 'vega';
 import {hasOwnProperty, isString} from 'vega-util';
-import {FieldName} from './channeldef';
-import {contains, Flag, hasProperty} from './util';
+import {FieldName} from './channeldef.js';
+import {contains, Flag, hasProperty} from './util.js';
 
 const AGGREGATE_OP_INDEX: Flag<AggregateOp> = {
   argmax: 1,
@@ -28,13 +28,13 @@ const AGGREGATE_OP_INDEX: Flag<AggregateOp> = {
   valid: 1,
   values: 1,
   variance: 1,
-  variancep: 1
+  variancep: 1,
 };
 
 export const MULTIDOMAIN_SORT_OP_INDEX = {
   count: 1,
   min: 1,
-  max: 1
+  max: 1,
 };
 
 export interface ArgminDef {
@@ -65,7 +65,7 @@ export const COUNTING_OPS = new Set<NonArgAggregateOp>([
   'count',
   'valid',
   'missing',
-  'distinct'
+  'distinct',
 ]) as ReadonlySet<NonArgAggregateOp>;
 
 export function isCountingAggregateOp(aggregate?: string | Aggregate): boolean {
@@ -82,7 +82,7 @@ export const SUM_OPS = new Set<NonArgAggregateOp>([
   'sum',
   'distinct',
   'valid',
-  'missing'
+  'missing',
 ]) as ReadonlySet<NonArgAggregateOp>;
 
 /**
@@ -95,5 +95,5 @@ export const SHARED_DOMAIN_OPS = new Set<AggregateOp>([
   'q1',
   'q3',
   'min',
-  'max'
+  'max',
 ]) as ReadonlySet<AggregateOp>;
diff --git a/src/axis.ts b/src/axis.ts
@@ -11,14 +11,14 @@ import type {
   SignalRef,
   TextBaseline,
   TimeInterval,
-  TimeIntervalStep
+  TimeIntervalStep,
 } from 'vega';
-import {ConditionalPredicate, Value, ValueDef} from './channeldef';
-import {DateTime} from './datetime';
-import {ExprRef} from './expr';
-import {Guide, GuideEncodingEntry, TitleMixins, VlOnlyGuideConfig} from './guide';
-import {Flag, keys} from './util';
-import {MapExcludeValueRefAndReplaceSignalWith, VgEncodeChannel} from './vega.schema';
+import {ConditionalPredicate, Value, ValueDef} from './channeldef.js';
+import {DateTime} from './datetime.js';
+import {ExprRef} from './expr.js';
+import {Guide, GuideEncodingEntry, TitleMixins, VlOnlyGuideConfig} from './guide.js';
+import {Flag, keys} from './util.js';
+import {MapExcludeValueRefAndReplaceSignalWith, VgEncodeChannel} from './vega.schema.js';
 import {hasOwnProperty} from 'vega-util';
 
 export type BaseAxisNoValueRefs<ES extends ExprRef | SignalRef> = AxisOverrideMixins<ES> &
@@ -189,87 +189,87 @@ export const CONDITIONAL_AXIS_PROP_INDEX: Record<
 > = {
   labelAlign: {
     part: 'labels',
-    vgProp: 'align'
+    vgProp: 'align',
   },
   labelBaseline: {
     part: 'labels',
-    vgProp: 'baseline'
+    vgProp: 'baseline',
   },
   labelColor: {
     part: 'labels',
-    vgProp: 'fill'
+    vgProp: 'fill',
   },
   labelFont: {
     part: 'labels',
-    vgProp: 'font'
+    vgProp: 'font',
   },
   labelFontSize: {
     part: 'labels',
-    vgProp: 'fontSize'
+    vgProp: 'fontSize',
   },
   labelFontStyle: {
     part: 'labels',
-    vgProp: 'fontStyle'
+    vgProp: 'fontStyle',
   },
   labelFontWeight: {
     part: 'labels',
-    vgProp: 'fontWeight'
+    vgProp: 'fontWeight',
   },
   labelOpacity: {
     part: 'labels',
-    vgProp: 'opacity'
+    vgProp: 'opacity',
   },
   labelOffset: null,
   labelPadding: null, // There is no fixed vgProp for tickSize, need to use signal.
   gridColor: {
     part: 'grid',
-    vgProp: 'stroke'
+    vgProp: 'stroke',
   },
   gridDash: {
     part: 'grid',
-    vgProp: 'strokeDash'
+    vgProp: 'strokeDash',
   },
   gridDashOffset: {
     part: 'grid',
-    vgProp: 'strokeDashOffset'
+    vgProp: 'strokeDashOffset',
   },
   gridOpacity: {
     part: 'grid',
-    vgProp: 'opacity'
+    vgProp: 'opacity',
   },
   gridWidth: {
     part: 'grid',
-    vgProp: 'strokeWidth'
+    vgProp: 'strokeWidth',
   },
   tickColor: {
     part: 'ticks',
-    vgProp: 'stroke'
+    vgProp: 'stroke',
   },
   tickDash: {
     part: 'ticks',
-    vgProp: 'strokeDash'
+    vgProp: 'strokeDash',
   },
   tickDashOffset: {
     part: 'ticks',
-    vgProp: 'strokeDashOffset'
+    vgProp: 'strokeDashOffset',
   },
   tickOpacity: {
     part: 'ticks',
-    vgProp: 'opacity'
+    vgProp: 'opacity',
   },
   tickSize: null, // There is no fixed vgProp for tickSize, need to use signal.
   tickWidth: {
     part: 'ticks',
-    vgProp: 'strokeWidth'
-  }
+    vgProp: 'strokeWidth',
+  },
 };
 
 export type ConditionalAxisProperty<V extends Value | number[], ES extends ExprRef | SignalRef> = (ValueDef<V> | ES) & {
   condition: ConditionalPredicate<ValueDef<V> | ES> | ConditionalPredicate<ValueDef<V> | ES>[];
 };
 
 export function isConditionalAxisValue<V extends Value | number[], ES extends ExprRef | SignalRef>(
-  v: any
+  v: any,
 ): v is ConditionalAxisProperty<V, ES> {
   return v?.condition;
 }
@@ -447,7 +447,7 @@ export const AXIS_PROPERTY_TYPE: Record<keyof VgAxis, 'main' | 'grid' | 'both'>
   tickExtra: 'both',
   translate: 'both',
   values: 'both',
-  zindex: 'both' // this is actually set afterward, so it doesn't matter
+  zindex: 'both', // this is actually set afterward, so it doesn't matter
 };
 
 export interface AxisEncoding {
@@ -559,14 +559,14 @@ export const COMMON_AXIS_PROPERTIES_INDEX: Flag<keyof (VgAxis | Axis<any>)> = {
   titleY: 1,
   translate: 1,
   values: 1,
-  zindex: 1
+  zindex: 1,
 };
 
 const AXIS_PROPERTIES_INDEX: Flag<keyof Axis<any>> = {
   ...COMMON_AXIS_PROPERTIES_INDEX,
   style: 1,
   labelExpr: 1,
-  encoding: 1
+  encoding: 1,
 };
 
 export function isAxisProperty(prop: string): prop is keyof Axis<any> {
@@ -710,7 +710,7 @@ const AXIS_CONFIGS_INDEX: Flag<keyof AxisConfigMixins<any>> = {
   axisYDiscrete: 1,
   axisYPoint: 1,
   axisYQuantitative: 1,
-  axisYTemporal: 1
+  axisYTemporal: 1,
 };
 
 export const AXIS_CONFIGS = keys(AXIS_CONFIGS_INDEX);