svelteplot 0.2.9-pr-104.1 → 0.2.9-pr-104.3

package/dist/helpers/scales.js

@@ -6,6 +6,7 @@ import { resolveProp, toChannelOption } from './resolve.js';
 import isDataRecord from './isDataRecord.js';
 import { createProjection } from './projection.js';
 import { maybeInterval } from './autoTicks.js';
+import { IS_SORTED } from '../transforms/sort.js';
 /**
  * compute the plot scales
  */
@@ -54,7 +55,7 @@ export function createScale(name, scaleOptions, marks, plotOptions, plotWidth, p
         // we're deliberately checking for !== undefined and not for != null
         // since the explicit sort transforms like shuffle will set the
         // sort channel to null to we know that there's an explicit order
-        if (name === 'x' && mark.options.sort != null) {
+        if ((name === 'x' || name === 'y') && mark.options[IS_SORTED] != undefined) {
             sortOrdinalDomain = false;
         }
         for (const channel of mark.channels) {
@@ -136,6 +137,12 @@ export function createScale(name, scaleOptions, marks, plotOptions, plotWidth, p
             }
         }
     }
+    if ((name === 'x' || name === 'y') && scaleOptions.sort) {
+        sortOrdinalDomain = true;
+    }
+    if ((name === 'x' || name === 'y') && scaleOptions.sort === false) {
+        sortOrdinalDomain = false;
+    }
     // construct domain from data values
     const valueArr = [...dataValues.values(), ...(scaleOptions.domain || [])].filter((d) => d != null);
     const type = scaleOptions.type === 'auto'

package/dist/marks/AxisX.svelte

@@ -99,7 +99,7 @@
     const ticks: RawValue[] = $derived(
         data.length > 0
             ? // use custom tick values if user passed any as prop
-              data
+              Array.from(new Set(data))
             : // use custom scale tick values if user passed any as plot scale option
               autoTicks(
                   plot.scales.x.type,

package/dist/marks/Dot.svelte

@@ -49,7 +49,6 @@
         return d3Symbol(maybeSymbol(symbolType), size)();
     }
 
-    const { getTestFacet } = getContext<FacetContext>('svelteplot/facet');
     const { dotRadius } = getContext<PlotDefaults>('svelteplot/_defaults');
 
     const args = $derived(

package/dist/transforms/sort.d.ts

@@ -1,10 +1,11 @@
 import type { DataRecord, DataRow, TransformArg } from '../types.js';
 export declare const SORT_KEY: unique symbol;
+export declare const IS_SORTED: unique symbol;
 export declare function sort({ data, ...channels }: TransformArg<DataRecord>, options?: {
     reverse?: boolean;
 }): any;
 /**
- * reverses the data row order
+ * shuffles the data row order
  */
 export declare function shuffle({ data, ...channels }: TransformArg<DataRow[]>, options?: {
     seed?: number;

package/dist/transforms/sort.js

@@ -3,6 +3,7 @@ import { resolveChannel } from '../helpers/resolve.js';
 import { shuffler } from 'd3-array';
 import { randomLcg } from 'd3-random';
 export const SORT_KEY = Symbol('sortKey');
+export const IS_SORTED = Symbol('isSorted');
 export function sort({ data, ...channels }, options = {}) {
     if (!Array.isArray(data))
         return { data, ...channels };
@@ -14,19 +15,26 @@ export function sort({ data, ...channels }, options = {}) {
             sort.channel = sort.channel.substring(1);
             sort.order = 'descending';
         }
+        // if sort is a function that does not take exactly one argument, we treat it
+        // as comparator function, as you would pass to array.sort
+        const isComparator = typeof channels.sort === 'function' && channels.sort.length !== 1;
         // sort data
         return {
-            data: data
-                .map((d) => ({
-                ...d,
-                [SORT_KEY]: resolveChannel('sort', d, { ...channels, sort })
-            }))
-                .toSorted((a, b) => (a[SORT_KEY] > b[SORT_KEY] ? 1 : a[SORT_KEY] < b[SORT_KEY] ? -1 : 0) *
-                (options.reverse || (isDataRecord(sort) && sort?.order === 'descending')
-                    ? -1
-                    : 1))
-                .map(({ [SORT_KEY]: a, ...rest }) => rest),
+            data: isComparator
+                ? data.toSorted(channels.sort)
+                : data
+                    .map((d) => ({
+                    ...d,
+                    [SORT_KEY]: resolveChannel('sort', d, { ...channels, sort })
+                }))
+                    .toSorted((a, b) => (a[SORT_KEY] > b[SORT_KEY] ? 1 : a[SORT_KEY] < b[SORT_KEY] ? -1 : 0) *
+                    (options.reverse ||
+                        (isDataRecord(sort) && sort?.order === 'descending')
+                        ? -1
+                        : 1))
+                    .map(({ [SORT_KEY]: a, ...rest }) => rest),
             ...channels,
+            [IS_SORTED]: sort,
             // set the sort channel to null to disable the implicit alphabetical
             // ordering of ordinal domains, and also to avoid double sorting in case
             // this transform is used "outside" a mark
@@ -39,7 +47,7 @@ export function sort({ data, ...channels }, options = {}) {
     };
 }
 /**
- * reverses the data row order
+ * shuffles the data row order
  */
 export function shuffle({ data, ...channels }, options = {}) {
     const random = randomLcg(options.seed);
@@ -49,7 +57,8 @@ export function shuffle({ data, ...channels }, options = {}) {
         ...channels,
         // set the sort channel to null to disable the implicit
         // alphabetical ordering of ordinal domains
-        sort: null
+        sort: null,
+        [IS_SORTED]: true
     };
 }
 /**
@@ -61,6 +70,7 @@ export function reverse({ data, ...channels }) {
         ...channels,
         // set the sort channel to null to disable the implicit
         // alphabetical ordering of ordinal domains
-        sort: null
+        sort: null,
+        [IS_SORTED]: true
     };
 }

package/dist/types.d.ts

@@ -345,7 +345,7 @@ export type PlotDefaults = {
     unknown: string;
     css: (d: string) => string | undefined;
 };
-export type GenericMarkOptions = Record<string, any>;
+export type GenericMarkOptions = Record<string | symbol, any>;
 export type DataRecord = Record<string | symbol, RawValue> & {
     ___orig___?: RawValue | [RawValue, RawValue];
 };
@@ -512,6 +512,12 @@ export type BaseMarkProps = Partial<{
     dy: ConstantAccessor<number>;
     fill: ConstantAccessor<string>;
     fillOpacity: ConstantAccessor<number>;
+    sort: string | ConstantAccessor<RawValue> | ((a: RawValue, b: RawValue) => number) | {
+        /** sort data using an already defined channel */
+        channel: string;
+        /** sort order */
+        order?: 'ascending' | 'descending';
+    };
     stroke: ConstantAccessor<string>;
     strokeWidth: ConstantAccessor<number>;
     strokeOpacity: ConstantAccessor<number>;
@@ -577,7 +583,7 @@ export type BaseRectMarkProps = {
     borderRadius?: BorderRadius;
 };
 export type Channels = Record<string, ChannelAccessor | ConstantAccessor<string | number | boolean | symbol>>;
-export type TransformArg<K> = Channels & {
+export type TransformArg<K> = Channels & BaseMarkProps & {
     data: K[];
 };
 export type MapArg<K> = Channels & {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "svelteplot",
-    "version": "0.2.9-pr-104.1",
+    "version": "0.2.9-pr-104.3",
     "license": "ISC",
     "author": {
         "name": "Gregor Aisch",