svelteplot 0.2.10-pr-110.0 → 0.2.10-pr-110.2

package/dist/marks/Arrow.svelte

@@ -67,9 +67,12 @@
 
     const {
         data = [{}],
-        class: className = null,
+        class: className = '',
         ...options
-    }: ArrowMarkProps = $derived({ ...DEFAULTS, ...markProps });
+    }: ArrowMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/BoxX.svelte

@@ -1,23 +1,37 @@
 <!-- @component
     Creates a horizontal box plot for visualizing data distribution with quartiles and outliers
 -->
+<script module lang="ts">
+    export type BoxXMarkProps = BoxYMarkProps;
+</script>
+
 <script lang="ts">
     import GroupMultiple from './helpers/GroupMultiple.svelte';
-    import type { BoxProps } from './BoxY.svelte';
+    import type { BoxYMarkProps } from './BoxY.svelte';
     import { BarX, TickX, RuleY, Dot, groupY } from '../index.js';
     import { resolveChannel } from '../helpers/resolve.js';
+    import { getContext } from 'svelte';
+    import type { PlotDefaults } from '../types.js';
 
-    let {
+    let markProps: BoxXMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').box,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').boxX
+    };
+    const {
         data = [{}],
-        x,
-        y,
-        rule,
         bar,
-        tickMedian = true,
-        tickMinMax = false,
+        rule,
+        tickMedian,
+        tickMinMax,
         dot,
-        class: className = null
-    }: BoxProps = $props();
+        x,
+        y,
+        class: className = ''
+    }: BoxXMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { data: grouped } = $derived(
         groupY(

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

@@ -1,5 +1,6 @@
-import type { BoxProps } from './BoxY.svelte';
+export type BoxXMarkProps = BoxYMarkProps;
+import type { BoxYMarkProps } from './BoxY.svelte';
 /** Creates a horizontal box plot for visualizing data distribution with quartiles and outliers */
-declare const BoxX: import("svelte").Component<BoxProps, {}, "">;
+declare const BoxX: import("svelte").Component<BoxYMarkProps, {}, "">;
 type BoxX = ReturnType<typeof BoxX>;
 export default BoxX;

package/dist/marks/BoxY.svelte

@@ -2,7 +2,7 @@
     Creates a vertical box plot for visualizing data distribution with quartiles and outliers
 -->
 <script lang="ts" module>
-    export type BoxProps = {
+    export type BoxYMarkProps = Pick<BaseMarkProps, 'class'> & {
         data: DataRecord[];
         x: ChannelAccessor;
         y: ChannelAccessor;
@@ -31,21 +31,31 @@
 
 <script lang="ts">
     import GroupMultiple from './helpers/GroupMultiple.svelte';
-    import type { ChannelAccessor, DataRecord } from '../types.js';
+    import type { BaseMarkProps, ChannelAccessor, DataRecord } from '../types.js';
     import { groupX, BarY, TickY, RuleX, Dot } from '../index.js';
     import { resolveChannel } from '../helpers/resolve.js';
+    import { getContext } from 'svelte';
+    import type { PlotDefaults } from '../types.js';
 
-    let {
+    let markProps: BoxYMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').box,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').boxY
+    };
+    const {
         data = [{}],
-        x,
-        y,
-        rule,
+        class: className = '',
         bar,
-        tickMedian = true,
-        tickMinMax = false,
+        rule,
+        tickMedian,
+        tickMinMax,
         dot,
-        class: className = null
-    }: BoxProps = $props();
+        x,
+        y
+    }: BoxYMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     let { data: grouped } = $derived(
         groupX(

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

@@ -1,4 +1,4 @@
-export type BoxProps = {
+export type BoxYMarkProps = Pick<BaseMarkProps, 'class'> & {
     data: DataRecord[];
     x: ChannelAccessor;
     y: ChannelAccessor;
@@ -23,8 +23,8 @@ export type BoxProps = {
      */
     dot: Record<string, ChannelAccessor>;
 };
-import type { ChannelAccessor, DataRecord } from '../types.js';
+import type { BaseMarkProps, ChannelAccessor, DataRecord } from '../types.js';
 /** Creates a vertical box plot for visualizing data distribution with quartiles and outliers */
-declare const BoxY: import("svelte").Component<BoxProps, {}, "">;
+declare const BoxY: import("svelte").Component<BoxYMarkProps, {}, "">;
 type BoxY = ReturnType<typeof BoxY>;
 export default BoxY;

package/dist/marks/Brush.svelte

@@ -44,27 +44,41 @@
     import { getContext } from 'svelte';
     import Frame from './Frame.svelte';
     import Rect from './Rect.svelte';
-    import type { BaseMarkProps, PlotContext } from '../types.js';
+    import type { BaseMarkProps, PlotContext, PlotDefaults } from '../types.js';
     import { clientToLayerCoordinates } from './helpers/events.js';
 
-    let {
-        brush = $bindable({ enabled: false }),
-        stroke = 'currentColor',
+    let { brush = $bindable(), ...markProps }: BrushMarkProps = $props();
+
+    const DEFAULTS = {
+        stroke: 'currentColor',
+        strokeDasharray: '2,3',
+        strokeOpacity: 0.6,
+        resizeHandleSize: 10,
+        constrainToDomain: false,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').brush
+    };
+
+    const {
+        data = [{}],
+        stroke,
         strokeWidth,
-        strokeDasharray = '2,3',
-        strokeOpacity = 0.6,
+        strokeDasharray,
+        strokeOpacity,
         strokeLinecap,
         strokeDashoffset,
         strokeLinejoin,
         strokeMiterlimit,
         cursor: forceCursor,
         limitDimension = false,
-        constrainToDomain = false,
-        resizeHandleSize = 10,
+        constrainToDomain,
+        resizeHandleSize,
         onbrushstart,
         onbrushend,
         onbrush
-    }: BrushMarkProps = $props();
+    }: BrushMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());
@@ -361,4 +375,10 @@
         {strokeMiterlimit}
         {strokeWidth} />
 {/if}
-<Frame fill="transparent" inset={-20} {cursor} {onpointerdown} {onpointermove} />
+<Frame
+    fill="transparent"
+    stroke="transparent"
+    inset={-20}
+    {cursor}
+    {onpointerdown}
+    {onpointermove} />

package/dist/marks/BrushX.svelte

@@ -4,8 +4,14 @@
 
 <script lang="ts">
     import Brush, { type BrushMarkProps } from './Brush.svelte';
+    import type { PlotDefaults } from '../types.js';
+    import { getContext } from 'svelte';
 
-    let { brush, ...restProps }: BrushXMarkProps = $props();
+    let { brush = $bindable(), ...options }: BrushXMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').brush,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').brushX
+    };
 </script>
 
-<Brush bind:brush limitDimension="x" {...restProps} />
+<Brush bind:brush limitDimension="x" {...DEFAULTS} {...options} />

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

@@ -1,5 +1,5 @@
 export type BrushXMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
 import { type BrushMarkProps } from './Brush.svelte';
-declare const BrushX: import("svelte").Component<BrushXMarkProps, {}, "">;
+declare const BrushX: import("svelte").Component<BrushXMarkProps, {}, "brush">;
 type BrushX = ReturnType<typeof BrushX>;
 export default BrushX;

package/dist/marks/BrushY.svelte

@@ -4,8 +4,14 @@
 
 <script lang="ts">
     import Brush, { type BrushMarkProps } from './Brush.svelte';
+    import type { PlotDefaults } from '../types.js';
+    import { getContext } from 'svelte';
 
-    let { brush, ...restProps }: BrushYMarkProps = $props();
+    let { brush = $bindable(), ...options }: BrushYMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').brush,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').brushY
+    };
 </script>
 
-<Brush bind:brush limitDimension="y" {...restProps} />
+<Brush bind:brush limitDimension="y" {...DEFAULTS} {...options} />

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

@@ -1,5 +1,5 @@
 export type BrushYMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
 import { type BrushMarkProps } from './Brush.svelte';
-declare const BrushY: import("svelte").Component<BrushYMarkProps, {}, "">;
+declare const BrushY: import("svelte").Component<BrushYMarkProps, {}, "brush">;
 type BrushY = ReturnType<typeof BrushY>;
 export default BrushY;

package/dist/marks/Cell.svelte

@@ -8,7 +8,8 @@
         DataRecord,
         BaseMarkProps,
         BaseRectMarkProps,
-        ChannelAccessor
+        ChannelAccessor,
+        PlotDefaults
     } from '../types.js';
 
     export type CellMarkProps = BaseMarkProps &
