svelteplot 0.3.7-pr-132.1 → 0.3.7-pr-131.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/Mark.svelte +1 -1
  2. package/dist/Mark.svelte.d.ts +1 -1
  3. package/dist/marks/CustomMark.svelte +46 -27
  4. package/dist/types/channel.d.ts +1 -0
  5. package/dist/types/data.d.ts +4 -2
  6. package/dist/types/mark.d.ts +1 -1
  7. package/package.json +20 -20
package/dist/Mark.svelte CHANGED
@@ -11,7 +11,7 @@
11
11
  {
12
12
  mark: Mark<GenericMarkOptions>;
13
13
  usedScales: ReturnType<typeof getUsedScales>;
14
- scaledData: ScaledDataRecord[];
14
+ scaledData: ScaledDataRecord<Datum>[];
15
15
  }
16
16
  ]
17
17
  >;
package/dist/Mark.svelte.d.ts CHANGED
@@ -71,7 +71,7 @@ declare class __sveltets_Render<Datum extends DataRecord> {
71
71
  children?: Snippet<[{
72
72
  mark: any;
73
73
  usedScales: ReturnType<typeof getUsedScales>;
74
- scaledData: ScaledDataRecord[];
74
+ scaledData: ScaledDataRecord<Datum>[];
75
75
  }]> | undefined;
76
76
  defaults?: Partial<Record<ScaledChannelName, RawValue>>;
77
77
  };
package/dist/marks/CustomMark.svelte CHANGED
@@ -4,10 +4,18 @@
4
4
  -->
5
5
  <script lang="ts" generics="Datum extends DataRecord">
6
6
  interface CustomMarkProps extends BaseMarkProps<Datum> {
7
- data: Datum[];
7
+ data?: Datum[];
8
8
  x?: ChannelAccessor<Datum>;
9
+ x1?: ChannelAccessor<Datum>;
10
+ x2?: ChannelAccessor<Datum>;
9
11
  y?: ChannelAccessor<Datum>;
10
- children: Snippet<[{ datum: Datum; x: number; y: number }]>;
12
+ y1?: ChannelAccessor<Datum>;
13
+ y2?: ChannelAccessor<Datum>;
14
+ r?: ChannelAccessor<Datum>;
15
+ mark?: Snippet<
16
+ [{ record: ScaledDataRecord<Datum>; index: number; usedScales: UsedScales }]
17
+ >;
18
+ marks?: Snippet<[{ records: ScaledDataRecord<Datum>[]; usedScales: UsedScales }]>;
11
19
  }
12
20
 
13
21
  import { getContext } from 'svelte';
@@ -15,36 +23,47 @@
15
23
  PlotContext,
16
24
  DataRecord,
17
25
  ChannelAccessor,
18
- BaseMarkProps
26
+ BaseMarkProps,
27
+ ScaledDataRecord,
28
+ UsedScales,
29
+ ScaledChannelName
19
30
  } from '../types/index.js';
20
31
  import type { Snippet } from 'svelte';
32
+ import { sort } from '../index.js';
21
33
 
22
- const { getPlotState } = getContext<PlotContext>('svelteplot');
23
- let plot = $derived(getPlotState());
34
+ import Mark from '../Mark.svelte';
24
35
 
25
- import { resolveChannel } from '../helpers/resolve.js';
26
- import { projectXY } from '../helpers/scales.js';
27
- import { isValid } from '../helpers/index.js';
28
- import GroupMultiple from './helpers/GroupMultiple.svelte';
36
+ let { data = [{} as Datum], mark, marks, ...options }: CustomMarkProps = $props();
29
37
 
30
- let {
31
- data = [{} as Datum],
32
- x,
33
- y,
34
- children,
35
- class: className = null
36
- }: CustomMarkProps = $props();
38
+ const args = $derived(sort({ data, ...options })) as CustomMarkProps;
39
+
40
+ const channels: ScaledChannelName[] = [
41
+ 'x',
42
+ 'x1',
43
+ 'x2',
44
+ 'y',
45
+ 'y1',
46
+ 'y2',
47
+ 'r',
48
+ 'fill',
49
+ 'stroke',
50
+ 'opacity',
51
+ 'fillOpacity',
52
+ 'strokeOpacity'
53
+ ];
37
54
  </script>
38
55
 
