nuxt-echarts 0.4.0 → 1.0.0

package/README.md

@@ -70,14 +70,12 @@ That's it! You can now use Nuxt ECharts in your Nuxt app ✨
 
 ## Credits
 
-The Nuxt ECharts module is heavily inspired by [vue-echarts](https://github.com/ecomfe/vue-echarts), created by [@Justineo](https://github.com/Justineo).
+The Nuxt ECharts module depends on [vue-echarts](https://github.com/ecomfe/vue-echarts), created by [@Justineo](https://github.com/Justineo).
 
 ## License
 
 This project is licensed under the [MIT License](./LICENSE).
 
-This project also partially contains code derived or copied from [vue-echarts(MIT)](https://github.com/ecomfe/vue-echarts/blob/main/LICENSE).
-
 ## Notice
 
 The Apache Software Foundation [Apache ECharts, ECharts](https://echarts.apache.org/), Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the [Apache Software Foundation](https://www.apache.org/).

package/dist/module.json

@@ -4,9 +4,9 @@
   "compatibility": {
     "nuxt": ">=3.2.0"
   },
-  "version": "0.4.0",
+  "version": "1.0.0",
   "builder": {
-    "@nuxt/module-builder": "1.0.1",
-    "unbuild": "3.5.0"
+    "@nuxt/module-builder": "1.0.2",
+    "unbuild": "3.6.0"
   }
 }

package/dist/module.mjs

@@ -135,9 +135,7 @@ const module = defineNuxtModule({
       "INIT_OPTIONS_KEY",
       "UPDATE_OPTIONS_KEY",
       "LOADING_OPTIONS_KEY"
-    ].forEach(
-      (name) => addImports({ name, from: resolve("./runtime/utils/injection") })
-    );
+    ].forEach((name) => addImports({ name, from: "vue-echarts" }));
   }
 });
 

package/dist/runtime/components/VChart.d.ts

