layerchart 0.44.0 → 0.51.0

package/dist/components/Chart.svelte.d.ts

@@ -1,17 +1,9 @@
 import { SvelteComponentTyped } from "svelte";
-import { WebGL as _WebGL } from 'layercake';
-import _Canvas from './layout/Canvas.svelte';
-import _Html from './layout/Html.svelte';
-import _Svg from './layout/Svg.svelte';
-export declare const Canvas: typeof _Canvas;
-export declare const Html: typeof _Html;
-export declare const Svg: typeof _Svg;
-export declare const WebGL: typeof _WebGL;
-import { type Accessor } from '../utils/common.js';
 import type { HierarchyNode } from 'd3-hierarchy';
 import type { SankeyGraph } from 'd3-sankey';
-import { type AnyScale } from '../utils/scales.js';
 import TransformContext from './TransformContext.svelte';
+import { type Accessor } from '../utils/common.js';
+import { type AnyScale, type DomainType } from '../utils/scales.js';
 declare class __sveltets_Render<TData> {
     props(): {
         /** Whether this chart should be rendered server side. @default false */
@@ -33,7 +25,7 @@ declare class __sveltets_Render<TData> {
         /**	The .layercake-container `<div>` tag. Useful for bindings. */
         element?: HTMLDivElement;
         /** If `data` is not a flat array of objects and you want to use any of the scales, set a flat version of the data via the `flatData` prop. */
-        data?: SankeyGraph<any, any> | TData[] | HierarchyNode<TData> | undefined;
+        data?: SankeyGraph<any, any> | HierarchyNode<TData> | TData[] | undefined;
         /** A flat version of data. */
         flatData?: any[];
         /** The x accessor. The key in each row of data that corresponds to the x-field. This can be a string, an accessor function, a number or an array of any combination of those types. This property gets converted to a function when you access it through the context. */
@@ -44,14 +36,26 @@ declare class __sveltets_Render<TData> {
         z?: Accessor<TData>;
         /** The r accessor. The key in each row of data that corresponds to the r-field. This can be a string, an accessor function, a number or an array of any combination of those types. This property gets converted to a function when you access it through the context. */
         r?: Accessor<TData>;
+        /** The x1 accessor. The key in each row of data that corresponds to the x1-field. This can be a string, an accessor function, a number or an array of any combination of those types. This property gets converted to a function when you access it through the context. */
+        x1?: Accessor<TData>;
+        /** The y1 accessor. The key in each row of data that corresponds to the y1-field. This can be a string, an accessor function, a number or an array of any combination of those types. This property gets converted to a function when you access it through the context. */
+        y1?: Accessor<TData>;
+        /** The c (color) accessor. The key in each row of data that corresponds to the color. This can be a string or an accessor function. This property gets converted to a function when you access it through the context. */
+        c?: Accessor<TData>;
         /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`. This value can also be an array because sometimes your scales are [piecewise](https://github.com/d3/d3-scale#continuous_domain) or are a list of discrete values such as in [ordinal scales](https://github.com/d3/d3-scale#ordinal-scales), useful for color series. Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
-        xDomain?: Function | (string | number | Date | null | undefined)[] | null;
+        xDomain?: DomainType;
         /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`.  Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
-        yDomain?: Function | (string | number | Date | null | undefined)[] | null;
+        yDomain?: DomainType;
+        /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`. This value can also be an array because sometimes your scales are [piecewise](https://github.com/d3/d3-scale#continuous_domain) or are a list of discrete values such as in [ordinal scales](https://github.com/d3/d3-scale#ordinal-scales), useful for color series. Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
+        zDomain?: DomainType;
         /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`. This value can also be an array because sometimes your scales are [piecewise](https://github.com/d3/d3-scale#continuous_domain) or are a list of discrete values such as in [ordinal scales](https://github.com/d3/d3-scale#ordinal-scales), useful for color series. Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
-        zDomain?: Function | (string | number | Date | null | undefined)[] | null;
+        rDomain?: DomainType;
         /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`. This value can also be an array because sometimes your scales are [piecewise](https://github.com/d3/d3-scale#continuous_domain) or are a list of discrete values such as in [ordinal scales](https://github.com/d3/d3-scale#ordinal-scales), useful for color series. Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
-        rDomain?: Function | (string | number | Date | null | undefined)[] | null;
+        x1Domain?: DomainType;
+        /** Set a min or max. For linear scales, if you want to inherit the value from the data's extent, set that value to `null`. This value can also be an array because sometimes your scales are [piecewise](https://github.com/d3/d3-scale#continuous_domain) or are a list of discrete values such as in [ordinal scales](https://github.com/d3/d3-scale#ordinal-scales), useful for color series. Set it to a function that receives the computed domain and lets you return a modified domain, useful for sorting values. */
+        y1Domain?: DomainType;
+        /** Set the list of color values. */
+        cDomain?: DomainType;
         /** Applies D3's [scale.nice()](https://github.com/d3/d3-scale#continuous_nice) to the x domain. @default false */
         xNice?: boolean | number;
         /** Applies D3's [scale.nice()](https://github.com/d3/d3-scale#continuous_nice) to the y domain. @default false */
@@ -60,23 +64,29 @@ declare class __sveltets_Render<TData> {
         zNice?: boolean | number;
         /**  Applies D3's [scale.nice()](https://github.com/d3/d3-scale#continuous_nice) to the r domain. @default false */
         rNice?: boolean | number;
-        /** @type Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
+        /** Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
         xPadding?: [number, number];
-        /** @type Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
+        /** Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
         yPadding?: [number, number];
-        /** @type Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
+        /** Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
         zPadding?: [number, number];
-        /** @type Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
+        /** Assign a pixel value to add to the min or max of the scale. This will increase the scales domain by the scale unit equivalent of the provided pixels. */
         rPadding?: [number, number];
-        /** @type {Function} [xScale=d3.scaleLinear] The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. */
+        /** The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleLinear */
         xScale?: AnyScale;
-        /** @type {Function} [yScale=d3.scaleLinear] The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. */
+        /** The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleLinear */
         yScale?: AnyScale;
-        /** @type {Function} [zScale=d3.scaleLinear] The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. */
+        /** The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleLinear */
         zScale?: AnyScale;
-        /** @type {Function} [rScale=d3.scaleSqrt] The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. */
+        /** The D3 scale that should be used for the x-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleSqrt */
         rScale?: AnyScale;
-        /** @type Override the default x range of `[0, width]` by setting an array or function with argument `({ width, height})` that returns an array. Setting this prop overrides `xReverse`. This can also be a list of numbers or strings for scales with discrete ranges like [scaleThreshhold](https://github.com/d3/d3-scale#threshold-scales) or [scaleQuantize](https://github.com/d3/d3-scale#quantize-scales). */
+        /** The D3 scale that should be used for the x1-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleLinear */
+        x1Scale?: AnyScale;
+        /** The D3 scale that should be used for the y1-dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleLinear */
+        y1Scale?: AnyScale;
+        /** The D3 scale that should be used for the  color dimension. Pass in an instantiated D3 scale if you want to override the default or you want to extra options. @default scaleOrdinal */
+        cScale?: AnyScale;
+        /** Override the default x range of `[0, width]` by setting an array or function with argument `({ width, height})` that returns an array. Setting this prop overrides `xReverse`. This can also be a list of numbers or strings for scales with discrete ranges like [scaleThreshhold](https://github.com/d3/d3-scale#threshold-scales) or [scaleQuantize](https://github.com/d3/d3-scale#quantize-scales). */
         xRange?: string[] | number[] | ((args: {
             width: number;
             height: number;
@@ -96,21 +106,35 @@ declare class __sveltets_Render<TData> {
             width: number;
             height: number;
         }) => number[] | string[]) | undefined;
+        /** Set the x1 range by setting an array or function with argument `({ xScale, width, height})` that returns an array. This can also be a list of numbers or strings for scales with discrete ranges like [scaleThreshhold](https://github.com/d3/d3-scale#threshold-scales) or [scaleQuantize](https://github.com/d3/d3-scale#quantize-scales). */
+        x1Range?: string[] | number[] | ((args: {
+            xScale: AnyScale;
+            width: number;
+            height: number;
+        }) => number[] | string[]) | undefined;
+        /** Set the y1 range by setting an array or function with argument `({ yScale, width, height})` that returns an array. This can also be a list of numbers or strings for scales with discrete ranges like [scaleThreshhold](https://github.com/d3/d3-scale#threshold-scales) or [scaleQuantize](https://github.com/d3/d3-scale#quantize-scales). */
+        y1Range?: string[] | number[] | ((args: {
+            yScale: AnyScale;
+            width: number;
+            height: number;
+        }) => number[] | string[]) | undefined;
+        /** Override the default y1 range of `[0, width]` by setting an array or function with argument `({ yScale, width, height})` that returns an array. Setting this prop overrides `x1Reverse`. This can also be a list of numbers or strings for scales with discrete ranges like [scaleThreshhold](https://github.com/d3/d3-scale#threshold-scales) or [scaleQuantize](https://github.com/d3/d3-scale#quantize-scales). */
+        cRange?: string[];
         /** Reverse the default x range. By default this is `false` and the range is `[0, width]`. Ignored if you set the xRange prop. @default false */
         xReverse?: boolean;
         /** Reverse the default y range. By default this is `true` and the range is `[height, 0]` unless using an ordinal scale with a `.bandwidth` method for `yScale`. Ignored if you set the `yRange` prop. @default true */
         yReverse?: boolean;
-        /** @type {Boolean} [zReverse=false] Reverse the default z range. By default this is `false` and the range is `[0, width]`. Ignored if you set the zRange prop. @default false */
+        /** Reverse the default z range. By default this is `false` and the range is `[0, width]`. Ignored if you set the zRange prop. @default false */
         zReverse?: boolean;
-        /** @type {Boolean} [rReverse=false] Reverse the default r range. By default this is `false` and the range is `[1, 25]`. Ignored if you set the rRange prop. @default false */
+        /** Reverse the default r range. By default this is `false` and the range is `[1, 25]`. Ignored if you set the rRange prop. @default false */
         rReverse?: boolean;
-        /** @type {Boolean} [xDomainSort=true] Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
+        /** Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
         xDomainSort?: boolean;
-        /** @type {Boolean} [yDomainSort=true] Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
+        /** Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
         yDomainSort?: boolean;
-        /** @type {Boolean} [zDomainSort=true] Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
+        /** Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
         zDomainSort?: boolean;
-        /** @type {Boolean} [rDomainSort=true] Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
+        /** Only used when scale is ordinal. Set whether the calculated unique items come back sorted. */
         rDomainSort?: boolean;
         /** The amount of padding to put around your chart. It operates like CSS box-sizing: border-box; where values are subtracted from the parent container's width and height, the same as a [D3 margin convention](https://bl.ocks.org/mbostock/3019563). */
         padding?: {
@@ -128,14 +152,16 @@ declare class __sveltets_Render<TData> {
         } | undefined;
         /** Any extra configuration values you want available on the LayerCake context. This could be useful for color lookups or additional constants. */
         custom?: Record<string, any>;
-        /** @type {Boolean} debug Enable debug printing to the console. Useful to inspect your scales and dimensions. */
+        /** Enable debug printing to the console. Useful to inspect your scales and dimensions. */
         debug?: boolean;
-        /** @type {Boolean} [verbose=true] Show warnings in the console. */
+        /** Show warnings in the console. */
         verbose?: boolean;
         /** x value guaranteed to be visible in xDomain.  Useful with optional negative values since `xDomain={[0, null]}` would ignore negative values */
         xBaseline?: number | null;
         /** y value guaranteed to be visible in yDomain.  Useful with optional negative values since `yDomain={[0, null]}` would ignore negative values */
         yBaseline?: number | null;
+        /** Use radial instead of cartesian coordinates, mapping `x` to `angle` and `y`` to radial.  Radial lines are positioned relative to the origin, use transform (ex. `<Group center>`) to change the origin */
+        radial?: boolean;
         /** Props passed to GeoContext */
         geo?: Partial<{
             projection?: (() => import("d3-geo").GeoProjection) | undefined;
@@ -169,7 +195,7 @@ declare class __sveltets_Render<TData> {
         }> | undefined;
         /** Props passed to TransformContext */
         transform?: Partial<{
-            mode?: "none" | "canvas" | "manual";
+            mode?: "canvas" | "manual" | "none";
             translateOnScale?: boolean;
             spring?: boolean | Parameters<typeof import("../stores/motionStore").motionStore>[1]["spring"];
             tweened?: boolean | Parameters<typeof import("../stores/motionStore").motionStore>[1]["tweened"];
@@ -195,7 +221,7 @@ declare class __sveltets_Render<TData> {
                 y: number;
             }>;
             initialScale?: number | undefined;
-            scale?: import("svelte/motion").Spring<number> | import("svelte/motion").Tweened<number> | import("svelte/store").Writable<number>;
+            scale?: import("svelte/store").Writable<number> | import("svelte/motion").Spring<number> | import("svelte/motion").Tweened<number>;
             setScrollMode?: (mode: "none" | "scale" | "translate") => void;
             reset?: () => void;
             zoomIn?: () => void;
@@ -218,7 +244,7 @@ declare class __sveltets_Render<TData> {
         transformContext?: TransformContext;
     };
     events(): {
-        resize: CustomEvent<any>;
+        resize: any;
         transform: CustomEvent<{
             scale: number;
             translate: {
@@ -267,14 +293,27 @@ declare class __sveltets_Render<TData> {
                 show: (e: PointerEvent, tooltipData?: any) => void;
                 hide: () => void;
             };
+            x: Function;
             xScale: any;
             xGet: any;
+            y: Function;
             yScale: any;
             yGet: any;
+            z: Function;
             zScale: any;
             zGet: any;
+            r: Function;
             rScale: any;
             rGet: any;
+            x1: any;
+            x1Scale: any;
+            x1Get: any;
+            y1: any;
+            y1Scale: any;
+            y1Get: any;
+            c: any;
+            cScale: any;
+            cGet: any;
             padding: {
                 top: number;
                 right: number;
@@ -286,8 +325,9 @@ declare class __sveltets_Render<TData> {
                 bottom?: number | undefined;
                 left?: number | undefined;
             };
-            data: unknown[] | SankeyGraph<any, any> | HierarchyNode<unknown>;
-            flatData: import("svelte/store").Readable<unknown[] | SankeyGraph<any, any> | HierarchyNode<unknown>>;
+            data: any;
+            flatData: any;
+            config: any;
         };
     };
 }

package/dist/components/ChartContext.svelte

@@ -1,6 +1,7 @@
 <!-- Wrapper to allow getting LayerCake context from <Chart> and exposing with a strongly type context getter -->
-<script context="module">import { createEventDispatcher, getContext, onMount, setContext } from 'svelte';
-import {} from 'svelte/store';
+<script context="module">import { createScale } from '../utils/scales.js';
+import { createEventDispatcher, getContext, onMount, setContext, } from 'svelte';
+import { derived, writable } from 'svelte/store';
 export const chartContextKey = Symbol();
 export function chartContext() {
     return getContext(chartContextKey);
@@ -10,10 +11,114 @@ function setChartContext(context) {
 }
 </script>
 
-<script generics="TData">const dispatch = createEventDispatcher();
+<script generics="TData">import { unique } from '@layerstack/utils/array';
+import { scaleOrdinal } from 'd3-scale';
+import { extent } from 'd3-array';
+import { accessor, chartDataArray } from '../utils/common.js';
+export let x1 = undefined;
+export let x1Scale = undefined;
+export let x1Domain = undefined;
+export let x1Range = undefined;
+export let y1 = undefined;
+export let y1Scale = undefined;
+export let y1Domain = undefined;
+export let y1Range = undefined;
+export let c = undefined;
+export let cScale = undefined;
+export let cDomain = undefined;
+export let cRange = undefined;
 const layerCakeContext = getContext('LayerCake');
-setChartContext(layerCakeContext);
-const { width, height, containerWidth, containerHeight } = layerCakeContext;
+const { data: contextData, width, height, containerWidth, containerHeight, xScale, yScale, } = layerCakeContext;
+/* --------------------------------------------
+ * Make store versions of each parameter
+ * Prefix these with `_` to keep things organized
+ */
+const _x1 = writable(accessor(x1));
+const _x1Scale = writable(null);
+const _x1Domain = writable(x1Domain);
+const _x1Range = writable(x1Range);
+const _x1Get = writable();
+$: $_x1 = accessor(x1);
+$: $_x1Domain = x1Domain ?? extent(chartDataArray($contextData), $_x1);
+$: $_x1Scale =
+    x1Scale && x1Range
+        ? createScale(x1Scale, $_x1Domain, x1Range, { xScale: $xScale, $width, $height })
+        : null;
+$: $_x1Range = x1Range;
+$: $_x1Get = (d) => $_x1Scale?.($_x1(d));
+const _y1 = writable(accessor(y1));
+const _y1Scale = writable(null);
+const _y1Domain = writable(y1Domain);
+const _y1Range = writable(y1Range);
+const _y1Get = writable();
+$: $_y1 = accessor(y1);
+$: $_y1Domain = y1Domain ?? extent(chartDataArray($contextData), $_y1);
+$: $_y1Range = y1Range;
+$: $_y1Scale =
+    y1Scale && y1Range
+        ? createScale(y1Scale, $_y1Domain, y1Range, { yScale: $yScale, $width, $height })
+        : null;
+$: $_y1Get = (d) => $_y1Scale?.($_y1(d));
+const _c = writable(accessor(c));
+const _cScale = writable(scaleOrdinal());
+const _cDomain = writable(cDomain);
+const _cRange = writable(cRange);
+const _cGet = writable();
+$: $_c = accessor(c);
+$: $_cDomain = cDomain ?? unique(chartDataArray($contextData).map($_c));
+$: $_cRange = cRange;
+$: $_cScale = cRange
+    ? createScale(cScale ?? scaleOrdinal(), $_cDomain, cRange, { $width, $height })
+    : null;
+$: $_cGet = (d) => $_cScale?.($_c(d));
+/** Use radial instead of cartesian coordinates, mapping `x` to `angle` and `y`` to radial.  Radial lines are positioned relative to the origin, use transform (ex. `<Group center>`) to change the origin */
+export let radial = false;
+const _radial = writable(radial);
+$: $_radial = radial;
+$: addtConfig = {
+    ...(x1 && { x1 }),
+    ...(x1Domain && { x1Domain }),
+    ...(x1Range && { x1Range }),
+    ...(x1Scale && { x1Scale }),
+    ...(y1 && { y1 }),
+    ...(y1Domain && { y1Domain }),
+    ...(y1Range && { y1Range }),
+    ...(y1Scale && { y1Scale }),
+    ...(c && { c }),
+    ...(cDomain && { cDomain }),
+    ...(cRange && { cRange }),
+    ...(cScale && { cScale }),
+};
+const _addtConfig = writable(addtConfig);
+$: $_addtConfig = addtConfig;
+const config = derived([layerCakeContext.config, _addtConfig], ([$config, $addtConfig]) => {
+    return {
+        ...$config,
+        ...$addtConfig,
+    };
+});
+const chartContext = {
+    ...layerCakeContext,
+    x1: _x1,
+    x1Domain: _x1Domain,
+    x1Range: _x1Range,
+    x1Scale: _x1Scale,
+    x1Get: _x1Get,
+    y1: _y1,
+    y1Domain: _y1Domain,
+    y1Range: _y1Range,
+    y1Scale: _y1Scale,
+    y1Get: _y1Get,
+    c: _c,
+    cDomain: _cDomain,
+    cRange: _cRange,
+    cScale: _cScale,
+    cGet: _cGet,
+    config,
+    radial: _radial,
+};
+setChartContext(chartContext);
+const dispatch = createEventDispatcher();
 $: if (isMounted) {
     dispatch('resize', {
         width: $width,
@@ -31,4 +136,17 @@ onMount(() => {
 export let data = []; // Same as `ComponentProps<Chart<TData>>` but causes circular reference
 </script>
 
-<slot {data} flatData={layerCakeContext.data} />
+<slot
+  {data}
+  flatData={chartContext.data}
+  config={$config}
+  x1={$_x1}
+  x1Scale={$_x1Scale}
+  x1Get={$_x1Get}
+  y1={$_y1}
+  y1Scale={$_y1Scale}
+  y1Get={$_y1Get}
+  c={$_c}
+  cScale={$_cScale}
+  cGet={$_cGet}
+/>

package/dist/components/ChartContext.svelte.d.ts

@@ -1,5 +1,5 @@
 import { SvelteComponentTyped } from "svelte";
-import type { AnyScale } from '../index.js/utils/scales.js';
+import { type AnyScale } from '../utils/scales.js';
 import type { HierarchyNode } from 'd3-hierarchy';
 import { type Readable } from 'svelte/store';
 export declare const chartContextKey: unique symbol;
@@ -20,6 +20,9 @@ type LayerCakeContext<TData> = {
     y: Readable<(d: TData) => any>;
     z: Readable<(d: TData) => any>;
     r: Readable<(d: TData) => any>;
+    x1: Readable<(d: TData) => any>;
+    y1: Readable<(d: TData) => any>;
+    c: Readable<(d: TData) => any>;
     custom: Readable<Object>;
     data: Readable<TData[] | HierarchyNode<TData> | SankeyGraph<any, any>>;
     xNice: Readable<number | boolean>;
@@ -50,10 +53,16 @@ type LayerCakeContext<TData> = {
     yDomain: Readable<any>;
     zDomain: Readable<any>;
     rDomain: Readable<any>;
+    x1Domain: Readable<any>;
+    y1Domain: Readable<any>;
+    cDomain: Readable<any>;
     xRange: Readable<any>;
     yRange: Readable<any>;
     zRange: Readable<any>;
     rRange: Readable<any>;
+    x1Range: Readable<any>;
+    y1Range: Readable<any>;
+    cRange: Readable<any>;
     config: Readable<any>;
     xScale: Readable<AnyScale>;
     xGet: Readable<any>;
@@ -63,6 +72,12 @@ type LayerCakeContext<TData> = {
     zGet: Readable<any>;
     rScale: Readable<AnyScale>;
     rGet: Readable<any>;
+    x1Scale: Readable<AnyScale | null>;
+    x1Get: Readable<any>;
+    y1Scale: Readable<AnyScale | null>;
+    y1Get: Readable<any>;
+    cScale: Readable<AnyScale | null>;
+    cGet: Readable<any>;
 };
 export type ChartEvents = {
     resize: ChartResizeDetail;
@@ -74,11 +89,34 @@ export type ChartResizeDetail = {
     containerHeight: number;
 };
 export type ChartResizeEvent = CustomEvent<ChartResizeDetail>;
-export type ChartContext<TData> = LayerCakeContext<TData> & {};
+export type ChartContext<TData> = LayerCakeContext<TData> & {
+    radial: Readable<boolean>;
+};
 export declare function chartContext<TData = any>(): ChartContext<TData>;
 import type { SankeyGraph } from 'd3-sankey';
 declare class __sveltets_Render<TData> {
     props(): {
+        x1?: import("../utils/common.js").Accessor<TData>;
+        x1Scale?: AnyScale<any, any, any, any> | undefined;
+        x1Domain?: import("../utils/scales.js").DomainType | undefined;
+        x1Range?: string[] | number[] | ((args: {
+            xScale: AnyScale;
+            width: number;
+            height: number;
+        }) => number[] | string[]) | undefined;
+        y1?: import("../utils/common.js").Accessor<TData>;
+        y1Scale?: AnyScale<any, any, any, any> | undefined;
+        y1Domain?: import("../utils/scales.js").DomainType | undefined;
+        y1Range?: string[] | number[] | ((args: {
+            yScale: AnyScale;
+            width: number;
+            height: number;
+        }) => number[] | string[]) | undefined;
+        c?: import("../utils/common.js").Accessor<TData>;
+        cScale?: AnyScale<any, any, any, any> | undefined;
+        cDomain?: import("../utils/scales.js").DomainType | undefined;
+        cRange?: string[] | undefined;
+        /** Use radial instead of cartesian coordinates, mapping `x` to `angle` and `y`` to radial.  Radial lines are positioned relative to the origin, use transform (ex. `<Group center>`) to change the origin */ radial?: boolean;
         data?: SankeyGraph<any, any> | TData[] | HierarchyNode<TData> | undefined;
     };
     events(): {} & {
@@ -88,6 +126,16 @@ declare class __sveltets_Render<TData> {
         default: {
             data: SankeyGraph<any, any> | TData[] | HierarchyNode<TData>;
             flatData: Readable<SankeyGraph<any, any> | TData[] | HierarchyNode<TData>>;
+            config: any;
+            x1: (d: TData) => any;
+            x1Scale: AnyScale<any, any, any, any> | null;
+            x1Get: Function;
+            y1: (d: TData) => any;
+            y1Scale: AnyScale<any, any, any, any> | null;
+            y1Get: Function;
+            c: (d: TData) => any;
+            cScale: AnyScale<any, any, any, any> | null;
+            cGet: Function;
         };
     };
 }

package/dist/components/Circle.svelte

@@ -1,5 +1,5 @@
 <script>import { tick } from 'svelte';
-import { cls } from 'svelte-ux';
+import { cls } from '@layerstack/tailwind';
 import { motionStore } from '../stores/motionStore.js';
 export let cx = 0;
 export let initialCx = cx;

package/dist/components/CircleClipPath.svelte

@@ -1,4 +1,4 @@
-<script>import { uniqueId } from 'svelte-ux';
+<script>import { uniqueId } from '@layerstack/utils';
 import ClipPath from './ClipPath.svelte';
 import Circle from './Circle.svelte';
 /** Unique id for clipPath */

package/dist/components/ClipPath.svelte

@@ -1,4 +1,4 @@
-<script>import { uniqueId } from 'svelte-ux';
+<script>import { uniqueId } from '@layerstack/utils';
 /** Unique id for clipPath */
 export let id = uniqueId('clipPath-');
 /** Use existing path or shape (by id) for clipPath */

package/dist/components/GeoPath.svelte

@@ -1,6 +1,6 @@
 <script>import { createEventDispatcher, getContext } from 'svelte';
 import { geoTransform as d3geoTransform, } from 'd3-geo';
-import { cls } from 'svelte-ux';
+import { cls } from '@layerstack/tailwind';
 import { chartContext } from './ChartContext.svelte';
 import { geoContext } from './GeoContext.svelte';
 import { curveLinearClosed } from 'd3-shape';

package/dist/components/GeoPath.svelte.d.ts

@@ -1,6 +1,6 @@
 import { SvelteComponentTyped } from "svelte";
 import { type GeoIdentityTransform, type GeoPermissibleObjects, type GeoProjection, type GeoTransformPrototype } from 'd3-geo';
-import type { TooltipContextValue } from './TooltipContext.svelte';
+import type { TooltipContextValue } from './tooltip/TooltipContext.svelte';
 import { type CurveFactory, type CurveFactoryLineOnly } from 'd3-shape';
 import { geoCurvePath } from '../utils/geo.js';
 declare const __propDef: {