fix: delay first setOption until initial resize, update deps

src/composables/api.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { Ref, unref } from "vue-demi";
+import { Ref } from "vue-demi";
 import { EChartsType, Option } from "../types";
 
 const METHOD_NAMES = [
@@ -26,7 +26,7 @@ type PublicMethods = Pick<EChartsType, MethodName>;
 export function usePublicAPI(
   chart: Ref<EChartsType | undefined>,
   init: (option?: Option) => void
-) {
+): PublicMethods {
   function makePublicMethod<T extends MethodName>(
     name: T
   ): (...args: Parameters<EChartsType[T]>) => ReturnType<EChartsType[T]> {
@@ -42,12 +42,6 @@ export function usePublicAPI(
     };
   }
 
-  function makeAnyMethod<T extends MethodName>(
-    name: T
-  ): (...args: any[]) => ReturnType<EChartsType[T]> {
-    return makePublicMethod(name) as any;
-  }
-
   function makePublicMethods(): PublicMethods {
     const methods = Object.create(null);
     METHOD_NAMES.forEach(name => {
@@ -57,10 +51,5 @@ export function usePublicAPI(
     return methods as PublicMethods;
   }
 
-  return {
-    ...makePublicMethods(),
-    dispatchAction: makeAnyMethod("dispatchAction"),
-    getDataURL: makeAnyMethod("getDataURL"),
-    getConnectedDataURL: makeAnyMethod("getConnectedDataURL")
-  };
+  return makePublicMethods();
 }

src/composables/autoresize.ts

@@ -1,37 +1,19 @@
 import { Ref, watch } from "vue-demi";
 import { throttle } from "echarts/core";
 import { addListener, removeListener, ResizeCallback } from "resize-detector";
-import { EChartsType, Option } from "../types";
+import { EChartsType } from "../types";
 
 export function useAutoresize(
   chart: Ref<EChartsType | undefined>,
   autoresize: Ref<boolean>,
-  root: Ref<HTMLElement | undefined>,
-  option: Ref<Option>
+  root: Ref<HTMLElement | undefined>
 ): void {
   let resizeListener: ResizeCallback | null = null;
-  let lastArea = 0;
-
-  function getArea() {
-    const el = root.value;
-    if (!el) {
-      return 0;
-    }
-    return el.offsetWidth * el.offsetHeight;
-  }
 
   watch([root, chart, autoresize], ([root, chart, autoresize], _, cleanup) => {
     if (root && chart && autoresize) {
-      lastArea = getArea();
       resizeListener = throttle(() => {
-        if (lastArea === 0) {
-          chart.setOption(Object.create(null), true);
-          chart.resize();
-          chart.setOption(option.value, true);
-        } else {
-          chart.resize();
-        }
-        lastArea = getArea();
+        chart.resize();
       }, 100);
 
       addListener(root, resizeListener);
@@ -39,7 +21,6 @@ export function useAutoresize(
 
     cleanup(() => {
       if (resizeListener && root) {
-        lastArea = 0;
         removeListener(root, resizeListener);
       }
     });

src/composables/loading.ts

@@ -3,14 +3,16 @@ import { EChartsType } from "../types";
 
 export const LOADING_OPTIONS_KEY = "ecLoadingOptions";
 
+type UnknownRecord = Record<string, unknown>;
+
 export function useLoading(
   chart: Ref<EChartsType | undefined>,
   loading: Ref<boolean>,
-  loadingOptions: Ref<object | undefined>
+  loadingOptions: Ref<UnknownRecord | undefined>
 ): void {
   const defaultLoadingOptions = inject(LOADING_OPTIONS_KEY, {}) as
-    | object
-    | Ref<object>;
+    | UnknownRecord
+    | Ref<UnknownRecord>;
   const realLoadingOptions = computed(() => ({
     ...unref(defaultLoadingOptions),
     ...loadingOptions?.value