@@ -1,166 +1,5 @@
-import type { PropType } from 'vue';
-import type { Option, Theme, InitOptions, UpdateOptions } from '../types.js';
-import type { PublicMethods } from '../composables/index.js';
-import type { EChartsElement } from '../utils/wc.js';
+import VChart from 'vue-echarts';
 import '#build/echarts.mjs';
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    loading: BooleanConstructor;
-    loadingOptions: PropType<import("../types.js").LoadingOptions>;
-    autoresize: PropType<boolean | {
-        throttle?: number;
-        onResize?: ResizeObserverCallback;
-    }>;
-    option: PropType<Option>;
-    theme: {
-        type: PropType<Theme>;
-    };
-    initOptions: PropType<InitOptions>;
-    updateOptions: PropType<UpdateOptions>;
-    group: StringConstructor;
-    manualUpdate: BooleanConstructor;
-}>, {
-    setOption: {
-        <Opt extends import("echarts/core").EChartsCoreOption>(option: Opt, notMerge?: boolean, lazyUpdate?: boolean): void;
-        <Opt extends import("echarts/core").EChartsCoreOption>(option: Opt, opts?: import("echarts/core").SetOptionOpts): void;
-    };
-    root: import("vue").ShallowRef<EChartsElement | undefined, EChartsElement | undefined>;
-    chart: import("vue").ShallowRef<import("echarts/core").ECharts | undefined, import("echarts/core").ECharts | undefined>;
-} & PublicMethods, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    click: (params: import("echarts/core").ECElementEvent) => void;
-    dblclick: (params: import("echarts/core").ECElementEvent) => void;
-    mouseout: (params: import("echarts/core").ECElementEvent) => void;
-    mouseover: (params: import("echarts/core").ECElementEvent) => void;
-    mouseup: (params: import("echarts/core").ECElementEvent) => void;
-    mousedown: (params: import("echarts/core").ECElementEvent) => void;
-    mousemove: (params: import("echarts/core").ECElementEvent) => void;
-    contextmenu: (params: import("echarts/core").ECElementEvent) => void;
-    globalout: (params: import("echarts/core").ECElementEvent) => void;
-} & {
-    highlight: (params: any) => void;
-    downplay: (params: any) => void;
-    selectchanged: (params: any) => void;
-    legendselectchanged: (params: any) => void;
-    legendselected: (params: any) => void;
-    legendunselected: (params: any) => void;
-    legendselectall: (params: any) => void;
-    legendinverseselect: (params: any) => void;
-    legendscroll: (params: any) => void;
-    datazoom: (params: any) => void;
-    datarangeselected: (params: any) => void;
-    graphroam: (params: any) => void;
-    georoam: (params: any) => void;
-    treeroam: (params: any) => void;
-    timelinechanged: (params: any) => void;
-    timelineplaychanged: (params: any) => void;
-    restore: (params: any) => void;
-    dataviewchanged: (params: any) => void;
-    magictypechanged: (params: any) => void;
-    geoselectchanged: (params: any) => void;
-    geoselected: (params: any) => void;
-    geounselected: (params: any) => void;
-    axisareaselected: (params: any) => void;
-    brush: (params: any) => void;
-    brushEnd: (params: any) => void;
-    brushselected: (params: any) => void;
-    globalcursortaken: (params: any) => void;
-} & {
-    rendered: (params: {
-        elapsedTime: number;
-    }) => void;
-    finished: () => void;
-} & {
-    "zr:mousewheel": (params: import("echarts/core").ElementEvent) => void;
-    "zr:drag": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dragstart": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dragend": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dragenter": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dragleave": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dragover": (params: import("echarts/core").ElementEvent) => void;
-    "zr:drop": (params: import("echarts/core").ElementEvent) => void;
-    "zr:click": (params: import("echarts/core").ElementEvent) => void;
-    "zr:dblclick": (params: import("echarts/core").ElementEvent) => void;
-    "zr:mouseout": (params: import("echarts/core").ElementEvent) => void;
-    "zr:mouseover": (params: import("echarts/core").ElementEvent) => void;
-    "zr:mouseup": (params: import("echarts/core").ElementEvent) => void;
-    "zr:mousedown": (params: import("echarts/core").ElementEvent) => void;
-    "zr:mousemove": (params: import("echarts/core").ElementEvent) => void;
-    "zr:contextmenu": (params: import("echarts/core").ElementEvent) => void;
-    "zr:globalout": (params: import("echarts/core").ElementEvent) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    loading: BooleanConstructor;
-    loadingOptions: PropType<import("../types.js").LoadingOptions>;
-    autoresize: PropType<boolean | {
-        throttle?: number;
-        onResize?: ResizeObserverCallback;
-    }>;
-    option: PropType<Option>;
-    theme: {
-        type: PropType<Theme>;
-    };
-    initOptions: PropType<InitOptions>;
-    updateOptions: PropType<UpdateOptions>;
-    group: StringConstructor;
-    manualUpdate: BooleanConstructor;
-}>> & Readonly<{
-    onClick?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onDblclick?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onMouseout?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onMouseover?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onMouseup?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onMousedown?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onMousemove?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onContextmenu?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    onGlobalout?: ((params: import("echarts/core").ECElementEvent) => any) | undefined;
-    "onZr:mousewheel"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:drag"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dragstart"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dragend"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dragenter"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dragleave"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dragover"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:drop"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:click"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:dblclick"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:mouseout"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:mouseover"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:mouseup"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:mousedown"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:mousemove"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:contextmenu"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    "onZr:globalout"?: ((params: import("echarts/core").ElementEvent) => any) | undefined;
-    onHighlight?: ((params: any) => any) | undefined;
-    onDownplay?: ((params: any) => any) | undefined;
-    onSelectchanged?: ((params: any) => any) | undefined;
-    onLegendselectchanged?: ((params: any) => any) | undefined;
-    onLegendselected?: ((params: any) => any) | undefined;
-    onLegendunselected?: ((params: any) => any) | undefined;
-    onLegendselectall?: ((params: any) => any) | undefined;
-    onLegendinverseselect?: ((params: any) => any) | undefined;
-    onLegendscroll?: ((params: any) => any) | undefined;
-    onDatazoom?: ((params: any) => any) | undefined;
-    onDatarangeselected?: ((params: any) => any) | undefined;
-    onGraphroam?: ((params: any) => any) | undefined;
-    onGeoroam?: ((params: any) => any) | undefined;
-    onTreeroam?: ((params: any) => any) | undefined;
-    onTimelinechanged?: ((params: any) => any) | undefined;
-    onTimelineplaychanged?: ((params: any) => any) | undefined;
-    onRestore?: ((params: any) => any) | undefined;
-    onDataviewchanged?: ((params: any) => any) | undefined;
-    onMagictypechanged?: ((params: any) => any) | undefined;
-    onGeoselectchanged?: ((params: any) => any) | undefined;
-    onGeoselected?: ((params: any) => any) | undefined;
-    onGeounselected?: ((params: any) => any) | undefined;
-    onAxisareaselected?: ((params: any) => any) | undefined;
-    onBrush?: ((params: any) => any) | undefined;
-    onBrushEnd?: ((params: any) => any) | undefined;
-    onBrushselected?: ((params: any) => any) | undefined;
-    onGlobalcursortaken?: ((params: any) => any) | undefined;
-    onRendered?: ((params: {
-        elapsedTime: number;
-    }) => any) | undefined;
-    onFinished?: (() => any) | undefined;
-}>, {
-    manualUpdate: boolean;
-    loading: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+type VChartType = typeof VChart;
+declare const _default: VChartType;
 export default _default;

package/dist/runtime/components/VChart.js

@@ -1,225 +1,39 @@
-import {
-  defineComponent,
-  shallowRef,
-  toRefs,
-  toValue,
-  watch,
-  computed,
-  inject,
-  onMounted,
-  onBeforeUnmount,
-  h,
-  nextTick,
-  watchEffect
-} from "vue";
-import { init as initChart } from "echarts/core";
-import {
-  usePublicAPI,
-  useAutoresize,
-  autoresizeProps,
-  useLoading,
-  loadingProps
-} from "../composables/index.js";
-import { isOn, omitOn } from "../utils/on.js";
-import { register, TAG_NAME } from "../utils/wc.js";
+import VChart from "vue-echarts";
 import "#build/echarts.mjs";
-import {
-  THEME_KEY,
-  INIT_OPTIONS_KEY,
-  UPDATE_OPTIONS_KEY
-} from "../utils/injection.js";
-const wcRegistered = register();
+import { defineComponent, h, ref, toRef } from "vue";
+const METHOD_NAMES = [
+  "setOption",
+  "getWidth",
+  "getHeight",
+  "getDom",
+  "getOption",
+  "resize",
+  "dispatchAction",
+  "convertToPixel",
+  "convertFromPixel",
+  "containPixel",
+  "getDataURL",
+  "getConnectedDataURL",
+  "appendData",
+  "clear",
+  "isDisposed",
+  "dispose"
+];
 export default defineComponent({
-  props: {
-    option: Object,
-    theme: {
-      type: [Object, String]
-    },
-    initOptions: Object,
-    updateOptions: Object,
-    group: String,
-    manualUpdate: Boolean,
-    ...autoresizeProps,
-    ...loadingProps
-  },
-  emits: {},
   inheritAttrs: false,
-  setup(props, { attrs, expose }) {
-    const root = shallowRef();
-    const chart = shallowRef();
-    const manualOption = shallowRef();
-    const defaultTheme = inject(THEME_KEY, null);
-    const defaultInitOptions = inject(INIT_OPTIONS_KEY, null);
-    const defaultUpdateOptions = inject(UPDATE_OPTIONS_KEY, null);
-    const { autoresize, manualUpdate, loading, loadingOptions } = toRefs(props);
-    const realOption = computed(
-      () => manualOption.value || props.option || null
+  setup(props, { attrs, slots, expose }) {
+    const root = ref(null);
+    const publicMethods = Object.fromEntries(
+      METHOD_NAMES.map((name) => [
+        name,
+        (...args) => (root.value?.[name])(...args)
+      ])
     );
-    const realTheme = computed(() => props.theme || toValue(defaultTheme) || {});
-    const realInitOptions = computed(
-      () => props.initOptions || toValue(defaultInitOptions) || {}
-    );
-    const realUpdateOptions = computed(
-      () => props.updateOptions || toValue(defaultUpdateOptions) || {}
-    );
-    const nonEventAttrs = computed(() => omitOn(attrs));
-    const nativeListeners = {};
-    const listeners = /* @__PURE__ */ new Map();
-    Object.keys(attrs).filter((key) => isOn(key)).forEach((key) => {
-      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") {
-        once = true;
-        event = event.substring(0, event.length - 4);
-      }
-      listeners.set({ event, zr, once }, attrs[key]);
-    });
-    function init(option) {
-      if (!root.value) {
-        return;
-      }
-      const instance = chart.value = initChart(
-        root.value,
-        realTheme.value,
-        realInitOptions.value
-      );
-      if (props.group) {
-        instance.group = props.group;
-      }
-      listeners.forEach((handler, { zr, once, event }) => {
-        if (!handler) {
-          return;
-        }
-        const target = zr ? instance.getZr() : instance;
-        if (once) {
-          const raw = handler;
-          handler = (...args) => {
-            raw(...args);
-            target.off(event, handler);
-          };
-        }
-        target.on(event, handler);
-      });
-      function resize() {
-        if (instance && !instance.isDisposed()) {
-          instance.resize();
-        }
-      }
-      function commit() {
-        const opt = option || realOption.value;
-        if (opt) {
-          instance.setOption(opt, realUpdateOptions.value);
-        }
-      }
-      if (autoresize.value) {
-        nextTick(() => {
-          resize();
-          commit();
-        });
-      } else {
-        commit();
-      }
-    }
-    const setOption = (option, notMerge, lazyUpdate) => {
-      const updateOptions = typeof notMerge === "boolean" ? { notMerge, lazyUpdate } : notMerge;
-      if (props.manualUpdate) {
-        manualOption.value = option;
-      }
-      if (!chart.value) {
-        init(option);
-      } else {
-        chart.value.setOption(option, updateOptions || {});
-      }
-    };
-    function cleanup() {
-      if (chart.value) {
-        chart.value.dispose();
-        chart.value = void 0;
-      }
-    }
-    let unwatchOption = null;
-    watch(
-      manualUpdate,
-      (manualUpdate2) => {
-        if (typeof unwatchOption === "function") {
-          unwatchOption();
-          unwatchOption = null;
-        }
-        if (!manualUpdate2) {
-          unwatchOption = watch(
-            () => props.option,
-            (option, oldOption) => {
-              if (!option) {
-                return;
-              }
-              if (!chart.value) {
-                init();
-              } else {
-                chart.value.setOption(option, {
-                  // mutating `option` will lead to `notMerge: false` and
-                  // replacing it with new reference will lead to `notMerge: true`
-                  notMerge: option !== oldOption,
-                  ...realUpdateOptions.value
-                });
-              }
-            },
-            { deep: true }
-          );
-        }
-      },
-      {
-        immediate: true
-      }
-    );
-    watch(
-      [realTheme, realInitOptions],
-      () => {
-        cleanup();
-        init();
-      },
-      {
-        deep: true
-      }
-    );
-    watchEffect(() => {
-      if (props.group && chart.value) {
-        chart.value.group = props.group;
-      }
-    });
-    const publicApi = usePublicAPI(chart);
-    useLoading(chart, loading, loadingOptions);
-    useAutoresize(chart, autoresize, root);
-    onMounted(() => {
-      init();
-    });
-    onBeforeUnmount(() => {
-      if (wcRegistered && root.value) {
-        root.value.__dispose = cleanup;
-      } else {
-        cleanup();
-      }
-    });
-    const exposed = {
-      setOption,
-      root,
-      chart
-    };
-    expose({ ...exposed, ...publicApi });
-    return () => h(TAG_NAME, {
-      ...nonEventAttrs.value,
-      ...nativeListeners,
-      ref: root,
-      class: ["echarts", nonEventAttrs.value.class]
+    expose({
+      ...publicMethods,
+      root: toRef(() => root.value?.root),
+      chart: toRef(() => root.value?.chart)
     });
+    return () => h(VChart, { ...attrs, ref: root }, slots);
   }
 });

package/dist/runtime/components/VChartIsland.server.vue

@@ -19,8 +19,8 @@ defineSlots();
 </script>
 
 <template>
-  <div class="vue-echarts-container">
-    <!--eslint-disable-next-line vue/no-v-html-->
-    <div class="vue-echarts-inner" v-html="svgStr" />
-  </div>
+  <div class="vue-echarts-container">
+    <!--eslint-disable-next-line vue/no-v-html-->
+    <div class="vue-echarts-inner" v-html="svgStr" />
+  </div>
 </template>

package/dist/runtime/components/VChartLight.vue

@@ -54,10 +54,10 @@ export default defineComponent({
 </script>
 
 <template>
-  <VChartServer
-    ref="root"
-    :option="option"
-    :init-options="initOptions"
-    :theme="theme"
-  />
+  <VChartServer
+    ref="root"
+    :option="option"
+    :init-options="initOptions"
+    :theme="theme"
+  />
 </template>

package/dist/runtime/components/VChartServer.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed, inject, ref, toValue } from "vue";
-import { THEME_KEY, INIT_OPTIONS_KEY } from "../utils/injection";
+import { THEME_KEY, INIT_OPTIONS_KEY } from "vue-echarts";
 const defaultTheme = inject(THEME_KEY, null);
 const defaultInitOptions = inject(INIT_OPTIONS_KEY, null);
 const props = defineProps({

package/dist/runtime/server-plugin.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("#app").Plugin<Record<string, unknown>> & import("#app").ObjectPlugin<Record<string, unknown>>;
+declare const _default: import("nuxt/app").Plugin<Record<string, unknown>> & import("nuxt/app").ObjectPlugin<Record<string, unknown>>;
 export default _default;

package/dist/runtime/types.d.ts

@@ -1,49 +1,9 @@
-import type { init, SetOptionOpts, ECElementEvent, ElementEvent } from 'echarts/core';
-import type { MaybeRefOrGetter } from 'vue';
-export type Injection<T> = MaybeRefOrGetter<T | null>;
+import type { init } from 'echarts/core';
 type InitType = typeof init;
 export type InitParameters = Parameters<InitType>;
 export type Theme = NonNullable<InitParameters[1]>;
-export type ThemeInjection = Injection<Theme>;
 export type InitOptions = NonNullable<InitParameters[2]>;
-export type InitOptionsInjection = Injection<InitOptions>;
-export type UpdateOptions = SetOptionOpts;
-export type UpdateOptionsInjection = Injection<UpdateOptions>;
-export type EChartsType = ReturnType<InitType>;
-export type SetOptionType = EChartsType['setOption'];
+type EChartsType = ReturnType<InitType>;
+type SetOptionType = EChartsType['setOption'];
 export type Option = Parameters<SetOptionType>[0];
-export type LoadingOptions = {
-    text?: string;
-    textColor?: string;
-    fontSize?: number | string;
-    fontWeight?: number | string;
-    fontStyle?: string;
-    fontFamily?: string;
-    maskColor?: string;
-    showSpinner?: boolean;
-    color?: string;
-    spinnerRadius?: number;
-    lineWidth?: number;
-    zlevel?: number;
-};
-export type LoadingOptionsInjection = Injection<LoadingOptions>;
-type MouseEventName = 'click' | 'dblclick' | 'mouseout' | 'mouseover' | 'mouseup' | 'mousedown' | 'mousemove' | 'contextmenu' | 'globalout';
-type ElementEventName = MouseEventName | 'mousewheel' | 'drag' | 'dragstart' | 'dragend' | 'dragenter' | 'dragleave' | 'dragover' | 'drop';
-type ZRenderEventName = `zr:${ElementEventName}`;
-type OtherEventName = 'highlight' | 'downplay' | 'selectchanged' | 'legendselectchanged' | 'legendselected' | 'legendunselected' | 'legendselectall' | 'legendinverseselect' | 'legendscroll' | 'datazoom' | 'datarangeselected' | 'graphroam' | 'georoam' | 'treeroam' | 'timelinechanged' | 'timelineplaychanged' | 'restore' | 'dataviewchanged' | 'magictypechanged' | 'geoselectchanged' | 'geoselected' | 'geounselected' | 'axisareaselected' | 'brush' | 'brushEnd' | 'brushselected' | 'globalcursortaken';
-type MouseEmits = {
-    [key in MouseEventName]: (params: ECElementEvent) => void;
-};
-type ZRenderEmits = {
-    [key in ZRenderEventName]: (params: ElementEvent) => void;
-};
-type OtherEmits = {
-    [key in OtherEventName]: (params: any) => void;
-};
-export type Emits = MouseEmits & OtherEmits & {
-    rendered: (params: {
-        elapsedTime: number;
-    }) => void;
-    finished: () => void;
-} & ZRenderEmits;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-echarts",
-  "version": "0.4.0",
+  "version": "1.0.0",
   "description": "Nuxt Module for Apache ECharts™",
   "keywords": [
     "vue",
@@ -14,7 +14,6 @@
   "repository": "kingyue737/nuxt-echarts",
   "license": "MIT",
   "type": "module",
-  "packageManager": "pnpm@10.13.1",
   "exports": {
     ".": {
       "types": "./dist/types.d.mts",
@@ -26,49 +25,50 @@
   "files": [
     "dist"
   ],
-  "scripts": {
-    "prepack": "nuxt-module-build build",
-    "dev": "nuxi dev playground",
-    "dev:build": "pnpm run dev:prepare && nuxi build playground",
-    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
-    "release": "pnpm run lint && pnpm run test && pnpm run prepack && changelogen --release && npm publish --registry=\"https://registry.npmjs.org/\" && git push --follow-tags",
-    "release:nightly": "pnpm changelogen --canary --publish --publishTag nightly",
-    "docs:dev": "nuxi dev docs",
-    "docs:build": "nuxi build docs",
-    "docs:types": "nuxi typecheck docs",
-    "lint": "eslint . --fix",
-    "format": "prettier . --write",
-    "test": "vitest run",
-    "test:watch": "vitest watch",
-    "test:types": "vue-tsc --noEmit && nuxi typecheck playground"
-  },
   "dependencies": {
-    "@nuxt/kit": "^4.0.0"
+    "@nuxt/kit": "^4.0.3"
   },
   "devDependencies": {
-    "@nuxt/eslint-config": "^1.6.0",
-    "@nuxt/module-builder": "^1.0.1",
-    "@nuxt/schema": "^4.0.0",
+    "@nuxt/eslint-config": "^1.8.0",
+    "@nuxt/module-builder": "^1.0.2",
+    "@nuxt/schema": "^4.0.3",
     "@nuxt/test-utils": "^3.19.2",
     "@nuxthub/core": "^0.9.0",
-    "@types/node": "^22.16.5",
+    "@types/node": "^22.17.1",
     "changelogen": "^0.6.2",
-    "echarts": "^5.6.0",
+    "echarts": "^6.0.0",
     "embla-carousel": "^8.6.0",
-    "eslint": "^9.31.0",
-    "nuxt": "^4.0.0",
+    "eslint": "^9.33.0",
+    "nuxt": "^4.0.3",
     "prettier": "^3.6.2",
     "prettier-plugin-tailwindcss": "^0.6.14",
-    "typescript": "^5.8.3",
-    "vite": "^7.0.5",
+    "typescript": "^5.9.2",
+    "vite": "^7.1.1",
     "vitest": "^3.2.4",
-    "vue-tsc": "^3.0.3",
-    "wrangler": "^4.25.0"
+    "vue-echarts": "^8.0.0-beta.1",
+    "vue-tsc": "^3.0.5",
+    "wrangler": "^4.28.1"
   },
   "peerDependencies": {
-    "echarts": "^5.5.1"
+    "echarts": "^6.0.0",
+    "vue-echarts": "^8.0.0-beta.1"
   },
   "stackblitz": {
     "startCommand": "pnpm run dev:prepare && pnpm run dev"
+  },
+  "scripts": {
+    "dev": "nuxi dev playground",
+    "dev:build": "nuxi build playground",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "release": "pnpm run lint && pnpm run test && pnpm run prepack && changelogen --release && npm publish --registry=\"https://registry.npmjs.org/\" && git push --follow-tags",
+    "release:nightly": "pnpm changelogen --canary --publish --publishTag nightly",
+    "docs:dev": "nuxi dev docs",
+    "docs:build": "nuxi build docs",
+    "docs:types": "nuxi typecheck docs",
+    "lint": "eslint . --fix",
+    "format": "prettier . --write",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
+    "test:types": "vue-tsc --noEmit && nuxi typecheck playground"
   }
-}
+}

package/dist/runtime/composables/api.d.ts

@@ -1,7 +0,0 @@
-import type { Ref } from 'vue';
-import type { EChartsType } from '../types.js';
-declare const METHOD_NAMES: readonly ["getWidth", "getHeight", "getDom", "getOption", "resize", "dispatchAction", "convertToPixel", "convertFromPixel", "containPixel", "getDataURL", "getConnectedDataURL", "appendData", "clear", "isDisposed", "dispose"];
-type MethodName = (typeof METHOD_NAMES)[number];
-export type PublicMethods = Pick<EChartsType, MethodName>;
-export declare function usePublicAPI(chart: Ref<EChartsType | undefined>): PublicMethods;
-export {};

package/dist/runtime/composables/api.js

@@ -1,35 +0,0 @@
-const METHOD_NAMES = [
-  "getWidth",
-  "getHeight",
-  "getDom",
-  "getOption",
-  "resize",
-  "dispatchAction",
-  "convertToPixel",
-  "convertFromPixel",
-  "containPixel",
-  "getDataURL",
-  "getConnectedDataURL",
-  "appendData",
-  "clear",
-  "isDisposed",
-  "dispose"
-];
-export function usePublicAPI(chart) {
-  function makePublicMethod(name) {
-    return (...args) => {
-      if (!chart.value) {
-        throw new Error("ECharts is not initialized yet.");
-      }
-      return chart.value[name].apply(chart.value, args);
-    };
-  }
-  function makePublicMethods() {
-    const methods = /* @__PURE__ */ Object.create(null);
-    METHOD_NAMES.forEach((name) => {
-      methods[name] = makePublicMethod(name);
-    });
-    return methods;
-  }
-  return makePublicMethods();
-}

package/dist/runtime/composables/autoresize.d.ts

@@ -1,11 +0,0 @@
-import { type Ref, type PropType } from 'vue';
-import type { EChartsType } from '../types.js';
-type AutoresizeProp = boolean | {
-    throttle?: number;
-    onResize?: ResizeObserverCallback;
-};
-export declare function useAutoresize(chart: Ref<EChartsType | undefined>, autoresize: Ref<AutoresizeProp | undefined>, root: Ref<HTMLElement | undefined>): void;
-export declare const autoresizeProps: {
-    autoresize: PropType<AutoresizeProp>;
-};
-export {};

package/dist/runtime/composables/autoresize.js

@@ -1,46 +0,0 @@
-import { watch } from "vue";
-import { throttle } from "echarts/core";
-export function useAutoresize(chart, autoresize, root) {
-  watch(
-    [root, chart, autoresize],
-    ([root2, chart2, autoresize2], _, onCleanup) => {
-      let ro = null;
-      if (root2 && chart2 && autoresize2) {
-        const { offsetWidth, offsetHeight } = root2;
-        const autoresizeOptions = autoresize2 === true ? {} : autoresize2;
-        const { throttle: wait = 100, onResize } = autoresizeOptions;
-        let initialResizeTriggered = false;
-        const callback = (entry, ob) => {
-          chart2.resize({ height: "auto", width: "auto" });
-          onResize?.(entry, ob);
-        };
-        const resizeCallback = wait ? (
-          // @ts-expect-error callback can accept params
-          throttle(callback, wait)
-        ) : callback;
-        ro = new ResizeObserver((entry, observer) => {
-          if (!initialResizeTriggered) {
-            initialResizeTriggered = true;
-            if (root2.offsetWidth === offsetWidth && root2.offsetHeight === offsetHeight) {
-              return;
-            }
-          }
-          if (root2.offsetWidth === 0 || root2.offsetHeight === 0) {
-            return;
-          }
-          resizeCallback(entry, observer);
-        });
-        ro.observe(root2);
-      }
-      onCleanup(() => {
-        if (ro) {
-          ro.disconnect();
-          ro = null;
-        }
-      });
-    }
-  );
-}
-export const autoresizeProps = {
-  autoresize: [Boolean, Object]
-};

package/dist/runtime/composables/index.d.ts

@@ -1,3 +0,0 @@
-export * from './api.js';
-export * from './autoresize.js';
-export * from './loading.js';

package/dist/runtime/composables/index.js

@@ -1,3 +0,0 @@
-export * from "./api.js";
-export * from "./autoresize.js";
-export * from "./loading.js";

package/dist/runtime/composables/loading.d.ts

@@ -1,8 +0,0 @@
-import { type Ref, type InjectionKey, type PropType } from 'vue';
-import type { EChartsType, LoadingOptions, LoadingOptionsInjection } from '../types.js';
-export declare const LOADING_OPTIONS_KEY: InjectionKey<LoadingOptionsInjection>;
-export declare function useLoading(chart: Ref<EChartsType | undefined>, loading: Ref<boolean>, loadingOptions: Ref<LoadingOptions | undefined>): void;
-export declare const loadingProps: {
-    loading: BooleanConstructor;
-    loadingOptions: PropType<LoadingOptions>;
-};

package/dist/runtime/composables/loading.js

@@ -1,29 +0,0 @@
-import {
-  toValue,
-  inject,
-  computed,
-  watchEffect
-} from "vue";
-export const LOADING_OPTIONS_KEY = Symbol();
-export function useLoading(chart, loading, loadingOptions) {
-  const defaultLoadingOptions = inject(LOADING_OPTIONS_KEY, {});
-  const realLoadingOptions = computed(() => ({
-    ...toValue(defaultLoadingOptions) || {},
-    ...loadingOptions?.value
-  }));
-  watchEffect(() => {
-    const instance = chart.value;
-    if (!instance) {
-      return;
-    }
-    if (loading.value) {
-      instance.showLoading(realLoadingOptions.value);
-    } else {
-      instance.hideLoading();
-    }
-  });
-}
-export const loadingProps = {
-  loading: Boolean,
-  loadingOptions: Object
-};

package/dist/runtime/utils/injection.d.ts

@@ -1,6 +0,0 @@
-import type { InjectionKey } from 'vue';
-import type { ThemeInjection, InitOptionsInjection, UpdateOptionsInjection } from '../types.js';
-export declare const THEME_KEY: InjectionKey<ThemeInjection>;
-export declare const INIT_OPTIONS_KEY: InjectionKey<InitOptionsInjection>;
-export declare const UPDATE_OPTIONS_KEY: InjectionKey<UpdateOptionsInjection>;
-export { LOADING_OPTIONS_KEY } from '../composables/index.js';

package/dist/runtime/utils/injection.js

@@ -1,4 +0,0 @@
-export const THEME_KEY = Symbol();
-export const INIT_OPTIONS_KEY = Symbol();
-export const UPDATE_OPTIONS_KEY = Symbol();
-export { LOADING_OPTIONS_KEY } from "../composables/index.js";

package/dist/runtime/utils/on.d.ts

@@ -1,4 +0,0 @@
-export declare const isOn: (key: string) => boolean;
-type Attrs = Record<string, any>;
-export declare function omitOn(attrs: Attrs): Attrs;
-export {};

package/dist/runtime/utils/on.js

@@ -1,11 +0,0 @@
-const onRE = /^on[^a-z]/;
-export const isOn = (key) => onRE.test(key);
-export function omitOn(attrs) {
-  const result = {};
-  for (const key in attrs) {
-    if (!isOn(key)) {
-      result[key] = attrs[key];
-    }
-  }
-  return result;
-}

package/dist/runtime/utils/wc.d.ts

@@ -1,6 +0,0 @@
-export declare const TAG_NAME = "x-vue-echarts";
-export declare class EChartsElement extends HTMLElement {
-    __dispose: (() => void) | null;
-    disconnectedCallback(): void;
-}
-export declare function register(): boolean;

package/dist/runtime/utils/wc.js

@@ -1,28 +0,0 @@
-let registered = null;
-export const TAG_NAME = "x-vue-echarts";
-if (typeof HTMLElement === "undefined") {
-  globalThis.HTMLElement = Object;
-  registered = false;
-}
-export class EChartsElement extends HTMLElement {
-  __dispose = null;
-  disconnectedCallback() {
-    if (this.__dispose) {
-      this.__dispose();
-      this.__dispose = null;
-    }
-  }
-}
-export function register() {
-  if (registered != null) {
-    return registered;
-  }
-  try {
-    if (customElements.get(TAG_NAME) == null) {
-      customElements.define(TAG_NAME, EChartsElement);
-    }
-  } catch {
-    return registered = false;
-  }
-  return registered = true;
-}