@@ -29,7 +30,20 @@
     import { isValid } from '../helpers/isValid.js';
     import RectPath from './helpers/RectPath.svelte';
 
-    let { data = [{}], class: className = null, ...options }: CellMarkProps = $props();
+    let markProps: CellMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').cell
+    };
+
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: CellMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/Geo.svelte

@@ -22,7 +22,8 @@
         PlotContext,
         BaseMarkProps,
         ConstantAccessor,
-        LinkableMarkProps
+        LinkableMarkProps,
+        PlotDefaults
     } from '../types.js';
     import Mark from '../Mark.svelte';
     import { geoPath } from 'd3-geo';
@@ -38,14 +39,23 @@
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());
 
-    let {
+    let markProps: GeoMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').geo
+    };
+
+    const {
         data = [{}],
         canvas = false,
         geoType,
         dragRotate,
-        class: className = null,
+        class: className = '',
         ...options
-    }: GeoMarkProps = $props();
+    }: GeoMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const path = $derived(
         callWithProps(geoPath, [plot.scales.projection], {

package/dist/marks/Graticule.svelte

@@ -17,17 +17,26 @@
     import Geo from './Geo.svelte';
     import { geoGraticule } from 'd3-geo';
     import { getContext } from 'svelte';
+    import type { PlotDefaults } from '../types.js';
+
+    let markProps: GraticuleMarkProps = $props();
 
     const DEFAULTS = {
-        graticuleStep: 10,
-        ...getContext<Partial<PlotDefaults>>('svelteplot/defaults')
+        ...getContext<PlotDefaults>('svelteplot/_defaults').graticule
     };
 
-    let { step = DEFAULTS.graticuleStep, stepX, stepY, ...options }: GraticuleMarkProps = $props();
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: GraticuleMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     let graticule = $derived.by(() => {
         const graticule = geoGraticule();
-        graticule.stepMinor([stepX || step, stepY || step]);
+        graticule.stepMinor([options.stepX || options.step, options.stepY || options.step]);
         return graticule;
     });
 </script>

package/dist/marks/GridX.svelte

@@ -11,13 +11,27 @@
 <script lang="ts">
     import { getContext } from 'svelte';
     import Mark from '../Mark.svelte';
-    import type { PlotContext, BaseMarkProps, RawValue } from '../types.js';
+    import type { PlotContext, BaseMarkProps, RawValue, PlotDefaults } from '../types.js';
     import { resolveChannel, resolveStyles } from '../helpers/resolve.js';
     import { autoTicks } from '../helpers/autoTicks.js';
     import { testFilter } from '../helpers/index.js';
     import { RAW_VALUE } from '../transforms/recordize.js';
 
-    let { data = [], automatic = false, ...options }: GridXMarkProps = $props();
+    let markProps: GridXMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').grid,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').gridX
+    };
+
+    const {
+        data = [],
+        automatic = false,
+        ...options
+    }: GridXMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/GridY.svelte

@@ -11,13 +11,27 @@
 <script lang="ts">
     import { getContext } from 'svelte';
     import Mark from '../Mark.svelte';
-    import type { PlotContext, BaseMarkProps, RawValue } from '../types.js';
+    import type { PlotContext, BaseMarkProps, RawValue, PlotDefaults } from '../types.js';
     import { resolveChannel, resolveStyles } from '../helpers/resolve.js';
     import { autoTicks } from '../helpers/autoTicks.js';
     import { testFilter } from '../helpers/index.js';
     import { RAW_VALUE } from '../transforms/recordize.js';
 
-    let { data = [], automatic = false, ...options }: GridYMarkProps = $props();
+    let markProps: GridYMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').grid,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').gridY
+    };
+
+    const {
+        data = [],
+        automatic = false,
+        ...options
+    }: GridYMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/Line.svelte

