@fundar/data-chart-telling 0.0.14 → 0.0.15

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 { 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,
+    };
+}

package/dist/layout/legend/DiscreteSection.svelte

@@ -2,7 +2,7 @@
   import { getConfiguration } from '../../configuration/config.svelte';
   import { paletteColor } from '../../utils/color';
   import type { DiscreteLegendSection } from '../../types/charts/legend';
-  import type { LineStyle } from '../../types/plots/styles';
+  import type { LineStyle } from '../../types/plots/constants';
 
   let { section }: { section: DiscreteLegendSection } = $props();
 

package/dist/layout/plot/AxisLayout.svelte

@@ -0,0 +1,95 @@
+<script lang="ts" generics="TData extends Record<string, unknown>">
+  import { AxisX, AxisY } from 'svelteplot';
+  import { getConfiguration } from '../../configuration/config.svelte';
+  import type { AxisValue } from '../../types/plots/axis';
+  import type { AxisBasedScalesConfig } from '../../types/plots/props';
+
+  /**
+   * Axis ticks/titles for the plot kinds that have an x/y axis pair
+   * (line/bar/heatmap/pyramid) — reads the scale/tick config off `scales`,
+   * against the plot's own resolved margins. Not used by `GeoPlot`, whose
+   * position comes from a `d3-geo` projection instead (see `GeoLayout`).
+   * `AxisX`/`AxisY` themselves inherit their actual scale from svelteplot's
+   * `<Plot>` context — this only supplies their cosmetic/tick-count props.
+   */
+  let {
+    data,
+    getX,
+    getY,
+    width,
+    height,
+    numericMargins,
+    scales,
+  }: {
+    data: TData[];
+    getX: (d: TData) => AxisValue;
+    getY: (d: TData) => AxisValue;
+    width: number;
+    height: number;
+    numericMargins: { top: number; right: number; bottom: number; left: number };
+    scales?: AxisBasedScalesConfig<TData>;
+  } = $props();
+
+  const cfg = $derived(getConfiguration());
+
+  const xValues = $derived(data.map(getX));
+  const yValues = $derived(data.map(getY));
+
+  /**
+   * Caps the requested tick count to the axis's own number of distinct
+   * values, but never above what the pixel width would naturally request —
+   * so a narrow domain (e.g. 5 whole years) never gets subdivided into
+   * fractional ticks (2020, 2020.5, 2021, …) just to fill the space. Skipped
+   * whenever the caller already controls tick density directly.
+   */
+  function autoTickCount(scale: AxisBasedScalesConfig<TData>['x'], values: AxisValue[], span: number, spacing: number, min: number): number | undefined {
+    if (scale?.ticks != null || scale?.tickSpacing != null || scale?.interval != null) return undefined;
+    const uniqueCount = new Set(values.map(String)).size;
+    const natural = Math.max(min, Math.round(span / spacing));
+    return uniqueCount >= 2 && uniqueCount < natural ? uniqueCount : undefined;
+  }
+
+  const xTickCount = $derived(
+    autoTickCount(scales?.x, xValues, Math.max(0, width - numericMargins.left - numericMargins.right), 80, 3),
+  );
+  const yTickCount = $derived(
+    autoTickCount(scales?.y, yValues, Math.max(0, height - numericMargins.top - numericMargins.bottom), 50, 2),
+  );
+
+  /** Vertical Y-axis title placement, when `scales.y.labelOrientation === 'vertical'`. */
+  const verticalYLabel = $derived.by(() => {
+    if (!scales?.y?.label || scales.y.labelOrientation !== 'vertical') return null;
+    const position = scales.y.labelPosition ?? 'middle';
+    const x = 14;
+    const top = numericMargins.top;
+    const bottom = height - numericMargins.bottom;
+    const y = position === 'top' ? top : (top + bottom) / 2;
+    return { text: scales.y.label, x, y, anchor: position === 'top' ? ('end' as const) : ('middle' as const) };
+  });
+</script>
+
+<AxisX
+  tickCount={xTickCount}
+  tickSize={scales?.x?.tickSize ?? cfg.axis.xTickSize}
+  tickPadding={scales?.x?.tickPadding ?? cfg.axis.xTickPadding}
+  tickFontSize={cfg.axis.fontSize}
+  titleFontSize={scales?.x?.titleFontSize ?? cfg.axis.titleFontSize}
+/>
+<AxisY
+  tickCount={yTickCount}
+  tickSize={scales?.y?.tickSize ?? cfg.axis.yTickSize}
+  tickPadding={scales?.y?.tickPadding ?? cfg.axis.yTickPadding}
+  tickFontSize={cfg.axis.fontSize}
+  titleFontSize={scales?.y?.titleFontSize ?? cfg.axis.titleFontSize}
+/>
+{#if verticalYLabel}
+  <text
+    x={verticalYLabel.x}
+    y={verticalYLabel.y}
+    transform="rotate(-90, {verticalYLabel.x}, {verticalYLabel.y})"
+    text-anchor={verticalYLabel.anchor}
+    font-size={scales?.y?.titleFontSize ?? cfg.axis.titleFontSize}
+    fill={cfg.axis.color}
+    opacity="0.8"
+  >{verticalYLabel.text}</text>
+{/if}

package/dist/layout/plot/AxisLayout.svelte.d.ts

@@ -0,0 +1,39 @@
+import type { AxisValue } from '../../types/plots/axis';
+import type { AxisBasedScalesConfig } from '../../types/plots/props';
+declare function $$render<TData extends Record<string, unknown>>(): {
+    props: {
+        data: TData[];
+        getX: (d: TData) => AxisValue;
+        getY: (d: TData) => AxisValue;
+        width: number;
+        height: number;
+        numericMargins: {
+            top: number;
+            right: number;
+            bottom: number;
+            left: number;
+        };
+        scales?: AxisBasedScalesConfig<TData>;
+    };
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<TData extends Record<string, unknown>> {
+    props(): ReturnType<typeof $$render<TData>>['props'];
+    events(): ReturnType<typeof $$render<TData>>['events'];
+    slots(): ReturnType<typeof $$render<TData>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TData extends Record<string, unknown>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TData>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TData>['props']>, ReturnType<__sveltets_Render<TData>['events']>, ReturnType<__sveltets_Render<TData>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TData>['bindings']>;
+    } & ReturnType<__sveltets_Render<TData>['exports']>;
+    <TData extends Record<string, unknown>>(internal: unknown, props: ReturnType<__sveltets_Render<TData>['props']> & {}): ReturnType<__sveltets_Render<TData>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const AxisLayout: $$IsomorphicComponent;
+type AxisLayout<TData extends Record<string, unknown>> = InstanceType<typeof AxisLayout<TData>>;
+export default AxisLayout;