svelteplot 0.3.4 → 0.3.5-pr-121.1

package/dist/marks/Text.svelte

@@ -2,18 +2,23 @@
     @component
     Useful for adding SVG text labels to your plot.
 -->
-<script module lang="ts">
-    export type TextMarkProps = BaseMarkProps & {
-        data: DataRecord[];
-        x: ChannelAccessor;
-        y: ChannelAccessor;
+
+<script lang="ts" generics="Datum extends DataRecord">
+    interface TextMarkProps extends BaseMarkProps<Datum>, LinkableMarkProps<Datum> {
+        data: Datum[];
+        x: ChannelAccessor<Datum>;
+        y: ChannelAccessor<Datum>;
         children?: Snippet;
-        text: ConstantAccessor<string>;
-        title?: ConstantAccessor<string>;
+        text: ConstantAccessor<string | null | false | undefined, Datum>;
+        title?: ConstantAccessor<string, Datum>;
+        /**
+         * the font size of the text
+         */
+        fontSize?: ConstantAccessor<number, Datum>;
         /**
          * if you want to apply class names to individual text elements
          */
-        textClass?: ConstantAccessor<string>;
+        textClass?: ConstantAccessor<string, Datum>;
         /**
          * the line anchor for vertical position; top, bottom, or middle
          */
@@ -22,7 +27,7 @@
          * line height as multiplier of font size
          * @default 1.2
          */
-        lineHeight?: ConstantAccessor<number>;
+        lineHeight?: ConstantAccessor<number, Datum>;
         frameAnchor?: ConstantAccessor<
             | 'bottom'
             | 'top'
@@ -31,12 +36,11 @@
             | 'top-left'
             | 'bottom-left'
             | 'top-right'
-            | 'bottom-right'
+            | 'bottom-right',
+            Datum
         >;
-    };
-</script>
+    }
 
-<script lang="ts">
     import { getContext, type Snippet } from 'svelte';
     import GroupMultiple from './helpers/GroupMultiple.svelte';
     import type {
@@ -44,11 +48,15 @@
         BaseMarkProps,
         ConstantAccessor,
         ChannelAccessor,
-        PlotDefaults
-    } from '../types.js';
+        PlotDefaults,
+        TransformArg,
+        RawValue,
+        LinkableMarkProps
+    } from '../types/index.js';
     import { resolveProp, resolveStyles } from '../helpers/resolve.js';
     import Mark from '../Mark.svelte';
-    import { sort } from '../index.js';
+    import { sort } from '..';
+    import Anchor from './helpers/Anchor.svelte';
 
     import MultilineText from './helpers/MultilineText.svelte';
 