@@ -47,22 +47,36 @@
     import { pick } from 'es-toolkit';
     import LineCanvas from './helpers/LineCanvas.svelte';
 
-    import type { RawValue } from '../types.js';
+    import type { RawValue, PlotDefaults } from '../types.js';
     import { isValid } from '../helpers/index.js';
     import { sort } from '../transforms/sort.js';
     import { recordizeXY } from '../transforms/recordize.js';
     import GroupMultiple from './helpers/GroupMultiple.svelte';
 
-    let {
+    let markProps: LineMarkProps = $props();
+
+    const DEFAULTS: LineMarkProps = {
+        curve: 'auto',
+        tension: 0,
+        canvas: false,
+        class: null,
+        lineClass: null,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').line
+    };
+
+    const {
         data = [{}],
-        curve = 'auto',
-        tension = 0,
+        curve,
+        tension,
         text,
-        canvas = false,
-        class: className = null,
-        lineClass = null,
+        canvas,
+        class: className,
+        lineClass,
         ...options
-    }: LineMarkProps = $props();
+    }: LineMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const args = $derived(sort(recordizeXY({ data, ...options })));
 

package/dist/marks/Link.svelte

@@ -28,7 +28,8 @@
         CurveName,
         MarkerOptions,
         RawValue,
-        ScaledDataRecord
+        ScaledDataRecord,
+        PlotDefaults
     } from '../types.js';
     import { resolveChannel, resolveProp, resolveStyles } from '../helpers/resolve.js';
     import { maybeData } from '../helpers/index.js';