39
- <GroupMultiple class="g-custom-mark {className || ''}" length={className ? 2 : data.length}>
40
- {#each data as datum, i (i)}
41
- {@const x_ = resolveChannel<Datum>('x', datum, { x, y })}
42
- {@const y_ = resolveChannel<Datum>('y', datum, { x, y })}
43
- {#if isValid(x_) && isValid(y_)}
44
- {@const [px, py] = projectXY(plot.scales, x_, y_)}
45
- <g transform="translate({px}, {py})">
46
- {@render children({ datum, x: px, y: py })}
47
- </g>
56
+ <Mark type="custom" required={[]} channels={channels.filter((d) => !!options[d])} {...args}>
57
+ {#snippet children({ scaledData, usedScales })}
58
+ {#if marks}
59
+ {@render marks({ records: scaledData.filter((d) => d.valid), usedScales })}
60
+ {/if}
61
+ {#if mark}
62
+ {#each scaledData as datum, i (i)}
63
+ {#if datum.valid}
64
+ {@render mark({ record: datum, index: i, usedScales })}
65
+ {/if}
66
+ {/each}
48
67
  {/if}
49
- {/each}
50
- </GroupMultiple>
68
+ {/snippet}
69
+ </Mark>
package/dist/types/channel.d.ts CHANGED
@@ -8,4 +8,5 @@ export type ChannelAccessor<T = Record<string | symbol, RawValue>> = ChannelValu
8
8
  };
9
9
  export type ChannelValue<T = Record<string | symbol, RawValue>> = RawValue | keyof T | ((d: T) => RawValue) | null | undefined;
10
10
  export type ScaledChannelName = 'fill' | 'fillOpacity' | 'opacity' | 'r' | 'length' | 'stroke' | 'strokeOpacity' | 'symbol' | 'fx' | 'fy' | 'x' | 'x1' | 'x2' | 'y' | 'y1' | 'y2';
11
+ export type ScaledChannelType<T extends ScaledChannelName> = T extends 'fill' | 'stroke' | 'symbol' ? string : number;
11
12
  export type ChannelName = ScaledChannelName | 'z' | 'sort' | 'filter' | 'interval';
package/dist/types/data.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import type { ScaledChannelName } from './channel.js';
1
+ import type { ScaledChannelName, ScaledChannelType } from './channel.js';
2
2
  export type RawValue = number | Date | boolean | string | symbol;
3
3
  export type DataRecord<T = Record<string | symbol, RawValue>> = T & {
4
4
  ___orig___?: RawValue | [RawValue, RawValue];
@@ -6,7 +6,9 @@ export type DataRecord<T = Record<string | symbol, RawValue>> = T & {
6
6
  export type ResolvedDataRecord<T = Record<string | symbol, RawValue>> = Partial<Record<ScaledChannelName, any>> & {
7
7
  datum: DataRecord<T>;
8
8
  };
9
- export type ScaledDataRecord<T = Record<string | symbol, RawValue>> = Partial<Record<ScaledChannelName, number | string | boolean | undefined>> & {
9
+ export type ScaledDataRecord<T = Record<string | symbol, RawValue>> = Partial<{
10
+ [K in ScaledChannelName]?: ScaledChannelType<K>;
11
+ }> & {
10
12
  datum: DataRecord<T>;
11
13
  valid: Boolean;
12
14
  };
package/dist/types/mark.d.ts CHANGED
@@ -6,7 +6,7 @@ export type Mark<T> = {
6
6
  data: DataRecord<T>[];
7
7
  options: T;
8
8
  };
9
- export type MarkType = 'area' | 'arrow' | 'barX' | 'barY' | 'cell' | 'dot' | 'vector' | 'frame' | 'geo' | 'gridX' | 'gridY' | 'line' | 'rect' | 'regression' | 'ruleX' | 'ruleY' | 'swoopyArrow' | 'text' | 'tickX' | 'tickY';
9
+ export type MarkType = 'area' | 'arrow' | 'barX' | 'barY' | 'cell' | 'custom' | 'dot' | 'vector' | 'frame' | 'geo' | 'gridX' | 'gridY' | 'line' | 'rect' | 'regression' | 'ruleX' | 'ruleY' | 'swoopyArrow' | 'text' | 'tickX' | 'tickY';
10
10
  export type MarkStyleProps = 'strokeDasharray' | 'strokeLinejoin' | 'strokeLinecap' | 'opacity' | 'cursor' | 'pointerEvents' | 'blend' | 'fill' | 'fillOpacity' | 'fontWeight' | 'fontVariant' | 'fontSize' | 'fontStyle' | 'stroke' | 'strokeWidth' | 'strokeOpacity' | 'x' | 'y' | 'clipPath' | 'mask' | 'filter' | 'angle' | 'radius' | 'symbol' | 'textAnchor' | 'width';
11
11
  import type { MouseEventHandler } from 'svelte/elements';
12
12
  import type { ChannelAccessor, ConstantAccessor, DataRecord, RawValue } from './index.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "svelteplot",
3
- "version": "0.3.7-pr-132.1",
3
+ "version": "0.3.7-pr-131.1",
4
4
  "license": "ISC",
5
5
  "author": {
6
6
  "name": "Gregor Aisch",
@@ -54,10 +54,10 @@
54
54
  "@emotion/css": "^11.13.5",
55
55
  "@sveltejs/adapter-auto": "^6.0.1",
56
56
  "@sveltejs/adapter-static": "^3.0.8",
57
- "@sveltejs/eslint-config": "^8.2.0",
58
- "@sveltejs/kit": "^2.22.0",
59
- "@sveltejs/package": "^2.3.11",
60
- "@sveltejs/vite-plugin-svelte": "5.1.0",
57
+ "@sveltejs/eslint-config": "^8.3.4",
58
+ "@sveltejs/kit": "^2.27.1",
59
+ "@sveltejs/package": "^2.4.0",
60
+ "@sveltejs/vite-plugin-svelte": "5.1.1",
61
61
  "@sveltepress/theme-default": "^6.0.4",
62
62
  "@sveltepress/twoslash": "^1.2.2",
63
63
  "@sveltepress/vite": "^1.2.2",
@@ -77,33 +77,33 @@
77
77
  "@types/geojson": "^7946.0.16",
78
78
  "@types/topojson": "^3.2.6",
79
79
  "@types/topojson-client": "^3.1.5",
80
- "@typescript-eslint/eslint-plugin": "^8.34.1",
81
- "@typescript-eslint/parser": "^8.34.1",
80
+ "@typescript-eslint/eslint-plugin": "^8.39.0",
81
+ "@typescript-eslint/parser": "^8.39.0",
82
82
  "csstype": "^3.1.3",
83
83
  "d3-dsv": "^3.0.1",
84
84
  "d3-fetch": "^3.0.1",
85
85
  "d3-force": "^3.0.0",
86
- "eslint": "^9.29.0",
87
- "eslint-config-prettier": "^10.1.5",
88
- "eslint-plugin-svelte": "3.9.3",
86
+ "eslint": "^9.32.0",
87
+ "eslint-config-prettier": "^10.1.8",
88
+ "eslint-plugin-svelte": "3.11.0",
89
89
  "jsdom": "^26.1.0",
90
- "prettier": "^3.6.0",
90
+ "prettier": "^3.6.2",
91
91
  "prettier-plugin-svelte": "^3.4.0",
92
- "puppeteer": "^24.10.2",
92
+ "puppeteer": "^24.15.0",
93
93
  "remark-code-extra": "^1.0.1",
94
94
  "remark-code-frontmatter": "^1.0.0",
95
95
  "resize-observer-polyfill": "^1.5.1",
96
- "sass": "^1.89.2",
97
- "svelte-check": "^4.2.2",
98
- "svelte-eslint-parser": "1.2.0",
96
+ "sass": "^1.90.0",
97
+ "svelte-check": "^4.3.1",
98
+ "svelte-eslint-parser": "1.3.1",
99
99
  "svelte-highlight": "^7.8.3",
100
100
  "svg-path-parser": "^1.1.0",
101
101
  "topojson-client": "^3.1.0",
102
102
  "ts-essentials": "^10.1.1",
103
103
  "tslib": "^2.8.1",
104
- "typedoc": "^0.28.5",
105
- "typedoc-plugin-markdown": "^4.7.0",
106
- "typescript": "^5.8.3",
104
+ "typedoc": "^0.28.9",
105
+ "typedoc-plugin-markdown": "^4.8.0",
106
+ "typescript": "^5.9.2",
107
107
  "vite": "^6.3.5",
108
108
  "vitest": "^3.2.4",
109
109
  "vitest-matchmedia-mock": "^2.0.3"
@@ -124,9 +124,9 @@
124
124
  "d3-scale-chromatic": "^3.1.0",
125
125
  "d3-shape": "^3.2.0",
126
126
  "d3-time": "^3.1.0",
127
- "es-toolkit": "^1.39.4",
127
+ "es-toolkit": "^1.39.8",
128
128
  "fast-equals": "^5.2.2",
129
129
  "merge-deep": "^3.0.3",
130
- "svelte": "5.34.7"
130
+ "svelte": "5.37.3"
131
131
  }
132
132
  }