svelteplot 0.3.8-pr-134.2 → 0.3.8-pr-141.0

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 (5) hide show
  1. package/dist/helpers/getBaseStyles.js +6 -1
  2. package/dist/marks/Text.svelte +15 -5
  3. package/dist/marks/Text.svelte.d.ts +18 -9
  4. package/dist/types/mark.d.ts +1 -1
  5. package/package.json +1 -1
package/dist/helpers/getBaseStyles.js CHANGED
@@ -11,11 +11,16 @@ const styleProps = {
11
11
  blend: 'mix-blend-mode',
12
12
  clipPath: 'clip-path',
13
13
  mask: 'mask',
14
+ fontFamily: 'font-family',
14
15
  fontSize: 'font-size',
15
- fontWeight: 'font-weight',
16
16
  fontStyle: 'font-style',
17
+ fontWeight: 'font-weight',
17
18
  textAnchor: 'text-anchor',
18
19
  fontVariant: 'font-variant',
20
+ letterSpacing: 'letter-spacing',
21
+ textDecoration: 'text-decoration',
22
+ textTransform: 'text-transform',
23
+ wordSpacing: 'word-spacing',
19
24
  cursor: 'cursor',
20
25
  pointerEvents: 'pointer-events'
21
26
  };
package/dist/marks/Text.svelte CHANGED
@@ -4,17 +4,27 @@
4
4
  -->
5
5
 
6
6
  <script lang="ts" generics="Datum extends DataRecord">