@@ -41,14 +42,21 @@
     import { geoPath } from 'd3-geo';
     import { pick } from 'es-toolkit';
 
-    let {
+    let markProps: LinkMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').link
+    };
+    const {
         data = [{}],
         curve = 'auto',
         tension = 0,
         text,
-        class: className = null,
+        class: className = '',
         ...options
-    }: LinkMarkProps = $props();
+    }: LinkMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());

package/dist/marks/Pointer.svelte

@@ -21,7 +21,7 @@
 
 <script lang="ts">
     import { getContext, type Snippet } from 'svelte';
-    import type { PlotContext } from '../types.js';
+    import type { PlotContext, PlotDefaults } from '../types.js';
     import { groups as d3Groups } from 'd3-array';
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
@@ -33,7 +33,13 @@
     import isDataRecord from '../helpers/isDataRecord.js';
     import { RAW_VALUE } from '../transforms/recordize.js';
 
-    let {
+    let markProps: PointerMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').pointer
+    };
+
+    const {
         data = [{}],
         children,
         x,
@@ -41,7 +47,10 @@
         z,
         maxDistance = 15,
         onupdate = null
-    }: PointerMarkProps = $props();
+    }: PointerMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     let selectedData = $state([]);
 

package/dist/marks/Rect.svelte

@@ -26,12 +26,26 @@
         DataRecord,
         BaseMarkProps,
         BaseRectMarkProps,
-        ChannelAccessor
+        ChannelAccessor,
+        PlotDefaults
     } from '../types.js';
     import GroupMultiple from './helpers/GroupMultiple.svelte';
     import RectPath from './helpers/RectPath.svelte';
 