@@ -64,7 +72,7 @@
     let markProps: TextMarkProps = $props();
 
     const {
-        data = [{}],
+        data = [{} as Datum],
         class: className = '',
         ...options
     }: TextMarkProps = $derived({
@@ -107,9 +115,3 @@
         </GroupMultiple>
     {/snippet}
 </Mark>
-
-<style>
-    text {
-        paint-order: stroke fill;
-    }
-</style>

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

@@ -1,28 +1,104 @@
-export type TextMarkProps = BaseMarkProps & {
-    data: DataRecord[];
-    x: ChannelAccessor;
-    y: ChannelAccessor;
-    children?: Snippet;
-    text: ConstantAccessor<string>;
-    title?: ConstantAccessor<string>;
-    /**
-     * if you want to apply class names to individual text elements
-     */
-    textClass?: ConstantAccessor<string>;
-    /**
-     * the line anchor for vertical position; top, bottom, or middle
-     */
-    lineAnchor?: ConstantAccessor<'bottom' | 'top' | 'middle'>;
-    /**
-     * line height as multiplier of font size
-     * @default 1.2
-     */
-    lineHeight?: ConstantAccessor<number>;
-    frameAnchor?: ConstantAccessor<'bottom' | 'top' | 'left' | 'right' | 'top-left' | 'bottom-left' | 'top-right' | 'bottom-right'>;
-};
 import { type Snippet } from 'svelte';
-import type { DataRecord, BaseMarkProps, ConstantAccessor, ChannelAccessor } from '../types.js';
+import type { DataRecord, ConstantAccessor, ChannelAccessor, RawValue, LinkableMarkProps } from '../types/index.js';
+declare class __sveltets_Render<Datum extends DataRecord> {
+    props(): Partial<{
+        filter?: ConstantAccessor<boolean, Datum>;
+        facet?: "auto" | "include" | "exclude";
+        fx: ChannelAccessor<Datum>;
+        fy: ChannelAccessor<Datum>;
+        dx: ConstantAccessor<number, Datum>;
+        dy: ConstantAccessor<number, Datum>;
+        fill: ChannelAccessor<Datum>;
+        fillOpacity: ConstantAccessor<number, Datum>;
+        sort: {
+            channel: string;
+            order?: "ascending" | "descending";
+        } | ((a: RawValue, b: RawValue) => number) | ConstantAccessor<RawValue, Datum>;
+        stroke: 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: ChannelAccessor<Datum>;
+        strokeDasharray: ConstantAccessor<string, Datum>;
+        strokeDashoffset: ConstantAccessor<number, Datum>;
+        mixBlendMode: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
+        clipPath: 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>;
+        class: string | null;
+        cursor: ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+    }> & LinkableMarkProps<Datum> & {
+        data: Datum[];
+        x: ChannelAccessor<Datum>;
+        y: ChannelAccessor<Datum>;
+        children?: Snippet;
+        text: ConstantAccessor<string | false | null | undefined, Datum>;
+        title?: ConstantAccessor<string, Datum>;
+        /**
+         * the font size of the text
+         */
+        fontSize?: ConstantAccessor<number, Datum>;
+        /**
+         * if you want to apply class names to individual text elements
+         */
+        textClass?: ConstantAccessor<string, Datum>;
+        /**
+         * the line anchor for vertical position; top, bottom, or middle
+         */
+        lineAnchor?: ConstantAccessor<"bottom" | "top" | "middle">;
+        /**
+         * line height as multiplier of font size
+         * @default 1.2
+         */
+        lineHeight?: ConstantAccessor<number, Datum>;
+        frameAnchor?: ConstantAccessor<"bottom" | "top" | "left" | "right" | "top-left" | "bottom-left" | "top-right" | "bottom-right", Datum>;
+    };
+    events(): {};
+    slots(): {};
+    bindings(): "";
+    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']>> & {
+        $$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']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
 /** Useful for adding SVG text labels to your plot. */
-declare const Text: import("svelte").Component<TextMarkProps, {}, "">;
-type Text = ReturnType<typeof Text>;
+declare const Text: $$IsomorphicComponent;
+type Text<Datum extends DataRecord> = InstanceType<typeof Text<Datum>>;
 export default Text;

package/dist/marks/TickX.svelte

@@ -2,27 +2,25 @@
     @component 
     The TickX mark is useful for showing one-dimensional distributions along the x axis. The y axis must be a band scale.
 -->
-<script module lang="ts">
-    export type TickXMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity'> & {
-        data: DataRow[];
+
+<script lang="ts" generics="Datum extends DataRow">
+    interface TickXMarkProps extends Omit<BaseMarkProps<Datum>, 'fill' | 'fillOpacity'> {
+        data: Datum[];
         /**
          * the horizontal position; bound to the x scale
          */
-        x?: ChannelAccessor;
+        x?: ChannelAccessor<Datum>;
         /**
          * the vertical position; bound to the y scale, which must be band. If the y channel
          * is not specified, the tick will span the full vertical extent of the frame.
          */
-        y?: ChannelAccessor;
+        y?: ChannelAccessor<Datum>;
         /**
          * if ticks are used on a non-bandwidth scale, this will determine the
          * length of the tick. Defaults to 10 pixel
          */
-        tickLength?: ConstantAccessor<number>;
-    };
-</script>
-
-<script lang="ts">
+        tickLength?: ConstantAccessor<number, Datum>;
+    }
     import Mark from '../Mark.svelte';
     import { getContext } from 'svelte';
     import { resolveChannel, resolveProp, resolveScaledStyles } from '../helpers/resolve.js';
@@ -32,9 +30,10 @@
         ChannelAccessor,
         DataRow,
         FacetContext,
-        PlotDefaults
-    } from '../types.js';
-    import { recordizeX } from '../index.js';
+        PlotDefaults,
+        ConstantAccessor
+    } from '../types/index.js';
+    import { recordizeX } from '..';
     import { projectX, projectY } from '../helpers/scales.js';
     import { isValid } from '../helpers/isValid.js';
     import { testFilter, parseInset } from '../helpers/index.js';

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

