react-use-echarts 0.0.5 → 0.0.7

package/dist/index.d.ts

@@ -122,7 +122,7 @@ export declare interface UseEchartsReturn {
      * Reference to the chart container element
      * 图表容器元素的引用
      */
-    chartRef: React.RefObject<HTMLDivElement>;
+    chartRef: React.RefObject<HTMLDivElement | null>;
     /**
      * Function to update chart options
      * 更新图表配置的函数

package/dist/index.es.js

@@ -1,72 +1,80 @@
-import { useRef as p, useCallback as z, useEffect as w } from "react";
-import * as C from "echarts";
-const R = ({
+import { useRef as z, useCallback as a, useEffect as C } from "react";
+import * as R from "echarts";
+const v = ({
   /** Chart configuration */
   option: f,
   /** Theme name */
-  theme: a,
+  theme: i,
   /** Skip merging with previous options */
-  notMerge: m = !1,
+  notMerge: l = !1,
   /** Enable lazy update mode */
-  lazyUpdate: l = !1,
+  lazyUpdate: p = !1,
   /** Display loading animation */
-  showLoading: h = !1,
+  showLoading: d = !1,
   /** Loading animation config */
-  loadingOption: d,
+  loadingOption: O,
   /** Event handlers map */
-  onEvents: s
+  onEvents: c
 }) => {
-  const c = p(null), t = p(), O = () => t.current, u = z(() => {
-    if (c.current && !t.current) {
-      const e = C.init(c.current, a);
-      return t.current = e, s && Object.entries(s).forEach(
-        ([r, { handler: n, query: i, context: o }]) => {
-          i ? e.on(r, i, n, o) : e.on(r, n, o);
-        }
-      ), h ? e.showLoading(d) : e.hideLoading(), e.setOption(f, { notMerge: m, lazyUpdate: l }), e;
-    }
-    return t.current;
-  }, [
+  const s = z(null), t = z(void 0), k = () => t.current, b = a(() => ({
+    option: f,
+    theme: i,
+    notMerge: l,
+    lazyUpdate: p,
+    showLoading: d,
+    loadingOption: O,
+    onEvents: c
+  }), [
     f,
-    a,
-    m,
+    i,
     l,
-    h,
+    p,
     d,
-    s
-  ]), b = z(
+    O,
+    c
+  ]), o = a(() => {
+    if (s.current && !t.current) {
+      const e = R.init(s.current, i);
+      t.current = e;
+      const r = b();
+      return r.onEvents && Object.entries(r.onEvents).forEach(
+        ([n, { handler: u, query: g, context: h }]) => {
+          g ? e.on(n, g, u, h) : e.on(n, u, h);
+        }
+      ), r.showLoading ? e.showLoading(r.loadingOption) : e.hideLoading(), e.setOption(r.option, {
+        notMerge: r.notMerge,
+        lazyUpdate: r.lazyUpdate
+      }), e;
+    }
+    return t.current;
+  }, [b, i]), M = a(
     (e, r) => {
-      requestAnimationFrame(() => {
-        const n = t.current || u();
+      queueMicrotask(() => {
+        const n = t.current || o();
         n && n.setOption(e, r);
       });
     },
-    [u]
+    [o]
   );
-  return w(() => {
+  return C(() => {
     const e = t.current;
     if (!e) return;
-    const r = () => {
-      const i = setTimeout(() => {
-        e == null || e.resize();
-      }, 250);
-      return () => clearTimeout(i);
-    }, n = r();
-    return window.addEventListener("resize", r), () => {
-      s && Object.entries(s).forEach(([i, { handler: o }]) => {
-        e.off(i, o);
-      }), window.removeEventListener("resize", r), e.dispose(), t.current = void 0, n();
-    };
-  }, [s]), w(() => {
-    c.current && requestAnimationFrame(() => {
-      u();
+    const r = new ResizeObserver(() => {
+      e.resize();
     });
-  }, [c, u]), {
-    chartRef: c,
-    setOption: b,
-    getInstance: O
+    return r.observe(s.current), () => {
+      r.disconnect(), c && e && Object.entries(c).forEach(([n, { handler: u }]) => {
+        e.off(n, u);
+      }), e.dispose(), t.current = void 0;
+    };
+  }, [t, c]), C(() => {
+    s.current && queueMicrotask(o);
+  }, [s, o]), {
+    chartRef: s,
+    setOption: M,
+    getInstance: k
   };
 };
 export {
-  R as useEcharts
+  v as useEcharts
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(r,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("react"),require("echarts")):typeof define=="function"&&define.amd?define(["exports","react","echarts"],t):(r=typeof globalThis<"u"?globalThis:r||self,t(r["react-use-echarts"]={},r.React,r.echarts))})(this,function(r,t,O){"use strict";function j(n){const f=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const i in n)if(i!=="default"){const d=Object.getOwnPropertyDescriptor(n,i);Object.defineProperty(f,i,d.get?d:{enumerable:!0,get:()=>n[i]})}}return f.default=n,Object.freeze(f)}const T=j(O),z=({option:n,theme:f,notMerge:i=!1,lazyUpdate:d=!1,showLoading:m=!1,loadingOption:b,onEvents:o})=>{const l=t.useRef(null),c=t.useRef(),g=()=>c.current,h=t.useCallback(()=>{if(l.current&&!c.current){const e=T.init(l.current,f);return c.current=e,o&&Object.entries(o).forEach(([s,{handler:u,query:a,context:p}])=>{a?e.on(s,a,u,p):e.on(s,u,p)}),m?e.showLoading(b):e.hideLoading(),e.setOption(n,{notMerge:i,lazyUpdate:d}),e}return c.current},[n,f,i,d,m,b,o]),w=t.useCallback((e,s)=>{requestAnimationFrame(()=>{const u=c.current||h();u&&u.setOption(e,s)})},[h]);return t.useEffect(()=>{const e=c.current;if(!e)return;const s=()=>{const a=setTimeout(()=>{e==null||e.resize()},250);return()=>clearTimeout(a)},u=s();return window.addEventListener("resize",s),()=>{o&&Object.entries(o).forEach(([a,{handler:p}])=>{e.off(a,p)}),window.removeEventListener("resize",s),e.dispose(),c.current=void 0,u()}},[o]),t.useEffect(()=>{l.current&&requestAnimationFrame(()=>{h()})},[l,h]),{chartRef:l,setOption:w,getInstance:g}};r.useEcharts=z,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+(function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react"),require("echarts")):typeof define=="function"&&define.amd?define(["exports","react","echarts"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r["react-use-echarts"]={},r.React,r.echarts))})(this,function(r,n,y){"use strict";function k(s){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const o in s)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(s,o);Object.defineProperty(c,o,a.get?a:{enumerable:!0,get:()=>s[o]})}}return c.default=s,Object.freeze(c)}const C=k(y),z=({option:s,theme:c,notMerge:o=!1,lazyUpdate:a=!1,showLoading:b=!1,loadingOption:h,onEvents:d})=>{const f=n.useRef(null),i=n.useRef(void 0),M=()=>i.current,O=n.useCallback(()=>({option:s,theme:c,notMerge:o,lazyUpdate:a,showLoading:b,loadingOption:h,onEvents:d}),[s,c,o,a,b,h,d]),l=n.useCallback(()=>{if(f.current&&!i.current){const e=C.init(f.current,c);i.current=e;const t=O();return t.onEvents&&Object.entries(t.onEvents).forEach(([u,{handler:p,query:g,context:j}])=>{g?e.on(u,g,p,j):e.on(u,p,j)}),t.showLoading?e.showLoading(t.loadingOption):e.hideLoading(),e.setOption(t.option,{notMerge:t.notMerge,lazyUpdate:t.lazyUpdate}),e}return i.current},[O,c]),R=n.useCallback((e,t)=>{queueMicrotask(()=>{const u=i.current||l();u&&u.setOption(e,t)})},[l]);return n.useEffect(()=>{const e=i.current;if(!e)return;const t=new ResizeObserver(()=>{e.resize()});return t.observe(f.current),()=>{t.disconnect(),d&&e&&Object.entries(d).forEach(([u,{handler:p}])=>{e.off(u,p)}),e.dispose(),i.current=void 0}},[i,d]),n.useEffect(()=>{f.current&&queueMicrotask(l)},[f,l]),{chartRef:f,setOption:R,getInstance:M}};r.useEcharts=z,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-use-echarts",
   "private": false,
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "A powerful React hooks library for Apache ECharts",
   "keywords": [
     "react",
@@ -41,31 +41,31 @@
     "dist"
   ],
   "devDependencies": {
-    "@eslint/js": "^9.15.0",
-    "@testing-library/react": "^16.0.1",
-    "@types/node": "^22.9.1",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@vitejs/plugin-react-swc": "^3.7.1",
-    "@vitest/coverage-v8": "2.1.5",
+    "@eslint/js": "^9.16.0",
+    "@testing-library/react": "^16.1.0",
+    "@types/node": "^22.10.2",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.2",
+    "@vitejs/plugin-react-swc": "^3.7.2",
+    "@vitest/coverage-v8": "2.1.8",
     "echarts": "^5.5.1",
-    "eslint": "^9.15.0",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "eslint-plugin-react-refresh": "^0.4.14",
-    "globals": "^15.12.0",
+    "eslint": "^9.16.0",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-refresh": "^0.4.16",
+    "globals": "^15.13.0",
     "jsdom": "^25.0.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "typescript": "~5.6.3",
-    "typescript-eslint": "^8.15.0",
-    "vite": "^5.4.11",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "typescript": "~5.7.2",
+    "typescript-eslint": "^8.18.0",
+    "vite": "^6.0.3",
     "vite-plugin-dts": "^4.3.0",
-    "vitest": "^2.1.5"
+    "vitest": "^2.1.8"
   },
   "peerDependencies": {
     "echarts": "^5.5.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react": "^18.3.1 || ^19.0.0",
+    "react-dom": "^18.3.1 || ^19.0.0"
   },
   "scripts": {
     "dev": "vite",