-    let { data = [{}], class: className = 'rect', ...options }: RectMarkProps = $props();
+    let markProps: RectMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rect
+    };
+
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: RectMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());

package/dist/marks/RectX.svelte

@@ -8,11 +8,25 @@
 <script lang="ts">
     import Rect, { type RectMarkProps } from './Rect.svelte';
     import { intervalY, stackX, recordizeX } from '../index.js';
-    import type { PlotContext } from '../types.js';
+    import type { PlotContext, PlotDefaults } from '../types.js';
     import { getContext } from 'svelte';
     import type { StackOptions } from '../transforms/stack';
 
-    let { data = [{}], stack, ...options }: RectXMarkProps = $props();
+    let markProps: RectXMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rect,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rectX
+    };
+
+    const {
+        data = [{}],
+        stack,
+        ...options
+    }: RectXMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());

package/dist/marks/RectY.svelte

@@ -8,11 +8,25 @@
 <script lang="ts">
     import Rect, { type RectMarkProps } from './Rect.svelte';
     import { intervalX, stackY, recordizeY } from '../index.js';
-    import type { PlotContext } from '../types.js';
+    import type { PlotContext, PlotDefaults } from '../types.js';
     import { getContext } from 'svelte';
     import type { StackOptions } from '../transforms/stack';
 
-    let { data = [{}], stack, ...options }: RectYMarkProps = $props();
+    let markProps: RectYMarkProps = $props();
+
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rect,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rectY
+    };
+
+    const {
+        data = [{}],
+        stack,
+        ...options
+    }: RectYMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/RuleX.svelte

@@ -24,10 +24,23 @@
         DataRecord,
         BaseMarkProps,
         ConstantAccessor,
-        ChannelAccessor
+        ChannelAccessor,
+        PlotDefaults
     } from '../types.js';
 
-    let { data = [{}], class: className = null, ...options }: RuleXMarkProps = $props();
+    let markProps: RuleXMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rule,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').ruleX
+    };
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: RuleXMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/RuleY.svelte

@@ -24,10 +24,23 @@
         DataRecord,
         BaseMarkProps,
         ConstantAccessor,
-        ChannelAccessor
+        ChannelAccessor,
+        PlotDefaults
     } from '../types.js';
 
-    let { data = [{}], class: className = null, ...options }: RuleYMarkProps = $props();
+    let markProps: RuleYMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').rule,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').ruleY
+    };
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: RuleYMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/marks/Sphere.svelte

@@ -8,8 +8,21 @@
 
 <script lang="ts">
     import Geo from './Geo.svelte';
+    import { getContext } from 'svelte';
+    import type { PlotDefaults } from '../types.js';
 
-    let { ...args }: SphereMarkProps = $props();
+    let markProps: SphereMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').sphere
+    };
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: SphereMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 </script>
 
-<Geo data={[{ type: 'Sphere' }]} {...args} geoType="sphere" />
+<Geo {data} {...options} geoType="sphere" />

package/dist/marks/Spike.svelte

@@ -8,16 +8,26 @@
 
 <script lang="ts">
     import Vector, { type VectorMarkProps } from './Vector.svelte';
-    let { data = [{}], ...options }: SpikeMarkProps = $props();
+    import type { PlotDefaults } from '../types.js';
+    import { getContext } from 'svelte';
+
+    let markProps: SpikeMarkProps = $props();
+
+    const DEFAULTS = {
+        fill: 'currentColor',
+        fillOpacity: 0.3,
+        strokeWidth: 1,
+        anchor: 'start' as const,
+        stroke: 'currentColor',
+        sort: { channel: '-y' },
+        shape: 'spike' as const,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').spike
+    };
+
+    const { data = [{}], ...options }: SpikeMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 </script>
 
-<Vector
-    {data}
-    fill={options.stroke || 'currentColor'}
-    fillOpacity={0.3}
-    strokeWidth={1}
-    anchor="start"
-    stroke="currentColor"
-    sort={{ channel: '-y' }}
-    {...options}
-    shape="spike" />
+<Vector {data} {...options} />

