@buildcanada/charts 0.3.6 → 0.3.7

package/src/grapher/lineCharts/Lines.tsx

@@ -5,10 +5,10 @@ import {
     PointVector,
     makeIdForHumanConsumption,
     pointsToPath,
-} from "../../utils/index"
+} from "../../utils/index.js"
 import { computed, makeObservable } from "mobx"
 import { observer } from "mobx-react"
-import { GRAPHER_OPACITY_MUTE } from "../core/GrapherConstants"
+import { GRAPHER_OPACITY_MUTE } from "../core/GrapherConstants.js"
 import {
     DEFAULT_LINE_COLOR,
     DEFAULT_LINE_OUTLINE_WIDTH,
@@ -17,10 +17,10 @@ import {
     LinesProps,
     PlacedLineChartSeries,
     RenderLineChartSeries,
-} from "./LineChartConstants"
-import { getSeriesKey } from "../chart/ChartUtils"
-import { GRAPHER_BACKGROUND_DEFAULT } from "../color/ColorConstants"
-import { MultiColorPolyline } from "../scatterCharts/MultiColorPolyline"
+} from "./LineChartConstants.js"
+import { getSeriesKey } from "../chart/ChartUtils.js"
+import { GRAPHER_BACKGROUND_DEFAULT } from "../color/ColorConstants.js"
+import { MultiColorPolyline } from "../scatterCharts/MultiColorPolyline.js"
 
 @observer
 export class Lines extends React.Component<LinesProps> {

package/src/grapher/lineLegend/LineLegend.tsx

@@ -5,39 +5,39 @@ import {
     Bounds,
     makeIdForHumanConsumption,
     excludeUndefined,
-} from "../../utils/index"
-import { TextWrap, Halo, MarkdownTextWrap } from "../../components/index"
+} from "../../utils/index.js"
+import { TextWrap, Halo, MarkdownTextWrap } from "../../components/index.js"
 import { computed, makeObservable } from "mobx"
 import { observer } from "mobx-react"
