svelteplot 0.10.3 → 0.11.0

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

@@ -4,7 +4,7 @@ export type ShapeRenderer = {
 };
 import type { DataRecord, ChannelAccessor } from '../types/index.js';
 import { type Snippet } from 'svelte';
-declare function $$render<Datum extends DataRecord>(): {
+declare function $$render<Datum = DataRecord | GeoJSON.GeoJsonObject>(): {
     props: Partial<{
         filter: import("../types/index.js").ConstantAccessor<boolean, Datum>;
         facet: "auto" | "include" | "exclude";
@@ -16,6 +16,16 @@ declare function $$render<Datum extends DataRecord>(): {
         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/data.js").RawValue, b: import("../types/data.js").RawValue) => number) | {
             channel: string;
             order?: "ascending" | "descending";
@@ -29,51 +39,119 @@ declare function $$render<Datum extends DataRecord>(): {
         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>;
     }> & {
+        /** the input data array; each element becomes one vector */
         data: Datum[];
+        /** the horizontal position channel; bound to the x scale */
         x: ChannelAccessor<Datum>;
+        /** the vertical position channel; bound to the y scale */
         y: ChannelAccessor<Datum>;
+        /** the radius (width) of the vector shape in pixels */
         r?: number;
+        /** the length of the vector in pixels */
         length?: ChannelAccessor<Datum>;
+        /** rotation angle of the vector in degrees */
         rotate?: ChannelAccessor<Datum>;
         /**
          * Controls where the vector is anchored in relation to the x, y position.
@@ -82,8 +160,11 @@ declare function $$render<Datum extends DataRecord>(): {
          * 'end', the arrow will end at the x, y position.
          */
         anchor?: "start" | "middle" | "end";
+        /** the shape of the vector; can be a preset name or a custom ShapeRenderer */
         shape?: "arrow" | "spike" | "arrow-filled" | ShapeRenderer;
+        /** snippet for custom rendering inside the vector mark group */
         children?: Snippet;
+        /** if true, renders using Canvas instead of SVG */
         canvas?: boolean;
     };
     exports: {};
@@ -91,7 +172,7 @@ declare function $$render<Datum extends DataRecord>(): {
     slots: {};
     events: {};
 };
-declare class __sveltets_Render<Datum extends DataRecord> {
+declare class __sveltets_Render<Datum = DataRecord | GeoJSON.GeoJsonObject> {
     props(): ReturnType<typeof $$render<Datum>>['props'];
     events(): ReturnType<typeof $$render<Datum>>['events'];
     slots(): ReturnType<typeof $$render<Datum>>['slots'];
@@ -99,13 +180,13 @@ declare class __sveltets_Render<Datum extends DataRecord> {
     exports(): {};
 }
 interface $$IsomorphicComponent {
-    new <Datum extends DataRecord>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Datum>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Datum>['props']>, ReturnType<__sveltets_Render<Datum>['events']>, ReturnType<__sveltets_Render<Datum>['slots']>> & {
+    new <Datum = DataRecord | GeoJSON.GeoJsonObject>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Datum>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Datum>['props']>, ReturnType<__sveltets_Render<Datum>['events']>, ReturnType<__sveltets_Render<Datum>['slots']>> & {
         $$bindings?: ReturnType<__sveltets_Render<Datum>['bindings']>;
     } & ReturnType<__sveltets_Render<Datum>['exports']>;
-    <Datum extends DataRecord>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
+    <Datum = DataRecord | GeoJSON.GeoJsonObject>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
     z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
 }
 /** The vector mark lets you place shapes (like arrows) on your plot. */
 declare const Vector: $$IsomorphicComponent;
-type Vector<Datum extends DataRecord> = InstanceType<typeof Vector<Datum>>;
+type Vector<Datum = DataRecord | GeoJSON.GeoJsonObject> = InstanceType<typeof Vector<Datum>>;
 export default Vector;

package/dist/marks/WaffleX.svelte

@@ -9,35 +9,37 @@
         ChannelAccessor,
         LinkableMarkProps,
         BorderRadius
-    } from '../types';
-    import { wafflePolygon, type WaffleOptions } from './helpers/waffle';
-    import { getPlotDefaults } from '../hooks/plotDefaults';
-    import { intervalX, recordizeX, sort, stackX } from '../transforms';
-    import type { StackOptions } from '../transforms/stack';
+    } from '../types/index.js';
+    import { wafflePolygon, type WaffleOptions } from './helpers/waffle.js';
+    import { getPlotDefaults } from '../hooks/plotDefaults.js';
+    import { intervalX, recordizeX, sort, stackX } from '../transforms/index.js';
+    import type { StackOptions } from '../transforms/stack.js';
     import Mark from '../Mark.svelte';
-    import { resolveProp, resolveStyles } from '../helpers/resolve';
-    import { roundedRect } from '../helpers/roundedRect';
+    import { resolveProp, resolveStyles } from '../helpers/resolve.js';
+    import { roundedRect } from '../helpers/roundedRect.js';
     import { usePlot } from '../hooks/usePlot.svelte.js';
 
     interface WaffleXMarkProps
         extends BaseMarkProps<Datum>, LinkableMarkProps<Datum>, WaffleOptions<Datum> {
+        /** the input data array */
         data?: Datum[];
         /**
-         * bound to a quantitative scale
+         * the horizontal position channel; bound to a quantitative scale
          */
         x?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the starting horizontal position; bound to a quantitative scale
          */
         x1?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the ending horizontal position; bound to a quantitative scale
          */
         x2?: ChannelAccessor<Datum>;
         /**
-         * bound to a band scale
+         * the vertical position channel; bound to a band scale
          */
         y?: ChannelAccessor<Datum>;
+        /** stacking options for combining multiple series */
         stack?: StackOptions;
     }
 
@@ -51,9 +53,9 @@
 
     const {
         data = [{} as Datum],
-        class: className = null,
+        class: className = '',
         stack,
-        symbol = null,
+        symbol,
         unit,
         ...options
     }: WaffleXMarkProps = $derived({ ...DEFAULTS, ...markProps });
@@ -76,8 +78,8 @@
     requiredScales={{ y: ['band'] }}
     channels={['x1', 'x2', 'y', 'fill', 'stroke', 'opacity', 'fillOpacity', 'strokeOpacity']}
     {...args}>
-    {#snippet children({ mark, usedScales, scaledData })}
-        {@const wafflePoly = wafflePolygon('x', args, plot.scales)}
+    {#snippet children({ usedScales, scaledData })}
+        {@const wafflePoly = wafflePolygon('x', args as any, plot.scales)}
         {#each scaledData as d, i (i)}
             {@const borderRadius = resolveProp(args.borderRadius, d?.datum, 0) as BorderRadius}
             {@const hasBorderRadius =
@@ -94,7 +96,7 @@
             <g class={['waffle-x', className]}>
                 <pattern {...pattern}>
                     {#if symbol}
-                        {@render symbol({ ...rect, style, styleClass, datum: d.datum })}
+                        {@render symbol({ ...rect, style, styleClass, datum: d.datum as Datum })}
                     {:else if hasBorderRadius}
                         <path
                             d={roundedRect(rect.x, rect.y, rect.width, rect.height, borderRadius)}

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

@@ -1,88 +1,162 @@
-import type { DataRecord, ChannelAccessor, LinkableMarkProps } from '../types';
-import { type WaffleOptions } from './helpers/waffle';
-import type { StackOptions } from '../transforms/stack';
+import type { DataRecord, ChannelAccessor, LinkableMarkProps } from '../types/index.js';
+import { type WaffleOptions } from './helpers/waffle.js';
+import type { StackOptions } from '../transforms/stack.js';
 declare function $$render<Datum extends DataRecord>(): {
     props: Partial<{
-        filter: import("../types").ConstantAccessor<boolean, Datum>;
+        filter: import("../types/index.js").ConstantAccessor<boolean, Datum>;
         facet: "auto" | "include" | "exclude";
         fx: ChannelAccessor<Datum>;
         fy: ChannelAccessor<Datum>;
-        dx: import("../types").ConstantAccessor<number, Datum>;
-        dy: import("../types").ConstantAccessor<number, Datum>;
-        dodgeX: import("../transforms/dodge").DodgeXOptions;
-        dodgeY: import("../transforms/dodge").DodgeYOptions;
+        dx: import("../types/index.js").ConstantAccessor<number, Datum>;
+        dy: import("../types/index.js").ConstantAccessor<number, Datum>;
+        dodgeX: import("../transforms/dodge.js").DodgeXOptions;
+        dodgeY: import("../transforms/dodge.js").DodgeYOptions;
         fill: ChannelAccessor<Datum>;
-        fillOpacity: import("../types").ConstantAccessor<number, Datum>;
-        sort: ((a: import("../types").RawValue, b: import("../types").RawValue) => number) | {
+        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";
-        } | import("../types").ConstantAccessor<import("../types").RawValue, Datum>;
+        } | import("../types/index.js").ConstantAccessor<import("../types/index.js").RawValue, Datum>;
         stroke: ChannelAccessor<Datum>;
-        strokeWidth: import("../types").ConstantAccessor<number, Datum>;
-        strokeOpacity: import("../types").ConstantAccessor<number, Datum>;
-        strokeLinejoin: import("../types").ConstantAccessor<import("csstype").Property.StrokeLinejoin, Datum>;
-        strokeLinecap: import("../types").ConstantAccessor<import("csstype").Property.StrokeLinecap, Datum>;
-        strokeMiterlimit: import("../types").ConstantAccessor<number, Datum>;
+        strokeWidth: import("../types/index.js").ConstantAccessor<number, Datum>;
+        strokeOpacity: import("../types/index.js").ConstantAccessor<number, Datum>;
+        strokeLinejoin: import("../types/index.js").ConstantAccessor<import("csstype").Property.StrokeLinejoin, Datum>;
+        strokeLinecap: import("../types/index.js").ConstantAccessor<import("csstype").Property.StrokeLinecap, Datum>;
+        strokeMiterlimit: import("../types/index.js").ConstantAccessor<number, Datum>;
         opacity: ChannelAccessor<Datum>;
-        strokeDasharray: import("../types").ConstantAccessor<string, Datum>;
-        strokeDashoffset: import("../types").ConstantAccessor<number, Datum>;
-        mixBlendMode: import("../types").ConstantAccessor<import("csstype").Property.MixBlendMode, 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").ConstantAccessor<string, Datum>;
-        shapeRendering: import("../types").ConstantAccessor<import("csstype").Property.ShapeRendering, Datum>;
-        paintOrder: import("../types").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>;
+        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: (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").ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+        cursor: import("../types/index.js").ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+        title: import("../types/index.js").ConstantAccessor<string, Datum>;
     }> & LinkableMarkProps<Datum> & WaffleOptions<Datum> & {
+        /** the input data array */
         data?: Datum[];
         /**
-         * bound to a quantitative scale
+         * the horizontal position channel; bound to a quantitative scale
          */
         x?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the starting horizontal position; bound to a quantitative scale
          */
         x1?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the ending horizontal position; bound to a quantitative scale
          */
         x2?: ChannelAccessor<Datum>;
         /**
-         * bound to a band scale
+         * the vertical position channel; bound to a band scale
          */
         y?: ChannelAccessor<Datum>;
+        /** stacking options for combining multiple series */
         stack?: StackOptions;
     };
     exports: {};

package/dist/marks/WaffleY.svelte

@@ -9,33 +9,34 @@
         BaseMarkProps,
         LinkableMarkProps,
         BorderRadius
-    } from '../types';
-    import { wafflePolygon, type WaffleOptions } from './helpers/waffle';
-    import { getPlotDefaults } from '../hooks/plotDefaults';
-    import { intervalY, recordizeY, sort, stackY } from '../transforms';
+    } from '../types/index.js';
+    import { wafflePolygon, type WaffleOptions } from './helpers/waffle.js';
+    import { getPlotDefaults } from '../hooks/plotDefaults.js';
+    import { intervalY, recordizeY, sort, stackY } from '../transforms/index.js';
     import Mark from '../Mark.svelte';
-    import { resolveProp, resolveStyles } from '../helpers/resolve';
-    import { roundedRect } from '../helpers/roundedRect';
+    import { resolveProp, resolveStyles } from '../helpers/resolve.js';
+    import { roundedRect } from '../helpers/roundedRect.js';
     import GroupMultiple from './helpers/GroupMultiple.svelte';
     import { usePlot } from '../hooks/usePlot.svelte.js';
 
     interface WaffleYMarkProps
         extends BaseMarkProps<Datum>, LinkableMarkProps<Datum>, WaffleOptions<Datum> {
+        /** the input data array */
         data?: Datum[];
         /**
-         * bound to a babd scale
+         * the horizontal position channel; bound to a band scale
          */
         x?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the vertical position channel; bound to a quantitative scale
          */
         y?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the starting vertical position; bound to a quantitative scale
          */
         y1?: ChannelAccessor<Datum>;
         /**
-         * bound to a quantitative scale
+         * the ending vertical position; bound to a quantitative scale
          */
         y2?: ChannelAccessor<Datum>;
     }
@@ -49,9 +50,9 @@
 
     const {
         data = [{} as Datum],
-        class: className = null,
+        class: className = '',
         stack,
-        symbol = null,
+        symbol,
         ...options
     }: WaffleYMarkProps = $derived({ ...DEFAULTS, ...markProps });
 
@@ -73,8 +74,8 @@
     requiredScales={{ x: ['band'] }}
     channels={['y1', 'y2', 'x', 'fill', 'stroke', 'opacity', 'fillOpacity', 'strokeOpacity']}
     {...args}>
-    {#snippet children({ mark, usedScales, scaledData })}
-        {@const wafflePoly = wafflePolygon('y', args, plot.scales)}
+    {#snippet children({ usedScales, scaledData })}
+        {@const wafflePoly = wafflePolygon('y', args as any, plot.scales)}
         {#each scaledData as d, i (i)}
             {@const [style, styleClass] = resolveStyles(
                 plot,
@@ -97,7 +98,7 @@
             <g class={['waffle-y', className]}>
                 <pattern {...pattern}>
                     {#if symbol}
-                        {@render symbol({ ...rect, style, styleClass, datum: d.datum })}
+                        {@render symbol({ ...rect, style, styleClass, datum: d.datum as Datum })}
                     {:else if hasBorderRadius}
                         <path
                             d={roundedRect(rect.x, rect.y, rect.width, rect.height, borderRadius)}