package/dist/marks/Text.svelte

@@ -39,13 +39,30 @@
         DataRecord,
         BaseMarkProps,
         ConstantAccessor,
-        ChannelAccessor
+        ChannelAccessor,
+        PlotDefaults
     } from '../types.js';
     import { resolveProp, resolveStyles } from '../helpers/resolve.js';
     import Mark from '../Mark.svelte';
     import { sort } from '../index.js';
 
-    let { data = [{}], class: className = null, ...options }: TextMarkProps = $props();
+    const DEFAULTS = {
+        fontSize: 12,
+        fontWeight: 500,
+        strokeWidth: 1.6,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').text
+    };
+
+    let markProps: TextMarkProps = $props();
+
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: TextMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());
@@ -54,7 +71,7 @@
         bottom: 'auto',
         middle: 'central',
         top: 'hanging'
-    };
+    } as const;
 
     const args = $derived(
         sort({
@@ -77,9 +94,10 @@
         'strokeOpacity',
         'fillOpacity'
     ]}
+    required={['x', 'y']}
     {...args}>
     {#snippet children({ mark, scaledData, usedScales })}
-        <GroupMultiple class="text {className || null}" length={className ? 2 : args.data.length}>
+        <GroupMultiple class="text {className}" length={className ? 2 : args.data.length}>
             {#each scaledData as d, i (i)}
                 {#if d.valid}
                     {@const title = resolveProp(args.title, d.datum, '')}

package/dist/marks/TickX.svelte

@@ -31,7 +31,8 @@
         BaseMarkProps,
         ChannelAccessor,
         DataRow,
-        FacetContext
+        FacetContext,
+        PlotDefaults
     } from '../types.js';
     import { recordizeX } from '../index.js';
     import { projectX, projectY } from '../helpers/scales.js';
@@ -41,7 +42,19 @@
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());
 
-    let { data = [{}], ...options }: TickXMarkProps = $props();
+    let markProps: TickXMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').tick,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').tickX
+    };
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: TickXMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     let args = $derived(recordizeX({ data, ...options }, { withIndex: false }));
 

package/dist/marks/TickY.svelte

@@ -32,7 +32,8 @@
         ChannelAccessor,
         DataRow,
         FacetContext,
-        ConstantAccessor
+        ConstantAccessor,
+        PlotDefaults
     } from '../types.js';
     import { recordizeY } from '../index.js';
     import { projectX, projectY } from '../helpers/scales.js';
@@ -42,7 +43,19 @@
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     let plot = $derived(getPlotState());
 
-    let { data = [{}], ...options }: TickYMarkProps = $props();
+    let markProps: TickYMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').tick,
+        ...getContext<PlotDefaults>('svelteplot/_defaults').tickY
+    };
+    const {
+        data = [{}],
+        class: className = '',
+        ...options
+    }: TickYMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     let args = $derived(recordizeY({ data, ...options }, { withIndex: false }));
 

package/dist/marks/Vector.svelte

@@ -9,7 +9,8 @@
         BaseMarkProps,
         ConstantAccessor,
         ChannelAccessor,
-        FacetContext
+        FacetContext,
+        PlotDefaults
     } from '../types.js';
 
     type D3Path = ReturnType<typeof import('d3-path').path>;
@@ -53,19 +54,26 @@
     const defaultRadius = 3.5;
 
     // The size of the arrowhead is proportional to its length, but we still allow
-    // the relative size of the head to be controlled via the mark’s width option;
+    // the relative size of the head to be controlled via the mark's width option;
     // doubling the default radius will produce an arrowhead that is twice as big.
-    // That said, we’ll probably want a arrow with a fixed head size, too.
+    // That said, we'll probably want a arrow with a fixed head size, too.
     const wingRatio = defaultRadius * 5;
 