@@ -1,22 +1,94 @@
-export type TickXMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity'> & {
-    data: DataRow[];
-    /**
-     * the horizontal position; bound to the x scale
-     */
-    x?: ChannelAccessor;
-    /**
-     * the vertical position; bound to the y scale, which must be band. If the y channel
-     * is not specified, the tick will span the full vertical extent of the frame.
-     */
-    y?: ChannelAccessor;
-    /**
-     * if ticks are used on a non-bandwidth scale, this will determine the
-     * length of the tick. Defaults to 10 pixel
-     */
-    tickLength?: ConstantAccessor<number>;
-};
-import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
+import type { ChannelAccessor, DataRow, ConstantAccessor } from '../types/index.js';
+declare class __sveltets_Render<Datum extends DataRow> {
+    props(): Omit<Partial<{
+        filter?: ConstantAccessor<boolean, Datum>;
+        facet?: "auto" | "include" | "exclude";
+        fx: ChannelAccessor<Datum>;
+        fy: ChannelAccessor<Datum>;
+        dx: ConstantAccessor<number, Datum>;
+        dy: ConstantAccessor<number, Datum>;
+        fill: ChannelAccessor<Datum>;
+        fillOpacity: ConstantAccessor<number, Datum>;
+        sort: {
+            channel: string;
+            order?: "ascending" | "descending";
+        } | ((a: import("../types/data").RawValue, b: import("../types/data").RawValue) => number) | ConstantAccessor<import("../types/data").RawValue, Datum>;
+        stroke: 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: ChannelAccessor<Datum>;
+        strokeDasharray: ConstantAccessor<string, Datum>;
+        strokeDashoffset: ConstantAccessor<number, Datum>;
+        mixBlendMode: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
+        clipPath: 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>;
+        class: string | null;
+        cursor: ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+    }>, "fill" | "fillOpacity"> & {
+        data: Datum[];
+        /**
+         * the horizontal position; bound to the x scale
+         */
+        x?: ChannelAccessor<Datum>;
+        /**
+         * the vertical position; bound to the y scale, which must be band. If the y channel
+         * is not specified, the tick will span the full vertical extent of the frame.
+         */
+        y?: ChannelAccessor<Datum>;
+        /**
+         * if ticks are used on a non-bandwidth scale, this will determine the
+         * length of the tick. Defaults to 10 pixel
+         */
+        tickLength?: ConstantAccessor<number, Datum>;
+    };
+    events(): {};
+    slots(): {};
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <Datum extends DataRow>(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 DataRow>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
 /** The TickX mark is useful for showing one-dimensional distributions along the x axis. The y axis must be a band scale. */
-declare const TickX: import("svelte").Component<TickXMarkProps, {}, "">;
-type TickX = ReturnType<typeof TickX>;
+declare const TickX: $$IsomorphicComponent;
+type TickX<Datum extends DataRow> = InstanceType<typeof TickX<Datum>>;
 export default TickX;

package/dist/marks/TickY.svelte

@@ -2,27 +2,24 @@
     @component 
     The TickY mark is useful for showing one-dimensional distributions along the y axis. The x axis must be a band scale.
 -->
-<script module lang="ts">
-    export type TickYMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity'> & {
-        data: DataRow[];
+<script lang="ts" generics="Datum extends DataRow">
+    interface TickYMarkProps extends Omit<BaseMarkProps<Datum>, 'fill' | 'fillOpacity'> {
+        data: Datum[];
         /**
          * the vertical position; bound to the x scale
          */
-        y?: ChannelAccessor;
+        y?: ChannelAccessor<Datum>;
         /**
-         * the horizontal position; bound to the x scale, which must be band. If the x channel
-         * is not specified, the tick will span the full horizontal extent of the frame.
+         * the horizontal position; bound to the y scale, which must be band. If the y channel
+         * is not specified, the tick will span the full vertical extent of the frame.
          */
-        x?: ChannelAccessor;
+        x?: ChannelAccessor<Datum>;
         /**
          * if ticks are used on a non-bandwidth scale, this will determine the
          * length of the tick. Defaults to 10 pixel
          */
-        tickLength?: ConstantAccessor<number>;
-    };
-</script>
-
-<script lang="ts">
+        tickLength?: ConstantAccessor<number, Datum>;
+    }
     import Mark from '../Mark.svelte';
     import { getContext } from 'svelte';
     import { resolveChannel, resolveProp, resolveScaledStyles } from '../helpers/resolve.js';
@@ -34,8 +31,8 @@
         FacetContext,
         ConstantAccessor,
         PlotDefaults
-    } from '../types.js';
-    import { recordizeY } from '../index.js';
+    } from '../types/index.js';
+    import { recordizeY } from '..';
     import { projectX, projectY } from '../helpers/scales.js';
     import { isValid } from '../helpers/isValid.js';
     import { testFilter, parseInset } from '../helpers/index.js';

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

