apexcharts 7.2.0 → 7.4.0

package/dist/features/all.esm.js

@@ -39,7 +39,7 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 /*!
- * ApexCharts v7.2.0
+ * ApexCharts v7.4.0
  * (c) 2018-2026 ApexCharts
  */
 import * as _core from "apexcharts/core";
@@ -810,8 +810,7 @@ class Exports {
       }
     };
     const handleUnequalXValues = () => {
-      const categories = /* @__PURE__ */ new Set();
-      const data = {};
+      const byCategory = /* @__PURE__ */ new Map();
       series.forEach((s, sI) => {
         s == null ? void 0 : s.data.forEach((dataItem) => {
           let cat, value;
@@ -824,23 +823,22 @@ class Exports {
           } else {
             return;
           }
-          if (!/** @type {Record<string,any>} */
-          data[cat]) {
-            data[cat] = Array(
-              series.length
-            ).fill("");
+          const key = String(cat);
+          let row = byCategory.get(key);
+          if (!row) {
+            row = { cat, values: Array(series.length).fill("") };
+            byCategory.set(key, row);
           }
-          data[cat][sI] = getFormattedValue(value);
-          categories.add(cat);
+          row.values[sI] = getFormattedValue(value);
         });
       });
       if (columns.length) {
         rows.push(columns.join(columnDelimiter));
       }
-      Array.from(categories).sort().forEach((cat) => {
-        const values = (
-          /** @type {Record<string,any>} */
-          data[cat]
+      Array.from(byCategory.keys()).sort().forEach((key) => {
+        const { cat, values } = (
+          /** @type {{cat: any, values: string[]}} */
+          byCategory.get(key)
         );
         rows.push([getFormattedCategory(cat), ...values].join(columnDelimiter));
       });
@@ -2600,10 +2598,49 @@ class Toolbar {
     this.elMenu = null;
     this.elMenuItems = [];
     this.t = null;
+    this._drawnForZoom = null;
   }
-  createToolbar() {
-    var _a, _b;
+  /**
+   * Whether this chart's built-in ways back out of a zoom are switched on.
+   *
+   * The gate `chart.zoom.resetControl` opens, and the one the Escape shortcut
+   * reads too, so a page that says it supplies its own reset gets neither.
+   * 'auto' means "supply one when nothing else on screen can": a toolbar
+   * showing its reset tool is a way back, and anything else is not.
+   *
+   * @returns {boolean}
+   */
+  resetControlAllowed() {
+    const c = this.w.config.chart;
+    if (!c.zoom || !c.zoom.enabled) return false;
+    const setting = c.zoom.resetControl === void 0 ? "auto" : c.zoom.resetControl;
+    if (setting !== "auto") return !!setting;
+    const onScreen = c.toolbar && c.toolbar.show && c.toolbar.tools && c.toolbar.tools.reset;
+    return !onScreen;
+  }
+  /**
+   * Whether a reset control has to be drawn for the state the chart is in now.
+   *
+   * Only while the chart is actually zoomed, which is the whole idea: the
+   * control appears at the moment the viewer changed the view, where they are
+   * already looking, and goes again when the range does. A page that never
+   * zooms never sees it, so `toolbar: { show: false }` still means an empty
+   * chart for everyone who does not zoom.
+   *
+   * @returns {boolean}
+   */
+  resetControlDue() {
+    return !!this.w.interact.zoomed && this.resetControlAllowed();
+  }
+  /**
+   * @param {{ resetOnly?: boolean }} [opts] `resetOnly` draws the on-demand
+   *   reset control and nothing else, for a chart whose page asked for no
+   *   toolbar at all. See {@link Toolbar#resetControlDue}.
+   */
+  createToolbar(opts = {}) {
+    var _a, _b, _c;
     const w = this.w;
+    const resetOnly = !!opts.resetOnly;
     const createDiv = () => {
       return BrowserAPIs.createElementNS("http://www.w3.org/1999/xhtml", "div");
     };
@@ -2631,6 +2668,24 @@ class Toolbar {
     this.elMenu = createDiv();
     this.elCustomIcons = [];
     this.t = w.config.chart.toolbar.tools;
+    this._drawnForZoom = null;
+    if (resetOnly) {
+      this.t = {
+        zoom: false,
+        zoomin: false,
+        zoomout: false,
+        selection: false,
+        pan: false,
+        measure: false,
+        download: false,
+        customIcons: [],
+        reset: true
+      };
+      this._drawnForZoom = "wrap";
+    } else if (!this.t.reset && this.resetControlDue()) {
+      this.t = __spreadProps(__spreadValues({}, this.t), { reset: true });
+      this._drawnForZoom = "control";
+    }
     if (Array.isArray(this.t.customIcons)) {
       for (let i = 0; i < this.t.customIcons.length; i++) {
         this.elCustomIcons.push(createBtn());
@@ -2741,7 +2796,14 @@ class Toolbar {
       this.elMenuIcon.setAttribute("aria-haspopup", "true");
       this.elMenuIcon.setAttribute("aria-expanded", "false");
     }
-    this._createHamburgerMenu(elToolbarWrap);
+    if (!resetOnly) this._createHamburgerMenu(elToolbarWrap);
+    if (resetOnly) {
+      (_a = this.elZoomReset) == null ? void 0 : _a.addEventListener(
+        "click",
+        this.handleZoomReset.bind(this)
+      );
+      return;
+    }
     if (w.interact.zoomEnabled) {
       this.elZoom.classList.add(this.selectedClass);
     } else if (w.interact.panEnabled) {
@@ -2750,7 +2812,7 @@ class Toolbar {
       this.elSelection.classList.add(this.selectedClass);
     } else if (w.interact.measureEnabled && this.elMeasure) {
       this.elMeasure.classList.add(this.selectedClass);
-      (_b = (_a = this.ctx.measure) == null ? void 0 : _a.startMeasure) == null ? void 0 : _b.call(_a);
+      (_c = (_b = this.ctx.measure) == null ? void 0 : _b.startMeasure) == null ? void 0 : _c.call(_b);
     }
     this.addToolbarEventListeners();
   }
@@ -3156,9 +3218,28 @@ class Toolbar {
         break;
     }
   }
+  /**
+   * Take down whatever the zoom alone put on screen.
+   *
+   * By hand, and not left to the next render, because of the order in
+   * {@link Toolbar#handleZoomReset}: the re-render happens while
+   * `interact.zoomed` is still true, so the control is drawn once more and then
+   * the flag clears with no further pass to notice. Reversing that order would
+   * change what every listener downstream of the update sees, which is a much
+   * larger promise than this control is worth.
+   */
+  clearZoomAffordance() {
+    const drawn = this._drawnForZoom;
+    this._drawnForZoom = null;
+    if (!drawn || !this.elZoomReset) return;
+    const parent = this.elZoomReset.parentNode;
+    const gone = drawn === "wrap" ? parent : this.elZoomReset;
+    if (gone && gone.parentNode) gone.parentNode.removeChild(gone);
+  }
   handleZoomReset() {
     const charts = this.ctx.getSyncedCharts();
     charts.forEach((ch) => {
+      var _a;
       const w = ch.w;
       if (!w.interact.zoomed) return;
       w.globals.lastXAxis.min = w.globals.initialConfig.xaxis.min;
@@ -3184,6 +3265,7 @@ class Toolbar {
         w.config.chart.animations.dynamicAnimation.enabled
       );
       w.interact.zoomed = false;
+      (_a = ch.ctx.toolbar) == null ? void 0 : _a.clearZoomAffordance();
     });
   }
   destroy() {
@@ -3332,6 +3414,10 @@ class ZoomPanSelection extends Toolbar {
         passive: false
       });
     }
+    this.hoverArea.addEventListener("keydown", me.escapeResetEvent.bind(me), {
+      capture: false,
+      passive: true
+    });
     if (this._momentumEnabled()) {
       ["touchstart", "touchmove", "touchend", "touchcancel"].forEach(
         (event) => {
@@ -3464,12 +3550,16 @@ class ZoomPanSelection extends Toolbar {
   /**
    * A wheel or pinch zoom is an incidental gesture: the viewer can land in a
    * zoomed window without meaning to (a page scroll over the chart, a two-finger
-   * swipe), so it is only offered when there is a way back out of it. The only
-   * built-in way back is the toolbar's reset button, hence 'auto' (the default
-   * for both allowMouseWheelZoom and pinch) resolves against that button being
-   * present. A page that builds its own reset control sets the option to true
-   * and gets the gesture with no toolbar. Drag-to-zoom is deliberate, so it is
-   * not gated this way.
+   * swipe), so it is only offered when there is a way back out of it. 'auto'
+   * (the default for both allowMouseWheelZoom and pinch) resolves against a
+   * reset button that is already on screen. A page that builds its own reset
+   * control sets the option to true and gets the gesture with no toolbar.
+   * Drag-to-zoom is deliberate, so it is not gated this way.
+   *
+   * `chart.zoom.resetControl` supplies a reset of its own once a chart IS
+   * zoomed, and deliberately does NOT open this gate. It arrives after the
+   * fact, and what an incidental wheel zoom takes from the viewer first is the
+   * page scroll it swallowed, which no button hands back.
    *
    * @param {boolean|'auto'} setting
    */
@@ -3484,6 +3574,58 @@ class ZoomPanSelection extends Toolbar {
     const { zoom } = this.w.config.chart;
     return this._incidentalZoomEnabled(zoom && zoom.allowMouseWheelZoom);
   }
+  /**
+   * Put keyboard focus on the chart, where the chart is focusable at all.
+   *
+   * A drag is swallowed by the zoom handlers before the browser can move focus,
+   * so a viewer who has just zoomed by hand leaves nothing focused, and every
+   * key the chart offers is out of reach: Escape to reset (see
+   * {@link ZoomPanSelection#escapeResetEvent}) and the +, - and 0 the keyboard
+   * module already binds. Focusing what they just acted on puts those in reach.
+   *
+   * Pointer-driven focus, which keyboard navigation expects and does not read
+   * as a request to start navigating, and which the stylesheet draws no ring
+   * around (`svg:focus:not(:focus-visible)`).
+   *
+   * Only where the accessibility module has made the SVG focusable, which is
+   * the default: a page that turned keyboard support off is not handed a tab
+   * stop it never asked for, and still has the reset control as its way back.
+   */
+  _focusForKeyboard() {
+    var _a, _b;
+    const node = this.w.dom.Paper && this.w.dom.Paper.node;
+    if (!node || typeof node.focus !== "function") return;
+    if (node.getAttribute("tabindex") === null) return;
+    (_b = (_a = this.ctx.keyboardNavigation) == null ? void 0 : _a.notePointerFocus) == null ? void 0 : _b.call(_a);
+    try {
+      node.focus({ preventScroll: true });
+    } catch (e) {
+      node.focus();
+    }
+  }
+  /**
+   * Escape, on a zoomed chart, puts the range back.
+   *
+   * The quiet half of the same answer the on-demand reset control gives, and
+   * gated on it, so a page that says it supplies its own way back gets neither.
+   *
+   * It defers to keyboard navigation, whose Escape dismisses the tooltip and
+   * which offers `0` for this, so the key means one thing at a time. It does
+   * not stop the event either, so a page listening for Escape still hears it.
+   *
+   * Reachable because a completed drag-zoom puts focus on the chart; see
+   * {@link ZoomPanSelection#_focusForKeyboard}.
+   *
+   * @param {any} e
+   */
+  escapeResetEvent(e) {
+    if (e.key !== "Escape" && e.key !== "Esc") return;
+    if (!this.w.interact.zoomed) return;
+    const nav = this.ctx.keyboardNavigation;
+    if (nav && nav.active) return;
+    if (!this.resetControlAllowed()) return;
+    this.handleZoomReset();
+  }
   /** Lazily-created, re-render-surviving wheel-gesture state. */
   _wheel() {
     const it = this.w.interact;
@@ -3966,11 +4108,16 @@ class ZoomPanSelection extends Toolbar {
         if (!w.config.chart.group) {
           options.yaxis = yaxis;
         }
-        me.ctx.updateHelpers._updateOptions(
+        const applied = me.ctx.updateHelpers._updateOptions(
           options,
           false,
           me.w.config.chart.animations.dynamicAnimation.enabled
         );
+        if (applied && typeof applied.then === "function") {
+          applied.then(() => me._focusForKeyboard());
+        } else {
+          me._focusForKeyboard();
+        }
         if (typeof w.config.chart.events.zoomed === "function") {
           toolbar.zoomCallback(xaxis, yaxis);
         }
@@ -5726,6 +5873,19 @@ class KeyboardNavigation {
   _onPointerDown() {
     this._lastPointerDownAt = Date.now();
   }
+  /**
+   * Note that a pointer gesture is about to move focus into the chart.
+   *
+   * The 100 ms window above catches the browser's own click-to-focus, which
+   * lands immediately. A drag-zoom moves focus deliberately, and only once its
+   * re-render is done (ZoomPanSelection#_focusForKeyboard), which is far
+   * outside that window. Without this it reads as a viewer asking to navigate
+   * by keyboard, which activates nav and flashes a tooltip at the first visible
+   * point after every zoom.
+   */
+  notePointerFocus() {
+    this._lastPointerDownAt = Date.now();
+  }
   /**
    * Called from Events.js keydown handler. Navigation keys are already handled
    * by the direct SVG listener (which can call preventDefault). This entry
@@ -9318,7 +9478,7 @@ function getRegistry() {
 function getPlugin(name) {
   return getRegistry()[name] || null;
 }
-const WEAVE_API_VERSION = 3;
+const WEAVE_API_VERSION = 5;
 const PLUGIN_CHART_METHODS = [
   "updateOptions",
   "updateSeries",
@@ -9549,6 +9709,19 @@ function buildPluginAPI(host, record) {
           enabledOnSeries: Array.isArray(
             w.config.dataLabels && w.config.dataLabels.enabledOnSeries
           ) ? w.config.dataLabels.enabledOnSeries.slice() : null
+        }),
+        // The caller's own dashing, reported for the same reason and against
+        // the same trap (v5). `stroke.dashArray` is indexed by series position
+        // with no per-series escape hatch, so a plugin that wants ITS OWN
+        // computed series dashed has to write the whole array, and writing one
+        // without knowing what was there discards the caller's dashed lines
+        // with nothing to restore them from.
+        //
+        // A scalar applies to every series and an array is per series. There is
+        // no "unset" to report: the option defaults to 0, and 0 already means
+        // no dashing, so restoring it restores exactly what was there.
+        stroke: Object.freeze({
+          dashArray: Array.isArray(w.config.stroke && w.config.stroke.dashArray) ? w.config.stroke.dashArray.slice() : w.config.stroke && w.config.stroke.dashArray || 0
         })
       });
     },
@@ -9616,6 +9789,36 @@ function buildPluginAPI(host, record) {
       host._reserve(record.def.name, box);
       return api;
     },
+    /**
+     * Subscribe to the data point a viewer is pointing at.
+     *
+     * The chart already knows this: it resolves the series and point under the
+     * pointer for its own tooltip and fires `dataPointMouseEnter`,
+     * `dataPointMouseLeave` and `dataPointSelection` for the caller. This
+     * forwards the same three, so a plugin gets the host's answer rather than
+     * hit-testing the SVG itself and disagreeing with the tooltip.
+     *
+     * The payload is normalised rather than the chart's own argument list,
+     * which passes `w`. A plugin must not receive `w`, and the three things a
+     * plugin actually wants (which series, which point, what the point is
+     * called) are exactly what the chart has already resolved.
+     *
+     * `category` is the resolved display label, the same string `api.categories`
+     * carries, because a plugin coordinating two charts keys on the label
+     * rather than on an index that means something different on each chart.
+     *
+     * Nothing here gives a plugin the ability to intercept or cancel: the
+     * chart's own tooltip, selection state and caller events are unaffected,
+     * and a handler that throws is contained rather than allowed to break the
+     * interaction it was watching.
+     *
+     * @param {(e: {type: 'enter'|'leave'|'select', seriesIndex: number, dataPointIndex: number, category: string|undefined, seriesName: string|undefined, selected: boolean|undefined}) => void} fn
+     * @returns {() => void} unsubscribe
+     * @since Weave v4
+     */
+    pointer(fn) {
+      return host._onPointer(record.def.name, fn);
+    },
     // ── custom events out to the host app ──
     /**
      * Fires as `plugin:<pluginName>:<name>` on the chart's event bus. The
@@ -9653,6 +9856,8 @@ const _WeaveHost = class _WeaveHost {
     this._derived = null;
     this._reserved = null;
     this._reserveTimer = null;
+    this._pointerSubs = null;
+    this._pointerWired = null;
     this._onUpdated = this._onUpdated.bind(this);
     this._init();
   }
@@ -9895,6 +10100,132 @@ const _WeaveHost = class _WeaveHost {
     }
     this._repairInitialSeries();
   }
+  /**
+   * Subscribe a plugin to the data point the viewer is pointing at.
+   *
+   * Wired lazily: a chart whose plugins never ask pays nothing, and the chart
+   * fires these three events whether or not anyone is listening, so there is no
+   * cost to the chart either way.
+   *
+   * The chart's own handler signature is `(e, ctx, {seriesIndex,
+   * dataPointIndex, w})`. `w` stops here: what reaches a plugin is the
+   * normalised payload documented on `api.pointer`.
+   *
+   * @param {string} pluginName
+   * @param {Function} fn
+   * @returns {() => void} unsubscribe
+   */
+  _onPointer(pluginName, fn) {
+    if (typeof fn !== "function") return () => {
+    };
+    if (!this._pointerSubs) this._pointerSubs = /* @__PURE__ */ new Map();
+    const list = this._pointerSubs.get(pluginName) || [];
+    list.push(fn);
+    this._pointerSubs.set(pluginName, list);
+    this._wirePointer();
+    return () => {
+      const current = this._pointerSubs && this._pointerSubs.get(pluginName);
+      if (!current) return;
+      const i = current.indexOf(fn);
+      if (i > -1) current.splice(i, 1);
+    };
+  }
+  /** Attach to the chart's own data point events, once. */
+  _wirePointer() {
+    if (this._pointerWired) return;
+    if (!this.ctx || typeof this.ctx.addEventListener !== "function") return;
+    const map = [
+      ["enter", "dataPointMouseEnter"],
+      ["leave", "dataPointMouseLeave"],
+      ["select", "dataPointSelection"]
+    ];
+    this._pointerWired = [];
+    for (const [type, name] of map) {
+      const handler = (_e, _ctx, opts) => {
+        this._emitPointer(type, opts);
+      };
+      this.ctx.addEventListener(name, handler);
+      this._pointerWired.push([name, handler]);
+    }
+  }
+  /**
+   * Hand one pointer event to every subscribed plugin.
+   *
+   * A handler that throws is contained per plugin, on the same terms as every
+   * other plugin callback here: this runs inside the viewer's own hover, and a
+   * plugin breaking the chart's interaction would be the worst failure mode
+   * this facade has.
+   *
+   * @param {'enter'|'leave'|'select'} type
+   * @param {any} opts
+   */
+  _emitPointer(type, opts) {
+    if (!this._pointerSubs || !this._pointerSubs.size) return;
+    const seriesIndex = opts && typeof opts.seriesIndex === "number" ? opts.seriesIndex : -1;
+    const dataPointIndex = opts && typeof opts.dataPointIndex === "number" ? opts.dataPointIndex : -1;
+    const labels = this._categories() || [];
+    const w = this.w;
+    const config = w && w.config && w.config.series || [];
+    const payload = {
+      type,
+      seriesIndex,
+      dataPointIndex,
+      category: dataPointIndex > -1 ? labels[dataPointIndex] : void 0,
+      // A pie/donut carries bare numbers in `series`, so there is no name to
+      // read: undefined rather than a guess, on the same terms as `category`.
+      seriesName: _WeaveHost._seriesName(config, seriesIndex),
+      // Only meaningful on a select: the chart hands back its whole selection
+      // set, and what a plugin wants to know is whether THIS point is now in
+      // it, so a second click reads as a deselect rather than another select.
+      selected: type === "select" ? _WeaveHost._isSelected(opts, seriesIndex, dataPointIndex) : void 0
+    };
+    for (const [name, handlers] of this._pointerSubs) {
+      for (const fn of handlers.slice()) {
+        try {
+          fn(payload);
+        } catch (e) {
+          console.warn(
+            '[apexcharts] plugin "' + name + '" threw in a pointer handler',
+            e
+          );
+        }
+      }
+    }
+  }
+  /**
+   * The configured name of series `i`, where there is one.
+   *
+   * @param {any[]} config
+   * @param {number} i
+   * @returns {string|undefined}
+   */
+  static _seriesName(config, i) {
+    if (i < 0) return void 0;
+    const entry = config[i];
+    if (!entry || typeof entry !== "object") return void 0;
+    return typeof entry.name === "string" ? entry.name : void 0;
+  }
+  /**
+   * Whether the chart now counts this point as selected.
+   *
+   * `selectedDataPoints` is an array per series of the indexes selected in it.
+   * Absent on a chart type that does not carry point selection, in which case
+   * the answer is undefined rather than false: "not selected" and "selection
+   * does not apply here" are different, and a plugin keying on it should be
+   * able to tell.
+   *
+   * @param {any} opts
+   * @param {number} seriesIndex
+   * @param {number} dataPointIndex
+   * @returns {boolean|undefined}
+   */
+  static _isSelected(opts, seriesIndex, dataPointIndex) {
+    const all = opts && opts.selectedDataPoints;
+    if (!Array.isArray(all) || seriesIndex < 0) return void 0;
+    const mine = all[seriesIndex];
+    if (!Array.isArray(mine)) return false;
+    return mine.indexOf(dataPointIndex) > -1;
+  }
   /**
    * Record a plugin's container reservation and re-render if it changed.
    *
@@ -10119,6 +10450,13 @@ const _WeaveHost = class _WeaveHost {
       this.active = [];
       this._derived = null;
       this._reserved = null;
+      this._pointerSubs = null;
+      if (this._pointerWired) {
+        for (const [name, handler] of this._pointerWired) {
+          this.ctx.removeEventListener && this.ctx.removeEventListener(name, handler);
+        }
+        this._pointerWired = null;
+      }
       if (this._reserveTimer != null) {
         clearTimeout(this._reserveTimer);
         this._reserveTimer = null;

package/dist/features/annotations.common.js

@@ -1,5 +1,5 @@
 /*!
- * ApexCharts v7.2.0
+ * ApexCharts v7.4.0
  * (c) 2018-2026 ApexCharts
  */
 "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});function t(t){if(t&&t.__esModule)return t;const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t)for(const o in t)if("default"!==o){const a=Object.getOwnPropertyDescriptor(t,o);Object.defineProperty(e,o,a.get?a:{enumerable:!0,get:()=>t[o]})}return e.default=t,Object.freeze(e)}const e=t(require("apexcharts/core")),o=e.__apex_Graphics,a=e.__apex_Utils,i=e.__apex_CoreUtils,n=e.__apex_Animations_applyProgressiveReveal;class s{constructor(t){this.w=t.w,this.annoCtx=t}setOrientations(t,e=null){var o,a;const i=this.w;if("vertical"===t.label.orientation){const n=null!==e?e:0,s=i.dom.baseEl.querySelector(`.apexcharts-xaxis-annotations .apexcharts-xaxis-annotation-label[rel='${n}']`);if(null!==s){const e=s.getBBox();s.setAttribute("x",String(parseFloat(null!=(o=s.getAttribute("x"))?o:"0")-e.height+4));const i="top"===t.label.position?e.width:-e.width;s.setAttribute("y",String(parseFloat(null!=(a=s.getAttribute("y"))?a:"0")+i));const{x:n,y:l}=this.annoCtx.graphics.rotateAroundCenter(s);s.setAttribute("transform",`rotate(-90 ${n} ${l})`)}}}addBackgroundToAnno(t,e){const o=this.w;if(!t||!e.label.text||!String(e.label.text).trim())return null;const a=o.dom.baseEl.querySelector(".apexcharts-grid");if(!a)return null;const i=a.getBoundingClientRect(),n=a.getBBox(),s=i.width/n.width||1,l=t.getBoundingClientRect();let{left:r,right:d,top:h,bottom:c}=e.label.style.padding;"vertical"===e.label.orientation&&([h,c,r,d]=[r,d,h,c]);const x=i.left-n.x*s,p=i.top-n.y*s,g=(l.left-x)/s-r,f=(l.top-p)/s-h,b=this.annoCtx.graphics.drawRect(g,f,l.width/s+r+d,l.height/s+h+c,e.label.borderRadius,e.label.style.background,1,e.label.borderWidth,e.label.borderColor,0);return e.id&&b.node.classList.add(e.id),b}annotationsBackground(){const t=this.w,e=(e,o,a)=>{const i=t.dom.baseEl.querySelector(`.apexcharts-${a}-annotations .apexcharts-${a}-annotation-label[rel='${o}']`);if(i){const o=i.parentNode,a=this.addBackgroundToAnno(i,e);if(a){null==o||o.insertBefore(a.node,i);const s=i.getAttribute("x");null!==s&&n(a,parseFloat(s),t),e.label.mouseEnter&&a.node.addEventListener("mouseenter",e.label.mouseEnter.bind(this,e)),e.label.mouseLeave&&a.node.addEventListener("mouseleave",e.label.mouseLeave.bind(this,e)),e.label.click&&a.node.addEventListener("click",e.label.click.bind(this,e))}}};t.config.annotations.xaxis.forEach((t,o)=>e(t,o,"xaxis")),t.config.annotations.yaxis.forEach((t,o)=>e(t,o,"yaxis")),t.config.annotations.points.forEach((t,o)=>e(t,o,"point"))}usesCategoryX(){const t=this.w;return("category"===t.config.xaxis.type||t.config.xaxis.convertedCatToNumeric)&&!this.annoCtx.invertAxis&&!t.axisFlags.dataFormatXNumeric&&!t.config.chart.sparkline.enabled}hasXDomain(){const t=this.w;return this.annoCtx.invertAxis?a.isNumber(t.globals.minY)&&a.isNumber(t.globals.yRange[0]):this.usesCategoryX()?t.labelData.labels.length>0||t.labelData.categoryLabels.length>0:a.isNumber(t.globals.minX)&&a.isNumber(t.globals.xRange)}getY1Y2(t,e){var o,a,n;const s=this.w,l="y1"===t?e.y:e.y2,r="string"==typeof l&&l.includes("px");let d,h=!1;if(this.annoCtx.invertAxis){const t=s.config.xaxis.convertedCatToNumeric?s.labelData.categoryLabels:s.labelData.labels,a=t.indexOf(l);if(!r&&-1===a)return{yP:0,clipped:!0};const i=s.dom.baseEl.querySelector(`.apexcharts-yaxis-texts-g text:nth-child(${a+1})`);d=i?parseFloat(null!=(o=i.getAttribute("y"))?o:"0"):(s.layout.gridHeight/t.length-1)*(a+1)-s.globals.barHeight,void 0!==e.seriesIndex&&s.globals.barHeight&&(d-=s.globals.barHeight/2*(s.seriesData.series.length-1)-s.globals.barHeight*e.seriesIndex)}else{if(!s.config.yaxis[e.yAxisIndex])return{yP:0,clipped:!0};const t=s.globals.seriesYAxisMap[e.yAxisIndex],o=null!=(a=null==t?void 0:t[0])?a:null;if(null===o&&s.seriesData.series.length)return{yP:0,clipped:!0};const r=null===o?s.globals.minY:s.globals.minYArr[o],c=null===o?s.globals.maxY-s.globals.minY:s.globals.yRange[o],x=s.config.yaxis[e.yAxisIndex].logarithmic&&null!==o?new i(this.w).getLogVal(s.config.yaxis[e.yAxisIndex].logBase,l,o)/s.globals.yLogRatio[o]:(l-r)/(c/s.layout.gridHeight);d=s.layout.gridHeight-Math.min(Math.max(x,0),s.layout.gridHeight),h=x>s.layout.gridHeight||x<0,!e.marker||void 0!==e.y&&null!==e.y||(d=0),(null==(n=s.config.yaxis[e.yAxisIndex])?void 0:n.reversed)&&(d=x)}return r&&(d=parseFloat(l)),{yP:d,clipped:h}}getX1X2(t,e){const o=this.w,a="x1"===t?e.x:e.x2,i=this.annoCtx.invertAxis?o.globals.minY:o.globals.minX,n=this.annoCtx.invertAxis?o.globals.maxY:o.globals.maxX,s=this.annoCtx.invertAxis?o.globals.yRange[0]:o.globals.xRange;let l=!1;const r="string"==typeof a&&a.includes("px"),d=null==a&&e.marker;if(!r&&!d&&!this.hasXDomain())return{x:0,clipped:!0};let h=this.annoCtx.inversedReversedAxis?(n-a)/(s/o.layout.gridWidth):(a-i)/(s/o.layout.gridWidth);return"category"!==o.config.xaxis.type&&!o.config.xaxis.convertedCatToNumeric||this.annoCtx.invertAxis||o.axisFlags.dataFormatXNumeric||o.config.chart.sparkline.enabled||(h=this.getStringX(a)),"string"==typeof a&&a.includes("px")&&(h=parseFloat(a)),null==a&&e.marker&&(h=o.layout.gridWidth),void 0!==e.seriesIndex&&o.globals.barWidth&&!this.annoCtx.invertAxis&&(h-=o.globals.barWidth/2*(o.seriesData.series.length-1)-o.globals.barWidth*e.seriesIndex),"number"!=typeof h&&(h=0,l=!0),parseFloat(h.toFixed(10))>parseFloat(o.layout.gridWidth.toFixed(10))?(h=o.layout.gridWidth,l=!0):h<0&&(h=0,l=!0),{x:h,clipped:l}}getStringX(t){var e;const o=this.w;let a=t;if(o.config.xaxis.convertedCatToNumeric&&o.labelData.categoryLabels.length){const e=String(t);t=o.labelData.categoryLabels.findIndex(t=>String(t)===e)+1}const i=o.labelData.labels.map(t=>Array.isArray(t)?t.join(" "):t).indexOf(t),n=o.dom.baseEl.querySelector(`.apexcharts-xaxis-texts-g text:nth-child(${i+1})`);return n&&(a=parseFloat(null!=(e=n.getAttribute("x"))?e:"0")),a}}class l{constructor(t){this.w=t.w,this.annoCtx=t,this.invertAxis=this.annoCtx.invertAxis,this.helpers=new s(this.annoCtx)}addXaxisAnnotation(t,e,o){const i=this.w,s=this.helpers.getX1X2("x1",t);let l=s.x;const r=s.clipped;let d,h=!0;const c=t.label.text,x=t.strokeDashArray;if(a.isNumber(l)){if(null===t.x2||void 0===t.x2){if(!r){const o=this.annoCtx.graphics.drawLine(l+t.offsetX,0+t.offsetY,l+t.offsetX,i.layout.gridHeight+t.offsetY,t.borderColor,x,t.borderWidth);e.appendChild(o.node),t.id&&o.node.classList.add(t.id),n(o,l+t.offsetX,i)}}else{const o=this.helpers.getX1X2("x2",t);if(d=o.x,h=o.clipped,d<l){const t=l;l=d,d=t}const a=this.annoCtx.graphics.drawRect(l+t.offsetX,0+t.offsetY,d-l,i.layout.gridHeight+t.offsetY,0,t.fillColor,t.opacity,1,t.borderColor,x);a.node.classList.add("apexcharts-annotation-rect"),a.attr("clip-path",`url(#gridRectMask${i.globals.cuid})`),e.appendChild(a.node),t.id&&a.node.classList.add(t.id),n(a,l+t.offsetX,i)}if(!r||!h){const a=this.annoCtx.graphics.getTextRects(c,t.label.style.fontSize),s="top"===t.label.position?4:"center"===t.label.position?i.layout.gridHeight/2+("vertical"===t.label.orientation?a.width/2:0):i.layout.gridHeight,r=this.annoCtx.graphics.drawText({x:l+t.label.offsetX,y:s+t.label.offsetY-("vertical"===t.label.orientation?"top"===t.label.position?a.width/2-12:-a.width/2:0),text:c,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-xaxis-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});r.attr({rel:o}),e.appendChild(r.node),n(r,l+t.label.offsetX,i),this.annoCtx.helpers.setOrientations(t,o)}}}drawXAxisAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-xaxis-annotations"});return t.config.annotations.xaxis.map((t,o)=>{this.addXaxisAnnotation(t,e.node,o)}),e}}const r=e.__apex_axes_AxesUtils;class d{constructor(t){this.w=t.w,this.annoCtx=t,this.helpers=new s(this.annoCtx),this.axesUtils=new r(this.annoCtx.w,{theme:this.annoCtx.theme,timeScale:this.annoCtx.timeScale})}addYaxisAnnotation(t,e,o){const a=this.w,i=t.strokeDashArray;let n=this.helpers.getY1Y2("y1",t),s=n.yP;const l=n.clipped;let r,d=!0,h=!1;const c=t.label.text;if(null===t.y2||void 0===t.y2){if(!l){h=!0;const o=this.annoCtx.graphics.drawLine(0+t.offsetX,s+t.offsetY,this._getYAxisAnnotationWidth(t),s+t.offsetY,t.borderColor,i,t.borderWidth);e.appendChild(o.node),t.id&&o.node.classList.add(t.id)}}else{if(n=this.helpers.getY1Y2("y2",t),r=n.yP,d=n.clipped,r>s){const t=s;s=r,r=t}if(!l||!d){h=!0;const o=this.annoCtx.graphics.drawRect(0+t.offsetX,r+t.offsetY,this._getYAxisAnnotationWidth(t),s-r,0,t.fillColor,t.opacity,1,t.borderColor,i);o.node.classList.add("apexcharts-annotation-rect"),o.attr("clip-path",`url(#gridRectMask${a.globals.cuid})`),e.appendChild(o.node),t.id&&o.node.classList.add(t.id)}}if(h){const i="right"===t.label.position?a.layout.gridWidth:"center"===t.label.position?a.layout.gridWidth/2:0,n=this.annoCtx.graphics.drawText({x:i+t.label.offsetX,y:(null!=r?r:s)+t.label.offsetY-3,text:c,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-yaxis-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});n.attr({rel:o}),e.appendChild(n.node)}}_getYAxisAnnotationWidth(t){const e=this.w;let o=e.layout.gridWidth;return o=t.width.indexOf("%")>-1?e.layout.gridWidth*parseInt(t.width,10)/100:parseInt(t.width,10),o+t.offsetX}drawYAxisAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-yaxis-annotations"});return t.config.annotations.yaxis.forEach((t,o)=>{t.yAxisIndex=this.axesUtils.translateYAxisIndex(t.yAxisIndex),this.axesUtils.isYAxisHidden(t.yAxisIndex)&&this.axesUtils.yAxisAllSeriesCollapsed(t.yAxisIndex)||this.addYaxisAnnotation(t,e.node,o)}),e}}const h=e.__apex_BrowserAPIs_BrowserAPIs;class c{constructor(t){this.w=t.w,this.annoCtx=t,this.helpers=new s(this.annoCtx)}addPointAnnotation(t,e,o){const i=this.w;if(i.globals.collapsedSeriesIndices.indexOf(t.seriesIndex)>-1)return;const s=this.helpers.getX1X2("x1",t),l=s.x,r=s.clipped,d=this.helpers.getY1Y2("y1",t),h=d.yP,c=d.clipped;if(a.isNumber(l)&&!c&&!r){const a={pSize:t.marker.size,pointStrokeWidth:t.marker.strokeWidth,pointFillColor:t.marker.fillColor,pointStrokeColor:t.marker.strokeColor,shape:t.marker.shape,pRadius:t.marker.radius,class:`apexcharts-point-annotation-marker ${t.marker.cssClass} ${t.id?t.id:""}`};let s=this.annoCtx.graphics.drawMarker(l+t.marker.offsetX,h+t.marker.offsetY,a);e.appendChild(s.node);const r=[s.node];n(s,l,i);const d=t.label.text?t.label.text:"",c=this.getConstrainedLabelX(d,l+t.label.offsetX,t.label),x=this.annoCtx.graphics.drawText({x:c,y:h+t.label.offsetY-t.marker.size-parseFloat(t.label.style.fontSize)/1.6,text:d,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-point-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});if(x.attr({rel:o}),e.appendChild(x.node),n(x,l,i),t.customSVG.SVG){const o=this.annoCtx.graphics.group({class:"apexcharts-point-annotations-custom-svg "+t.customSVG.cssClass});o.attr({transform:`translate(${l+t.customSVG.offsetX}, ${h+t.customSVG.offsetY})`}),o.node.innerHTML=t.customSVG.SVG,e.appendChild(o.node),r.push(o.node)}if(t.image.path){const e=t.image.width?t.image.width:20,o=t.image.height?t.image.height:20;s=this.annoCtx.addImage({x:l+t.image.offsetX-e/2,y:h+t.image.offsetY-o/2,width:e,height:o,path:t.image.path,appendTo:".apexcharts-point-annotations"}),r.push(s.node)}t.tooltip&&t.tooltip.enabled&&r.forEach(e=>{e.addEventListener("mouseenter",()=>{this.showPointTooltip(t,e)}),e.addEventListener("mouseleave",()=>{this.hidePointTooltip()})}),t.mouseEnter&&s.node.addEventListener("mouseenter",t.mouseEnter.bind(this,t)),t.mouseLeave&&s.node.addEventListener("mouseleave",t.mouseLeave.bind(this,t)),t.click&&s.node.addEventListener("click",t.click.bind(this,t))}}getConstrainedLabelX(t,e,o){const a=this.w;if(!t)return e;const{width:i}=this.annoCtx.graphics.getTextRects(t,o.style.fontSize,o.style.fontFamily,void 0,!0,o.style.fontWeight);let n,s;switch(o.textAnchor){case"start":n=e,s=e+i;break;case"end":n=e-i,s=e;break;default:n=e-i/2,s=e+i/2}const l=o.style.padding||{};return n-=l.left||0,s+=l.right||0,n<0?e-n:s>a.layout.gridWidth?e-(s-a.layout.gridWidth):e}getPointTooltipEl(){const t=this.w;let e=t.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");return e||(e=h.createElementNS("http://www.w3.org/1999/xhtml","div"),e.classList.add("apexcharts-tooltip","apexcharts-annotation-tooltip"),t.dom.elWrap.appendChild(e)),e}getPointTooltipContent(t){const e=this.w,o=t.tooltip||{};if("function"==typeof o.formatter)return o.formatter({annotation:t,seriesIndex:t.seriesIndex,id:t.id,w:e});let a=null!=o.text?o.text:t.label&&t.label.text;return Array.isArray(a)&&(a=a.join("<br/>")),null==a?"":String(a)}showPointTooltip(t,e){const o=this.w,a=this.getPointTooltipContent(t);if(!a)return;const i=this.getPointTooltipEl();i.innerHTML=a;const n=t.tooltip.theme||o.config.tooltip.theme||"light";i.classList.remove("apexcharts-theme-light","apexcharts-theme-dark"),i.classList.add(`apexcharts-theme-${n}`),i.classList.add("apexcharts-active");const s=o.dom.elWrap.getBoundingClientRect(),l=e.getBoundingClientRect(),r=i.getBoundingClientRect(),d=t.tooltip.offsetX||0,h=t.tooltip.offsetY||0;let c=l.left-s.left+l.width/2-r.width/2,x=l.top-s.top-r.height-10;c=Math.max(0,Math.min(c,s.width-r.width)),x<0&&(x=l.top-s.top+l.height+10),i.style.left=c+d+"px",i.style.top=x+h+"px"}hidePointTooltip(){const t=this.w.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");t&&t.classList.remove("apexcharts-active")}drawPointAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-point-annotations"});return t.config.annotations.points.map((t,o)=>{this.addPointAnnotation(t,e.node,o)}),e}}const x=e.__apex_Options;e.default.registerFeatures({annotations:class{constructor(t,{theme:e=null,timeScale:a=null}={}){this.w=t,this.theme=e,this.timeScale=a,this.invertAxis=void 0,this.inversedReversedAxis=void 0,this.graphics=new o(this.w),this.w.globals.isBarHorizontal&&(this.invertAxis=!0),this.helpers=new s(this),this.xAxisAnnotations=new l(this),this.yAxisAnnotations=new d(this),this.pointsAnnotations=new c(this),this.w.globals.isBarHorizontal&&this.w.config.yaxis[0].reversed&&(this.inversedReversedAxis=!0),this.xDivision=this.w.layout.gridWidth/this.w.globals.dataPoints}drawAxesAnnotations(){const t=this.w;if(t.globals.axisCharts){const e=this.yAxisAnnotations.drawYAxisAnnotations(),o=this.xAxisAnnotations.drawXAxisAnnotations(),a=this.pointsAnnotations.drawPointAnnotations(),i=t.config.chart.animations.enabled,n=[e,o,a],s=[o.node,e.node,a.node],l="line"===t.config.chart.type||"area"===t.config.chart.type||"rangeArea"===t.config.chart.type,r=[l,!1,l];for(let e=0;e<3;e++)t.dom.elGraphical.add(n[e]),!i||t.globals.resized||t.globals.dataChanged||"scatter"!==t.config.chart.type&&"bubble"!==t.config.chart.type&&t.globals.dataPoints>1&&!r[e]&&s[e].classList.add("apexcharts-element-hidden"),t.globals.delayedElements.push({el:s[e],index:0});this.helpers.annotationsBackground()}}drawImageAnnos(){this.w.config.annotations.images.map(t=>{this.addImage(t)})}drawTextAnnos(){this.w.config.annotations.texts.map(t=>{this.addText(t)})}addXaxisAnnotation(t,e,o){this.xAxisAnnotations.addXaxisAnnotation(t,e,o)}addYaxisAnnotation(t,e,o){this.yAxisAnnotations.addYaxisAnnotation(t,e,o)}addPointAnnotation(t,e,o){this.pointsAnnotations.addPointAnnotation(t,e,o)}addText(t){const{x:e,y:o,text:a,textAnchor:i,foreColor:n,fontSize:s,fontFamily:l,fontWeight:r,cssClass:d,backgroundColor:h,borderWidth:c,strokeDashArray:x,borderRadius:p,borderColor:g,appendTo:f=".apexcharts-svg",paddingLeft:b=4,paddingRight:u=4,paddingBottom:y=2,paddingTop:m=2}=t,A=this.w,w=this.graphics.drawText({x:e,y:o,text:a,textAnchor:i||"start",fontSize:s||"12px",fontWeight:r||"regular",fontFamily:l||A.config.chart.fontFamily,foreColor:n||A.config.chart.foreColor,cssClass:d}),C=A.dom.baseEl.querySelector(f);C&&C.appendChild(w.node);const v=w.bbox();if(a){const t=this.graphics.drawRect(v.x-b,v.y-m,v.width+b+u,v.height+y+m,p,h||"transparent",1,c,g,x);C.insertBefore(t.node,w.node)}}addImage(t){const e=this.w,{path:o,x:a=0,y:i=0,width:n=20,height:s=20,appendTo:l=".apexcharts-svg"}=t,r=e.dom.Paper.image(o);r.size(n,s).move(a,i);const d=e.dom.baseEl.querySelector(l);return d&&d.appendChild(r.node),r}addXaxisAnnotationExternal(t,e,o){return this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"xaxis",contextMethod:o.addXaxisAnnotation}),o}addYaxisAnnotationExternal(t,e,o){return this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"yaxis",contextMethod:o.addYaxisAnnotation}),o}addPointAnnotationExternal(t,e,o){return void 0===this.invertAxis&&(this.invertAxis=o.w.globals.isBarHorizontal),this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"point",contextMethod:o.addPointAnnotation}),o}addAnnotationExternal({params:t,pushToMemory:e,context:o,type:i,contextMethod:n}){const s=o,l=s.w,r=l.dom.baseEl.querySelector(`.apexcharts-${i}-annotations`),d=r.childNodes.length+1,h=new x,c=Object.assign({},"xaxis"===i?h.xAxisAnnotation:"yaxis"===i?h.yAxisAnnotation:h.pointAnnotation),p=a.extend(c,t);switch(i){case"xaxis":this.addXaxisAnnotation(p,r,d);break;case"yaxis":this.addYaxisAnnotation(p,r,d);break;case"point":this.addPointAnnotation(p,r,d)}const g=l.dom.baseEl.querySelector(`.apexcharts-${i}-annotations .apexcharts-${i}-annotation-label[rel='${d}']`),f=this.helpers.addBackgroundToAnno(g,p);return f&&r.insertBefore(f.node,g),e&&l.globals.memory.methodsToExec.push({context:s,id:p.id?p.id:a.randomId(),method:n,label:"addAnnotation",params:t}),o}_removeAnnotationTooltip(t){const e=t.dom.elWrap&&t.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");e&&e.parentNode&&e.parentNode.removeChild(e)}clearAnnotations(t){const e=t.w;this._removeAnnotationTooltip(e);const o=e.dom.baseEl.querySelectorAll(".apexcharts-yaxis-annotations, .apexcharts-xaxis-annotations, .apexcharts-point-annotations");for(let t=e.globals.memory.methodsToExec.length-1;t>=0;t--)"addText"!==e.globals.memory.methodsToExec[t].label&&"addAnnotation"!==e.globals.memory.methodsToExec[t].label||e.globals.memory.methodsToExec.splice(t,1);Array.prototype.forEach.call(o,t=>{for(;t.firstChild;)t.removeChild(t.firstChild)})}removeAnnotation(t,e){const o=t.w;this._removeAnnotationTooltip(o);const a=o.dom.baseEl.querySelectorAll(`.${e}`);a&&(o.globals.memory.methodsToExec.map((t,a)=>{t.id===e&&o.globals.memory.methodsToExec.splice(a,1)}),Object.keys(o.config.annotations).forEach(t=>{const a=o.config.annotations[t];Array.isArray(a)&&(o.config.annotations[t]=a.filter(t=>t.id!==e))}),Array.prototype.forEach.call(a,t=>{t.parentElement.removeChild(t)}))}}}),Object.defineProperty(exports,"default",{enumerable:!0,get:()=>e.default});

package/dist/features/annotations.esm.js

@@ -1,5 +1,5 @@
 /*!
- * ApexCharts v7.2.0
+ * ApexCharts v7.4.0
  * (c) 2018-2026 ApexCharts
  */
 import * as _core from "apexcharts/core";

package/dist/features/annotations.js

@@ -1,5 +1,5 @@
 /*!
- * ApexCharts v7.2.0
+ * ApexCharts v7.4.0
  * (c) 2018-2026 ApexCharts
  */
 !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ApexAnnotations={})}(this,function(t){"use strict";const e=globalThis.ApexCharts,o=globalThis.ApexCharts.__internals.__apex_Graphics,a=globalThis.ApexCharts.__internals.__apex_Utils,i=globalThis.ApexCharts.__internals.__apex_CoreUtils,n=globalThis.ApexCharts.__internals;n.__apex_Animations,n.__apex_Animations_computeStagger,n.__apex_Animations_applyAnimationPolicy,n.__apex_Animations_prefersReducedMotion;const s=n.__apex_Animations_applyProgressiveReveal;class l{constructor(t){this.w=t.w,this.annoCtx=t}setOrientations(t,e=null){var o,a;const i=this.w;if("vertical"===t.label.orientation){const n=null!==e?e:0,s=i.dom.baseEl.querySelector(`.apexcharts-xaxis-annotations .apexcharts-xaxis-annotation-label[rel='${n}']`);if(null!==s){const e=s.getBBox();s.setAttribute("x",String(parseFloat(null!=(o=s.getAttribute("x"))?o:"0")-e.height+4));const i="top"===t.label.position?e.width:-e.width;s.setAttribute("y",String(parseFloat(null!=(a=s.getAttribute("y"))?a:"0")+i));const{x:n,y:l}=this.annoCtx.graphics.rotateAroundCenter(s);s.setAttribute("transform",`rotate(-90 ${n} ${l})`)}}}addBackgroundToAnno(t,e){const o=this.w;if(!t||!e.label.text||!String(e.label.text).trim())return null;const a=o.dom.baseEl.querySelector(".apexcharts-grid");if(!a)return null;const i=a.getBoundingClientRect(),n=a.getBBox(),s=i.width/n.width||1,l=t.getBoundingClientRect();let{left:r,right:d,top:h,bottom:c}=e.label.style.padding;"vertical"===e.label.orientation&&([h,c,r,d]=[r,d,h,c]);const x=i.left-n.x*s,p=i.top-n.y*s,g=(l.left-x)/s-r,f=(l.top-p)/s-h,b=this.annoCtx.graphics.drawRect(g,f,l.width/s+r+d,l.height/s+h+c,e.label.borderRadius,e.label.style.background,1,e.label.borderWidth,e.label.borderColor,0);return e.id&&b.node.classList.add(e.id),b}annotationsBackground(){const t=this.w,e=(e,o,a)=>{const i=t.dom.baseEl.querySelector(`.apexcharts-${a}-annotations .apexcharts-${a}-annotation-label[rel='${o}']`);if(i){const o=i.parentNode,a=this.addBackgroundToAnno(i,e);if(a){null==o||o.insertBefore(a.node,i);const n=i.getAttribute("x");null!==n&&s(a,parseFloat(n),t),e.label.mouseEnter&&a.node.addEventListener("mouseenter",e.label.mouseEnter.bind(this,e)),e.label.mouseLeave&&a.node.addEventListener("mouseleave",e.label.mouseLeave.bind(this,e)),e.label.click&&a.node.addEventListener("click",e.label.click.bind(this,e))}}};t.config.annotations.xaxis.forEach((t,o)=>e(t,o,"xaxis")),t.config.annotations.yaxis.forEach((t,o)=>e(t,o,"yaxis")),t.config.annotations.points.forEach((t,o)=>e(t,o,"point"))}usesCategoryX(){const t=this.w;return("category"===t.config.xaxis.type||t.config.xaxis.convertedCatToNumeric)&&!this.annoCtx.invertAxis&&!t.axisFlags.dataFormatXNumeric&&!t.config.chart.sparkline.enabled}hasXDomain(){const t=this.w;return this.annoCtx.invertAxis?a.isNumber(t.globals.minY)&&a.isNumber(t.globals.yRange[0]):this.usesCategoryX()?t.labelData.labels.length>0||t.labelData.categoryLabels.length>0:a.isNumber(t.globals.minX)&&a.isNumber(t.globals.xRange)}getY1Y2(t,e){var o,a,n;const s=this.w,l="y1"===t?e.y:e.y2,r="string"==typeof l&&l.includes("px");let d,h=!1;if(this.annoCtx.invertAxis){const t=s.config.xaxis.convertedCatToNumeric?s.labelData.categoryLabels:s.labelData.labels,a=t.indexOf(l);if(!r&&-1===a)return{yP:0,clipped:!0};const i=s.dom.baseEl.querySelector(`.apexcharts-yaxis-texts-g text:nth-child(${a+1})`);d=i?parseFloat(null!=(o=i.getAttribute("y"))?o:"0"):(s.layout.gridHeight/t.length-1)*(a+1)-s.globals.barHeight,void 0!==e.seriesIndex&&s.globals.barHeight&&(d-=s.globals.barHeight/2*(s.seriesData.series.length-1)-s.globals.barHeight*e.seriesIndex)}else{if(!s.config.yaxis[e.yAxisIndex])return{yP:0,clipped:!0};const t=s.globals.seriesYAxisMap[e.yAxisIndex],o=null!=(a=null==t?void 0:t[0])?a:null;if(null===o&&s.seriesData.series.length)return{yP:0,clipped:!0};const r=null===o?s.globals.minY:s.globals.minYArr[o],c=null===o?s.globals.maxY-s.globals.minY:s.globals.yRange[o],x=s.config.yaxis[e.yAxisIndex].logarithmic&&null!==o?new i(this.w).getLogVal(s.config.yaxis[e.yAxisIndex].logBase,l,o)/s.globals.yLogRatio[o]:(l-r)/(c/s.layout.gridHeight);d=s.layout.gridHeight-Math.min(Math.max(x,0),s.layout.gridHeight),h=x>s.layout.gridHeight||x<0,!e.marker||void 0!==e.y&&null!==e.y||(d=0),(null==(n=s.config.yaxis[e.yAxisIndex])?void 0:n.reversed)&&(d=x)}return r&&(d=parseFloat(l)),{yP:d,clipped:h}}getX1X2(t,e){const o=this.w,a="x1"===t?e.x:e.x2,i=this.annoCtx.invertAxis?o.globals.minY:o.globals.minX,n=this.annoCtx.invertAxis?o.globals.maxY:o.globals.maxX,s=this.annoCtx.invertAxis?o.globals.yRange[0]:o.globals.xRange;let l=!1;const r="string"==typeof a&&a.includes("px"),d=null==a&&e.marker;if(!r&&!d&&!this.hasXDomain())return{x:0,clipped:!0};let h=this.annoCtx.inversedReversedAxis?(n-a)/(s/o.layout.gridWidth):(a-i)/(s/o.layout.gridWidth);return"category"!==o.config.xaxis.type&&!o.config.xaxis.convertedCatToNumeric||this.annoCtx.invertAxis||o.axisFlags.dataFormatXNumeric||o.config.chart.sparkline.enabled||(h=this.getStringX(a)),"string"==typeof a&&a.includes("px")&&(h=parseFloat(a)),null==a&&e.marker&&(h=o.layout.gridWidth),void 0!==e.seriesIndex&&o.globals.barWidth&&!this.annoCtx.invertAxis&&(h-=o.globals.barWidth/2*(o.seriesData.series.length-1)-o.globals.barWidth*e.seriesIndex),"number"!=typeof h&&(h=0,l=!0),parseFloat(h.toFixed(10))>parseFloat(o.layout.gridWidth.toFixed(10))?(h=o.layout.gridWidth,l=!0):h<0&&(h=0,l=!0),{x:h,clipped:l}}getStringX(t){var e;const o=this.w;let a=t;if(o.config.xaxis.convertedCatToNumeric&&o.labelData.categoryLabels.length){const e=String(t);t=o.labelData.categoryLabels.findIndex(t=>String(t)===e)+1}const i=o.labelData.labels.map(t=>Array.isArray(t)?t.join(" "):t).indexOf(t),n=o.dom.baseEl.querySelector(`.apexcharts-xaxis-texts-g text:nth-child(${i+1})`);return n&&(a=parseFloat(null!=(e=n.getAttribute("x"))?e:"0")),a}}class r{constructor(t){this.w=t.w,this.annoCtx=t,this.invertAxis=this.annoCtx.invertAxis,this.helpers=new l(this.annoCtx)}addXaxisAnnotation(t,e,o){const i=this.w,n=this.helpers.getX1X2("x1",t);let l=n.x;const r=n.clipped;let d,h=!0;const c=t.label.text,x=t.strokeDashArray;if(a.isNumber(l)){if(null===t.x2||void 0===t.x2){if(!r){const o=this.annoCtx.graphics.drawLine(l+t.offsetX,0+t.offsetY,l+t.offsetX,i.layout.gridHeight+t.offsetY,t.borderColor,x,t.borderWidth);e.appendChild(o.node),t.id&&o.node.classList.add(t.id),s(o,l+t.offsetX,i)}}else{const o=this.helpers.getX1X2("x2",t);if(d=o.x,h=o.clipped,d<l){const t=l;l=d,d=t}const a=this.annoCtx.graphics.drawRect(l+t.offsetX,0+t.offsetY,d-l,i.layout.gridHeight+t.offsetY,0,t.fillColor,t.opacity,1,t.borderColor,x);a.node.classList.add("apexcharts-annotation-rect"),a.attr("clip-path",`url(#gridRectMask${i.globals.cuid})`),e.appendChild(a.node),t.id&&a.node.classList.add(t.id),s(a,l+t.offsetX,i)}if(!r||!h){const a=this.annoCtx.graphics.getTextRects(c,t.label.style.fontSize),n="top"===t.label.position?4:"center"===t.label.position?i.layout.gridHeight/2+("vertical"===t.label.orientation?a.width/2:0):i.layout.gridHeight,r=this.annoCtx.graphics.drawText({x:l+t.label.offsetX,y:n+t.label.offsetY-("vertical"===t.label.orientation?"top"===t.label.position?a.width/2-12:-a.width/2:0),text:c,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-xaxis-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});r.attr({rel:o}),e.appendChild(r.node),s(r,l+t.label.offsetX,i),this.annoCtx.helpers.setOrientations(t,o)}}}drawXAxisAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-xaxis-annotations"});return t.config.annotations.xaxis.map((t,o)=>{this.addXaxisAnnotation(t,e.node,o)}),e}}const d=globalThis.ApexCharts.__internals.__apex_axes_AxesUtils;class h{constructor(t){this.w=t.w,this.annoCtx=t,this.helpers=new l(this.annoCtx),this.axesUtils=new d(this.annoCtx.w,{theme:this.annoCtx.theme,timeScale:this.annoCtx.timeScale})}addYaxisAnnotation(t,e,o){const a=this.w,i=t.strokeDashArray;let n=this.helpers.getY1Y2("y1",t),s=n.yP;const l=n.clipped;let r,d=!0,h=!1;const c=t.label.text;if(null===t.y2||void 0===t.y2){if(!l){h=!0;const o=this.annoCtx.graphics.drawLine(0+t.offsetX,s+t.offsetY,this._getYAxisAnnotationWidth(t),s+t.offsetY,t.borderColor,i,t.borderWidth);e.appendChild(o.node),t.id&&o.node.classList.add(t.id)}}else{if(n=this.helpers.getY1Y2("y2",t),r=n.yP,d=n.clipped,r>s){const t=s;s=r,r=t}if(!l||!d){h=!0;const o=this.annoCtx.graphics.drawRect(0+t.offsetX,r+t.offsetY,this._getYAxisAnnotationWidth(t),s-r,0,t.fillColor,t.opacity,1,t.borderColor,i);o.node.classList.add("apexcharts-annotation-rect"),o.attr("clip-path",`url(#gridRectMask${a.globals.cuid})`),e.appendChild(o.node),t.id&&o.node.classList.add(t.id)}}if(h){const i="right"===t.label.position?a.layout.gridWidth:"center"===t.label.position?a.layout.gridWidth/2:0,n=this.annoCtx.graphics.drawText({x:i+t.label.offsetX,y:(null!=r?r:s)+t.label.offsetY-3,text:c,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-yaxis-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});n.attr({rel:o}),e.appendChild(n.node)}}_getYAxisAnnotationWidth(t){const e=this.w;let o=e.layout.gridWidth;return o=t.width.indexOf("%")>-1?e.layout.gridWidth*parseInt(t.width,10)/100:parseInt(t.width,10),o+t.offsetX}drawYAxisAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-yaxis-annotations"});return t.config.annotations.yaxis.forEach((t,o)=>{t.yAxisIndex=this.axesUtils.translateYAxisIndex(t.yAxisIndex),this.axesUtils.isYAxisHidden(t.yAxisIndex)&&this.axesUtils.yAxisAllSeriesCollapsed(t.yAxisIndex)||this.addYaxisAnnotation(t,e.node,o)}),e}}const c=globalThis.ApexCharts.__internals.__apex_BrowserAPIs_BrowserAPIs;class x{constructor(t){this.w=t.w,this.annoCtx=t,this.helpers=new l(this.annoCtx)}addPointAnnotation(t,e,o){const i=this.w;if(i.globals.collapsedSeriesIndices.indexOf(t.seriesIndex)>-1)return;const n=this.helpers.getX1X2("x1",t),l=n.x,r=n.clipped,d=this.helpers.getY1Y2("y1",t),h=d.yP,c=d.clipped;if(a.isNumber(l)&&!c&&!r){const a={pSize:t.marker.size,pointStrokeWidth:t.marker.strokeWidth,pointFillColor:t.marker.fillColor,pointStrokeColor:t.marker.strokeColor,shape:t.marker.shape,pRadius:t.marker.radius,class:`apexcharts-point-annotation-marker ${t.marker.cssClass} ${t.id?t.id:""}`};let n=this.annoCtx.graphics.drawMarker(l+t.marker.offsetX,h+t.marker.offsetY,a);e.appendChild(n.node);const r=[n.node];s(n,l,i);const d=t.label.text?t.label.text:"",c=this.getConstrainedLabelX(d,l+t.label.offsetX,t.label),x=this.annoCtx.graphics.drawText({x:c,y:h+t.label.offsetY-t.marker.size-parseFloat(t.label.style.fontSize)/1.6,text:d,textAnchor:t.label.textAnchor,fontSize:t.label.style.fontSize,fontFamily:t.label.style.fontFamily,fontWeight:t.label.style.fontWeight,foreColor:t.label.style.color,cssClass:`apexcharts-point-annotation-label ${t.label.style.cssClass} ${t.id?t.id:""}`});if(x.attr({rel:o}),e.appendChild(x.node),s(x,l,i),t.customSVG.SVG){const o=this.annoCtx.graphics.group({class:"apexcharts-point-annotations-custom-svg "+t.customSVG.cssClass});o.attr({transform:`translate(${l+t.customSVG.offsetX}, ${h+t.customSVG.offsetY})`}),o.node.innerHTML=t.customSVG.SVG,e.appendChild(o.node),r.push(o.node)}if(t.image.path){const e=t.image.width?t.image.width:20,o=t.image.height?t.image.height:20;n=this.annoCtx.addImage({x:l+t.image.offsetX-e/2,y:h+t.image.offsetY-o/2,width:e,height:o,path:t.image.path,appendTo:".apexcharts-point-annotations"}),r.push(n.node)}t.tooltip&&t.tooltip.enabled&&r.forEach(e=>{e.addEventListener("mouseenter",()=>{this.showPointTooltip(t,e)}),e.addEventListener("mouseleave",()=>{this.hidePointTooltip()})}),t.mouseEnter&&n.node.addEventListener("mouseenter",t.mouseEnter.bind(this,t)),t.mouseLeave&&n.node.addEventListener("mouseleave",t.mouseLeave.bind(this,t)),t.click&&n.node.addEventListener("click",t.click.bind(this,t))}}getConstrainedLabelX(t,e,o){const a=this.w;if(!t)return e;const{width:i}=this.annoCtx.graphics.getTextRects(t,o.style.fontSize,o.style.fontFamily,void 0,!0,o.style.fontWeight);let n,s;switch(o.textAnchor){case"start":n=e,s=e+i;break;case"end":n=e-i,s=e;break;default:n=e-i/2,s=e+i/2}const l=o.style.padding||{};return n-=l.left||0,s+=l.right||0,n<0?e-n:s>a.layout.gridWidth?e-(s-a.layout.gridWidth):e}getPointTooltipEl(){const t=this.w;let e=t.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");return e||(e=c.createElementNS("http://www.w3.org/1999/xhtml","div"),e.classList.add("apexcharts-tooltip","apexcharts-annotation-tooltip"),t.dom.elWrap.appendChild(e)),e}getPointTooltipContent(t){const e=this.w,o=t.tooltip||{};if("function"==typeof o.formatter)return o.formatter({annotation:t,seriesIndex:t.seriesIndex,id:t.id,w:e});let a=null!=o.text?o.text:t.label&&t.label.text;return Array.isArray(a)&&(a=a.join("<br/>")),null==a?"":String(a)}showPointTooltip(t,e){const o=this.w,a=this.getPointTooltipContent(t);if(!a)return;const i=this.getPointTooltipEl();i.innerHTML=a;const n=t.tooltip.theme||o.config.tooltip.theme||"light";i.classList.remove("apexcharts-theme-light","apexcharts-theme-dark"),i.classList.add(`apexcharts-theme-${n}`),i.classList.add("apexcharts-active");const s=o.dom.elWrap.getBoundingClientRect(),l=e.getBoundingClientRect(),r=i.getBoundingClientRect(),d=t.tooltip.offsetX||0,h=t.tooltip.offsetY||0;let c=l.left-s.left+l.width/2-r.width/2,x=l.top-s.top-r.height-10;c=Math.max(0,Math.min(c,s.width-r.width)),x<0&&(x=l.top-s.top+l.height+10),i.style.left=c+d+"px",i.style.top=x+h+"px"}hidePointTooltip(){const t=this.w.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");t&&t.classList.remove("apexcharts-active")}drawPointAnnotations(){const t=this.w,e=this.annoCtx.graphics.group({class:"apexcharts-point-annotations"});return t.config.annotations.points.map((t,o)=>{this.addPointAnnotation(t,e.node,o)}),e}}const p=globalThis.ApexCharts.__internals.__apex_Options;e.registerFeatures({annotations:class{constructor(t,{theme:e=null,timeScale:a=null}={}){this.w=t,this.theme=e,this.timeScale=a,this.invertAxis=void 0,this.inversedReversedAxis=void 0,this.graphics=new o(this.w),this.w.globals.isBarHorizontal&&(this.invertAxis=!0),this.helpers=new l(this),this.xAxisAnnotations=new r(this),this.yAxisAnnotations=new h(this),this.pointsAnnotations=new x(this),this.w.globals.isBarHorizontal&&this.w.config.yaxis[0].reversed&&(this.inversedReversedAxis=!0),this.xDivision=this.w.layout.gridWidth/this.w.globals.dataPoints}drawAxesAnnotations(){const t=this.w;if(t.globals.axisCharts){const e=this.yAxisAnnotations.drawYAxisAnnotations(),o=this.xAxisAnnotations.drawXAxisAnnotations(),a=this.pointsAnnotations.drawPointAnnotations(),i=t.config.chart.animations.enabled,n=[e,o,a],s=[o.node,e.node,a.node],l="line"===t.config.chart.type||"area"===t.config.chart.type||"rangeArea"===t.config.chart.type,r=[l,!1,l];for(let e=0;e<3;e++)t.dom.elGraphical.add(n[e]),!i||t.globals.resized||t.globals.dataChanged||"scatter"!==t.config.chart.type&&"bubble"!==t.config.chart.type&&t.globals.dataPoints>1&&!r[e]&&s[e].classList.add("apexcharts-element-hidden"),t.globals.delayedElements.push({el:s[e],index:0});this.helpers.annotationsBackground()}}drawImageAnnos(){this.w.config.annotations.images.map(t=>{this.addImage(t)})}drawTextAnnos(){this.w.config.annotations.texts.map(t=>{this.addText(t)})}addXaxisAnnotation(t,e,o){this.xAxisAnnotations.addXaxisAnnotation(t,e,o)}addYaxisAnnotation(t,e,o){this.yAxisAnnotations.addYaxisAnnotation(t,e,o)}addPointAnnotation(t,e,o){this.pointsAnnotations.addPointAnnotation(t,e,o)}addText(t){const{x:e,y:o,text:a,textAnchor:i,foreColor:n,fontSize:s,fontFamily:l,fontWeight:r,cssClass:d,backgroundColor:h,borderWidth:c,strokeDashArray:x,borderRadius:p,borderColor:g,appendTo:f=".apexcharts-svg",paddingLeft:b=4,paddingRight:u=4,paddingBottom:m=2,paddingTop:y=2}=t,A=this.w,C=this.graphics.drawText({x:e,y:o,text:a,textAnchor:i||"start",fontSize:s||"12px",fontWeight:r||"regular",fontFamily:l||A.config.chart.fontFamily,foreColor:n||A.config.chart.foreColor,cssClass:d}),w=A.dom.baseEl.querySelector(f);w&&w.appendChild(C.node);const v=C.bbox();if(a){const t=this.graphics.drawRect(v.x-b,v.y-y,v.width+b+u,v.height+m+y,p,h||"transparent",1,c,g,x);w.insertBefore(t.node,C.node)}}addImage(t){const e=this.w,{path:o,x:a=0,y:i=0,width:n=20,height:s=20,appendTo:l=".apexcharts-svg"}=t,r=e.dom.Paper.image(o);r.size(n,s).move(a,i);const d=e.dom.baseEl.querySelector(l);return d&&d.appendChild(r.node),r}addXaxisAnnotationExternal(t,e,o){return this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"xaxis",contextMethod:o.addXaxisAnnotation}),o}addYaxisAnnotationExternal(t,e,o){return this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"yaxis",contextMethod:o.addYaxisAnnotation}),o}addPointAnnotationExternal(t,e,o){return void 0===this.invertAxis&&(this.invertAxis=o.w.globals.isBarHorizontal),this.addAnnotationExternal({params:t,pushToMemory:e,context:o,type:"point",contextMethod:o.addPointAnnotation}),o}addAnnotationExternal({params:t,pushToMemory:e,context:o,type:i,contextMethod:n}){const s=o,l=s.w,r=l.dom.baseEl.querySelector(`.apexcharts-${i}-annotations`),d=r.childNodes.length+1,h=new p,c=Object.assign({},"xaxis"===i?h.xAxisAnnotation:"yaxis"===i?h.yAxisAnnotation:h.pointAnnotation),x=a.extend(c,t);switch(i){case"xaxis":this.addXaxisAnnotation(x,r,d);break;case"yaxis":this.addYaxisAnnotation(x,r,d);break;case"point":this.addPointAnnotation(x,r,d)}const g=l.dom.baseEl.querySelector(`.apexcharts-${i}-annotations .apexcharts-${i}-annotation-label[rel='${d}']`),f=this.helpers.addBackgroundToAnno(g,x);return f&&r.insertBefore(f.node,g),e&&l.globals.memory.methodsToExec.push({context:s,id:x.id?x.id:a.randomId(),method:n,label:"addAnnotation",params:t}),o}_removeAnnotationTooltip(t){const e=t.dom.elWrap&&t.dom.elWrap.querySelector(".apexcharts-annotation-tooltip");e&&e.parentNode&&e.parentNode.removeChild(e)}clearAnnotations(t){const e=t.w;this._removeAnnotationTooltip(e);const o=e.dom.baseEl.querySelectorAll(".apexcharts-yaxis-annotations, .apexcharts-xaxis-annotations, .apexcharts-point-annotations");for(let t=e.globals.memory.methodsToExec.length-1;t>=0;t--)"addText"!==e.globals.memory.methodsToExec[t].label&&"addAnnotation"!==e.globals.memory.methodsToExec[t].label||e.globals.memory.methodsToExec.splice(t,1);Array.prototype.forEach.call(o,t=>{for(;t.firstChild;)t.removeChild(t.firstChild)})}removeAnnotation(t,e){const o=t.w;this._removeAnnotationTooltip(o);const a=o.dom.baseEl.querySelectorAll(`.${e}`);a&&(o.globals.memory.methodsToExec.map((t,a)=>{t.id===e&&o.globals.memory.methodsToExec.splice(a,1)}),Object.keys(o.config.annotations).forEach(t=>{const a=o.config.annotations[t];Array.isArray(a)&&(o.config.annotations[t]=a.filter(t=>t.id!==e))}),Array.prototype.forEach.call(a,t=>{t.parentElement.removeChild(t)}))}}}),t.default=e,Object.defineProperties(t,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});