-    let {
+    let markProps: VectorMarkProps = $props();
+    const DEFAULTS = {
+        ...getContext<PlotDefaults>('svelteplot/_defaults').vector
+    };
+    const {
         data = [{}],
         canvas,
         shape = 'arrow',
         anchor = 'middle',
         r = defaultRadius,
         ...options
-    }: VectorMarkProps = $props();
+    }: VectorMarkProps = $derived({
+        ...DEFAULTS,
+        ...markProps
+    });
 
     const { getPlotState } = getContext<PlotContext>('svelteplot');
     const plot = $derived(getPlotState());

package/dist/types.d.ts

@@ -32,6 +32,9 @@ import type { RuleYMarkProps } from './marks/RuleY.svelte';
 import type { TickYMarkProps } from './marks/TickY.svelte';
 import type { GridYMarkProps } from './marks/GridY.svelte';
 import type { GridXMarkProps } from './marks/GridX.svelte';
+import type { PointerMarkProps } from './marks/Pointer.svelte';
+import type { BoxXMarkProps } from './marks/BoxX.svelte';
+import type { BoxYMarkProps } from './marks/BoxY.svelte';
 export type MarkType = 'area' | 'arrow' | 'axisX' | 'axisY' | 'barX' | 'barY' | 'cell' | 'dot' | 'vector' | 'frame' | 'geo' | 'gridX' | 'gridY' | 'line' | 'rect' | 'regression' | 'ruleX' | 'ruleY' | 'swoopyArrow' | 'text' | 'tickX' | 'tickY';
 export type ScaleName = 'x' | 'y' | 'r' | 'color' | 'opacity' | 'length' | 'symbol' | 'fx' | 'fy' | 'projection';
 export type ScaleType = 'linear' | 'pow' | 'sqrt' | 'log' | 'symlog' | 'time' | 'point' | 'ordinal' | 'sequential' | 'band' | 'categorical' | 'cyclical' | 'threshold' | 'quantile-cont' | 'quantile' | 'quantize' | 'diverging' | 'diverging-log' | 'diverging-pow' | 'diverging-sqrt' | 'diverging-symlog';
@@ -601,7 +604,7 @@ export type AutoMarginStores = {
     autoMarginRight: Writable<Map<string, number>>;
     autoMarginBottom: Writable<Map<string, number>>;
 };
-type IgnoreDefaults = 'data' | 'facet' | ChannelName | 'title' | 'automatic';
+type IgnoreDefaults = 'data' | 'facet' | ChannelName | 'title' | 'automatic' | 'children';
 /**
  * these are the default options for the plot marks that can be set using
  * the 'svelteplot/defaults' context.
@@ -700,6 +703,18 @@ export type PlotDefaults = {
      * default props for barY marks
      */
     barY: Partial<Omit<BarXMarkProps, IgnoreDefaults>>;
+    /**
+     * default props for box marks, applied to boxX and boxY marks
+     */
+    box: Partial<Omit<BoxXMarkProps, IgnoreDefaults>>;
+    /**
+     * default props for boxX marks
+     */
+    boxX: Partial<Omit<BoxXMarkProps, IgnoreDefaults>>;
+    /**
+     * default props for boxY marks
+     */
+    boxY: Partial<Omit<BoxYMarkProps, IgnoreDefaults>>;
     /**
      * default props for brush marks, applied to brush, brushX and brushY marks
      */
@@ -760,6 +775,10 @@ export type PlotDefaults = {
      * default props for link marks
      */
     link: Partial<Omit<LinkMarkProps, IgnoreDefaults>>;
+    /**
+     * default props for pointer marks
+     */
+    pointer: Partial<Omit<PointerMarkProps, IgnoreDefaults>>;
     /**
      * default props for rect marks, applied to rect and rectX marks
      */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "svelteplot",
-    "version": "0.2.10-pr-110.0",
+    "version": "0.2.10-pr-110.2",
     "license": "ISC",
     "author": {
         "name": "Gregor Aisch",