@heartlandone/vega 1.35.1 → 1.36.1

package/dist/cjs/{app-globals-c8a5e8f9.js → app-globals-10b08b3a.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-const log = require('./log-2402f20e.js');
-const themeManager = require('./themeManager-1d14fe0d.js');
+const log = require('./log-0e500258.js');
+const themeManager = require('./themeManager-27f2b6aa.js');
 const vegaDialogController = require('./vegaDialogController-7b71945a.js');
 
 /**

package/dist/cjs/{component-b15f9853.js → component-6111461d.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const log = require('./log-2402f20e.js');
+const log = require('./log-0e500258.js');
 
 const exemptionClasses = [
   'vega-flex-grow',

package/dist/cjs/{designToken-21d31650.js → designToken-0231398e.js}

@@ -2,8 +2,8 @@
 
 const typeGuard = require('./typeGuard-bb401d05.js');
 const breakpoints = require('./breakpoints-23bb4f74.js');
-const log = require('./log-2402f20e.js');
-const responsiveFormatFacade = require('./responsiveFormatFacade-897d74ef.js');
+const log = require('./log-0e500258.js');
+const responsiveFormatFacade = require('./responsiveFormatFacade-1635c5dd.js');
 
 /**
  * It logs a warning message to the console.

package/dist/cjs/index.cjs.js

@@ -3,22 +3,22 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const breakpoints = require('./breakpoints-2c150832.js');
-const log = require('./log-2402f20e.js');
-const designToken = require('./designToken-21d31650.js');
+const log = require('./log-0e500258.js');
+const designToken = require('./designToken-0231398e.js');
 const string = require('./string-21427167.js');
 const typeGuard = require('./typeGuard-bb401d05.js');
 const breakpoints$1 = require('./breakpoints-23bb4f74.js');
 const icons = require('./icons-44ed411d.js');
 const typography = require('./typography-9f9d8d04.js');
 const ui = require('./ui-bbf1eed1.js');
-const themeManager = require('./themeManager-1d14fe0d.js');
+const themeManager = require('./themeManager-27f2b6aa.js');
 const vegaDialogController = require('./vegaDialogController-7b71945a.js');
-require('./responsiveFormatFacade-897d74ef.js');
+require('./responsiveFormatFacade-1635c5dd.js');
 require('./number-7e7d9981.js');
 require('./misc-aa481a6d.js');
-require('./ui-e19fec2a.js');
+require('./ui-7db8ff4a.js');
 require('./ui.type-655d8879.js');
-require('./zIndexManager-e2852632.js');
+require('./zIndexManager-d4174c1c.js');
 require('./tinycolor-14174cd4.js');
 
 /* This file is generated by vega-design 2.0.71 */

package/dist/cjs/{injectElementAppender-79e3cece.js → injectElementAppender-a90ff4ba.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-const log = require('./log-2402f20e.js');
+const log = require('./log-0e500258.js');
 const ui = require('./ui-bbf1eed1.js');
 const typeGuard = require('./typeGuard-bb401d05.js');
-const responsiveFormatFacade = require('./responsiveFormatFacade-897d74ef.js');
-const ui$1 = require('./ui-e19fec2a.js');
-const zIndexManager = require('./zIndexManager-e2852632.js');
+const responsiveFormatFacade = require('./responsiveFormatFacade-1635c5dd.js');
+const ui$1 = require('./ui-7db8ff4a.js');
+const zIndexManager = require('./zIndexManager-d4174c1c.js');
 
 /**
  * Get the position of the element in the container according to the target element and the placement

package/dist/cjs/{injectFormFieldController-8fa3cee6.js → injectFormFieldController-be1c3d42.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-const log = require('./log-2402f20e.js');
-const observer = require('./observer-d6c59015.js');
-const ui = require('./ui-e19fec2a.js');
+const log = require('./log-0e500258.js');
+const observer = require('./observer-b2f7a866.js');
+const ui = require('./ui-7db8ff4a.js');
 const string = require('./string-21427167.js');
 
 /**

package/dist/cjs/{injectKeyboardManager-3603cb45.js → injectKeyboardManager-e858f542.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const ui = require('./ui-e19fec2a.js');
+const ui = require('./ui-7db8ff4a.js');
 
 /**
  * It listens to the keyup event on the window and calls the appropriate method on the registered elements

package/dist/cjs/{legendInputProcessor-1472b831.js → legendInputProcessor-52b9a7cf.js}

@@ -3549,9 +3549,10 @@ class SVGRenderer extends BaseRenderer {
    * @param {string} color - Background color token type, which is a type of color
    * used in the chart's background.
    * @param {string} textStyle - The text style of the axis
+   * @returns {SVGGElement} svg g element
    */
   drawLegend(position, text, color, textStyle) {
-    d3Select(this.context)
+    return d3Select(this.context)
       .select('.vega-chart-legend-g')
       .append('g')
       .attr('class', 'vega-chart-legend-item')
@@ -3563,7 +3564,8 @@ class SVGRenderer extends BaseRenderer {
         y: -4,
       }, 4, color));
       g.append(() => this.getTextNode({ x: 8, y: 0 }, text, textStyle));
-    });
+    })
+      .node();
   }
   /**
    * This function draws a rectangle with a specified position, width, height, and optional color using D3.js.
@@ -3596,6 +3598,7 @@ class SVGRenderer extends BaseRenderer {
     d3Select(this.context)
       .select('.vega-chart-draw-g')
       .append('path')
+      .attr('class', 'vega-chart-line-path')
       .datum(positions)
       .attr('fill', 'none')
       .attr('stroke', color)
@@ -3616,16 +3619,23 @@ class SVGRenderer extends BaseRenderer {
    * @param {number} outerRadius - The outer radius parameter is a number that determines the outer
    * radius of the arc path being drawn.
    * @param {number} innerRadius - The inner radius of the arc path, specified as a number.
+   * @returns {SVGPathElement} svg arc path element.
    */
   drawArcPath(center, record, color, outerRadius, innerRadius) {
-    d3Select(this.context)
+    return d3Select(this.context)
       .select('.vega-chart-draw-g')
       .append('path')
       .datum(record)
+      .attr('class', 'vega-chart-arc-path')
+      .attr('data-name', (item) => item.data.name)
       .attr('transform', `translate(${center.x},${center.y})`)
       .attr('fill', color)
       .attr('stroke-width', 0)
-      .attr('d', d3Arc().innerRadius(innerRadius).outerRadius(outerRadius));
+      .attr('d', d3Arc().innerRadius(innerRadius).outerRadius(outerRadius))
+      .attr('data-d', d3Arc()
+      .innerRadius(innerRadius)
+      .outerRadius(outerRadius + 10))
+      .node();
   }
   /**
    * This function clears all elements within two specific classes in a D3 selection.
@@ -3769,10 +3779,12 @@ class CanvasRenderer extends BaseRenderer {
    * @param {string} color - color string
    * represents a color for the legend. It could be a string or a number that corresponds to a specific
    * color value.
+   * @returns {HTMLCanvasElement} chart canvas element
    */
   drawLegend(position, text, color) {
     this.drawCircle(position, 4, color);
     this.drawText(position, text);
+    return this.context;
   }
   /**
    * The function `drawText` takes a position and a string of text as parameters and does not return anything.
@@ -3838,6 +3850,7 @@ class CanvasRenderer extends BaseRenderer {
    * @param {number} outerRadius - The outer radius parameter is a number that determines the outer
    * radius of the arc path being drawn.
    * @param {number} innerRadius - The inner radius of the arc path, specified as a number.
+   * @returns {HTMLCanvasElement} chart canvas element.
    */
   drawArcPath(center, record, color, outerRadius, innerRadius) {
     const context2d = this.getContext2d();
@@ -3849,6 +3862,7 @@ class CanvasRenderer extends BaseRenderer {
     if (innerRadius) {
       this.drawCircle(center, innerRadius, '#F0F3F7');
     }
+    return this.context;
   }
   /**
    * The function "clear"
@@ -3928,8 +3942,8 @@ function parseNumberToPixelString(input) {
 }
 
 const DEFAULT_LAYOUT = {
-  width: null,
-  height: null,
+  width: undefined,
+  height: undefined,
   margin: {
     top: 30,
     right: 30,
@@ -3960,10 +3974,10 @@ class ChartDimensionController {
    */
   setContainerWidthAndHeight(layout) {
     const { width, height } = layout;
-    if (width !== null) {
+    if (width !== undefined) {
       this.container.style.width = parseNumberToPixelString(width);
     }
-    if (height !== null) {
+    if (height !== undefined) {
       this.container.style.height = parseNumberToPixelString(height);
     }
   }
@@ -3999,7 +4013,7 @@ class ChartDimensionController {
    */
   getContainerInnerWidth(layout) {
     const width = this.getContainerClientWidth(layout);
-    const { left, right } = (layout === null || layout === void 0 ? void 0 : layout.margin) || DEFAULT_LAYOUT.margin;
+    const { left, right } = ((layout === null || layout === void 0 ? void 0 : layout.margin) || DEFAULT_LAYOUT.margin);
     return width ? width - right - left : 0;
   }
   /**
@@ -4012,7 +4026,7 @@ class ChartDimensionController {
    */
   getContainerInnerHeight(layout) {
     const height = this.getContainerClientHeight(layout);
-    const { top, bottom } = (layout === null || layout === void 0 ? void 0 : layout.margin) || DEFAULT_LAYOUT.margin;
+    const { top, bottom } = ((layout === null || layout === void 0 ? void 0 : layout.margin) || DEFAULT_LAYOUT.margin);
     return height ? height - top - bottom : 0;
   }
   /**
@@ -4040,6 +4054,159 @@ class ChartDimensionController {
   }
 }
 
+/**
+ * This is a TypeScript code that defines an abstract class `BaseInteractor` with a generic type `T` that extends either `SVGElement` or `HTMLCanvasElement`.
+ */
+class BaseInteractor {
+  /**
+   * This is a constructor function that takes a parameter of type T and sets it as a protected property called "context".
+   *
+   * @param {SVGElement | HTMLCanvasElement} context - The "context" parameter is a protected property of a class constructor that is
+   * of type "T". It is used to store a reference to an object or data that is required by the class
+   * methods to perform their tasks. The "protected" keyword means that the property can only be
+   * accessed within the class
+   */
+  constructor(context) {
+    this.context = context;
+    this.interactingEntryForEventRegistry = new Map();
+    this.interactingEntryForDrawerRegistry = new WeakMap();
+  }
+  /**
+   * This function registers an interacting entry with a drawer, draw piece, and event type in an interactor registry.
+   *
+   * @param {BaseDrawer<unknown>} drawer - The drawer parameter is an instance of a class that extends the BaseDrawer class,
+   * which is used for drawing on a canvas or other graphical surface.
+   * @param {DrawPiece} drawPiece - DrawPiece is a type that represents a specific piece that can be
+   * drawn on a canvas or other graphical surface. It could include information such as the shape,
+   * color, size, and position of the piece.
+   * @param {InteractingEntry} interactingEntry - InteractingEntry is a data structure that represents
+   * an interaction between a user and a graphical element on the screen. It contains information such
+   * as the type of event that triggered the interaction (e.g. mouse click, touch)
+   */
+  register(drawer, drawPiece, interactingEntry) {
+    /* eslint-disable @typescript-eslint/no-non-null-assertion */
+    const eventType = interactingEntry.eventType;
+    if (!this.interactingEntryForEventRegistry.get(eventType)) {
+      this.interactingEntryForEventRegistry.set(eventType, []);
+    }
+    this.interactingEntryForEventRegistry.get(eventType).push(interactingEntry);
+    if (!this.interactingEntryForDrawerRegistry.get(drawer)) {
+      this.interactingEntryForDrawerRegistry.set(drawer, new WeakMap());
+    }
+    if (!this.interactingEntryForDrawerRegistry.get(drawer).get(drawPiece)) {
+      this.interactingEntryForDrawerRegistry.get(drawer).set(drawPiece, []);
+    }
+    this.interactingEntryForDrawerRegistry.get(drawer).get(drawPiece).push(interactingEntry);
+    /* eslint-enable @typescript-eslint/no-non-null-assertion */
+  }
+  /**
+   * This function unregisters a drawer from the interactor registry.
+   *
+   * @param {BaseDrawer<unknown>} drawer - The parameter `drawer` is of type `BaseDrawer<unknown>`. It is an object that
+   * represents a drawer and is used to unregister the drawer from the `interactorRegistry`. The
+   * `interactorRegistry` is a `WeakMap` that stores a mapping between an `Interactor` and
+   */
+  unregisterByDrawer(drawer) {
+    /* eslint-disable @typescript-eslint/no-non-null-assertion */
+    const drawPiece = drawer.drawPiece;
+    if (drawPiece &&
+      this.interactingEntryForDrawerRegistry.has(drawer) &&
+      this.interactingEntryForDrawerRegistry.get(drawer) &&
+      this.interactingEntryForDrawerRegistry.get(drawer).has(drawPiece) &&
+      this.interactingEntryForDrawerRegistry.get(drawer).get(drawPiece)) {
+      this.interactingEntryForEventRegistry.forEach((value, key) => {
+        this.interactingEntryForEventRegistry.set(key, value.filter((interactingEntry) => {
+          return (this.interactingEntryForDrawerRegistry
+            .get(drawer)
+            .get(drawPiece)
+            .indexOf(interactingEntry) < 0);
+        }));
+      });
+      /* eslint-enable @typescript-eslint/no-non-null-assertion */
+    }
+    this.interactingEntryForDrawerRegistry.delete(drawer);
+  }
+  /**
+   * This function handles mouse events for registered interactor and drawers.
+   *
+   * @param {EventType} eventType - The type of event being registered in the registry, such as "click" or "mousemove".
+   * @param {MouseEvent} event - The `event` parameter is of type `MouseEvent`, which represents a
+   * mouse-related event (such as a click, double-click, or mouse movement) that occurred on the web
+   * page. It contains information about the event, such as the type of event, the target element that
+   * triggered the event
+   */
+  callRegistry(eventType, event) {
+    const interactingEntryArray = this.interactingEntryForEventRegistry.get(eventType);
+    if (interactingEntryArray) {
+      interactingEntryArray.forEach((interactingEntry) => {
+        if (interactingEntry.shouldHandle(event)) {
+          interactingEntry.handle(event);
+        }
+      });
+    }
+  }
+}
+
+/**
+ * The CanvasInteractor class extends the BaseInteractor class and provides empty methods for handling mouse move, click, and hover events on a HTML canvas element.
+ */
+class CanvasInteractor extends BaseInteractor {
+}
+
+/**
+ *  The SVGInteractor class extends the BaseInteractor class and provides methods for handling mouse events on SVG elements.
+ */
+class SVGInteractor extends BaseInteractor {
+  /**
+   * This is a constructor function that adds event listeners for click and mouseover events to an SVG element.
+   *
+   * @param {SVGElement} context - The context parameter is an SVGElement, which is the element that the
+   * constructor is being called on. It is used to add event listeners to the element for mouseover and
+   * click events.
+   */
+  constructor(context) {
+    super(context);
+    this.addContextListener();
+  }
+  /**
+   * This function adds event listeners for click and mouseover events to the context element and calls
+   * a registry function with the corresponding event type and event object.
+   */
+  addContextListener() {
+    this.context.addEventListener('click', (event) => {
+      this.callRegistry('click', event);
+    });
+    this.context.addEventListener('mouseover', (event) => {
+      this.callRegistry('mouseover', event);
+    });
+  }
+}
+
+/** The InteractorFactory class provides a static method to create and return an appropriate interactor based on the type of context provided. */
+class InteractorFactory {
+  /**
+   * This function returns a BaseInteractor object based on the type of context passed in (SVGElement or HTMLCanvasElement).
+   *
+   * @param {SVGElement | HTMLCanvasElement} context - The `context` parameter is either an SVGElement
+   * or an HTMLCanvasElement. It is used to determine which type of interactor to create and return. If
+   * the context is an SVGElement, an instance of SVGInteractor is returned. If the context is an
+   * HTMLCanvasElement, an instance of
+   * @returns {BaseInteractor<SVGElement | HTMLCanvasElement>} A `BaseInteractor` object that is either an instance of `SVGInteractor` or
+   * `CanvasInteractor`, depending on the type of the `context` parameter passed to the `get` method.
+   */
+  static get(context) {
+    if (context instanceof SVGElement) {
+      return new SVGInteractor(context);
+    }
+    else if (context instanceof HTMLCanvasElement) {
+      return new CanvasInteractor(context);
+    }
+    else {
+      throw new Error('Invalid context');
+    }
+  }
+}
+
 /** This is a TypeScript class called `BaseChart` that serves as a base class for creating charts */
 class BaseChart {
   /**
@@ -4054,6 +4221,7 @@ class BaseChart {
     const context = GraphContextFactory.get(options.mode, options.container);
     this.dimensionController = new ChartDimensionController(options.container);
     this.renderer = RendererFactory.get(context);
+    this.interactor = InteractorFactory.get(context);
     this.initLayoutOptions(options);
   }
   /**
@@ -4080,10 +4248,11 @@ class BaseChart {
     this.updateOptions(this.options);
   }
   /**
-   * sets the layout if it hasn't been set yet, and executes all the drawers.
+   * sets the layout if it hasn't been set yet, and executes all the drawers. unregister the interactor by drawer
    */
   render() {
-    this.drawers = this.createDrawerChain(this.renderer);
+    this.unregisterByDrawer();
+    this.drawers = this.createDrawerChain(this.renderer, this.interactor);
     this.clear();
     if (!this.isLayoutSet) {
       this.setLayout();
@@ -4110,6 +4279,16 @@ class BaseChart {
     this.options = Object.assign(options, { layout: newLayout });
     this.dimensionController.setContainerWidthAndHeight(newLayout);
   }
+  /**
+   * This function un-registers drawers from the interactor.
+   */
+  unregisterByDrawer() {
+    if (this.drawers) {
+      this.drawers.forEach((drawer) => {
+        this.interactor.unregisterByDrawer(drawer);
+      });
+    }
+  }
 }
 
 /* This file is generated by vega-design 2.0.71 */
@@ -4255,17 +4434,21 @@ class BaseDrawer {
    * This is a constructor function that takes in a renderer and options for a chart drawer.
    *
    * @param {BaseRenderer<SVGElement | HTMLCanvasElement>} renderer - `renderer` parameter is an instance of a `BaseRenderer` class that can render either SVG elements or a 2D canvas context
+   * @param {BaseInteractor<SVGElement | HTMLCanvasElement>} interactor - `renderer` parameter is an instance of a `BaseInteractor` class
    * @param {ChartDrawerOptions<unknown>} options - where `T` is a generic type parameter. This parameter contains various options that can be used to customize the chart being drawn
    */
-  constructor(renderer, options) {
+  constructor(renderer, interactor, options) {
     this.renderer = renderer;
+    this.interactor = interactor;
     this.options = options;
   }
   /**
    * The function executes a draw method.
    */
   execute() {
-    this.draw();
+    const drawPiece = this.draw();
+    this.drawPiece = drawPiece;
+    this.addInteractionSupport(drawPiece);
   }
   /**
    * returns a color token based on an index and an optional array of colors.
@@ -4304,19 +4487,127 @@ class BaseDrawer {
   }
 }
 
+/** The code is defining an abstract class called `InteractingEntryGenerator` with a generic type `T`. This class is responsible for generating an `InteractingEntry` object based on the provided options. */
+class InteractingEntryGenerator {
+  /**
+   * The function generates an InteractingEntry object based on the provided options.
+   *
+   * @param {unknown} options - The `options` parameter is a generic type `T` that represents the options or configuration for the `generate` function. It can be any type that you define when calling the `generate` function.
+   * @returns {InteractingEntry} An object of type InteractingEntry is being returned.
+   */
+  generate(options) {
+    return {
+      eventType: this.eventType,
+      shouldHandle: this.createShouldHandle(options),
+      handle: this.createHandle(options),
+    };
+  }
+}
+
+/** The PieLegendHoverGenerator class generates an InteractingEntry object that handles mouseover events on a legend of a D3 pie chart and triggers a mouseover event on the corresponding path element. */
+class PieLegendHoverGenerator extends InteractingEntryGenerator {
+  constructor() {
+    super(...arguments);
+    this.eventType = 'mouseover';
+  }
+  /**
+   * The function "createShouldHandle" returns a function that takes an event as a parameter and returns a boolean value.
+   *
+   * @returns {InteractingEntry['shouldHandle']} A function that takes an event as an argument and returns a boolean value.
+   */
+  createShouldHandle() {
+    return this.shouldHandle;
+  }
+  /**
+   * The function "createHandle" returns the handle property of an InteractingEntry object.
+   *
+   * @param {LegendInputType} options the legend render options
+   * @returns {InteractingEntry['handle']} The `handle` property of the `InteractingEntry` object is being returned.
+   */
+  createHandle(options) {
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    return (event) => {
+      this.handle(event, options);
+    };
+  }
+  /**
+   * This function checks if a mouse event should be handled based on whether the target or its parent element has a specific class.
+   *
+   * @param {MouseEvent} event - MouseEvent is a type of event that is triggered by a mouse action, such
+   * as clicking, hovering, or scrolling. It contains information about the event, such as the target
+   * element and the position of the mouse.
+   * @returns {boolean} A boolean value is being returned. The method `shouldHandle` checks if the target element
+   * or its parent element has a class of `vega-chart-legend-item` and returns `true` if it does, and
+   * `false` otherwise.
+   */
+  shouldHandle(event) {
+    var _a;
+    const target = event.target;
+    const container = event.currentTarget.parentElement;
+    return (container.tagName === 'VEGA-PIE-CHART' &&
+      (target.classList.contains('vega-chart-legend-item') ||
+        !!((_a = target.parentElement) === null || _a === void 0 ? void 0 : _a.classList.contains('vega-chart-legend-item'))));
+  }
+  /**
+   * The function handles a mouse event on a legend and triggers a mouseover event on the corresponding path element in a D3 chart.
+   *
+   * @param {MouseEvent} event - The event parameter is a MouseEvent, which represents a user action
+   * (such as a click or hover) on a specific element in the DOM.
+   * @param {LegendInputType} options - LegendInputType is a custom type that likely contains
+   * information about the data being displayed in the chart, such as the names of the categories or
+   * series being plotted. It may also include information about the chart's appearance or behavior,
+   * such as the colors or labels used in the legend. Without more information about
+   */
+  handle(event, options) {
+    var _a;
+    const svgSelection = d3Select(event.currentTarget);
+    const target = event.target;
+    const targetTextNode = target.tagName === 'text'
+      ? target
+      : target.tagName === 'circle'
+        ? target.nextElementSibling
+        : target.querySelector('text');
+    const name = targetTextNode ? targetTextNode.textContent : '';
+    const index = name ? options.data.indexOf(name) : 0;
+    const paths = svgSelection
+      .selectAll(`path.vega-chart-arc-path`)
+      .nodes();
+    (_a = paths[index]) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new MouseEvent('mouseover', { bubbles: true }));
+  }
+}
+
 /** The LegendDrawer class draws circles and text for each legend in a chart. */
 class LegendDrawer extends BaseDrawer {
+  constructor() {
+    super(...arguments);
+    this.pieLegendHoverGenerator = new PieLegendHoverGenerator();
+  }
+  /**
+   * This function adds interaction support to a chart by registering it with an interactor and providing a hover generator.
+   *
+   * @param {(SVGGElement | HTMLCanvasElement)[]} drawPiece - `drawPiece` is a parameter of type array
+   * that contains either `SVGGElement` or `HTMLCanvasElement` elements. It is used as a callback
+   * function to draw the legend items on the chart.
+   */
+  addInteractionSupport(drawPiece) {
+    var _a;
+    if ((_a = this.options.renderOptions.data) === null || _a === void 0 ? void 0 : _a.length) {
+      this.interactor.register(this, drawPiece, this.pieLegendHoverGenerator.generate(this.options.renderOptions));
+    }
+  }
   /**
    * This function draws a legend on a chart using input options.
+   *
+   * @returns {(SVGGElement | HTMLCanvasElement)[]}  draw piece
    */
   draw() {
-    const { data, colors, position, width } = this.options.renderOptions;
+    const { data = [], colors, position, width } = this.options.renderOptions;
     const options = this.getChartLegendOptions(data, colors, position);
     if (options) {
       const longestLegendLength = array$2.getLongestTextLengthFromArray(data);
-      options.legends.forEach((legend, index) => {
+      return options.legends.map((legend, index) => {
         const position = this.getLegendPosition(options.position, index, longestLegendLength, width);
-        this.renderer.drawLegend(position, legend.field, legend.color, this.getStyleTextFromToken('v-font-footnote2-short'));
+        return this.renderer.drawLegend(position, legend.field, legend.color, this.getStyleTextFromToken('v-font-footnote2-short'));
       });
     }
   }
@@ -4382,7 +4673,8 @@ class LayoutInputProcessor {
    */
   process(input) {
     const { container, layout } = input;
-    const { top, right, bottom, left } = (layout === null || layout === void 0 ? void 0 : layout.margin) || DEFAULT_LAYOUT.margin;
+    const { top, right, bottom, left } = ((layout === null || layout === void 0 ? void 0 : layout.margin) ||
+      DEFAULT_LAYOUT.margin);
     const dimensionController = new ChartDimensionController(container);
     return {
       width: dimensionController.getContainerClientWidth(layout),
@@ -4445,7 +4737,7 @@ class LegendInputProcessor {
    * - `height`: the
    */
   process(input, previousOutput) {
-    const { colors, legends } = input;
+    const { colors, legends = [] } = input;
     const { width, height } = previousOutput;
     return {
       data: legends,
@@ -4459,6 +4751,7 @@ class LegendInputProcessor {
 
 exports.BaseChart = BaseChart;
 exports.BaseDrawer = BaseDrawer;
+exports.InteractingEntryGenerator = InteractingEntryGenerator;
 exports.LayoutInputProcessor = LayoutInputProcessor;
 exports.LegendDrawer = LegendDrawer;
 exports.LegendInputProcessor = LegendInputProcessor;
@@ -4467,7 +4760,7 @@ exports.array = array;
 exports.color = color;
 exports.constant = constant$1;
 exports.constant$1 = constant;
-exports.d3Arc = d3Arc;
+exports.d3Select = d3Select;
 exports.interpolateNumber = interpolateNumber;
 exports.interpolateRgb = interpolateRgb;
 exports.interpolateString = interpolateString;