svelteplot 0.10.3 → 0.11.0

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

@@ -1,83 +1,170 @@
-import type { RawValue, ConstantAccessor } from '../types/index.js';
+import type { RawValue, ConstantAccessor, TickFormatFunction } from '../types/index.js';
 declare function $$render<Datum extends RawValue>(): {
     props: Omit<Partial<{
         filter: ConstantAccessor<boolean, Datum>;
         facet: "auto" | "include" | "exclude";
-        fx: import("../types/channel").ChannelAccessor<Datum>;
-        fy: import("../types/channel").ChannelAccessor<Datum>;
+        fx: import("../types/channel.js").ChannelAccessor<Datum>;
+        fy: import("../types/channel.js").ChannelAccessor<Datum>;
         dx: ConstantAccessor<number, Datum>;
         dy: ConstantAccessor<number, Datum>;
-        dodgeX: import("../transforms/dodge").DodgeXOptions;
-        dodgeY: import("../transforms/dodge").DodgeYOptions;
-        fill: import("../types/channel").ChannelAccessor<Datum>;
+        dodgeX: import("../transforms/dodge.js").DodgeXOptions;
+        dodgeY: import("../transforms/dodge.js").DodgeYOptions;
+        fill: import("../types/channel.js").ChannelAccessor<Datum>;
         fillOpacity: ConstantAccessor<number, Datum>;
+        fontFamily: ConstantAccessor<import("csstype").Property.FontFamily, Datum>;
+        fontSize: ConstantAccessor<number | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "math" | (string & {}) | "large" | "medium" | "small" | "x-large" | "x-small" | "xx-large" | "xx-small" | "xxx-large" | "larger" | "smaller", Datum>;
+        fontStyle: ConstantAccessor<import("csstype").Property.FontStyle, Datum>;
+        fontVariant: ConstantAccessor<import("csstype").Property.FontVariant, Datum>;
+        fontWeight: ConstantAccessor<import("csstype").Property.FontWeight, Datum>;
+        letterSpacing: ConstantAccessor<import("csstype").Property.LetterSpacing<0 | (string & {})>, Datum>;
+        wordSpacing: ConstantAccessor<import("csstype").Property.WordSpacing<0 | (string & {})>, Datum>;
+        textAnchor: ConstantAccessor<import("csstype").Property.TextAnchor, Datum>;
+        textTransform: ConstantAccessor<import("csstype").Property.TextTransform, Datum>;
+        textDecoration: ConstantAccessor<import("csstype").Property.TextDecoration<0 | (string & {})>, Datum>;
         sort: ((a: RawValue, b: RawValue) => number) | {
             channel: string;
             order?: "ascending" | "descending";
         } | ConstantAccessor<RawValue, Datum>;
-        stroke: import("../types/channel").ChannelAccessor<Datum>;
+        stroke: import("../types/channel.js").ChannelAccessor<Datum>;
         strokeWidth: ConstantAccessor<number, Datum>;
         strokeOpacity: ConstantAccessor<number, Datum>;
         strokeLinejoin: ConstantAccessor<import("csstype").Property.StrokeLinejoin, Datum>;
         strokeLinecap: ConstantAccessor<import("csstype").Property.StrokeLinecap, Datum>;
         strokeMiterlimit: ConstantAccessor<number, Datum>;
-        opacity: import("../types/channel").ChannelAccessor<Datum>;
+        opacity: import("../types/channel.js").ChannelAccessor<Datum>;
         strokeDasharray: ConstantAccessor<string, Datum>;
         strokeDashoffset: ConstantAccessor<number, Datum>;
+        blend: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
         mixBlendMode: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
         clipPath: string;
         mask: string;
         imageFilter: ConstantAccessor<string, Datum>;
         shapeRendering: ConstantAccessor<import("csstype").Property.ShapeRendering, Datum>;
         paintOrder: ConstantAccessor<string, Datum>;
-        onclick: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondblclick: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseup: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmousedown: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmousemove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseout: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointercancel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerdown: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerup: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointermove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerout: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondrag: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondrop: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragstart: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragend: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchstart: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchmove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchend: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchcancel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        oncontextmenu: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onwheel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
+        onclick: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondblclick: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseup: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmousedown: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmousemove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseout: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointercancel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerdown: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerup: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointermove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerout: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondrag: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondrop: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragstart: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragend: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchstart: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchmove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchend: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchcancel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        oncontextmenu: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onwheel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
         class: string;
         style: string;
         cursor: ConstantAccessor<import("csstype").Property.Cursor, Datum>;
-    }>, "fillOpacity" | "paintOrder" | "href" | "target" | "title"> & {
+        title: ConstantAccessor<string, Datum>;
+    }>, "fillOpacity" | "textAnchor" | "paintOrder" | "title" | "href" | "target"> & {
+        /** custom tick values to display on the axis */
         data?: Datum[];
+        /** whether this axis was automatically added by the Plot component */
         automatic?: boolean;
+        /** the axis title label; set to false or null to hide */
         title?: string | false | null;
+        /** which edge of the plot the axis appears on */
         anchor?: "left" | "right";
+        /** controls which facet edge displays this axis */
         facetAnchor?: "auto" | "left" | "right" | "left-empty" | "right-empty";
+        /** vertical alignment of tick labels relative to the tick position */
         lineAnchor?: "top" | "center" | "bottom";
+        /** the interval between ticks, e.g. "day", "month", or a number */
         interval?: string | number;
+        /** horizontal alignment of the axis title */
         labelAnchor?: "auto" | "left" | "center" | "right";
+        /** text anchor for tick labels */
         textAnchor?: "auto" | "start" | "middle" | "end";
+        /** the length of tick marks in pixels */
         tickSize?: number;
+        /** font size for tick labels */
         tickFontSize?: ConstantAccessor<number, Datum>;
+        /** font size for the axis title */
         titleFontSize?: number;
+        /** spacing between tick marks and tick labels in pixels */
         tickPadding?: number;
-        tickFormat?: "auto" | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((d: RawValue) => string);
+        /** formatter for tick labels; can be "auto", an Intl format options object, or a custom function */
+        tickFormat?: "auto" | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | TickFormatFunction;
+        /** CSS class applied to each tick label */
         tickClass?: ConstantAccessor<string, Datum>;
         /** ticks is a shorthand for defining data, tickCount or interval */
         ticks?: number | string | Datum[];

package/dist/marks/BarX.svelte

@@ -35,6 +35,7 @@
         BaseMarkProps,
         BaseRectMarkProps,
         ChannelAccessor,
+        DataRecord,
         LinkableMarkProps
     } from '../types/index.js';
     import { getPlotDefaults } from '../hooks/plotDefaults.js';
@@ -50,7 +51,7 @@
 
     const {
         data = [{} as Datum],
-        class: className = null,
+        class: className = '',
         stack,
         canvas = false,
         ...options
@@ -81,20 +82,20 @@
             {@const rectCanvasData = scaledData
                 .filter((d) => d.valid)
                 .map((d) => {
-                    const minx = Math.min(d.x1, d.x2);
-                    const maxx = Math.max(d.x1, d.x2);
+                    const minx = Math.min(d.x1 as number, d.x2 as number);
+                    const maxx = Math.max(d.x1 as number, d.x2 as number);
 
                     return {
                         ...d,
                         x1: minx,
                         x2: maxx,
-                        y1: d.y - bw * 0.5,
-                        y2: d.y + bw * 0.5
+                        y1: (d.y as number) - bw * 0.5,
+                        y2: (d.y as number) + bw * 0.5
                     };
                 })}
             <GroupMultiple class={barGroupClass} length={scaledData.length}>
                 <RectCanvas
-                    {options}
+                    options={options as BaseMarkProps<DataRecord> & BaseRectMarkProps<DataRecord>}
                     data={rectCanvasData}
                     {usedScales}
                     useInsetAsFallbackHorizontally={false} />
@@ -102,17 +103,18 @@
         {:else}
             <GroupMultiple class="bar-x" length={scaledData.length}>
                 {#each scaledData as d, i (i)}
-                    {@const minx = Math.min(d.x1, d.x2)}
-                    {@const maxx = Math.max(d.x1, d.x2)}
+                    {@const minx = Math.min(d.x1 as number, d.x2 as number)}
+                    {@const maxx = Math.max(d.x1 as number, d.x2 as number)}
                     {#if d.valid}
                         <RectPath
                             {usedScales}
                             class={className}
-                            {options}
+                            options={options as BaseRectMarkProps<DataRecord> &
+                                BaseMarkProps<DataRecord>}
                             datum={d}
                             x={minx}
                             useInsetAsFallbackHorizontally={false}
-                            y={d.y - bw * 0.5}
+                            y={(d.y as number) - bw * 0.5}
                             width={maxx - minx}
                             height={bw} />
                     {/if}

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

@@ -9,10 +9,20 @@ declare function $$render<Datum extends DataRow>(): {
         fy: ChannelAccessor<Datum>;
         dx: import("../types/index.js").ConstantAccessor<number, Datum>;
         dy: import("../types/index.js").ConstantAccessor<number, Datum>;
-        dodgeX: import("../transforms/dodge").DodgeXOptions;
-        dodgeY: import("../transforms/dodge").DodgeYOptions;
+        dodgeX: import("../transforms/dodge.js").DodgeXOptions;
+        dodgeY: import("../transforms/dodge.js").DodgeYOptions;
         fill: ChannelAccessor<Datum>;
         fillOpacity: import("../types/index.js").ConstantAccessor<number, Datum>;
+        fontFamily: import("../types/index.js").ConstantAccessor<import("csstype").Property.FontFamily, Datum>;
+        fontSize: import("../types/index.js").ConstantAccessor<number | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "math" | (string & {}) | "large" | "medium" | "small" | "x-large" | "x-small" | "xx-large" | "xx-small" | "xxx-large" | "larger" | "smaller", Datum>;
+        fontStyle: import("../types/index.js").ConstantAccessor<import("csstype").Property.FontStyle, Datum>;
+        fontVariant: import("../types/index.js").ConstantAccessor<import("csstype").Property.FontVariant, Datum>;
+        fontWeight: import("../types/index.js").ConstantAccessor<import("csstype").Property.FontWeight, Datum>;
+        letterSpacing: import("../types/index.js").ConstantAccessor<import("csstype").Property.LetterSpacing<0 | (string & {})>, Datum>;
+        wordSpacing: import("../types/index.js").ConstantAccessor<import("csstype").Property.WordSpacing<0 | (string & {})>, Datum>;
+        textAnchor: import("../types/index.js").ConstantAccessor<import("csstype").Property.TextAnchor, Datum>;
+        textTransform: import("../types/index.js").ConstantAccessor<import("csstype").Property.TextTransform, Datum>;
+        textDecoration: import("../types/index.js").ConstantAccessor<import("csstype").Property.TextDecoration<0 | (string & {})>, Datum>;
         sort: ((a: import("../types/index.js").RawValue, b: import("../types/index.js").RawValue) => number) | {
             channel: string;
             order?: "ascending" | "descending";
@@ -26,45 +36,107 @@ declare function $$render<Datum extends DataRow>(): {
         opacity: ChannelAccessor<Datum>;
         strokeDasharray: import("../types/index.js").ConstantAccessor<string, Datum>;
         strokeDashoffset: import("../types/index.js").ConstantAccessor<number, Datum>;
+        blend: import("../types/index.js").ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
         mixBlendMode: import("../types/index.js").ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
         clipPath: string;
         mask: string;
         imageFilter: import("../types/index.js").ConstantAccessor<string, Datum>;
         shapeRendering: import("../types/index.js").ConstantAccessor<import("csstype").Property.ShapeRendering, Datum>;
         paintOrder: import("../types/index.js").ConstantAccessor<string, Datum>;
-        onclick: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondblclick: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseup: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmousedown: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmousemove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseout: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onmouseover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointercancel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerdown: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerup: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointermove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onpointerout: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondrag: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondrop: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragstart: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragenter: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragleave: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragover: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ondragend: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchstart: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchmove: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchend: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        ontouchcancel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        oncontextmenu: import("svelte/elements").MouseEventHandler<SVGPathElement>;
-        onwheel: import("svelte/elements").MouseEventHandler<SVGPathElement>;
+        onclick: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondblclick: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseup: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmousedown: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmousemove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseout: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onmouseover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointercancel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerdown: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerup: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointermove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onpointerout: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondrag: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondrop: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragstart: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragenter: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragleave: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragover: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ondragend: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchstart: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchmove: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchend: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        ontouchcancel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        oncontextmenu: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
+        onwheel: (event: Event & {
+            currentTarget: SVGPathElement;
+        }, datum: Datum, index: number) => void;
         class: string;
         style: string;
         cursor: import("../types/index.js").ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+        title: import("../types/index.js").ConstantAccessor<string, Datum>;
     }> & LinkableMarkProps<Datum> & BaseRectMarkProps<Datum> & {
         data: Datum[];
         x?: ChannelAccessor<Datum>;

package/dist/marks/BarY.svelte

@@ -34,6 +34,7 @@
         BaseMarkProps,
         BaseRectMarkProps,
         ChannelAccessor,
+        DataRecord,
         DataRow,
         LinkableMarkProps
     } from '../types/index.js';
@@ -50,8 +51,8 @@
     let markProps: BarYMarkProps = $props();
 
     const {
-        data = [{}],
-        class: className = null,
+        data = [{} as Datum],
+        class: className = '',
         stack,
         canvas = false,
         ...options
@@ -80,20 +81,20 @@
             {@const rectCanvasData = scaledData
                 .filter((d) => d.valid)
                 .map((d) => {
-                    const miny = Math.min(d.y1, d.y2);
-                    const maxy = Math.max(d.y1, d.y2);
+                    const miny = Math.min(d.y1 as number, d.y2 as number);
+                    const maxy = Math.max(d.y1 as number, d.y2 as number);
 
                     return {
                         ...d,
-                        x1: d.x - bw * 0.5,
-                        x2: d.x + bw * 0.5,
+                        x1: (d.x as number) - bw * 0.5,
+                        x2: (d.x as number) + bw * 0.5,
                         y1: miny,
                         y2: maxy
                     };
                 })}
             <GroupMultiple class={barGroupClass} length={scaledData.length}>
                 <RectCanvas
-                    {options}
+                    options={options as BaseMarkProps<DataRecord> & BaseRectMarkProps<DataRecord>}
                     data={rectCanvasData}
                     {usedScales}
                     useInsetAsFallbackVertically={false} />
@@ -101,11 +102,11 @@
         {:else}
             <GroupMultiple class="bar-y" length={scaledData.length}>
                 {#each scaledData as d, i (i)}
-                    {@const miny = Math.min(d.y1, d.y2)}
-                    {@const maxy = Math.max(d.y1, d.y2)}
+                    {@const miny = Math.min(d.y1 as number, d.y2 as number)}
+                    {@const maxy = Math.max(d.y1 as number, d.y2 as number)}
                     {#if d.valid}
                         <RectPath
-                            x={d.x - bw * 0.5}
+                            x={(d.x as number) - bw * 0.5}
                             y={miny}
                             options={args}
                             class={className}