@@ -1,22 +1,94 @@
-export type TickYMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity'> & {
-    data: DataRow[];
-    /**
-     * the vertical position; bound to the x scale
-     */
-    y?: ChannelAccessor;
-    /**
-     * the horizontal position; bound to the x scale, which must be band. If the x channel
-     * is not specified, the tick will span the full horizontal extent of the frame.
-     */
-    x?: ChannelAccessor;
-    /**
-     * if ticks are used on a non-bandwidth scale, this will determine the
-     * length of the tick. Defaults to 10 pixel
-     */
-    tickLength?: ConstantAccessor<number>;
-};
-import type { BaseMarkProps, ChannelAccessor, DataRow, ConstantAccessor } from '../types.js';
+import type { ChannelAccessor, DataRow, ConstantAccessor } from '../types/index.js';
+declare class __sveltets_Render<Datum extends DataRow> {
+    props(): Omit<Partial<{
+        filter?: ConstantAccessor<boolean, Datum>;
+        facet?: "auto" | "include" | "exclude";
+        fx: ChannelAccessor<Datum>;
+        fy: ChannelAccessor<Datum>;
+        dx: ConstantAccessor<number, Datum>;
+        dy: ConstantAccessor<number, Datum>;
+        fill: ChannelAccessor<Datum>;
+        fillOpacity: ConstantAccessor<number, Datum>;
+        sort: {
+            channel: string;
+            order?: "ascending" | "descending";
+        } | ((a: import("../types/data").RawValue, b: import("../types/data").RawValue) => number) | ConstantAccessor<import("../types/data").RawValue, Datum>;
+        stroke: 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: ChannelAccessor<Datum>;
+        strokeDasharray: ConstantAccessor<string, Datum>;
+        strokeDashoffset: ConstantAccessor<number, Datum>;
+        mixBlendMode: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
+        clipPath: 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>;
+        class: string | null;
+        cursor: ConstantAccessor<import("csstype").Property.Cursor, Datum>;
+    }>, "fill" | "fillOpacity"> & {
+        data: Datum[];
+        /**
+         * the vertical position; bound to the x scale
+         */
+        y?: ChannelAccessor<Datum>;
+        /**
+         * the horizontal position; bound to the y scale, which must be band. If the y channel
+         * is not specified, the tick will span the full vertical extent of the frame.
+         */
+        x?: ChannelAccessor<Datum>;
+        /**
+         * if ticks are used on a non-bandwidth scale, this will determine the
+         * length of the tick. Defaults to 10 pixel
+         */
+        tickLength?: ConstantAccessor<number, Datum>;
+    };
+    events(): {};
+    slots(): {};
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <Datum extends DataRow>(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 DataRow>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
 /** The TickY mark is useful for showing one-dimensional distributions along the y axis. The x axis must be a band scale. */
-declare const TickY: import("svelte").Component<TickYMarkProps, {}, "">;
-type TickY = ReturnType<typeof TickY>;
+declare const TickY: $$IsomorphicComponent;
+type TickY<Datum extends DataRow> = InstanceType<typeof TickY<Datum>>;
 export default TickY;

package/dist/marks/Vector.svelte

@@ -3,49 +3,45 @@
     The vector mark lets you place shapes (like arrows) on your plot.
 -->
 <script lang="ts" module>
-    import type {
-        PlotContext,
-        DataRecord,
-        BaseMarkProps,
-        ConstantAccessor,
-        ChannelAccessor,
-        FacetContext,
-        PlotDefaults
-    } from '../types.js';
-
     type D3Path = ReturnType<typeof import('d3-path').path>;
-
     export type ShapeRenderer = {
         draw(context: D3Path, l: number, r: number): void;
     };
+</script>
 
-    export type VectorMarkProps = BaseMarkProps & {
-        data: DataRecord[];
-        x: ChannelAccessor;
-        y: ChannelAccessor;
+<script lang="ts" generics="Datum extends DataRecord">
+    interface VectorMarkProps extends BaseMarkProps<Datum> {
+        data: Datum[];
+        x: ChannelAccessor<Datum>;
+        y: ChannelAccessor<Datum>;
         r?: number;
-        length?: ChannelAccessor;
-        rotate?: ChannelAccessor;
+        length?: ChannelAccessor<Datum>;
+        rotate?: ChannelAccessor<Datum>;
         /**
          * Controls where the vector is anchored in relation to the x, y position.
          * If set to 'start', the arrow will start at the x, y position. If set to
          * 'middle', the arrow will be centered at the x, y position. If set to
          * 'end', the arrow will end at the x, y position.
          */
-        anchor: 'start' | 'middle' | 'end';
+        anchor?: 'start' | 'middle' | 'end';
         shape?: 'arrow' | 'spike' | 'arrow-filled' | ShapeRenderer;
         children?: Snippet;
         canvas?: boolean;
-    };
-</script>
+    }
+    import type {
+        PlotContext,
+        DataRecord,
+        BaseMarkProps,
+        ChannelAccessor,
+        FacetContext,
+        PlotDefaults
+    } from '../types/index.js';
 
-<script lang="ts">
     import { getContext, type Snippet } from 'svelte';
     import { pathRound as path } from 'd3-path';
 
     import { resolveChannel, resolveProp, resolveStyles } from '../helpers/resolve.js';
-    import { projectXY } from '../helpers/scales.js';
-    import { sort } from '../index.js';
+    import { sort } from '..';
     import Mark from '../Mark.svelte';
     //import DotCanvas from './helpers/DotCanvas.svelte';
     import { maybeData, testFilter, isValid } from '../helpers/index.js';