7
+ import type * as CSS from 'csstype';
8
+
7
9
  interface TextMarkProps extends BaseMarkProps<Datum>, LinkableMarkProps<Datum> {
8
- data: Datum[];
9
- x: ChannelAccessor<Datum>;
10
- y: ChannelAccessor<Datum>;
10
+ data?: Datum[];
11
+ x?: ChannelAccessor<Datum>;
12
+ y?: ChannelAccessor<Datum>;
11
13
  children?: Snippet;
12
14
  text: ConstantAccessor<string | null | false | undefined, Datum>;
13
15
  title?: ConstantAccessor<string, Datum>;
14
16
  /**
15
17
  * the font size of the text
16
18
  */
17
- fontSize?: ConstantAccessor<number, Datum>;
19
+ fontFamily?: ConstantAccessor<CSS.Property.FontFamily, Datum>;
20
+ fontSize?: ConstantAccessor<CSS.Property.FontSize, Datum>;
21
+ fontWeight?: ConstantAccessor<CSS.Property.FontWeight, Datum>;
22
+ fontStyle?: ConstantAccessor<CSS.Property.FontStyle, Datum>;
23
+ fontVariant?: ConstantAccessor<CSS.Property.FontVariant, Datum>;
24
+ letterSpacing?: ConstantAccessor<CSS.Property.LetterSpacing, Datum>;
25
+ wordSpacing?: ConstantAccessor<CSS.Property.WordSpacing, Datum>;
26
+ textTransform?: ConstantAccessor<CSS.Property.TextTransform, Datum>;
27
+ textDecoration?: ConstantAccessor<CSS.Property.TextDecoration, Datum>;
18
28
  /**
19
29
  * if you want to apply class names to individual text elements
20
30
  */
@@ -62,7 +72,7 @@
62
72
 
63
73
  const DEFAULTS = {
64
74
  fontSize: 12,
65
- fontWeight: 500,
75
+ c: 500,
66
76
  strokeWidth: 1.6,
67
77
  frameAnchor: 'center',
68
78
  lineHeight: 1.1,
package/dist/marks/Text.svelte.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import type * as CSS from 'csstype';
1
2
  import { type Snippet } from 'svelte';
2
3
  import type { DataRecord, ConstantAccessor, ChannelAccessor, RawValue, LinkableMarkProps } from '../types/index.js';
3
4
  declare class __sveltets_Render<Datum extends DataRecord> {
@@ -17,16 +18,16 @@ declare class __sveltets_Render<Datum extends DataRecord> {
17
18
  stroke: ChannelAccessor<Datum>;
18
19
  strokeWidth: ConstantAccessor<number, Datum>;
19
20
  strokeOpacity: ConstantAccessor<number, Datum>;
20
- strokeLinejoin: ConstantAccessor<import("csstype").Property.StrokeLinejoin, Datum>;
21
- strokeLinecap: ConstantAccessor<import("csstype").Property.StrokeLinecap, Datum>;
21
+ strokeLinejoin: ConstantAccessor<CSS.Property.StrokeLinejoin, Datum>;
22
+ strokeLinecap: ConstantAccessor<CSS.Property.StrokeLinecap, Datum>;
22
23
  strokeMiterlimit: ConstantAccessor<number, Datum>;
23
24
  opacity: ChannelAccessor<Datum>;
24
25
  strokeDasharray: ConstantAccessor<string, Datum>;
25
26
  strokeDashoffset: ConstantAccessor<number, Datum>;
26
- mixBlendMode: ConstantAccessor<import("csstype").Property.MixBlendMode, Datum>;
27
+ mixBlendMode: ConstantAccessor<CSS.Property.MixBlendMode, Datum>;
27
28
  clipPath: string;
28
29
  imageFilter: ConstantAccessor<string, Datum>;
29
- shapeRendering: ConstantAccessor<import("csstype").Property.ShapeRendering, Datum>;
30
+ shapeRendering: ConstantAccessor<CSS.Property.ShapeRendering, Datum>;
30
31
  paintOrder: ConstantAccessor<string, Datum>;
31
32
  onclick?: import("svelte/elements").MouseEventHandler<SVGPathElement>;
32
33
  ondblclick?: import("svelte/elements").MouseEventHandler<SVGPathElement>;
@@ -59,18 +60,26 @@ declare class __sveltets_Render<Datum extends DataRecord> {
59
60
  oncontextmenu?: import("svelte/elements").MouseEventHandler<SVGPathElement>;
60
61
  onwheel?: import("svelte/elements").MouseEventHandler<SVGPathElement>;
61
62
  class: string | null;
62
- cursor: ConstantAccessor<import("csstype").Property.Cursor, Datum>;
63
+ cursor: ConstantAccessor<CSS.Property.Cursor, Datum>;
63
64
  }> & LinkableMarkProps<Datum> & {
64
- data: Datum[];
65
- x: ChannelAccessor<Datum>;
66
- y: ChannelAccessor<Datum>;
65
+ data?: Datum[] | undefined;
66
+ x?: ChannelAccessor<Datum>;
67
+ y?: ChannelAccessor<Datum>;
67
68
  children?: Snippet;
68
69
  text: ConstantAccessor<string | false | null | undefined, Datum>;
69
70
  title?: ConstantAccessor<string, Datum>;
70
71
  /**
71
72
  * the font size of the text
72
73
  */
73
- fontSize?: ConstantAccessor<number, Datum>;
74
+ fontFamily?: ConstantAccessor<CSS.Property.FontFamily, Datum>;
75
+ fontSize?: ConstantAccessor<CSS.Property.FontSize<0 | (string & {})>, Datum>;
76
+ fontWeight?: ConstantAccessor<CSS.Property.FontWeight, Datum>;
77
+ fontStyle?: ConstantAccessor<CSS.Property.FontStyle, Datum>;
78
+ fontVariant?: ConstantAccessor<CSS.Property.FontVariant, Datum>;
79
+ letterSpacing?: ConstantAccessor<CSS.Property.LetterSpacing<0 | (string & {})>, Datum>;
80
+ wordSpacing?: ConstantAccessor<CSS.Property.WordSpacing<0 | (string & {})>, Datum>;
81
+ textTransform?: ConstantAccessor<CSS.Property.TextTransform, Datum>;
82
+ textDecoration?: ConstantAccessor<CSS.Property.TextDecoration<0 | (string & {})>, Datum>;
74
83
  /**
75
84
  * if you want to apply class names to individual text elements
76
85
  */
package/dist/types/mark.d.ts CHANGED
@@ -7,7 +7,7 @@ export type Mark<T> = {
7
7
  options: T;
8
8
  };
9
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
- 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';
10
+ export type MarkStyleProps = 'strokeDasharray' | 'strokeLinejoin' | 'strokeLinecap' | 'opacity' | 'cursor' | 'pointerEvents' | 'blend' | 'fill' | 'fillOpacity' | 'fontFamily' | 'fontWeight' | 'fontVariant' | 'fontSize' | 'fontStyle' | 'letterSpacing' | 'wordSpacing' | 'stroke' | 'strokeWidth' | 'strokeOpacity' | 'x' | 'y' | 'clipPath' | 'mask' | 'filter' | 'angle' | 'radius' | 'symbol' | 'textAnchor' | 'textTransform' | 'textDecoration' | 'width';
11
11
  import type { MouseEventHandler } from 'svelte/elements';
12
12
  import type { ChannelAccessor, ConstantAccessor, DataRecord, RawValue } from './index.js';
13
13
  import type * as CSS from 'csstype';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "svelteplot",
3
- "version": "0.3.8-pr-134.2",
3
+ "version": "0.3.8-pr-141.0",
4
4
  "license": "ISC",
5
5
  "author": {
6
6
  "name": "Gregor Aisch",