@fundar/data-chart-telling 0.0.14 → 0.0.16

package/dist/configuration/themes/index.d.ts

@@ -48,6 +48,7 @@ export declare const THEMES: {
             titleWeight?: string | number | undefined;
             gap?: string | undefined;
             swatchSize?: string | undefined;
+            disabledOpacity?: number | undefined;
         } | undefined;
         axis?: {
             color?: string | undefined;
@@ -69,10 +70,10 @@ export declare const THEMES: {
             border?: string | undefined;
         } | undefined;
         margins?: {
-            top?: number | undefined;
-            right?: number | undefined;
-            bottom?: number | undefined;
-            left?: number | undefined;
+            top?: number | "auto" | undefined;
+            right?: number | "auto" | undefined;
+            bottom?: number | "auto" | undefined;
+            left?: number | "auto" | undefined;
         } | undefined;
         palette?: string[] | undefined;
         continuous?: {
@@ -95,8 +96,8 @@ export declare const THEMES: {
                 strokeWidth?: number | undefined;
                 strokeOpacity?: number | undefined;
                 strokeDasharray?: (string | import("../..").LineStyle) | undefined;
-                strokeLinecap?: import("../../types/plots/styles").LineCap | undefined;
-                strokeLinejoin?: import("../../types/plots/styles").LineJoin | undefined;
+                strokeLinecap?: import("../..").LineCap | undefined;
+                strokeLinejoin?: import("../..").LineJoin | undefined;
             } | undefined;
             dot?: {
                 dotRadius?: number | undefined;
@@ -111,15 +112,19 @@ export declare const THEMES: {
             font?: {
                 fill?: string | undefined;
                 fontSize?: number | undefined;
-                fontWeight?: "normal" | "bold" | undefined;
-                fontStyle?: "normal" | "italic" | undefined;
-                textAnchor?: "start" | "middle" | "end" | undefined;
-                lineAnchor?: "top" | "middle" | "bottom" | undefined;
+                fontWeight?: import("../..").FontWeight | undefined;
+                fontStyle?: import("../..").FontStyleKeyword | undefined;
+                textAnchor?: import("../..").TextAnchor | undefined;
+                lineAnchor?: import("../..").LineAnchor | undefined;
+                lineHeight?: number | undefined;
+                rotate?: number | undefined;
                 stroke?: string | undefined;
                 strokeWidth?: number | undefined;
                 paintOrder?: string | undefined;
                 dx?: number | undefined;
                 dy?: number | undefined;
+                class?: string | undefined;
+                textClass?: string | undefined;
             } | undefined;
         } | undefined;
     };
@@ -166,6 +171,7 @@ export declare const THEMES: {
             titleWeight?: string | number | undefined;
             gap?: string | undefined;
             swatchSize?: string | undefined;
+            disabledOpacity?: number | undefined;
         } | undefined;
         axis?: {
             color?: string | undefined;
@@ -187,10 +193,10 @@ export declare const THEMES: {
             border?: string | undefined;
         } | undefined;
         margins?: {
-            top?: number | undefined;
-            right?: number | undefined;
-            bottom?: number | undefined;
-            left?: number | undefined;
+            top?: number | "auto" | undefined;
+            right?: number | "auto" | undefined;
+            bottom?: number | "auto" | undefined;
+            left?: number | "auto" | undefined;
         } | undefined;
         palette?: string[] | undefined;
         continuous?: {
@@ -213,8 +219,8 @@ export declare const THEMES: {
                 strokeWidth?: number | undefined;
                 strokeOpacity?: number | undefined;
                 strokeDasharray?: (string | import("../..").LineStyle) | undefined;
-                strokeLinecap?: import("../../types/plots/styles").LineCap | undefined;
-                strokeLinejoin?: import("../../types/plots/styles").LineJoin | undefined;
+                strokeLinecap?: import("../..").LineCap | undefined;
+                strokeLinejoin?: import("../..").LineJoin | undefined;
             } | undefined;
             dot?: {
                 dotRadius?: number | undefined;
@@ -229,15 +235,19 @@ export declare const THEMES: {
             font?: {
                 fill?: string | undefined;
                 fontSize?: number | undefined;
-                fontWeight?: "normal" | "bold" | undefined;
-                fontStyle?: "normal" | "italic" | undefined;
-                textAnchor?: "start" | "middle" | "end" | undefined;
-                lineAnchor?: "top" | "middle" | "bottom" | undefined;
+                fontWeight?: import("../..").FontWeight | undefined;
+                fontStyle?: import("../..").FontStyleKeyword | undefined;
+                textAnchor?: import("../..").TextAnchor | undefined;
+                lineAnchor?: import("../..").LineAnchor | undefined;
+                lineHeight?: number | undefined;
+                rotate?: number | undefined;
                 stroke?: string | undefined;
                 strokeWidth?: number | undefined;
                 paintOrder?: string | undefined;
                 dx?: number | undefined;
                 dy?: number | undefined;
+                class?: string | undefined;
+                textClass?: string | undefined;
             } | undefined;
         } | undefined;
     };
@@ -284,6 +294,7 @@ export declare const THEMES: {
             titleWeight?: string | number | undefined;
             gap?: string | undefined;
             swatchSize?: string | undefined;
+            disabledOpacity?: number | undefined;
         } | undefined;
         axis?: {
             color?: string | undefined;
@@ -305,10 +316,10 @@ export declare const THEMES: {
             border?: string | undefined;
         } | undefined;
         margins?: {
-            top?: number | undefined;
-            right?: number | undefined;
-            bottom?: number | undefined;
-            left?: number | undefined;
+            top?: number | "auto" | undefined;
+            right?: number | "auto" | undefined;
+            bottom?: number | "auto" | undefined;
+            left?: number | "auto" | undefined;
         } | undefined;
         palette?: string[] | undefined;
         continuous?: {
@@ -331,8 +342,8 @@ export declare const THEMES: {
                 strokeWidth?: number | undefined;
                 strokeOpacity?: number | undefined;
                 strokeDasharray?: (string | import("../..").LineStyle) | undefined;
-                strokeLinecap?: import("../../types/plots/styles").LineCap | undefined;
-                strokeLinejoin?: import("../../types/plots/styles").LineJoin | undefined;
+                strokeLinecap?: import("../..").LineCap | undefined;
+                strokeLinejoin?: import("../..").LineJoin | undefined;
             } | undefined;
             dot?: {
                 dotRadius?: number | undefined;
@@ -347,15 +358,19 @@ export declare const THEMES: {
             font?: {
                 fill?: string | undefined;
                 fontSize?: number | undefined;
-                fontWeight?: "normal" | "bold" | undefined;
-                fontStyle?: "normal" | "italic" | undefined;
-                textAnchor?: "start" | "middle" | "end" | undefined;
-                lineAnchor?: "top" | "middle" | "bottom" | undefined;
+                fontWeight?: import("../..").FontWeight | undefined;
+                fontStyle?: import("../..").FontStyleKeyword | undefined;
+                textAnchor?: import("../..").TextAnchor | undefined;
+                lineAnchor?: import("../..").LineAnchor | undefined;
+                lineHeight?: number | undefined;
+                rotate?: number | undefined;
                 stroke?: string | undefined;
                 strokeWidth?: number | undefined;
                 paintOrder?: string | undefined;
                 dx?: number | undefined;
                 dy?: number | undefined;
+                class?: string | undefined;
+                textClass?: string | undefined;
             } | undefined;
         } | undefined;
     };
@@ -402,6 +417,7 @@ export declare const THEMES: {
             titleWeight?: string | number | undefined;
             gap?: string | undefined;
             swatchSize?: string | undefined;
+            disabledOpacity?: number | undefined;
         } | undefined;
         axis?: {
             color?: string | undefined;
@@ -423,10 +439,10 @@ export declare const THEMES: {
             border?: string | undefined;
         } | undefined;
         margins?: {
-            top?: number | undefined;
-            right?: number | undefined;
-            bottom?: number | undefined;
-            left?: number | undefined;
+            top?: number | "auto" | undefined;
+            right?: number | "auto" | undefined;
+            bottom?: number | "auto" | undefined;
+            left?: number | "auto" | undefined;
         } | undefined;
         palette?: string[] | undefined;
         continuous?: {
@@ -449,8 +465,8 @@ export declare const THEMES: {
                 strokeWidth?: number | undefined;
                 strokeOpacity?: number | undefined;
                 strokeDasharray?: (string | import("../..").LineStyle) | undefined;
-                strokeLinecap?: import("../../types/plots/styles").LineCap | undefined;
-                strokeLinejoin?: import("../../types/plots/styles").LineJoin | undefined;
+                strokeLinecap?: import("../..").LineCap | undefined;
+                strokeLinejoin?: import("../..").LineJoin | undefined;
             } | undefined;
             dot?: {
                 dotRadius?: number | undefined;
@@ -465,15 +481,19 @@ export declare const THEMES: {
             font?: {
                 fill?: string | undefined;
                 fontSize?: number | undefined;
-                fontWeight?: "normal" | "bold" | undefined;
-                fontStyle?: "normal" | "italic" | undefined;
-                textAnchor?: "start" | "middle" | "end" | undefined;
-                lineAnchor?: "top" | "middle" | "bottom" | undefined;
+                fontWeight?: import("../..").FontWeight | undefined;
+                fontStyle?: import("../..").FontStyleKeyword | undefined;
+                textAnchor?: import("../..").TextAnchor | undefined;
+                lineAnchor?: import("../..").LineAnchor | undefined;
+                lineHeight?: number | undefined;
+                rotate?: number | undefined;
                 stroke?: string | undefined;
                 strokeWidth?: number | undefined;
                 paintOrder?: string | undefined;
                 dx?: number | undefined;
                 dy?: number | undefined;
+                class?: string | undefined;
+                textClass?: string | undefined;
             } | undefined;
         } | undefined;
     };

package/dist/index.d.ts

@@ -2,35 +2,49 @@ export { default as BarPlot } from './plots/bar/Plot.svelte';
 export { default as HeatmapPlot } from './plots/heatmap/Plot.svelte';
 export { default as LinePlot } from './plots/line/Plot.svelte';
 export { default as PyramidPlot } from './plots/pyramid/Plot.svelte';
-export { default as Chart } from './charts/Chart.svelte';
+export { default as GeoPlot } from './plots/geo/Plot.svelte';
+export { default as BaseChart } from './charts/BaseChart.svelte';
 export { default as BarChart } from './charts/bar/Chart.svelte';
 export { default as HeatmapChart } from './charts/heatmap/Chart.svelte';
 export { default as LineChart } from './charts/line/Chart.svelte';
 export { default as PyramidChart } from './charts/pyramid/Chart.svelte';
 export { default as ChartContainer } from './charts/container/ChartContainer.svelte';
-export { default as PlotLayout } from './layout/plot/PlotLayout.svelte';
+export { default as BasePlotLayout } from './layout/plot/BasePlotLayout.svelte';
+export { default as GeoLayout } from './layout/geo/GeoLayout.svelte';
+export { default as TileLayer } from './plots/geo/TileLayer.svelte';
+export { argentinaBicontinental } from './plots/geo/projections/argentina';
 export { default as Timeline } from './layout/timeline/Timeline.svelte';
 export { default as TimelineLayout } from './layout/timeline/TimelineLayout.svelte';
 export { default as FacetLayout } from './layout/facet/FacetLayout.svelte';
 export { default as LegendLayout } from './layout/legend/LegendLayout.svelte';
 export { default as Tooltip } from './layout/tooltip/Tooltip.svelte';
-export { default as DeltaMarker } from './plots/markers/DeltaMarker.svelte';
-export { default as DotMarker } from './plots/markers/DotMarker.svelte';
-export { default as HoverMarker } from './plots/markers/HoverMarker.svelte';
-export { default as PeakMarker } from './plots/markers/PeakMarker.svelte';
-export { default as TextMarker } from './plots/markers/TextMarker.svelte';
+export { default as DeltaMarker } from './markers/DeltaMarker.svelte';
+export { default as DotMarker } from './markers/DotMarker.svelte';
+export { default as HoverMarker } from './markers/HoverMarker.svelte';
+export { default as PeakMarker } from './markers/PeakMarker.svelte';
+export { default as TextMarker } from './markers/TextMarker.svelte';
 export { setConfiguration, getConfiguration, resetConfiguration, configToCssVars, cssVarsStyle, DEFAULT_CONFIG, } from './configuration/config.svelte';
 export { THEMES } from './configuration/themes';
 export type { ThemeName } from './configuration/themes';
 export { groupBy, buildSeries } from './utils/grouping';
 export { makeColorScale, normalize, resolveCssColor, paletteColor } from './utils/color';
-export type { AxisValue, Accessor, AxisScale, ScalesConfig, Series, SeriesProps, DataProps } from './types/plots/common';
+export type { AxisValue, AxisScale } from './types/plots/axis';
+export type { Accessor, Series, SeriesProps, DataProps } from './types/plots/data/common';
+export type { BasePlotProps, StylesConfig, MarkersConfig, SegmentsConfig, AxisBasedScalesConfig, GeoScalesConfig, ScalesConfig, MarginConfig, TooltipConfig, } from './types/plots/props';
 export type { DeltaConfig, } from './types/plots/delta';
-export type { SymbolType, LineStyle, StrokeStyle, DotStyle, FontStyle, LineSegmentStyle, BarSegmentStyle, CellSegmentStyle, Range, Area, Segment, SeriesAwareSegmentsMap, DefaultSegmentsMap, SegmentsStyle, Segments, ValueAnchor, ValuesStyle, ColorsStyle, PlotStyles, } from './types/plots/styles';
-export type { Marker, MarkerProps } from './types/plots/markers';
-export type { PlotProps } from './types/plots/props';
+export type { ValuesStyle, ColorsStyle, BasePlotStyles, } from './types/plots/styles/common';
+export type { LineSegmentStyle, BarSegmentStyle, CellSegmentStyle, GeoSegmentStyle } from './types/plots/segments/common';
+export type { Range, Area, Segment } from './types/plots/segments/config';
+export type { ValueAnchor, SymbolType, LineStyle, LineCap, LineJoin, FontWeight, FontStyleKeyword, TextAnchor, LineAnchor, } from './types/plots/constants';
+export type { FontStyle, StrokeStyle, DotStyle } from './types/plots/styling';
+export type { Marker } from './types/markers/common';
+export type { MarkerProps } from './types/markers/props';
+export type { GeoFeature, GeoJsonInput, GeoDataProps, Topology } from './types/plots/data/geo';
+export type { GeoProjectionName, GeoProjectionConfig, GeoCustomProjection, GeoCustomProjectionFactory, } from './types/plots/scales/geo';
+export type { GeoStyles, GeoTileLayerConfig, GeoZoomConfig } from './types/plots/styles/geo';
+export type { GeoMarker, GeoInsetMarker, GeoInsetLocation, GeoInsetProjectionName, GeoInsetProjectionConfig, } from './types/markers/geo';
 export type { TimeValue, Orientation, FacetColumns, FacetConfig, TimelineConfig, ChartPlotContext, ChartPlotSnippet, } from './types/charts/common';
-export type { LegendSection, DiscreteLegendSection, ContinuousLegendSection, LegendItem, } from './types/charts/legend';
-export type { HoverStrategy, TooltipOptions, TooltipProp, TooltipRuntime, } from './types/layout/tooltip';
+export type { LegendSection, DiscreteLegendSection, ContinuousLegendSection, LegendItem, LegendDisabledStyle, } from './types/charts/legend';
+export type { HoverStrategy, TooltipOptions, TooltipProp, } from './types/layout/tooltip';
 export type { ChartConfig, ChartConfigInput, TextStyle } from './types/configuration/styling';
 export type { ChartProps } from './types/charts/props';

package/dist/index.js

@@ -4,27 +4,32 @@ export { default as BarPlot } from './plots/bar/Plot.svelte';
 export { default as HeatmapPlot } from './plots/heatmap/Plot.svelte';
 export { default as LinePlot } from './plots/line/Plot.svelte';
 export { default as PyramidPlot } from './plots/pyramid/Plot.svelte';
+export { default as GeoPlot } from './plots/geo/Plot.svelte';
 // ── Charts ──────────────────────────────────────────────────────────────────
 // High-level, plot-agnostic chrome plus ready-made chart kinds.
-export { default as Chart } from './charts/Chart.svelte';
+export { default as BaseChart } from './charts/BaseChart.svelte';
 export { default as BarChart } from './charts/bar/Chart.svelte';
 export { default as HeatmapChart } from './charts/heatmap/Chart.svelte';
 export { default as LineChart } from './charts/line/Chart.svelte';
 export { default as PyramidChart } from './charts/pyramid/Chart.svelte';
 // Interchangeable layout primitives (compose your own chart kinds with these).
 export { default as ChartContainer } from './charts/container/ChartContainer.svelte';
-export { default as PlotLayout } from './layout/plot/PlotLayout.svelte';
+export { default as BasePlotLayout } from './layout/plot/BasePlotLayout.svelte';
+export { default as GeoLayout } from './layout/geo/GeoLayout.svelte';
+export { default as TileLayer } from './plots/geo/TileLayer.svelte';
+// Custom geo projections — usable as `scales.projection.type`.
+export { argentinaBicontinental } from './plots/geo/projections/argentina';
 export { default as Timeline } from './layout/timeline/Timeline.svelte';
 export { default as TimelineLayout } from './layout/timeline/TimelineLayout.svelte';
 export { default as FacetLayout } from './layout/facet/FacetLayout.svelte';
 export { default as LegendLayout } from './layout/legend/LegendLayout.svelte';
 export { default as Tooltip } from './layout/tooltip/Tooltip.svelte';
 // Markers
-export { default as DeltaMarker } from './plots/markers/DeltaMarker.svelte';
-export { default as DotMarker } from './plots/markers/DotMarker.svelte';
-export { default as HoverMarker } from './plots/markers/HoverMarker.svelte';
-export { default as PeakMarker } from './plots/markers/PeakMarker.svelte';
-export { default as TextMarker } from './plots/markers/TextMarker.svelte';
+export { default as DeltaMarker } from './markers/DeltaMarker.svelte';
+export { default as DotMarker } from './markers/DotMarker.svelte';
+export { default as HoverMarker } from './markers/HoverMarker.svelte';
+export { default as PeakMarker } from './markers/PeakMarker.svelte';
+export { default as TextMarker } from './markers/TextMarker.svelte';
 export { setConfiguration, getConfiguration, resetConfiguration, configToCssVars, cssVarsStyle, DEFAULT_CONFIG, } from './configuration/config.svelte';
 export { THEMES } from './configuration/themes';
 // ── Utils ─────────────────────────────────────────────────────────────────────

package/dist/layout/facet/FacetLayout.svelte

@@ -5,7 +5,7 @@
     FacetColumns,
     FacetCellSnippet,
   } from '../../types/charts/common';
-  import type { Accessor } from '../../types/plots/common';
+  import type { Accessor } from '../../types/plots/data/common';
 
   /**
    * Small-multiples layout. It splits the data by `by`, arranges the groups in a

package/dist/layout/facet/FacetLayout.svelte.d.ts

@@ -1,5 +1,5 @@
 import type { FacetColumns, FacetCellSnippet } from '../../types/charts/common';
-import type { Accessor } from '../../types/plots/common';
+import type { Accessor } from '../../types/plots/data/common';
 declare function $$render<TRow extends Record<string, unknown>>(): {
     props: {
         data: TRow[];

package/dist/layout/geo/GeoLayout.svelte

@@ -0,0 +1,47 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import TileLayer from '../../plots/geo/TileLayer.svelte';
+  import type { GeoTileLayerConfig } from '../../types/plots/styles/geo';
+
+  /**
+   * Geo-only chrome nested inside `BasePlotLayout` (the `GeoPlot` analog of
+   * `AxisLayout`/`GridLayout`/`RuleLayout`) — just the pan/zoom transform
+   * group and the raster tile layer underneath the map's own marks.
+   * Everything else GeoPlot used to duplicate from `BasePlotLayout` (the hover
+   * state machine, `<Plot>` itself, `<Pointer>`, the tooltip) now lives
+   * exclusively in `BasePlotLayout`; the zoom/rotate *gesture* state itself lives
+   * in `GeoPlot`'s own `Plot.svelte` (it also feeds the projection's
+   * `rotate`, which has to reach `BasePlotLayout`'s `<Plot projection>` prop —
+   * something a component nested *inside* that same `<Plot>` has no way to
+   * reach back out to), and is only handed down here as an already-resolved
+   * `zoomTransform` to apply.
+   */
+  let {
+    width,
+    height,
+    numericMargins,
+    zoomTransform,
+    tileLayer,
+    children,
+  }: {
+    width: number;
+    height: number;
+    numericMargins: { top: number; right: number; bottom: number; left: number };
+    zoomTransform: { x: number; y: number; k: number };
+    tileLayer?: GeoTileLayerConfig;
+    children: Snippet;
+  } = $props();
+</script>
+
+<g transform="translate({zoomTransform.x}, {zoomTransform.y}) scale({zoomTransform.k})">
+  {#if tileLayer}
+    <TileLayer
+      config={tileLayer}
+      left={numericMargins.left}
+      top={numericMargins.top}
+      width={Math.max(0, width - numericMargins.left - numericMargins.right)}
+      height={Math.max(0, height - numericMargins.top - numericMargins.bottom)}
+    />
+  {/if}
+  {@render children()}
+</g>

package/dist/layout/geo/GeoLayout.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { Snippet } from 'svelte';
+import type { GeoTileLayerConfig } from '../../types/plots/styles/geo';
+type $$ComponentProps = {
+    width: number;
+    height: number;
+    numericMargins: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+    zoomTransform: {
+        x: number;
+        y: number;
+        k: number;
+    };
+    tileLayer?: GeoTileLayerConfig;
+    children: Snippet;
+};
+declare const GeoLayout: import("svelte").Component<$$ComponentProps, {}, "">;
+type GeoLayout = ReturnType<typeof GeoLayout>;
+export default GeoLayout;

package/dist/layout/geo/resolveProjection.d.ts

@@ -0,0 +1,10 @@
+import type { GeoProjectionConfig } from '../../types/plots/scales/geo';
+/**
+ * Resolves a `GeoScalesConfig['projection']` into what svelteplot's own
+ * `<Plot projection>` expects — kept separate from `GeoPlot`'s own
+ * `Plot.svelte` so adding more projection-level behavior (like the
+ * `domain: 'data'` sentinel below) doesn't grow that component itself.
+ */
+export declare function resolveProjection<TFeature extends Record<string, unknown> & {
+    geometry?: unknown;
+}>(projection: GeoProjectionConfig | undefined, data: TFeature[]): GeoProjectionConfig;

package/dist/layout/geo/resolveProjection.js

@@ -0,0 +1,48 @@
+/**
+ * `data` (see `resolveProjection`) is one row per disjoint geometry *part*
+ * (see `Plot.svelte`'s `hoverCandidates` — needed so hover-matching finds
+ * every part of a multi-part feature, not just whichever one its combined
+ * centroid happens to land near), not one row per feature. Several rows
+ * therefore share the exact same `geometry` object by reference — spread
+ * from the same tagged feature, only `__cx`/`__cy` differ. Deduping by that
+ * reference before handing rows to d3-geo's bounds/fit computation matters:
+ * a feature with many parts (e.g. a province whose `MultiPolygon` has
+ * hundreds of small islands) would otherwise have its *entire* geometry
+ * re-traversed once per part it contributed, an accidental O(parts²) cost
+ * that got severe enough to be visible (multi-second) on real IGN data.
+ */
+function dedupeByGeometry(data) {
+    const seen = new Set();
+    const result = [];
+    for (const row of data) {
+        if (seen.has(row.geometry))
+            continue;
+        seen.add(row.geometry);
+        result.push(row);
+    }
+    return result;
+}
+/**
+ * Resolves a `GeoScalesConfig['projection']` into what svelteplot's own
+ * `<Plot projection>` expects — kept separate from `GeoPlot`'s own
+ * `Plot.svelte` so adding more projection-level behavior (like the
+ * `domain: 'data'` sentinel below) doesn't grow that component itself.
+ */
+export function resolveProjection(projection, data) {
+    if (!projection)
+        return 'equal-earth';
+    if (typeof projection === 'string')
+        return projection;
+    const domain = projection.domain === 'data'
+        ? { type: 'FeatureCollection', features: dedupeByGeometry(data) }
+        : projection.domain;
+    return {
+        type: projection.type,
+        rotate: projection.rotate,
+        center: projection.center,
+        parallels: projection.parallels,
+        inset: projection.inset,
+        clip: projection.clip,
+        domain,
+    };
+}