nuxt-echarts 0.3.1 → 0.3.2

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.2.0"
   },
-  "version": "0.3.1",
+  "version": "0.3.2",
   "builder": {
     "@nuxt/module-builder": "1.0.1",
     "unbuild": "3.5.0"

package/dist/runtime/components/VChart.js

@@ -2,7 +2,7 @@ import {
   defineComponent,
   shallowRef,
   toRefs,
-  unref,
+  toValue,
   watch,
   computed,
   inject,
@@ -55,36 +55,43 @@ export default defineComponent({
     const realOption = computed(
       () => manualOption.value || props.option || null
     );
-    const realTheme = computed(() => props.theme || unref(defaultTheme) || {});
+    const realTheme = computed(() => props.theme || toValue(defaultTheme) || {});
     const realInitOptions = computed(
-      () => props.initOptions || unref(defaultInitOptions) || {}
+      () => props.initOptions || toValue(defaultInitOptions) || {}
     );
     const realUpdateOptions = computed(
-      () => props.updateOptions || unref(defaultUpdateOptions) || {}
+      () => props.updateOptions || toValue(defaultUpdateOptions) || {}
     );
     const nativeListeners = shallowRef({});
     const realAttrs = computed(() => ({
       ...omitOn(attrs),
       ...nativeListeners.value
     }));
-    const realListeners = {};
-    function init(option) {
+    const listeners = /* @__PURE__ */ new Map();
+    function collectListeners() {
       const _nativeListeners = {};
       Object.keys(attrs).filter((key) => isOn(key)).forEach((key) => {
-        let event = key.charAt(2).toLowerCase() + key.slice(3);
-        if (event.indexOf("native:") === 0) {
-          const nativeKey = `on${event.charAt(7).toUpperCase()}${event.slice(
-            8
-          )}`;
+        if (key.indexOf("Native:") === 2) {
+          const nativeKey = `on${key.charAt(9).toUpperCase()}${key.slice(10)}`;
           _nativeListeners[nativeKey] = attrs[key];
           return;
         }
+        let event = key.charAt(2).toLowerCase() + key.slice(3);
+        let zr;
+        if (event.indexOf("zr:") === 0) {
+          zr = true;
+          event = event.substring(3);
+        }
+        let once;
         if (event.substring(event.length - 4) === "Once") {
-          event = `~${event.substring(0, event.length - 4)}`;
+          once = true;
+          event = event.substring(0, event.length - 4);
         }
-        realListeners[event] = attrs[key];
+        listeners.set({ event, zr, once }, attrs[key]);
       });
       nativeListeners.value = _nativeListeners;
+    }
+    function init(option) {
       if (!root.value) {
         return;
       }
@@ -96,23 +103,12 @@ export default defineComponent({
       if (props.group) {
         instance.group = props.group;
       }
-      Object.keys(realListeners).forEach((key) => {
-        let handler = realListeners[key];
+      listeners.forEach((handler, { zr, once, event }) => {
         if (!handler) {
           return;
         }
-        let event = key.toLowerCase();
-        if (event.charAt(0) === "~") {
-          event = event.substring(1);
-          handler.__once__ = true;
-        }
-        let target = instance;
-        if (event.indexOf("zr:") === 0) {
-          target = instance.getZr();
-          event = event.substring(3);
-        }
-        if (handler.__once__) {
-          delete handler.__once__;
+        const target = zr ? instance.getZr() : instance;
+        if (once) {
           const raw = handler;
           handler = (...args) => {
             raw(...args);
@@ -210,6 +206,7 @@ export default defineComponent({
     useLoading(chart, loading, loadingOptions);
     useAutoresize(chart, autoresize, root);
     onMounted(async () => {
+      collectListeners();
       if (!root.value) await nextTick();
       init();
     });
@@ -230,9 +227,10 @@ export default defineComponent({
     };
   },
   render() {
-    const attrs = this.realAttrs;
-    attrs.ref = "root";
-    attrs.class = attrs.class ? ["echarts"].concat(attrs.class) : "echarts";
-    return h(TAG_NAME, attrs);
+    return h(TAG_NAME, {
+      ...this.realAttrs,
+      ref: "root",
+      class: ["echarts", ...this.realAttrs.class || []]
+    });
   }
 });

package/dist/runtime/components/VChartServer.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, unref, inject, ref } from "vue";
+import { computed, inject, ref, toValue } from "vue";
 import { THEME_KEY, INIT_OPTIONS_KEY } from "../utils/injection";
 const defaultTheme = inject(THEME_KEY, null);
 const defaultInitOptions = inject(INIT_OPTIONS_KEY, null);
@@ -9,9 +9,9 @@ const props = defineProps({
   initOptions: { type: null, required: false }
 });
 const emits = defineEmits(["error"]);
-const realTheme = computed(() => props.theme || unref(defaultTheme) || {});
+const realTheme = computed(() => props.theme || toValue(defaultTheme) || {});
 const realInitOptions = computed(
-  () => props.initOptions || unref(defaultInitOptions) || {}
+  () => props.initOptions || toValue(defaultInitOptions) || {}
 );
 function onError(e) {
   if (e instanceof TypeError && e.message === "Cannot read properties of undefined (reading 'link')") {
@@ -23,17 +23,17 @@ const root = ref(null);
 </script>
 
 <template>
-  <div class="vue-echarts-server">
-    <VChartIsland
-      ref="root"
-      :theme="realTheme"
-      :option="option"
-      :init-options="realInitOptions"
-      @error="onError"
-    >
-      <template #fallback>
-        <slot name="fallback" />
-      </template>
-    </VChartIsland>
-  </div>
+  <div class="vue-echarts-server">
+    <VChartIsland
+      ref="root"
+      :theme="realTheme"
+      :option="option"
+      :init-options="realInitOptions"
+      @error="onError"
+    >
+      <template #fallback>
+        <slot name="fallback" />
+      </template>
+    </VChartIsland>
+  </div>
 </template>

package/dist/runtime/composables/autoresize.js

@@ -25,6 +25,9 @@ export function useAutoresize(chart, autoresize, root) {
               return;
             }
           }
+          if (root2.offsetWidth === 0 || root2.offsetHeight === 0) {
+            return;
+          }
           resizeCallback(entry, observer);
         });
         ro.observe(root2);

package/dist/runtime/composables/loading.js

@@ -1,5 +1,5 @@
 import {
-  unref,
+  toValue,
   inject,
   computed,
   watchEffect
@@ -8,7 +8,7 @@ export const LOADING_OPTIONS_KEY = "ecLoadingOptions";
 export function useLoading(chart, loading, loadingOptions) {
   const defaultLoadingOptions = inject(LOADING_OPTIONS_KEY, {});
   const realLoadingOptions = computed(() => ({
-    ...unref(defaultLoadingOptions) || {},
+    ...toValue(defaultLoadingOptions) || {},
     ...loadingOptions?.value
   }));
   watchEffect(() => {

package/dist/runtime/types.d.ts

@@ -1,6 +1,6 @@
 import type { init, SetOptionOpts, ECElementEvent, ElementEvent } from 'echarts/core';
-import type { MaybeRef } from 'vue';
-export type Injection<T> = MaybeRef<T | null>;
+import type { MaybeRefOrGetter } from 'vue';
+export type Injection<T> = MaybeRefOrGetter<T | null>;
 type InitType = typeof init;
 export type InitParameters = Parameters<InitType>;
 export type Theme = NonNullable<InitParameters[1]>;
@@ -10,8 +10,6 @@ export type InitOptionsInjection = Injection<InitOptions>;
 export type UpdateOptions = SetOptionOpts;
 export type UpdateOptionsInjection = Injection<UpdateOptions>;
 export type EChartsType = ReturnType<InitType>;
-type ZRenderType = ReturnType<EChartsType['getZr']>;
-export type EventTarget = EChartsType | ZRenderType;
 type SetOptionType = EChartsType['setOption'];
 export type Option = Parameters<SetOptionType>[0];
 export type LoadingOptions = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-echarts",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "Nuxt Module for Apache ECharts™",
   "keywords": [
     "vue",
@@ -14,7 +14,7 @@
   "repository": "kingyue737/nuxt-echarts",
   "license": "MIT",
   "type": "module",
-  "packageManager": "pnpm@10.10.0",
+  "packageManager": "pnpm@10.11.0",
   "exports": {
     ".": {
       "types": "./dist/types.d.mts",
@@ -43,23 +43,24 @@
     "test:types": "vue-tsc --noEmit && nuxi typecheck playground"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.17.3",
-    "echarts": "^5.6.0"
+    "@nuxt/kit": "^3.17.4"
   },
   "devDependencies": {
-    "@nuxt/eslint-config": "^1.3.1",
+    "@nuxt/eslint-config": "^1.4.1",
     "@nuxt/module-builder": "^1.0.1",
-    "@nuxt/schema": "^3.17.3",
-    "@nuxt/test-utils": "^3.18.0",
-    "@types/node": "^22.15.18",
+    "@nuxt/schema": "^3.17.4",
+    "@nuxt/test-utils": "^3.19.1",
+    "@types/node": "^22.15.21",
     "changelogen": "^0.6.1",
-    "eslint": "^9.26.0",
-    "nuxt": "^3.17.3",
+    "echarts": "^5.6.0",
+    "echarts-gl": "^2.0.9",
+    "eslint": "^9.27.0",
+    "nuxt": "^3.17.4",
     "prettier": "^3.5.3",
     "prettier-plugin-tailwindcss": "^0.6.11",
     "typescript": "^5.8.3",
     "vite": "^6.3.5",
-    "vitest": "^3.1.3",
+    "vitest": "^3.1.4",
     "vue-tsc": "^2.2.10"
   },
   "peerDependencies": {
@@ -68,4 +69,4 @@
   "stackblitz": {
     "startCommand": "pnpm run dev:prepare && pnpm run dev"
   }
-}
+}