@astryxdesign/vega 0.1.6-canary.1b61ba6 → 0.1.6-canary.1d64659

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 (6) hide show
  1. package/dist/VegaChart.d.ts +3 -4
  2. package/dist/VegaChart.d.ts.map +1 -1
  3. package/dist/index.js +11 -11
  4. package/dist/index.mjs +11 -11
  5. package/package.json +3 -3
  6. package/src/VegaChart.tsx +14 -17
package/dist/VegaChart.d.ts CHANGED
@@ -29,9 +29,8 @@ import type { VegaChartProps } from './types';
29
29
  * it when `spec`, `parseConfig`, `parseOptions`, or `viewOptions` changes,
30
30
  * and calls `view.finalize()` on cleanup to release all runtime resources.
31
31
  *
32
- * Callbacks (`onReady`, `onError`) are non-reactive Effect Events -- they
33
- * always see the latest props and never re-run the View lifecycle, so you
34
- * don't need to memoize them. Pass stable references (or `useMemo`)
32
+ * Callbacks (`onReady`, `onError`) are stable across renders via refs --
33
+ * you don't need to memoize them. Pass stable references (or `useMemo`)
35
34
  * for `parseConfig`, `parseOptions`, `viewOptions`, and `data` to avoid
36
35
  * unnecessary re-renders.
37
36
  *
@@ -64,7 +63,7 @@ import type { VegaChartProps } from './types';
64
63
  * />
