layerchart 2.0.0-next.26 → 2.0.0-next.28

package/dist/components/Axis.svelte

@@ -400,7 +400,7 @@
     <Text {...resolvedLabelProps} />
   {/if}
 
-  {#each tickVals as tick, index (tick)}
+  {#each tickVals as tick, index (tick.valueOf())}
     {@const tickCoords = getCoords(tick)}
     {@const [radialTickCoordsX, radialTickCoordsY] = pointRadial(tickCoords.x, tickCoords.y)}
     {@const [radialTickMarkCoordsX, radialTickMarkCoordsY] = pointRadial(

package/dist/utils/array.d.ts

@@ -1,5 +1,6 @@
 import type { Numeric } from 'd3-array';
 import { extent as d3extent } from 'd3-array';
+import { type Accessor } from './common.js';
 /**
  * Wrapper around d3-array's `extent()` but remove [undefined, undefined] return type
  */
@@ -16,8 +17,8 @@ export declare function arraysEqual(arr1: unknown[], arr2: unknown[]): boolean;
  * This is useful for visualizing overlapping events in a timeline / Gantt chart.
  */
 export declare function applyLanes<T extends Record<string, any>>(data: T[], options?: {
-    start: keyof T;
-    end: keyof T;
+    start: Accessor<T>;
+    end: Accessor<T>;
 }): (T & {
     lane: number;
 })[];

package/dist/utils/array.js

@@ -1,4 +1,5 @@
 import { extent as d3extent } from 'd3-array';
+import { accessor } from './common.js';
 /**
  * Wrapper around d3-array's `extent()` but remove [undefined, undefined] return type
  */
@@ -22,11 +23,16 @@ export function arraysEqual(arr1, arr2) {
  * Add `lanes` property to each element in the data array support densely packing.
  * This is useful for visualizing overlapping events in a timeline / Gantt chart.
  */
-export function applyLanes(data, options = { start: 'start', end: 'end' }) {
+export function applyLanes(data, options = {
+    start: 'start',
+    end: 'end',
+}) {
     const result = [];
     let stack = [];
+    const startAccessor = accessor(options.start);
+    const endAccessor = accessor(options.end);
     for (const d of data) {
-        let lane = stack.findIndex((s) => s[options.end] <= d[options.start] && s[options.start] < d[options.start]);
+        let lane = stack.findIndex((s) => endAccessor(s) <= startAccessor(d) && startAccessor(s) < startAccessor(d));
         if (lane === -1) {
             lane = stack.length;
         }

package/dist/utils/array.test.js

@@ -76,6 +76,44 @@ describe('applyLanes', () => {
             },
         ]);
     });
+    it('should work with nested string keys for start and end', () => {
+        const data = [
+            { name: 'Task 1', duration: { start: new Date('2023-01-01'), end: new Date('2023-01-02') } },
+            { name: 'Task 2', duration: { start: new Date('2023-01-03'), end: new Date('2023-01-04') } },
+        ];
+        const result = applyLanes(data, { start: 'duration.start', end: 'duration.end' });
+        expect(result).toEqual([
+            {
+                name: 'Task 1',
+                duration: { start: new Date('2023-01-01'), end: new Date('2023-01-02') },
+                lane: 0,
+            },
+            {
+                name: 'Task 2',
+                duration: { start: new Date('2023-01-03'), end: new Date('2023-01-04') },
+                lane: 0,
+            },
+        ]);
+    });
+    it('should work with function accessors for start and end', () => {
+        const data = [
+            { name: 'Task 1', duration: { start: new Date('2023-01-01'), end: new Date('2023-01-02') } },
+            { name: 'Task 2', duration: { start: new Date('2023-01-03'), end: new Date('2023-01-04') } },
+        ];
+        const result = applyLanes(data, { start: (d) => d.duration.start, end: (d) => d.duration.end });
+        expect(result).toEqual([
+            {
+                name: 'Task 1',
+                duration: { start: new Date('2023-01-01'), end: new Date('2023-01-02') },
+                lane: 0,
+            },
+            {
+                name: 'Task 2',
+                duration: { start: new Date('2023-01-03'), end: new Date('2023-01-04') },
+                lane: 0,
+            },
+        ]);
+    });
     it('should handle empty array', () => {
         const data = [];
         const result = applyLanes(data);

package/dist/utils/index.d.ts

@@ -1,3 +1,4 @@
+export { applyLanes } from './array.js';
 export * from './canvas.js';
 export * from './common.js';
 export * from './geo.js';

package/dist/utils/index.js

@@ -1,3 +1,4 @@
+export { applyLanes } from './array.js';
 export * from './canvas.js';
 export * from './common.js';
 export * from './geo.js';

package/package.json

@@ -4,7 +4,7 @@
   "author": "Sean Lynch <techniq35@gmail.com>",
   "license": "MIT",
   "repository": "techniq/layerchart",
-  "version": "2.0.0-next.26",
+  "version": "2.0.0-next.28",
   "devDependencies": {
     "@changesets/cli": "^2.29.4",
     "@iconify-json/lucide": "^1.2.48",