@revivejs/vue-highcharts 2.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Alexandro Marques
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,116 @@
+# @revivejs/vue-highcharts
+
+> A maintained **Vue 2 wrapper for Highcharts** with a thin plugin API, a globally registered `<highcharts>` component, and versioned live demos.
+
+[![npm version](https://img.shields.io/npm/v/@revivejs/vue-highcharts.svg?style=flat-square)](https://www.npmjs.com/package/@revivejs/vue-highcharts)
+[![npm downloads](https://img.shields.io/npm/dt/@revivejs/vue-highcharts.svg?style=flat-square)](https://www.npmjs.com/package/@revivejs/vue-highcharts)
+[![license](https://img.shields.io/npm/l/@revivejs/vue-highcharts.svg?style=flat-square)](https://github.com/alexandroit/vue-highcharts/blob/master/LICENSE)
+[![Vue 2](https://img.shields.io/badge/Vue-2-brightgreen?style=flat-square&logo=vuedotjs)](https://v2.vuejs.org)
+[![Highcharts](https://img.shields.io/badge/Highcharts-12.5-navy?style=flat-square)](https://www.highcharts.com)
+
+**[Documentation & Live Demos](https://alexandroit.github.io/vue-highcharts/)** | **[npm](https://www.npmjs.com/package/@revivejs/vue-highcharts)** | **[Issues](https://github.com/alexandroit/vue-highcharts/issues)** | **[Repository](https://github.com/alexandroit/vue-highcharts)**
+
+**Latest version:** `2.0.0`
+
+## Why this library?
+
+`@revivejs/vue-highcharts` follows the familiar Vue + Highcharts pattern:
+
+- install one plugin
+- pass a `highcharts` instance
+- pass a single `options` object
+- grab the live chart through a component ref when you need imperative access
+
+That keeps Vue in charge of your template structure while preserving the native Highcharts API.
+
+## Vue Version Compatibility
+
+| Package version | Vue version | Highcharts version | Demo link |
+| :---: | :---: | :---: | :--- |
+| **2.0.0** | **2.7.x** | **12.5.x** | [Vue 2 demo](https://alexandroit.github.io/vue-highcharts/vue-2/) |
+
+## Installation
+
+```bash
+npm install @revivejs/vue-highcharts highcharts
+```
+
+## Basic Usage
+
+```js
+import Vue from 'vue';
+import Highcharts from 'highcharts';
+import HighchartsVue from '@revivejs/vue-highcharts';
+
+Vue.use(HighchartsVue);
+
+new Vue({
+  data() {
+    return {
+      Highcharts,
+      chartOptions: {
+        title: { text: 'Quarterly revenue' },
+        series: [{ type: 'line', data: [14, 18, 22, 28] }]
+      }
+    };
+  }
+});
+```
+
+```html
+<highcharts :highcharts="Highcharts" :options="chartOptions" />
+```
+
+## StockChart
+
+```html
+<highcharts
+  :highcharts="Highstock"
+  constructor-type="stockChart"
+  :options="stockOptions"
+/>
+```
+
+## Modules
+
+```js
+import Highcharts from 'highcharts';
+import {
+  exposeHighchartsGlobals,
+  initHighchartsModules
+} from '@revivejs/vue-highcharts';
+
+exposeHighchartsGlobals(Highcharts);
+
+const [{ default: Highcharts3D }, { default: HeatmapModule }] = await Promise.all([
+  import('highcharts/highcharts-3d.js'),
+  import('highcharts/modules/heatmap.js')
+]);
+
+initHighchartsModules(Highcharts, Highcharts3D, HeatmapModule);
+```
+
+## Imperative Access
+
+```js
+this.$refs.salesChart.chart.series[0].addPoint(42);
+```
+
+## API
+
+| Prop | Type | Notes |
+| :--- | :--- | :--- |
+| `highcharts` | `typeof Highcharts` | Required. Pass the instance or bundle you want to use. |
+| `options` | `Highcharts.Options` | Required. Passed into the selected Highcharts constructor. |
+| `constructorType` | `'chart' \| 'stockChart' \| 'mapChart' \| 'ganttChart'` | Defaults to `'chart'`. |
+| `callback` | `(chart) => void` | Called after the chart is created. |
+| `allowChartUpdate` | `boolean` | Defaults to `true`. |
+| `immutable` | `boolean` | Recreates the chart instead of calling `chart.update`. |
+| `updateArgs` | `[redraw, oneToOne, animation]` | Forwarded to `chart.update`. |
+
+## Changelog
+
+### 2.0.0
+- Initial Vue wrapper line
+- Added the first versioned docs app for Vue 2
+- Established the versioned docs structure used by later releases

package/dist/index.cjs

@@ -0,0 +1,177 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Chart: () => Chart,
+  HighchartsVue: () => HighchartsVue,
+  default: () => plugin_default,
+  exposeHighchartsGlobals: () => exposeHighchartsGlobals,
+  initHighchartsModules: () => initHighchartsModules
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/Chart.ts
+var import_vue = __toESM(require("vue"), 1);
+function createChart() {
+  const container = this.$refs.container;
+  if (!container) {
+    return;
+  }
+  const factory = this.highcharts[this.constructorType];
+  if (typeof factory !== "function") {
+    throw new Error(
+      `Unknown Highcharts constructor "${this.constructorType}". Make sure you passed the right Highcharts bundle.`
+    );
+  }
+  destroyChart.call(this);
+  this.chart = factory(container, this.options, (chart) => {
+    this.callback?.(chart);
+  });
+}
+function destroyChart() {
+  this.chart?.destroy();
+  this.chart = null;
+}
+var Chart = import_vue.default.extend({
+  name: "highcharts",
+  props: {
+    highcharts: {
+      type: Object,
+      required: true
+    },
+    options: {
+      type: Object,
+      required: true
+    },
+    constructorType: {
+      type: String,
+      default: "chart"
+    },
+    callback: {
+      type: Function,
+      default: void 0
+    },
+    allowChartUpdate: {
+      type: Boolean,
+      default: true
+    },
+    immutable: {
+      type: Boolean,
+      default: false
+    },
+    updateArgs: {
+      type: Array,
+      default: () => [true, true, true]
+    }
+  },
+  data() {
+    return {
+      chart: null
+    };
+  },
+  mounted() {
+    createChart.call(this);
+  },
+  beforeDestroy() {
+    destroyChart.call(this);
+  },
+  watch: {
+    highcharts() {
+      createChart.call(this);
+    },
+    constructorType() {
+      createChart.call(this);
+    },
+    options: {
+      deep: true,
+      handler() {
+        if (!this.chart) {
+          return;
+        }
+        if (this.immutable) {
+          createChart.call(this);
+          return;
+        }
+        if (!this.allowChartUpdate) {
+          return;
+        }
+        this.chart.update(
+          this.options,
+          this.updateArgs[0],
+          this.updateArgs[1],
+          this.updateArgs[2]
+        );
+      }
+    }
+  },
+  render(h) {
+    return h("div", { ref: "container" });
+  }
+});
+
+// src/plugin.ts
+var HighchartsVue = {
+  install(Vue2) {
+    Vue2.component("highcharts", Chart);
+  }
+};
+var plugin_default = HighchartsVue;
+
+// src/modules.ts
+var appliedModules = /* @__PURE__ */ new WeakMap();
+function exposeHighchartsGlobals(highcharts) {
+  const scope = globalThis;
+  scope.Highcharts = highcharts;
+  scope._Highcharts = highcharts;
+}
+function initHighchartsModules(highcharts, ...modules) {
+  exposeHighchartsGlobals(highcharts);
+  const registry = appliedModules.get(highcharts) ?? /* @__PURE__ */ new Set();
+  for (const entry of modules) {
+    const factory = entry.default ?? entry;
+    if (registry.has(factory)) {
+      continue;
+    }
+    if (typeof factory === "function") {
+      factory(highcharts);
+      registry.add(factory);
+    }
+  }
+  appliedModules.set(highcharts, registry);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Chart,
+  HighchartsVue,
+  exposeHighchartsGlobals,
+  initHighchartsModules
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/Chart.ts","../src/plugin.ts","../src/modules.ts"],"sourcesContent":["export { Chart } from './Chart';\nexport type { ConstructorType, UpdateArgs } from './Chart';\nexport { HighchartsVue } from './plugin';\nexport { exposeHighchartsGlobals, initHighchartsModules } from './modules';\nexport type { HighchartsModuleFactory } from './modules';\nexport { default } from './plugin';\n","import Vue from 'vue';\nimport type Highcharts from 'highcharts';\n\nexport type ConstructorType = 'chart' | 'stockChart' | 'mapChart' | 'ganttChart';\n\nexport type UpdateArgs = [\n  redraw?: boolean,\n  oneToOne?: boolean,\n  animation?: boolean | Partial<Highcharts.AnimationOptionsObject>\n];\n\nfunction createChart(this: Vue & {\n  highcharts: typeof Highcharts;\n  options: Highcharts.Options;\n  constructorType: ConstructorType;\n  callback?: (chart: Highcharts.Chart) => void;\n  chart: Highcharts.Chart | null;\n  $refs: { container?: HTMLElement };\n}) {\n  const container = this.$refs.container;\n\n  if (!container) {\n    return;\n  }\n\n  const factory = (this.highcharts as unknown as Record<string, unknown>)[this.constructorType];\n\n  if (typeof factory !== 'function') {\n    throw new Error(\n      `Unknown Highcharts constructor \"${this.constructorType}\". ` +\n        'Make sure you passed the right Highcharts bundle.'\n    );\n  }\n\n  destroyChart.call(this);\n\n  this.chart = (\n    factory as (\n      container: HTMLElement,\n      options: Highcharts.Options,\n      callback?: (chart: Highcharts.Chart) => void\n    ) => Highcharts.Chart\n  )(container, this.options, (chart) => {\n    this.callback?.(chart);\n  });\n}\n\nfunction destroyChart(this: Vue & { chart: Highcharts.Chart | null }) {\n  this.chart?.destroy();\n  this.chart = null;\n}\n\nexport const Chart = Vue.extend({\n  name: 'highcharts',\n  props: {\n    highcharts: {\n      type: Object,\n      required: true\n    },\n    options: {\n      type: Object,\n      required: true\n    },\n    constructorType: {\n      type: String,\n      default: 'chart'\n    },\n    callback: {\n      type: Function,\n      default: undefined\n    },\n    allowChartUpdate: {\n      type: Boolean,\n      default: true\n    },\n    immutable: {\n      type: Boolean,\n      default: false\n    },\n    updateArgs: {\n      type: Array,\n      default: () => [true, true, true]\n    }\n  },\n  data() {\n    return {\n      chart: null as Highcharts.Chart | null\n    };\n  },\n  mounted() {\n    createChart.call(this as never);\n  },\n  beforeDestroy() {\n    destroyChart.call(this as never);\n  },\n  watch: {\n    highcharts() {\n      createChart.call(this as never);\n    },\n    constructorType() {\n      createChart.call(this as never);\n    },\n    options: {\n      deep: true,\n      handler(this: Vue & {\n        allowChartUpdate: boolean;\n        immutable: boolean;\n        updateArgs: UpdateArgs;\n        chart: Highcharts.Chart | null;\n        options: Highcharts.Options;\n      }) {\n        if (!this.chart) {\n          return;\n        }\n\n        if (this.immutable) {\n          createChart.call(this as never);\n          return;\n        }\n\n        if (!this.allowChartUpdate) {\n          return;\n        }\n\n        this.chart.update(\n          this.options,\n          this.updateArgs[0],\n          this.updateArgs[1],\n          this.updateArgs[2]\n        );\n      }\n    }\n  },\n  render(h) {\n    return h('div', { ref: 'container' });\n  }\n});\n","import type { PluginObject } from 'vue';\nimport { Chart } from './Chart';\n\nexport const HighchartsVue: PluginObject<never> = {\n  install(Vue) {\n    Vue.component('highcharts', Chart);\n  }\n};\n\nexport default HighchartsVue;\n","import type Highcharts from 'highcharts';\n\nexport type HighchartsModuleFactory =\n  | ((highcharts: typeof Highcharts) => void)\n  | { default?: (highcharts: typeof Highcharts) => void };\n\ntype HighchartsGlobalScope = typeof globalThis & {\n  Highcharts?: typeof Highcharts;\n  _Highcharts?: typeof Highcharts;\n};\n\nconst appliedModules = new WeakMap<object, Set<unknown>>();\n\nexport function exposeHighchartsGlobals(highcharts: typeof Highcharts) {\n  const scope = globalThis as HighchartsGlobalScope;\n\n  scope.Highcharts = highcharts;\n  scope._Highcharts = highcharts;\n}\n\nexport function initHighchartsModules(\n  highcharts: typeof Highcharts,\n  ...modules: HighchartsModuleFactory[]\n) {\n  exposeHighchartsGlobals(highcharts);\n\n  const registry = appliedModules.get(highcharts) ?? new Set<unknown>();\n\n  for (const entry of modules) {\n    const factory = (entry as { default?: (highcharts: typeof Highcharts) => void }).default ?? entry;\n\n    if (registry.has(factory)) {\n      continue;\n    }\n\n    if (typeof factory === 'function') {\n      factory(highcharts);\n      registry.add(factory);\n    }\n  }\n\n  appliedModules.set(highcharts, registry);\n}\n"],"mappings":"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","names":["Vue","Vue"]}

package/dist/index.d.cts

@@ -0,0 +1,32 @@
+import * as vue_types_vue from 'vue/types/vue';
+import * as Vue from 'vue';
+import Vue__default, { PluginObject } from 'vue';
+import Highcharts from 'highcharts';
+
+type ConstructorType = 'chart' | 'stockChart' | 'mapChart' | 'ganttChart';
+type UpdateArgs = [
+    redraw?: boolean,
+    oneToOne?: boolean,
+    animation?: boolean | Partial<Highcharts.AnimationOptionsObject>
+];
+declare const Chart: vue_types_vue.ExtendedVue<Vue__default<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue__default>, {
+    chart: Highcharts.Chart | null;
+}, unknown, unknown, {
+    highcharts: any;
+    options: any;
+    constructorType: string;
+    callback: Function;
+    allowChartUpdate: boolean;
+    immutable: boolean;
+    updateArgs: unknown[];
+}, {}, Vue.ComponentOptionsMixin, Vue.ComponentOptionsMixin>;
+
+declare const HighchartsVue: PluginObject<never>;
+
+type HighchartsModuleFactory = ((highcharts: typeof Highcharts) => void) | {
+    default?: (highcharts: typeof Highcharts) => void;
+};
+declare function exposeHighchartsGlobals(highcharts: typeof Highcharts): void;
+declare function initHighchartsModules(highcharts: typeof Highcharts, ...modules: HighchartsModuleFactory[]): void;
+
+export { Chart, type ConstructorType, type HighchartsModuleFactory, HighchartsVue, type UpdateArgs, HighchartsVue as default, exposeHighchartsGlobals, initHighchartsModules };

package/dist/index.d.ts

@@ -0,0 +1,32 @@
+import * as vue_types_vue from 'vue/types/vue';
+import * as Vue from 'vue';
+import Vue__default, { PluginObject } from 'vue';
+import Highcharts from 'highcharts';
+
+type ConstructorType = 'chart' | 'stockChart' | 'mapChart' | 'ganttChart';
+type UpdateArgs = [
+    redraw?: boolean,
+    oneToOne?: boolean,
+    animation?: boolean | Partial<Highcharts.AnimationOptionsObject>
+];
+declare const Chart: vue_types_vue.ExtendedVue<Vue__default<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue__default>, {
+    chart: Highcharts.Chart | null;
+}, unknown, unknown, {
+    highcharts: any;
+    options: any;
+    constructorType: string;
+    callback: Function;
+    allowChartUpdate: boolean;
+    immutable: boolean;
+    updateArgs: unknown[];
+}, {}, Vue.ComponentOptionsMixin, Vue.ComponentOptionsMixin>;
+
+declare const HighchartsVue: PluginObject<never>;
+
+type HighchartsModuleFactory = ((highcharts: typeof Highcharts) => void) | {
+    default?: (highcharts: typeof Highcharts) => void;
+};
+declare function exposeHighchartsGlobals(highcharts: typeof Highcharts): void;
+declare function initHighchartsModules(highcharts: typeof Highcharts, ...modules: HighchartsModuleFactory[]): void;
+
+export { Chart, type ConstructorType, type HighchartsModuleFactory, HighchartsVue, type UpdateArgs, HighchartsVue as default, exposeHighchartsGlobals, initHighchartsModules };

package/dist/index.js

@@ -0,0 +1,137 @@
+// src/Chart.ts
+import Vue from "vue";
+function createChart() {
+  const container = this.$refs.container;
+  if (!container) {
+    return;
+  }
+  const factory = this.highcharts[this.constructorType];
+  if (typeof factory !== "function") {
+    throw new Error(
+      `Unknown Highcharts constructor "${this.constructorType}". Make sure you passed the right Highcharts bundle.`
+    );
+  }
+  destroyChart.call(this);
+  this.chart = factory(container, this.options, (chart) => {
+    this.callback?.(chart);
+  });
+}
+function destroyChart() {
+  this.chart?.destroy();
+  this.chart = null;
+}
+var Chart = Vue.extend({
+  name: "highcharts",
+  props: {
+    highcharts: {
+      type: Object,
+      required: true
+    },
+    options: {
+      type: Object,
+      required: true
+    },
+    constructorType: {
+      type: String,
+      default: "chart"
+    },
+    callback: {
+      type: Function,
+      default: void 0
+    },
+    allowChartUpdate: {
+      type: Boolean,
+      default: true
+    },
+    immutable: {
+      type: Boolean,
+      default: false
+    },
+    updateArgs: {
+      type: Array,
+      default: () => [true, true, true]
+    }
+  },
+  data() {
+    return {
+      chart: null
+    };
+  },
+  mounted() {
+    createChart.call(this);
+  },
+  beforeDestroy() {
+    destroyChart.call(this);
+  },
+  watch: {
+    highcharts() {
+      createChart.call(this);
+    },
+    constructorType() {
+      createChart.call(this);
+    },
+    options: {
+      deep: true,
+      handler() {
+        if (!this.chart) {
+          return;
+        }
+        if (this.immutable) {
+          createChart.call(this);
+          return;
+        }
+        if (!this.allowChartUpdate) {
+          return;
+        }
+        this.chart.update(
+          this.options,
+          this.updateArgs[0],
+          this.updateArgs[1],
+          this.updateArgs[2]
+        );
+      }
+    }
+  },
+  render(h) {
+    return h("div", { ref: "container" });
+  }
+});
+
+// src/plugin.ts
+var HighchartsVue = {
+  install(Vue2) {
+    Vue2.component("highcharts", Chart);
+  }
+};
+var plugin_default = HighchartsVue;
+
+// src/modules.ts
+var appliedModules = /* @__PURE__ */ new WeakMap();
+function exposeHighchartsGlobals(highcharts) {
+  const scope = globalThis;
+  scope.Highcharts = highcharts;
+  scope._Highcharts = highcharts;
+}
+function initHighchartsModules(highcharts, ...modules) {
+  exposeHighchartsGlobals(highcharts);
+  const registry = appliedModules.get(highcharts) ?? /* @__PURE__ */ new Set();
+  for (const entry of modules) {
+    const factory = entry.default ?? entry;
+    if (registry.has(factory)) {
+      continue;
+    }
+    if (typeof factory === "function") {
+      factory(highcharts);
+      registry.add(factory);
+    }
+  }
+  appliedModules.set(highcharts, registry);
+}
+export {
+  Chart,
+  HighchartsVue,
+  plugin_default as default,
+  exposeHighchartsGlobals,
+  initHighchartsModules
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Chart.ts","../src/plugin.ts","../src/modules.ts"],"sourcesContent":["import Vue from 'vue';\nimport type Highcharts from 'highcharts';\n\nexport type ConstructorType = 'chart' | 'stockChart' | 'mapChart' | 'ganttChart';\n\nexport type UpdateArgs = [\n  redraw?: boolean,\n  oneToOne?: boolean,\n  animation?: boolean | Partial<Highcharts.AnimationOptionsObject>\n];\n\nfunction createChart(this: Vue & {\n  highcharts: typeof Highcharts;\n  options: Highcharts.Options;\n  constructorType: ConstructorType;\n  callback?: (chart: Highcharts.Chart) => void;\n  chart: Highcharts.Chart | null;\n  $refs: { container?: HTMLElement };\n}) {\n  const container = this.$refs.container;\n\n  if (!container) {\n    return;\n  }\n\n  const factory = (this.highcharts as unknown as Record<string, unknown>)[this.constructorType];\n\n  if (typeof factory !== 'function') {\n    throw new Error(\n      `Unknown Highcharts constructor \"${this.constructorType}\". ` +\n        'Make sure you passed the right Highcharts bundle.'\n    );\n  }\n\n  destroyChart.call(this);\n\n  this.chart = (\n    factory as (\n      container: HTMLElement,\n      options: Highcharts.Options,\n      callback?: (chart: Highcharts.Chart) => void\n    ) => Highcharts.Chart\n  )(container, this.options, (chart) => {\n    this.callback?.(chart);\n  });\n}\n\nfunction destroyChart(this: Vue & { chart: Highcharts.Chart | null }) {\n  this.chart?.destroy();\n  this.chart = null;\n}\n\nexport const Chart = Vue.extend({\n  name: 'highcharts',\n  props: {\n    highcharts: {\n      type: Object,\n      required: true\n    },\n    options: {\n      type: Object,\n      required: true\n    },\n    constructorType: {\n      type: String,\n      default: 'chart'\n    },\n    callback: {\n      type: Function,\n      default: undefined\n    },\n    allowChartUpdate: {\n      type: Boolean,\n      default: true\n    },\n    immutable: {\n      type: Boolean,\n      default: false\n    },\n    updateArgs: {\n      type: Array,\n      default: () => [true, true, true]\n    }\n  },\n  data() {\n    return {\n      chart: null as Highcharts.Chart | null\n    };\n  },\n  mounted() {\n    createChart.call(this as never);\n  },\n  beforeDestroy() {\n    destroyChart.call(this as never);\n  },\n  watch: {\n    highcharts() {\n      createChart.call(this as never);\n    },\n    constructorType() {\n      createChart.call(this as never);\n    },\n    options: {\n      deep: true,\n      handler(this: Vue & {\n        allowChartUpdate: boolean;\n        immutable: boolean;\n        updateArgs: UpdateArgs;\n        chart: Highcharts.Chart | null;\n        options: Highcharts.Options;\n      }) {\n        if (!this.chart) {\n          return;\n        }\n\n        if (this.immutable) {\n          createChart.call(this as never);\n          return;\n        }\n\n        if (!this.allowChartUpdate) {\n          return;\n        }\n\n        this.chart.update(\n          this.options,\n          this.updateArgs[0],\n          this.updateArgs[1],\n          this.updateArgs[2]\n        );\n      }\n    }\n  },\n  render(h) {\n    return h('div', { ref: 'container' });\n  }\n});\n","import type { PluginObject } from 'vue';\nimport { Chart } from './Chart';\n\nexport const HighchartsVue: PluginObject<never> = {\n  install(Vue) {\n    Vue.component('highcharts', Chart);\n  }\n};\n\nexport default HighchartsVue;\n","import type Highcharts from 'highcharts';\n\nexport type HighchartsModuleFactory =\n  | ((highcharts: typeof Highcharts) => void)\n  | { default?: (highcharts: typeof Highcharts) => void };\n\ntype HighchartsGlobalScope = typeof globalThis & {\n  Highcharts?: typeof Highcharts;\n  _Highcharts?: typeof Highcharts;\n};\n\nconst appliedModules = new WeakMap<object, Set<unknown>>();\n\nexport function exposeHighchartsGlobals(highcharts: typeof Highcharts) {\n  const scope = globalThis as HighchartsGlobalScope;\n\n  scope.Highcharts = highcharts;\n  scope._Highcharts = highcharts;\n}\n\nexport function initHighchartsModules(\n  highcharts: typeof Highcharts,\n  ...modules: HighchartsModuleFactory[]\n) {\n  exposeHighchartsGlobals(highcharts);\n\n  const registry = appliedModules.get(highcharts) ?? new Set<unknown>();\n\n  for (const entry of modules) {\n    const factory = (entry as { default?: (highcharts: typeof Highcharts) => void }).default ?? entry;\n\n    if (registry.has(factory)) {\n      continue;\n    }\n\n    if (typeof factory === 'function') {\n      factory(highcharts);\n      registry.add(factory);\n    }\n  }\n\n  appliedModules.set(highcharts, registry);\n}\n"],"mappings":"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","names":["Vue"]}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@revivejs/vue-highcharts",
+  "version": "2.0.0",
+  "description": "A thin Vue 2 wrapper for Highcharts with versioned demos.",
+  "keywords": [
+    "vue",
+    "vue-library",
+    "highcharts",
+    "charts",
+    "vue-highcharts",
+    "highcharts-vue",
+    "stock-chart",
+    "heatmap",
+    "3d-chart",
+    "plugin",
+    "wrapper",
+    "ui-component",
+    "revived",
+    "maintained"
+  ],
+  "homepage": "https://alexandroit.github.io/vue-highcharts/",
+  "bugs": {
+    "url": "https://github.com/alexandroit/vue-highcharts/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/alexandroit/vue-highcharts.git"
+  },
+  "license": "MIT",
+  "type": "module",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsup",
+    "clean": "rm -rf dist docs/vue-2 docs/vue-3",
+    "docs:install:vue-2": "cd docs-src/vue-2 && npm install",
+    "build:docs:vue-2": "cd docs-src/vue-2 && npm run build",
+    "build:docs": "npm run build:docs:vue-2",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "highcharts": ">=12.5.0",
+    "vue": ">=2.7.0 <3.0.0"
+  },
+  "devDependencies": {
+    "highcharts": "12.5.0",
+    "tsup": "8.5.1",
+    "typescript": "5.9.3",
+    "vue": "2.7.16"
+  }
+}