svelteplot 0.2.6-next.1 → 0.2.6-next.3

package/dist/core/Facet.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
     import { setContext, type Snippet } from 'svelte';
     import { resolveChannel } from '../helpers/resolve.js';
-    import type { BaseMarkProps, DataRecord, PlotScale, RawValue } from '../types.js';
-    import { identity } from '../helpers';
+    import type { BaseMarkProps, DataRecord, RawValue } from '../types.js';
 
     let {
         fx,

package/dist/core/FacetGrid.svelte

@@ -4,7 +4,7 @@
     marks for each facet domain value 
 -->
 <script lang="ts">
-    import { getContext, setContext, type Snippet } from 'svelte';
+    import { getContext, type Snippet } from 'svelte';
     import type { PlotContext, GenericMarkOptions, Mark } from '../types.js';
     import { scaleBand } from 'd3-scale';
     import Facet from './Facet.svelte';

package/dist/core/Plot.svelte

@@ -62,6 +62,7 @@
         initialWidth: 500,
         inset: 0,
         colorScheme: 'turbo',
+        unknown: '#cccccc',
         dotRadius: 3,
         frame: false,
         axes: true,
@@ -160,7 +161,7 @@
     );
 
     // if the plot is showing filled dot marks we're using different defaults
-    // for the symbol axis range, so we're passing on this info to the createScales
+    // for the symbol axis range, so we're passing on this info to the computeScales
     // function below
     const hasFilledDotMarks = $derived(
         !!explicitMarks.find((d) => d.type === 'dot' && d.options.fill)

package/dist/helpers/autoScales.js

@@ -5,6 +5,7 @@ import callWithProps from './callWithProps.js';
 import { interpolateLab, interpolateRound } from 'd3-interpolate';
 import { coalesce, maybeNumber } from './index.js';
 import { getLogTicks } from './getLogTicks.js';
+import { isPlainObject } from 'es-toolkit';
 const Scales = {
     point: scalePoint,
     band: scaleBand,
@@ -102,10 +103,23 @@ export function autoScaleColor({ type, domain, scaleOptions, plotOptions, plotWi
     let fn;
     let range;
     // special treatment for color scales
-    const { scheme, interpolate, pivot, n = type === 'threshold' ? domain.length + 1 : 9 } = scaleOptions;
+    const { scheme, interpolate, pivot, n = type === 'threshold' ? domain.length + 1 : 9, unknown = plotDefaults.unknown } = scaleOptions;
     if (type === 'categorical' || type === 'ordinal') {
         // categorical
-        const scheme_ = scheme || plotDefaults.categoricalColorScheme;
+        let scheme_ = scheme || plotDefaults.categoricalColorScheme;
+        if (isPlainObject(scheme_)) {
+            const newScheme = Object.values(scheme_);
+            const newDomain = Object.keys(scheme_);
+            // for every value in domain that's not part of the scheme, map to unknown
+            for (const v of domain) {
+                if (scheme_[v] == null) {
+                    newDomain.push(v);
+                    newScheme.push(unknown);
+                }
+            }
+            domain = newDomain;
+            scheme_ = newScheme;
+        }
         // categorical scale
         range = Array.isArray(scheme_)
             ? scheme_

package/dist/helpers/projection.js

@@ -1,5 +1,5 @@
 import { geoClipRectangle, geoPath, geoTransform } from 'd3-geo';
-import { constant, isObject, isValid } from './index.js';
+import { constant, isObject } from './index.js';
 const identity = constant({ stream: (stream) => stream });
 const defaultAspectRatio = 0.618;
 export function createProjection({ projOptions, inset: globalInset = 2, insetTop = globalInset, insetRight = globalInset, insetBottom = globalInset, insetLeft = globalInset } = {}, dimensions) {

package/dist/helpers/reduce.js

@@ -1,4 +1,4 @@
-import { min, max, mode, sum, mean, median, variance, deviation, quantile, range } from 'd3-array';
+import { min, max, mode, sum, mean, median, variance, deviation, quantile } from 'd3-array';
 import { resolveChannel } from './resolve.js';
 import { POSITION_CHANNELS } from './index.js';
 const niceReduceNames = {

package/dist/helpers/resolve.js

@@ -2,7 +2,6 @@ import { CHANNEL_SCALE } from '../constants.js';
 import isDataRecord from './isDataRecord.js';
 import isRawValue from './isRawValue.js';
 import { isValid } from './isValid.js';
-import { pick } from 'es-toolkit';
 import { getBaseStylesObject } from './getBaseStyles.js';
 import { RAW_VALUE } from '../transforms/recordize.js';
 export function resolveProp(accessor, datum, _defaultValue = null) {

package/dist/helpers/scales.js

@@ -1,4 +1,4 @@
-import { extent, range as d3Range, ascending } from 'd3-array';
+import { extent, ascending } from 'd3-array';
 import { isColorOrNull, isDateOrNull, isNumberOrNull, isNumberOrNullOrNaN, isStringOrNull } from './typeChecks.js';
 import { CHANNEL_SCALE, VALID_SCALE_TYPES } from '../constants.js';
 import { isSymbolOrNull } from './typeChecks.js';

package/dist/marks/Arrow.svelte

@@ -9,7 +9,6 @@
         BaseMarkProps,
         ConstantAccessor,
         ChannelAccessor,
-        FacetContext,
         RawValue
     } from '../types.js';
     import { resolveChannel, resolveProp, resolveStyles } from '../helpers/resolve.js';

package/dist/marks/AxisY.svelte

@@ -6,11 +6,9 @@
         PlotContext,
         BaseMarkProps,
         RawValue,
-        DataRecord,
         FacetContext,
         DefaultOptions
     } from '../types.js';
-    import getBaseStyles from '../helpers/getBaseStyles.js';
     import autoTimeFormat from '../helpers/autoTimeFormat.js';
     import type { ConstantAccessor } from '../types.js';
     import { autoTicks } from '../helpers/autoTicks.js';

package/dist/marks/CellX.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import Cell from './Cell.svelte';
-    import { recordizeX, recordizeY } from '../index.js';
+    import { recordizeY } from '../index.js';
     import type { BaseMarkProps, DataRow, RectMarkProps } from '../types.js';
     import type { ChannelAccessor } from '../types.js';
 

package/dist/marks/ColorLegend.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import { getContext } from 'svelte';
     import { Plot, AxisX, Frame } from '../index.js';
-    import { symbol as d3Symbol, symbol } from 'd3-shape';
+    import { symbol as d3Symbol } from 'd3-shape';
     import { range as d3Range, extent } from 'd3-array';
     import { maybeSymbol } from '../helpers/symbols.js';
 

package/dist/marks/DifferenceY.svelte

@@ -2,7 +2,6 @@
     import type {
         BaseMarkProps,
         ChannelAccessor,
-        ConstantAccessor,
         CurveName,
         DataRecord,
         PlotContext

package/dist/marks/Dot.svelte

@@ -15,7 +15,7 @@
     import { sort } from '../index.js';
     import Mark from '../Mark.svelte';
     import DotCanvas from './helpers/DotCanvas.svelte';
-    import { maybeData, testFilter, isValid } from '../helpers/index.js';
+    import { maybeData, isValid } from '../helpers/index.js';
     import { recordizeXY } from '../transforms/recordize.js';
     import { addEventHandlers } from './helpers/events.js';
 

package/dist/marks/Geo.svelte

@@ -4,9 +4,7 @@
         DataRecord,
         PlotContext,
         BaseMarkProps,
-        FacetContext,
-        ConstantAccessor,
-        UsedScales
+        ConstantAccessor
     } from '../types.js';
     import Mark from '../Mark.svelte';
     import { geoPath } from 'd3-geo';

package/dist/marks/GridY.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import { getContext } from 'svelte';
     import Mark from '../Mark.svelte';
-    import type { PlotContext, BaseMarkProps, RawValue, DataRecord } from '../types.js';
+    import type { PlotContext, BaseMarkProps, RawValue } from '../types.js';
     import { resolveChannel, resolveStyles } from '../helpers/resolve.js';
     import { autoTicks } from '../helpers/autoTicks.js';
     import { testFilter } from '../helpers/index.js';

package/dist/marks/Line.svelte

@@ -41,7 +41,7 @@
     import MarkerPath from './helpers/MarkerPath.svelte';
     import { getContext } from 'svelte';
     import { resolveProp, resolveStyles } from '../helpers/resolve.js';
-    import { line, type CurveFactory, type Line } from 'd3-shape';
+    import { line, type CurveFactory, type Line as D3Line } from 'd3-shape';
     import { geoPath } from 'd3-geo';
     import callWithProps from '../helpers/callWithProps.js';
     import { maybeCurve } from '../helpers/curves.js';
@@ -100,7 +100,7 @@
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());
 
-    const linePath: Line<ScaledDataRecord> = $derived(
+    const linePath: D3Line<ScaledDataRecord> = $derived(
         plot.scales.projection && curve === 'auto'
             ? sphereLine(plot.scales.projection)
             : callWithProps(line, [], {

package/dist/marks/Line.svelte.d.ts

@@ -21,7 +21,7 @@ export type BaseLineMarkProps = {
     lineClass?: ConstantAccessor<string>;
     canvas?: boolean;
 } & MarkerOptions;
-import { type CurveFactory, type Line } from 'd3-shape';
+import { type CurveFactory } from 'd3-shape';
 import type { RawValue } from '../types.js';
 type LineMarkProps = BaseMarkProps & {
     x?: ChannelAccessor;

package/dist/marks/Rect.svelte

@@ -6,8 +6,6 @@
     import Mark from '../Mark.svelte';
     import { getContext } from 'svelte';
     import { intervalX, intervalY } from '../index.js';
-    import { resolveProp, resolveStyles } from '../helpers/resolve.js';
-    import { coalesce, maybeNumber } from '../helpers/index.js';
     import type {
         PlotContext,
         DataRecord,
@@ -15,7 +13,6 @@
         BaseRectMarkProps,
         ChannelAccessor
     } from '../types.js';
-    import { addEventHandlers } from './helpers/events.js';
     import GroupMultiple from './helpers/GroupMultiple.svelte';
     import RectPath from './helpers/RectPath.svelte';
 

package/dist/marks/helpers/BaseAxisY.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { getContext, tick, untrack } from 'svelte';
+    import { getContext, untrack } from 'svelte';
     import { randomId, testFilter } from '../../helpers/index.js';
     import { resolveProp, resolveStyles } from '../../helpers/resolve.js';
     import { max } from 'd3-array';

package/dist/marks/helpers/DotCanvas.svelte

@@ -6,7 +6,6 @@
         ScaledDataRecord,
         PlotContext
     } from '../../types.js';
-    import { CSS_VAR } from '../../constants.js';
     import { resolveProp } from '../../helpers/resolve.js';
     import { maybeSymbol } from '../../helpers/symbols.js';
     import { symbol as d3Symbol } from 'd3-shape';

package/dist/marks/helpers/GeoCanvas.svelte

@@ -8,7 +8,7 @@
     } from '../../types.js';
     import { CSS_VAR } from '../../constants.js';
     import { resolveProp, resolveScaledStyleProps } from '../../helpers/resolve.js';
-    import { getContext, untrack } from 'svelte';
+    import { getContext } from 'svelte';
     import { type GeoPath } from 'd3-geo';
     import CanvasLayer from './CanvasLayer.svelte';
     import type { Attachment } from 'svelte/attachments';

package/dist/marks/helpers/events.js

@@ -1,4 +1,4 @@
-import { invert, pick } from 'es-toolkit';
+import { pick } from 'es-toolkit';
 import { RAW_VALUE } from '../../transforms/recordize.js';
 import { INDEX } from '../../constants.js';
 /**

package/dist/transforms/bin.js

@@ -1,7 +1,7 @@
 import { resolveChannel } from '../helpers/resolve.js';
 import { maybeInterval } from '../helpers/autoTicks.js';
-import { bin as d3Bin, extent, groups as d3Groups, thresholdFreedmanDiaconis, thresholdScott, thresholdSturges } from 'd3-array';
-import { Reducer, reduceOutputs } from '../helpers/reduce.js';
+import { bin as d3Bin, extent, thresholdFreedmanDiaconis, thresholdScott, thresholdSturges } from 'd3-array';
+import { reduceOutputs } from '../helpers/reduce.js';
 import { groupFacetsAndZ } from '../helpers/group.js';
 import { isDate } from '../helpers/typeChecks.js';
 const ThresholdGenerators = {

package/dist/transforms/window.js

@@ -1,6 +1,6 @@
 import { maybeInterval } from '../helpers/autoTicks.js';
 import { isValid } from '../helpers/index.js';
-import { Reducer, mayberReducer } from '../helpers/reduce.js';
+import { mayberReducer } from '../helpers/reduce.js';
 import { resolveChannel } from '../helpers/resolve.js';
 import { groups as d3Groups } from 'd3-array';
 export function windowX(args, options) {

package/dist/types.d.ts

@@ -339,6 +339,10 @@ export type PlotDefaults = {
      */
     numberFormat: Intl.NumberFormatOptions;
     markerDotRadius: number;
+    /**
+     * fallback color to be used for null/NA
+     */
+    unknown: string;
     css: (d: string) => string | undefined;
 };
 export type GenericMarkOptions = Record<string, any>;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "svelteplot",
-    "version": "0.2.6-next.1",
+    "version": "0.2.6-next.3",
     "license": "ISC",
     "author": {
         "name": "Gregor Aisch",