-import { VerticalAxis } from "../axis/Axis"
+import { VerticalAxis } from "../axis/Axis.js"
 import {
     Color,
     EntityName,
     SeriesName,
     VerticalAlign,
-} from "../../types/index"
+} from "../../types/index.js"
 import {
     BASE_FONT_SIZE,
     GRAPHER_FONT_SCALE_12,
     GRAPHER_OPACITY_MUTE,
     GRAPHER_TEXT_OUTLINE_FACTOR,
-} from "../core/GrapherConstants"
-import { darkenColorForText } from "../color/ColorUtils"
-import { AxisConfig } from "../axis/AxisConfig"
-import { GRAPHER_BACKGROUND_DEFAULT } from "../color/ColorConstants"
+} from "../core/GrapherConstants.js"
+import { darkenColorForText } from "../color/ColorUtils.js"
+import { AxisConfig } from "../axis/AxisConfig.js"
+import { GRAPHER_BACKGROUND_DEFAULT } from "../color/ColorConstants.js"
 import {
     findImportantSeriesThatFitIntoTheAvailableSpace,
     findSeriesThatFitIntoTheAvailableSpace,
-} from "./LineLegendFilterAlgorithms"
+} from "./LineLegendFilterAlgorithms.js"
 import {
     ANNOTATION_PADDING,
     DEFAULT_CONNECTOR_LINE_WIDTH,
     DEFAULT_FONT_WEIGHT,
     LEGEND_ITEM_MIN_SPACING,
     MARKER_MARGIN,
-} from "./LineLegendConstants"
-import { getSeriesKey } from "./LineLegendHelpers"
-import { LineLabelSeries, PlacedSeries, SizedSeries } from "./LineLegendTypes"
+} from "./LineLegendConstants.js"
+import { getSeriesKey } from "./LineLegendHelpers.js"
+import { LineLabelSeries, PlacedSeries, SizedSeries } from "./LineLegendTypes.js"
 
 function groupBounds(group: PlacedSeries[]): Bounds {
     const first = group[0]

package/src/grapher/lineLegend/LineLegendFilterAlgorithms.ts

@@ -6,8 +6,8 @@ import {
     pickCandidate,
     pickCandidateWithMaxDistanceToReferenceCandidate,
     pickCandidateWithRetry,
-} from "./LineLegendHelpers"
-import { PlacedSeries } from "./LineLegendTypes"
+} from "./LineLegendHelpers.js"
+import { PlacedSeries } from "./LineLegendTypes.js"
 
 /**
  * Keep a subset of series that fit within the available height, prioritizing by

package/src/grapher/lineLegend/LineLegendHelpers.ts

@@ -1,7 +1,7 @@
 import * as _ from "lodash-es"
-import { SeriesName } from "../../utils/index"
-import { PlacedSeries } from "./LineLegendTypes"
-import { LEGEND_ITEM_MIN_SPACING } from "./LineLegendConstants"
+import { SeriesName } from "../../utils/index.js"
+import { PlacedSeries } from "./LineLegendTypes.js"
+import { LEGEND_ITEM_MIN_SPACING } from "./LineLegendConstants.js"
 import * as R from "remeda"
 
 type Bracket = [number, number]

package/src/grapher/lineLegend/LineLegendTypes.ts

@@ -1,7 +1,7 @@
-import { MarkdownTextWrap, TextWrap } from "../../components/index"
-import { Bounds } from "../../utils/index"
-import { ChartSeries } from "../chart/ChartInterface"
-import { InteractionState } from "../interaction/InteractionState"
+import { MarkdownTextWrap, TextWrap } from "../../components/index.js"
+import { Bounds } from "../../utils/index.js"
+import { ChartSeries } from "../chart/ChartInterface.js"
+import { InteractionState } from "../interaction/InteractionState.js"
 
 export interface LineLabelSeries extends ChartSeries {
     label: string

package/src/grapher/mapCharts/ChoroplethGlobe.tsx

@@ -24,7 +24,7 @@ import {
     MapRegionName,
     excludeUndefined,
     EntityName,
-} from "../../utils/index"
+} from "../../utils/index.js"
 import {
     Annotation,
     ANNOTATION_COLOR_DARK,
@@ -45,9 +45,9 @@ import {
     PROJECTED_DATA_LEGEND_COLOR,
     RenderFeature,
     SVGMouseEvent,
-} from "./MapChartConstants"
-import { MapConfig } from "./MapConfig"
-import { getGeoFeaturesForGlobe } from "./GeoFeatures"
+} from "./MapChartConstants.js"
+import { MapConfig } from "./MapConfig.js"
+import { getGeoFeaturesForGlobe } from "./GeoFeatures.js"
 import {
     BackgroundCountry,
     CountryWithData,
@@ -56,8 +56,8 @@ import {
     InternalValueAnnotation,
     NoDataPattern,
     ProjectedDataPattern,
-} from "./MapComponents"
-import { Patterns } from "../core/GrapherConstants"
+} from "./MapComponents.js"
+import { Patterns } from "../core/GrapherConstants.js"
 import {
     calculateDistance,
     detectNearbyFeature,
@@ -65,16 +65,16 @@ import {
     sortFeaturesByInteractionStateAndSize,
     getForegroundFeatures,
     isValidGlobeRegionName,
-} from "./MapHelpers"
+} from "./MapHelpers.js"
 import {
     makeInternalAnnotationForFeature,
     makeExternalAnnotationForFeature,
     repositionAndFilterExternalAnnotations,
-} from "./MapAnnotations"
+} from "./MapAnnotations.js"
 import * as R from "remeda"
-import { GlobeController } from "./GlobeController"
-import { isDarkColor } from "../color/ColorUtils"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
+import { GlobeController } from "./GlobeController.js"
+import { isDarkColor } from "../color/ColorUtils.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
 
 const DEFAULT_SCALE = geoOrthographic().scale()
 

package/src/grapher/mapCharts/ChoroplethMap.tsx

@@ -7,7 +7,7 @@ import {
     excludeUndefined,
     EntityName,
     MapRegionName,
-} from "../../utils/index"
+} from "../../utils/index.js"
 import { computed, action, observable, makeObservable } from "mobx"
 import { observer } from "mobx-react"
 import { Quadtree, quadtree } from "d3-quadtree"
@@ -28,8 +28,8 @@ import {
     MapViewport,
     MAP_VIEWPORTS,
     MAP_REGION_LABELS,
-} from "./MapChartConstants"
-import { getGeoFeaturesForMap } from "./GeoFeatures"
+} from "./MapChartConstants.js"
+import { getGeoFeaturesForMap } from "./GeoFeatures.js"
 import {
     BackgroundCountry,
     CountryWithData,
@@ -38,23 +38,23 @@ import {
     InternalValueAnnotation,
     NoDataPattern,
     ProjectedDataPattern,
-} from "./MapComponents"
-import { Patterns } from "../core/GrapherConstants"
+} from "./MapComponents.js"
+import { Patterns } from "../core/GrapherConstants.js"
 import {
     detectNearbyFeature,
     getCountriesByRegion,
     getForegroundFeatures,
     sortFeaturesByInteractionStateAndSize,
-} from "./MapHelpers"
+} from "./MapHelpers.js"
 import {
     makeInternalAnnotationForFeature,
     makeExternalAnnotationForFeature,
     repositionAndFilterExternalAnnotations,
-} from "./MapAnnotations"
-import { isDarkColor } from "../color/ColorUtils"
-import { MapConfig } from "./MapConfig"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
-import { MAP_PROJECTIONS } from "./MapProjections"
+} from "./MapAnnotations.js"
+import { isDarkColor } from "../color/ColorUtils.js"
+import { MapConfig } from "./MapConfig.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
+import { MAP_PROJECTIONS } from "./MapProjections.js"
 
 @observer
 export class ChoroplethMap extends React.Component<{

package/src/grapher/mapCharts/GeoFeatures.ts

@@ -4,12 +4,12 @@ import {
     GlobeRenderFeature,
     MapRenderFeature,
     RenderFeatureType,
-} from "./MapChartConstants"
-import { Bounds, lazy, MapRegionName, PointVector } from "../../utils/index"
-import { CanadaTopology } from "./CanadaTopology"
-import { MapTopology } from "./MapTopology"
+} from "./MapChartConstants.js"
+import { Bounds, lazy, MapRegionName, PointVector } from "../../utils/index.js"
+import { CanadaTopology } from "./CanadaTopology.js"
+import { MapTopology } from "./MapTopology.js"
 import { geoBounds, geoCentroid, geoPath } from "d3-geo"
-import { MAP_PROJECTIONS } from "./MapProjections"
+import { MAP_PROJECTIONS } from "./MapProjections.js"
 
 // Get the underlying geographical topology elements we're going to display
 export const GeoFeatures: GeoFeature[] = (

package/src/grapher/mapCharts/GlobeController.ts

@@ -3,7 +3,7 @@ import { geoInterpolate, geoOrthographic, geoPath } from "d3-geo"
 import { interpolateNumber } from "d3-interpolate"
 import { easeCubicOut } from "d3-ease"
 import * as R from "remeda"
-import { EntityName, GlobeConfig, GlobeRegionName } from "../../types/index"
+import { EntityName, GlobeConfig, GlobeRegionName } from "../../types/index.js"
 import {
     Bounds,
     excludeUndefined,
@@ -13,9 +13,9 @@ import {
     getCountryNamesForRegion,
     getRegionByName,
     checkHasMembers,
-} from "../../utils/index"
-import { MapConfig } from "./MapConfig"
-import { getGeoFeaturesForGlobe } from "./GeoFeatures"
+} from "../../utils/index.js"
+import { MapConfig } from "./MapConfig.js"
+import { getGeoFeaturesForGlobe } from "./GeoFeatures.js"
 import {
     DEFAULT_GLOBE_ROTATION,
     DEFAULT_GLOBE_ROTATIONS_FOR_TIME,
@@ -29,10 +29,10 @@ import {
     GLOBE_VIEWPORTS,
     GlobeRenderFeature,
     MAP_REGION_NAMES,
-} from "./MapChartConstants"
-import { isPointPlacedOnVisibleHemisphere } from "./MapHelpers"
+} from "./MapChartConstants.js"
+import { isPointPlacedOnVisibleHemisphere } from "./MapHelpers.js"
 import { ckmeans } from "simple-statistics"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
 import { center } from "@turf/center"
 import { action } from "mobx"
 

package/src/grapher/mapCharts/MapAnnotationPlacements.ts

@@ -1,6 +1,6 @@
-import { GeoFeaturesById } from "./GeoFeatures"
+import { GeoFeaturesById } from "./GeoFeatures.js"
 import annotations from "./MapAnnotationPlacements.json"
-import { Direction, EllipseCoords, GeoFeature } from "./MapChartConstants"
+import { Direction, EllipseCoords, GeoFeature } from "./MapChartConstants.js"
 
 interface RawAnnotationPlacement {
     id: string

package/src/grapher/mapCharts/MapAnnotations.ts

@@ -2,9 +2,9 @@ import { Feature, GeoJsonProperties, Polygon } from "geojson"
 import { GeoProjection } from "d3-geo"
 import { forceSimulation, forceX, forceY, SimulationNodeDatum } from "d3-force"
 // no types available
-import bboxCollide from "./d3-bboxCollide"
+import bboxCollide from "./d3-bboxCollide.js"
 import { booleanIntersects } from "@turf/boolean-intersects"
-import { Bounds, excludeUndefined } from "../../utils/index"
+import { Bounds, excludeUndefined } from "../../utils/index.js"
 import {
     Direction,
     Ellipse,
@@ -20,11 +20,11 @@ import {
     ANNOTATION_FONT_SIZE_EXTERNAL_MAX,
     ANNOTATION_MARKER_LINE_LENGTH_DEFAULT,
     ANNOTATION_MARKER_LINE_LENGTH_MAX,
-} from "./MapChartConstants"
+} from "./MapChartConstants.js"
 import * as R from "remeda"
-import { annotationPlacementsById } from "./MapAnnotationPlacements"
-import { GRAPHER_DARK_TEXT } from "../color/ColorConstants"
-import { getGeoFeaturesForGlobe } from "./GeoFeatures"
+import { annotationPlacementsById } from "./MapAnnotationPlacements.js"
+import { GRAPHER_DARK_TEXT } from "../color/ColorConstants.js"
+import { getGeoFeaturesForGlobe } from "./GeoFeatures.js"
 
 const MARKER_TEXT_GAP = 2
 

package/src/grapher/mapCharts/MapChart.sample.ts

@@ -1,6 +1,6 @@
-import { DimensionProperty } from "../../utils/index"
-import { GrapherProgrammaticInterface } from "../core/Grapher"
-import { GRAPHER_TAB_CONFIG_OPTIONS } from "../../types/index"
+import { DimensionProperty } from "../../utils/index.js"
+import { GrapherProgrammaticInterface } from "../core/Grapher.js"
+import { GRAPHER_TAB_CONFIG_OPTIONS } from "../../types/index.js"
 
 export const legacyMapGrapher: GrapherProgrammaticInterface = {
     hasMapTab: true,

package/src/grapher/mapCharts/MapChart.tsx

@@ -5,19 +5,19 @@ import {
     exposeInstanceOnWindow,
     Color,
     HorizontalAlign,
-} from "../../utils/index"
+} from "../../utils/index.js"
 import { observable, computed, action, makeObservable } from "mobx"
 import { observer } from "mobx-react"
 import {
     HorizontalCategoricalColorLegend,
     HorizontalColorLegendManager,
     HorizontalNumericColorLegend,
-} from "../legend/HorizontalColorLegends"
+} from "../legend/HorizontalColorLegends.js"
 import { select } from "d3-selection"
 import { easeCubic } from "d3-ease"
-import { MapTooltip } from "./MapTooltip"
-import { TooltipState } from "../tooltip/Tooltip"
-import { CoreColumn } from "../../core-table/index"
+import { MapTooltip } from "./MapTooltip.js"
+import { TooltipState } from "../tooltip/Tooltip.js"
+import { CoreColumn } from "../../core-table/index.js"
 import {
     GeoFeature,
     MapBracket,
@@ -31,16 +31,16 @@ import {
     MapColumnInfo,
     PROJECTED_DATA_LEGEND_COLOR,
     MapViewport,
-} from "./MapChartConstants"
-import { MapConfig } from "./MapConfig"
-import { ColorScale } from "../color/ColorScale"
+} from "./MapChartConstants.js"
+import { MapConfig } from "./MapConfig.js"
+import { ColorScale } from "../color/ColorScale.js"
 import {
     BASE_FONT_SIZE,
     DEFAULT_GRAPHER_BOUNDS,
     GRAPHER_MAX_TOOLTIP_WIDTH,
     Patterns,
-} from "../core/GrapherConstants"
-import { ChartInterface } from "../chart/ChartInterface"
+} from "../core/GrapherConstants.js"
+import { ChartInterface } from "../chart/ChartInterface.js"
 import {
     CategoricalBin,
     ColorScaleBin,
@@ -49,28 +49,28 @@ import {
     isNumericBin,
     isProjectedDataBin,
     NumericBin,
-} from "../color/ColorScaleBin"
+} from "../color/ColorScaleBin.js"
 import {
     LegendInteractionState,
     LegendStyleConfig,
-} from "../legend/LegendInteractionState"
+} from "../legend/LegendInteractionState.js"
 import {
     ColumnSlug,
     GrapherVariant,
     MapRegionName,
-} from "../../types/index"
-import { ClipPath, makeClipPath } from "../chart/ChartUtils"
-import { NoDataModal } from "../noDataModal/NoDataModal"
+} from "../../types/index.js"
+import { ClipPath, makeClipPath } from "../chart/ChartUtils.js"
+import { NoDataModal } from "../noDataModal/NoDataModal.js"
 import { Component, createRef } from "react"
-import { ChoroplethMap } from "./ChoroplethMap"
-import { ChoroplethGlobe } from "./ChoroplethGlobe"
-import { GlobeController } from "./GlobeController"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
+import { ChoroplethMap } from "./ChoroplethMap.js"
+import { ChoroplethGlobe } from "./ChoroplethGlobe.js"
+import { GlobeController } from "./GlobeController.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
 import { match } from "ts-pattern"
-import { makeProjectedDataPatternId } from "./MapComponents"
-import { MapChartState } from "./MapChartState"
-import { ChartComponentProps } from "../chart/ChartTypeMap"
-import { InteractionState } from "../interaction/InteractionState"
+import { makeProjectedDataPatternId } from "./MapComponents.js"
+import { MapChartState } from "./MapChartState.js"
+import { ChartComponentProps } from "../chart/ChartTypeMap.js"
+import { InteractionState } from "../interaction/InteractionState.js"
 
 export type MapChartProps = ChartComponentProps<MapChartState>
 

package/src/grapher/mapCharts/MapChartConstants.ts

@@ -1,5 +1,5 @@
-import { ColorScaleBin } from "../color/ColorScaleBin"
-import { Bounds, ColumnSlug } from "../../utils/index"
+import { ColorScaleBin } from "../color/ColorScaleBin.js"
+import { Bounds, ColumnSlug } from "../../utils/index.js"
 import {
     MapRegionName,
     SeriesName,
@@ -7,15 +7,15 @@ import {
     ProjectionColumnInfo,
     type GrapherInteractionEvent,
     Time,
-} from "../../types/index"
-import { ChartManager } from "../chart/ChartManager"
-import { MapConfig } from "./MapConfig"
-import { ChartSeries } from "../chart/ChartInterface"
-import { GlobeController } from "./GlobeController"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
-import { CoreColumn } from "../../core-table/index"
+} from "../../types/index.js"
+import { ChartManager } from "../chart/ChartManager.js"
+import { MapConfig } from "./MapConfig.js"
+import { ChartSeries } from "../chart/ChartInterface.js"
+import { GlobeController } from "./GlobeController.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
+import { CoreColumn } from "../../core-table/index.js"
 import * as R from "remeda"
-import { InteractionState } from "../interaction/InteractionState"
+import { InteractionState } from "../interaction/InteractionState.js"
 
 export declare type SVGMouseEvent = React.MouseEvent<SVGElement>
 

package/src/grapher/mapCharts/MapChartState.ts

@@ -1,18 +1,18 @@
 import * as R from "remeda"
 import { computed, makeObservable } from "mobx"
-import { ChartState } from "../chart/ChartInterface"
+import { ChartState } from "../chart/ChartInterface.js"
 import {
     ChoroplethSeries,
     ChoroplethSeriesByName,
     MAP_REGION_LABELS,
     MapChartManager,
     MapColumnInfo,
-} from "./MapChartConstants"
+} from "./MapChartConstants.js"
 import {
     CoreColumn,
     ErrorValueTypes,
     ChartsTable,
-} from "../../core-table/index"
+} from "../../core-table/index.js"
 import { match, P } from "ts-pattern"
 import {
     ChartErrorInfo,
@@ -24,24 +24,24 @@ import {
     PrimitiveType,
     TickFormattingOptions,
     Time,
-} from "../../types/index"
+} from "../../types/index.js"
 import {
     anyToString,
     checkHasMembers,
     isPresent,
     mappableCountries,
     regions,
-} from "../../utils/index"
-import { MapConfig } from "./MapConfig"
-import { combineHistoricalAndProjectionColumns } from "../chart/ChartUtils"
+} from "../../utils/index.js"
+import { MapConfig } from "./MapConfig.js"
+import { combineHistoricalAndProjectionColumns } from "../chart/ChartUtils.js"
 import {
     getCountriesByRegion,
     isOnTheCanadaMap,
     isOnTheMap,
-} from "./MapHelpers"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
-import { ColorScale, ColorScaleManager } from "../color/ColorScale"
-import { ColorScaleConfig } from "../color/ColorScaleConfig"
+} from "./MapHelpers.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
+import { ColorScale, ColorScaleManager } from "../color/ColorScale.js"
+import { ColorScaleConfig } from "../color/ColorScaleConfig.js"
 
 export type MapFormatValueForTooltip = (
     d: PrimitiveType,

package/src/grapher/mapCharts/MapChartThumbnail.tsx

@@ -1,9 +1,9 @@
 import React from "react"
 import { computed, makeObservable } from "mobx"
 import { observer } from "mobx-react"
-import { ChartInterface } from "../chart/ChartInterface"
-import { MapChartState } from "./MapChartState"
-import { MapChart, MapChartProps } from "./MapChart"
+import { ChartInterface } from "../chart/ChartInterface.js"
+import { MapChartState } from "./MapChartState.js"
+import { MapChart, MapChartProps } from "./MapChart.js"
 
 @observer
 export class MapChartThumbnail

package/src/grapher/mapCharts/MapComponents.tsx

@@ -1,5 +1,5 @@
 import React from "react"
-import { makeIdForHumanConsumption } from "../../utils/index"
+import { makeIdForHumanConsumption } from "../../utils/index.js"
 import {
     BLUR_FILL_OPACITY,
     BLUR_STROKE_OPACITY,
@@ -14,13 +14,13 @@ import {
     RenderFeature,
     InternalAnnotation,
     ExternalAnnotation,
-} from "./MapChartConstants"
-import { isMapRenderFeature } from "./MapHelpers"
-import { getExternalMarkerEndPosition } from "./MapAnnotations"
-import { Patterns } from "../core/GrapherConstants"
-import { calculateLightnessScore, isDarkColor } from "../color/ColorUtils"
-import { Halo } from "../../components/index"
-import { InteractionState } from "../interaction/InteractionState"
+} from "./MapChartConstants.js"
+import { isMapRenderFeature } from "./MapHelpers.js"
+import { getExternalMarkerEndPosition } from "./MapAnnotations.js"
+import { Patterns } from "../core/GrapherConstants.js"
+import { calculateLightnessScore, isDarkColor } from "../color/ColorUtils.js"
+import { Halo } from "../../components/index.js"
+import { InteractionState } from "../interaction/InteractionState.js"
 
 export function BackgroundCountry<Feature extends RenderFeature>({
     feature,

package/src/grapher/mapCharts/MapConfig.ts

@@ -5,8 +5,8 @@ import {
     MapConfigInterface,
     TimeBound,
     EntityName,
-} from "../../types/index"
-import { ColorScaleConfig } from "../color/ColorScaleConfig"
+} from "../../types/index.js"
+import { ColorScaleConfig } from "../color/ColorScaleConfig.js"
 import {
     ColumnSlug,
     Persistable,
@@ -20,9 +20,9 @@ import {
     NoUndefinedValues,
     ToleranceStrategy,
     minTimeBoundFromJSONOrNegativeInfinity,
-} from "../../utils/index"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
-import { DEFAULT_GLOBE_ROTATION, DEFAULT_GLOBE_ZOOM } from "./MapChartConstants"
+} from "../../utils/index.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
+import { DEFAULT_GLOBE_ROTATION, DEFAULT_GLOBE_ZOOM } from "./MapChartConstants.js"
 import * as R from "remeda"
 
 // MapConfig holds the data and underlying logic needed by MapTab.

package/src/grapher/mapCharts/MapHelpers.ts

@@ -7,18 +7,18 @@ import {
     getCountryNamesForRegion,
     getRelativeMouse,
     lazy,
-} from "../../utils/index"
-import { GlobeRegionName, MapRegionName } from "../../types/index"
+} from "../../utils/index.js"
+import { GlobeRegionName, MapRegionName } from "../../types/index.js"
 import {
     GEO_FEATURES_CLASSNAME,
     MAP_HOVER_TARGET_RANGE,
     RenderFeature,
     MapRenderFeature,
     RenderFeatureType,
-} from "./MapChartConstants"
-import { CanadaTopology } from "./CanadaTopology"
-import { MapTopology } from "./MapTopology"
-import { MapSelectionArray } from "../selection/MapSelectionArray"
+} from "./MapChartConstants.js"
+import { CanadaTopology } from "./CanadaTopology.js"
+import { MapTopology } from "./MapTopology.js"
+import { MapSelectionArray } from "../selection/MapSelectionArray.js"
 import * as R from "remeda"
 
 export function detectNearbyFeature<Feature extends RenderFeature>({

package/src/grapher/mapCharts/MapProjections.ts

@@ -4,8 +4,8 @@ import {
     geoAzimuthalEqualArea,
     GeoProjection,
 } from "d3-geo"
-import { geoRobinson, geoPatterson } from "./d3-geo-projection"
-import { MapRegionName } from "../../types/index"
+import { geoRobinson, geoPatterson } from "./d3-geo-projection.js"
+import { MapRegionName } from "../../types/index.js"
 
 export const MAP_PROJECTIONS: Record<MapRegionName, GeoProjection> = {
     World: geoRobinson(),

package/src/grapher/mapCharts/MapSparkline.tsx

@@ -8,16 +8,16 @@ import {
     EntityName,
     VariableRoundingMode,
     Time,
-} from "../../types/index"
-import { ChartsTable } from "../../core-table/index"
-import { LineChart } from "../lineCharts/LineChart"
-import { LineChartState } from "../lineCharts/LineChartState"
-import { Bounds, checkIsVeryShortUnit } from "../../utils/index"
-import { LineChartManager } from "../lineCharts/LineChartConstants"
-import { ColorScale } from "../color/ColorScale"
+} from "../../types/index.js"
+import { ChartsTable } from "../../core-table/index.js"
+import { LineChart } from "../lineCharts/LineChart.js"
+import { LineChartState } from "../lineCharts/LineChartState.js"
+import { Bounds, checkIsVeryShortUnit } from "../../utils/index.js"
+import { LineChartManager } from "../lineCharts/LineChartConstants.js"
+import { ColorScale } from "../color/ColorScale.js"
 import * as R from "remeda"
-import { MapColumnInfo } from "./MapChartConstants"
-import type { MapFormatValueForTooltip } from "./MapChartState"
+import { MapColumnInfo } from "./MapChartConstants.js"
+import type { MapFormatValueForTooltip } from "./MapChartState.js"
 
 const DEFAULT_SPARKLINE_WIDTH = 250
 const DEFAULT_SPARKLINE_HEIGHT = 87