65
64
  * ```
66
65
  */
67
- export declare function VegaChart({ spec, data, compileOptions, parseConfig, parseOptions, viewOptions, className, style, ref, onReady: onReadyProp, onError: onErrorProp, ...props }: VegaChartProps): React.JSX.Element;
66
+ export declare function VegaChart({ spec, data, compileOptions, parseConfig, parseOptions, viewOptions, className, style, ref, onReady, onError, ...props }: VegaChartProps): React.JSX.Element;
68
67
  export declare namespace VegaChart {
69
68
  var displayName: string;
70
69
  }
package/dist/VegaChart.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"VegaChart.d.ts","sourceRoot":"","sources":["../src/VegaChart.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAA0C,MAAM,OAAO,CAAC;AAI/D,OAAO,KAAK,EAAC,cAAc,EAAyB,MAAM,SAAS,CAAC;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,WAAW,EACX,YAAY,EACZ,WAAW,EACX,SAAS,EACT,KAAK,EACL,GAAG,EACH,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,EACpB,GAAG,KAAK,EACT,EAAE,cAAc,qBAiGhB;yBA9Ge,SAAS"}
1
+ {"version":3,"file":"VegaChart.d.ts","sourceRoot":"","sources":["../src/VegaChart.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAA0B,MAAM,OAAO,CAAC;AAI/C,OAAO,KAAK,EAAC,cAAc,EAAyB,MAAM,SAAS,CAAC;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,WAAW,EACX,YAAY,EACZ,WAAW,EACX,SAAS,EACT,KAAK,EACL,GAAG,EACH,OAAO,EACP,OAAO,EACP,GAAG,KAAK,EACT,EAAE,cAAc,qBA+FhB;yBA5Ge,SAAS"}
package/dist/index.js CHANGED
@@ -41,17 +41,15 @@ function VegaChart({
41
41
  className,
42
42
  style,
43
43
  ref,
44
- onReady: onReadyProp,
45
- onError: onErrorProp,
44
+ onReady,
45
+ onError,
46
46
  ...props
47
47
  }) {
48
48
  const containerRef = _react.useRef.call(void 0, null);
49
- const onReady = _react.useEffectEvent.call(void 0, (view) => {
50
- _optionalChain([onReadyProp, 'optionalCall', _ => _(view)]);
51
- });
52
- const onError = _react.useEffectEvent.call(void 0, (error) => {
53
- _optionalChain([onErrorProp, 'optionalCall', _2 => _2(error)]);
54
- });
49
+ const onReadyRef = _react.useRef.call(void 0, onReady);
50
+ const onErrorRef = _react.useRef.call(void 0, onError);
51
+ onReadyRef.current = onReady;
52
+ onErrorRef.current = onError;
55
53
  _react.useEffect.call(void 0, () => {
56
54
  const container = containerRef.current;
57
55
  if (!container) {
@@ -61,7 +59,9 @@ function VegaChart({
61
59
  let view = null;
62
60
  const fail = (err) => {
63
61
  if (!cancelled) {
64
- onError(err instanceof Error ? err : new Error(String(err)));
62
+ _optionalChain([onErrorRef, 'access', _ => _.current, 'optionalCall', _2 => _2(
63
+ err instanceof Error ? err : new Error(String(err))
64
+ )]);
65
65
  }
66
66
  };
67
67
  try {
@@ -88,7 +88,7 @@ function VegaChart({
88
88
  return;
89
89
  }
90
90
  if (view) {
91
- onReady(view);
91
+ _optionalChain([onReadyRef, 'access', _5 => _5.current, 'optionalCall', _6 => _6(view)]);
92
92
  }
93
93
  }).catch(fail);
94
94
  } catch (err) {
@@ -96,7 +96,7 @@ function VegaChart({
96
96
  }
97
97
  return () => {
98
98
  cancelled = true;
99
- _optionalChain([view, 'optionalAccess', _5 => _5.finalize, 'call', _6 => _6()]);
99
+ _optionalChain([view, 'optionalAccess', _7 => _7.finalize, 'call', _8 => _8()]);
100
100
  };
101
101
  }, [spec, data, compileOptions, parseConfig, parseOptions, viewOptions]);
102
102
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
package/dist/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  // src/VegaChart.tsx
2
- import { useEffect, useEffectEvent, useRef } from "react";
2
+ import { useEffect, useRef } from "react";
3
3
  import { parse, View } from "vega";
4
4
  import { compile } from "vega-lite";
5
5
 
@@ -41,17 +41,15 @@ function VegaChart({
41
41
  className,
42
42
  style,
43
43
  ref,
44
- onReady: onReadyProp,
45
- onError: onErrorProp,
44
+ onReady,
45
+ onError,
46
46
  ...props
47
47
  }) {
48
48
  const containerRef = useRef(null);
49
- const onReady = useEffectEvent((view) => {
50
- onReadyProp?.(view);
51
- });
52
- const onError = useEffectEvent((error) => {
53
- onErrorProp?.(error);
54
- });
49
+ const onReadyRef = useRef(onReady);
50
+ const onErrorRef = useRef(onError);
51
+ onReadyRef.current = onReady;
52
+ onErrorRef.current = onError;
55
53
  useEffect(() => {
56
54
  const container = containerRef.current;
57
55
  if (!container) {
@@ -61,7 +59,9 @@ function VegaChart({
61
59
  let view = null;
62
60
  const fail = (err) => {
63
61
  if (!cancelled) {
64
- onError(err instanceof Error ? err : new Error(String(err)));
62
+ onErrorRef.current?.(
63
+ err instanceof Error ? err : new Error(String(err))
64
+ );
65
65
  }
66
66
  };
67
67
  try {
@@ -88,7 +88,7 @@ function VegaChart({
88
88
  return;
89
89
  }
90
90
  if (view) {
91
- onReady(view);
91
+ onReadyRef.current?.(view);
92
92
  }
93
93
  }).catch(fail);
94
94
  } catch (err) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/vega",
3
- "version": "0.1.6-canary.1b61ba6",
3
+ "version": "0.1.6-canary.1d64659",
4
4
  "description": "Astryx Vega wrapper — chart and data visualization components. Published to npm only under the @canary dist-tag for early testing; never released as a stable (latest) version.",
5
5
  "author": "Meta Open Source",
6
6
  "license": "MIT",
@@ -41,8 +41,8 @@
41
41
  "README.md"
42
42
  ],
43
43
  "peerDependencies": {
44
- "react": ">=19.2.0",
45
- "react-dom": ">=19.2.0",
44
+ "react": ">=19.0.0",
45
+ "react-dom": ">=19.0.0",
46
46
  "vega": ">=6.0.0",
47
47
  "vega-lite": ">=6.0.0"
48
48
  },
package/src/VegaChart.tsx CHANGED
@@ -9,7 +9,7 @@
9
9
  * SYNC: When modified, update /packages/vega/README.md
10
10
  */
11
11
 
12
- import React, {useEffect, useEffectEvent, useRef} from 'react';
12
+ import React, {useEffect, useRef} from 'react';
13
13
  import {parse, View} from 'vega';
14
14
  import {compile} from 'vega-lite';
15
15
  import {parseSchema} from './schema';
@@ -36,9 +36,8 @@ import type {VegaChartProps, VegaSpec, VegaLiteSpec} from './types';
36
36
  * it when `spec`, `parseConfig`, `parseOptions`, or `viewOptions` changes,
37
37
  * and calls `view.finalize()` on cleanup to release all runtime resources.
38
38
  *
39
- * Callbacks (`onReady`, `onError`) are non-reactive Effect Events -- they
40
- * always see the latest props and never re-run the View lifecycle, so you
41
- * don't need to memoize them. Pass stable references (or `useMemo`)
39
+ * Callbacks (`onReady`, `onError`) are stable across renders via refs --
40
+ * you don't need to memoize them. Pass stable references (or `useMemo`)
42
41
  * for `parseConfig`, `parseOptions`, `viewOptions`, and `data` to avoid
43
42
  * unnecessary re-renders.
44
43
  *
@@ -81,21 +80,17 @@ export function VegaChart({
81
80
  className,
82
81
  style,
83
82
  ref,
84
- onReady: onReadyProp,
85
- onError: onErrorProp,
83
+ onReady,
84
+ onError,
86
85
  ...props
87
86
  }: VegaChartProps) {
88
87
  const containerRef = useRef<HTMLDivElement>(null);
89
88
 
90
- // The Effect fires these callbacks without treating them as reactive
91
- // dependencies, so the View isn't torn down and rebuilt when a parent
92
- // passes fresh inline callbacks on every render.
93
- const onReady = useEffectEvent((view: View) => {
94
- onReadyProp?.(view);
95
- });
96
- const onError = useEffectEvent((error: Error) => {
97
- onErrorProp?.(error);
98
- });
89
+ // Keep callbacks in refs so they don't need to be in the dep array.
90
+ const onReadyRef = useRef(onReady);
91
+ const onErrorRef = useRef(onError);
92
+ onReadyRef.current = onReady;
93
+ onErrorRef.current = onError;
99
94
 
100
95
  useEffect(() => {
101
96
  const container = containerRef.current;
@@ -108,7 +103,9 @@ export function VegaChart({
108
103
 
109
104
  const fail = (err: unknown) => {
110
105
  if (!cancelled) {
111
- onError(err instanceof Error ? err : new Error(String(err)));
106
+ onErrorRef.current?.(
107
+ err instanceof Error ? err : new Error(String(err)),
108
+ );
112
109
  }
113
110
  };
114
111
 
@@ -152,7 +149,7 @@ export function VegaChart({
152
149
  return;
153
150
  }
154
151
  if (view) {
155
- onReady(view);
152
+ onReadyRef.current?.(view);
156
153
  }
157
154
  })
158
155
  .catch(fail);