@mui/x-charts 8.0.0-alpha.8 → 8.0.0-beta.0

package/LineChart/LineElement.d.ts

@@ -1,48 +1,48 @@
 import * as React from 'react';
 import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
-import { AnimatedLineProps } from './AnimatedLine';
-import { SeriesId } from '../models/seriesType/common';
+import { AnimatedLineProps } from "./AnimatedLine.js";
+import { SeriesId } from "../models/seriesType/common.js";
 export interface LineElementClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element when highlighted. */
-    highlighted: string;
-    /** Styles applied to the root element when faded. */
-    faded: string;
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element when highlighted. */
+  highlighted: string;
+  /** Styles applied to the root element when faded. */
+  faded: string;
 }
 export type LineElementClassKey = keyof LineElementClasses;
 export interface LineElementOwnerState {
-    id: SeriesId;
-    color: string;
-    gradientId?: string;
-    isFaded: boolean;
-    isHighlighted: boolean;
-    classes?: Partial<LineElementClasses>;
+  id: SeriesId;
+  color: string;
+  gradientId?: string;
+  isFaded: boolean;
+  isHighlighted: boolean;
+  classes?: Partial<LineElementClasses>;
 }
 export declare function getLineElementUtilityClass(slot: string): string;
 export declare const lineElementClasses: LineElementClasses;
 export interface LineElementSlots {
-    /**
-     * The component that renders the line.
-     * @default LineElementPath
-     */
-    line?: React.JSXElementConstructor<AnimatedLineProps>;
+  /**
+   * The component that renders the line.
+   * @default LineElementPath
+   */
+  line?: React.JSXElementConstructor<AnimatedLineProps>;
 }
 export interface LineElementSlotProps {
-    line?: SlotComponentPropsFromProps<AnimatedLineProps, {}, LineElementOwnerState>;
+  line?: SlotComponentPropsFromProps<AnimatedLineProps, {}, LineElementOwnerState>;
 }
 export interface LineElementProps extends Omit<LineElementOwnerState, 'isFaded' | 'isHighlighted'>, Pick<AnimatedLineProps, 'skipAnimation'>, Omit<React.SVGProps<SVGPathElement>, 'ref' | 'color' | 'id'> {
-    d: string;
-    /**
-     * The props used for each component slot.
-     * @default {}
-     */
-    slotProps?: LineElementSlotProps;
-    /**
-     * Overridable component slots.
-     * @default {}
-     */
-    slots?: LineElementSlots;
+  d: string;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: LineElementSlotProps;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: LineElementSlots;
 }
 /**
  * Demos:
@@ -56,6 +56,6 @@ export interface LineElementProps extends Omit<LineElementOwnerState, 'isFaded'
  */
 declare function LineElement(props: LineElementProps): React.JSX.Element;
 declare namespace LineElement {
-    var propTypes: any;
+  var propTypes: any;
 }
-export { LineElement };
+export { LineElement };

package/LineChart/LineElement.js

@@ -1,22 +1,31 @@
+"use strict";
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LineElement = LineElement;
+exports.getLineElementUtilityClass = getLineElementUtilityClass;
+exports.lineElementClasses = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+var _useInteractionItemProps = require("../hooks/useInteractionItemProps");
+var _AnimatedLine = require("./AnimatedLine");
+var _useItemHighlighted = require("../hooks/useItemHighlighted");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["id", "classes", "color", "gradientId", "slots", "slotProps", "onClick"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import composeClasses from '@mui/utils/composeClasses';
-import useSlotProps from '@mui/utils/useSlotProps';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import { useInteractionItemProps } from "../hooks/useInteractionItemProps.js";
-import { AnimatedLine } from "./AnimatedLine.js";
-import { useItemHighlighted } from "../context/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function getLineElementUtilityClass(slot) {
-  return generateUtilityClass('MuiLineElement', slot);
+function getLineElementUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiLineElement', slot);
 }
-export const lineElementClasses = generateUtilityClasses('MuiLineElement', ['root', 'highlighted', 'faded']);
+const lineElementClasses = exports.lineElementClasses = (0, _generateUtilityClasses.default)('MuiLineElement', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -27,7 +36,7 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['root', `series-${id}`, isHighlighted && 'highlighted', isFaded && 'faded']
   };
-  return composeClasses(slots, getLineElementUtilityClass, classes);
+  return (0, _composeClasses.default)(slots, getLineElementUtilityClass, classes);
 };
 /**
  * Demos:
@@ -49,12 +58,15 @@ function LineElement(props) {
       slotProps,
       onClick
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const getInteractionItemProps = useInteractionItemProps();
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const interactionProps = (0, _useInteractionItemProps.useInteractionItemProps)({
+    type: 'line',
+    seriesId: id
+  });
   const {
     isFaded,
     isHighlighted
-  } = useItemHighlighted({
+  } = (0, _useItemHighlighted.useItemHighlighted)({
     seriesId: id
   });
   const ownerState = {
@@ -66,46 +78,42 @@ function LineElement(props) {
     isHighlighted
   };
   const classes = useUtilityClasses(ownerState);
-  const Line = slots?.line ?? AnimatedLine;
-  const lineProps = useSlotProps({
+  const Line = slots?.line ?? _AnimatedLine.AnimatedLine;
+  const lineProps = (0, _useSlotProps.default)({
     elementType: Line,
     externalSlotProps: slotProps?.line,
-    additionalProps: _extends({}, getInteractionItemProps({
-      type: 'line',
-      seriesId: id
-    }), {
+    additionalProps: (0, _extends2.default)({}, interactionProps, {
       onClick,
       cursor: onClick ? 'pointer' : 'unset'
     }),
     className: classes.root,
     ownerState
   });
-  return /*#__PURE__*/_jsx(Line, _extends({}, other, lineProps));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, (0, _extends2.default)({}, other, lineProps));
 }
 process.env.NODE_ENV !== "production" ? LineElement.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
-  classes: PropTypes.object,
-  color: PropTypes.string.isRequired,
-  d: PropTypes.string.isRequired,
-  gradientId: PropTypes.string,
-  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
+  classes: _propTypes.default.object,
+  color: _propTypes.default.string.isRequired,
+  d: _propTypes.default.string.isRequired,
+  gradientId: _propTypes.default.string,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * If `true`, animations are skipped.
    * @default false
    */
-  skipAnimation: PropTypes.bool,
+  skipAnimation: _propTypes.default.bool,
   /**
    * The props used for each component slot.
    * @default {}
    */
-  slotProps: PropTypes.object,
+  slotProps: _propTypes.default.object,
   /**
    * Overridable component slots.
    * @default {}
    */
-  slots: PropTypes.object
-} : void 0;
-export { LineElement };
+  slots: _propTypes.default.object
+} : void 0;

package/LineChart/LineHighlightElement.d.ts

@@ -1,20 +1,24 @@
 import * as React from 'react';
-import { SeriesId } from '../models/seriesType/common';
+import { SeriesId } from "../models/seriesType/common.js";
 export interface LineHighlightElementClasses {
-    /** Styles applied to the root element. */
-    root: string;
+  /** Styles applied to the root element. */
+  root: string;
 }
 export type HighlightElementClassKey = keyof LineHighlightElementClasses;
-interface LineHighlightElementOwnerState {
-    id: SeriesId;
-    color: string;
-    x: number;
-    y: number;
-    classes?: Partial<LineHighlightElementClasses>;
+interface LineHighlightElementCommonProps {
+  id: SeriesId;
+  color: string;
+  x: number;
+  y: number;
+  classes?: Partial<LineHighlightElementClasses>;
 }
 export declare function getHighlightElementUtilityClass(slot: string): string;
 export declare const lineHighlightElementClasses: LineHighlightElementClasses;
-export type LineHighlightElementProps = LineHighlightElementOwnerState & Omit<React.SVGProps<SVGCircleElement>, 'ref' | 'id'>;
+export type LineHighlightElementProps = (LineHighlightElementCommonProps & ({
+  shape: 'circle';
+} & Omit<React.SVGProps<SVGCircleElement>, 'ref' | 'id'>)) | (LineHighlightElementCommonProps & {
+  shape: 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye';
+} & Omit<React.SVGProps<SVGPathElement>, 'ref' | 'id'>);
 /**
  * Demos:
  *
@@ -27,6 +31,6 @@ export type LineHighlightElementProps = LineHighlightElementOwnerState & Omit<Re
  */
 declare function LineHighlightElement(props: LineHighlightElementProps): React.JSX.Element;
 declare namespace LineHighlightElement {
-    var propTypes: any;
+  var propTypes: any;
 }
-export { LineHighlightElement };
+export { LineHighlightElement };

package/LineChart/LineHighlightElement.js

@@ -1,19 +1,30 @@
+"use strict";
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["x", "y", "id", "classes", "color"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import composeClasses from '@mui/utils/composeClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import { styled } from '@mui/material/styles';
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import { jsx as _jsx } from "react/jsx-runtime";
-export function getHighlightElementUtilityClass(slot) {
-  return generateUtilityClass('MuiHighlightElement', slot);
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LineHighlightElement = LineHighlightElement;
+exports.getHighlightElementUtilityClass = getHighlightElementUtilityClass;
+exports.lineHighlightElementClasses = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactMajor = _interopRequireDefault(require("@mui/x-internals/reactMajor"));
+var _d3Shape = require("@mui/x-charts-vendor/d3-shape");
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+var _getSymbol = require("../internals/getSymbol");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["x", "y", "id", "classes", "color", "shape"];
+function getHighlightElementUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiHighlightElement', slot);
 }
-export const lineHighlightElementClasses = generateUtilityClasses('MuiHighlightElement', ['root']);
+const lineHighlightElementClasses = exports.lineHighlightElementClasses = (0, _generateUtilityClasses.default)('MuiHighlightElement', ['root']);
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -22,19 +33,8 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['root', `series-${id}`]
   };
-  return composeClasses(slots, getHighlightElementUtilityClass, classes);
+  return (0, _composeClasses.default)(slots, getHighlightElementUtilityClass, classes);
 };
-const HighlightElement = styled('circle', {
-  name: 'MuiHighlightElement',
-  slot: 'Root',
-  overridesResolver: (_, styles) => styles.root
-})(({
-  ownerState
-}) => ({
-  transform: `translate(${ownerState.x}px, ${ownerState.y}px)`,
-  transformOrigin: `${ownerState.x}px ${ownerState.y}px`,
-  fill: ownerState.color
-}));
 /**
  * Demos:
  *
@@ -49,34 +49,39 @@ function LineHighlightElement(props) {
   const {
       x,
       y,
-      id,
-      classes: innerClasses,
-      color
+      color,
+      shape
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const ownerState = {
-    id,
-    classes: innerClasses,
-    color,
-    x,
-    y
-  };
-  const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(HighlightElement, _extends({
-    pointerEvents: "none",
-    ownerState: ownerState,
-    className: classes.root,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const classes = useUtilityClasses(props);
+  const Element = shape === 'circle' ? 'circle' : 'path';
+  const additionalProps = shape === 'circle' ? {
     cx: 0,
     cy: 0,
     r: other.r === undefined ? 5 : other.r
-  }, other));
+  } : {
+    d: (0, _d3Shape.symbol)(_d3Shape.symbolsFill[(0, _getSymbol.getSymbol)(shape)])()
+  };
+
+  // React 18 does not recognize `transformOrigin` and React 19 does not recognize `transform-origin`
+  const transformOrigin = _reactMajor.default > 18 ? {
+    transformOrigin: `${x} ${y}`
+  } : {
+    'transform-origin': `${x} ${y}`
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Element, (0, _extends2.default)({
+    pointerEvents: "none",
+    className: classes.root,
+    transform: `translate(${x} ${y})`,
+    fill: color
+  }, transformOrigin, additionalProps, other));
 }
 process.env.NODE_ENV !== "production" ? LineHighlightElement.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
-  classes: PropTypes.object,
-  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired
-} : void 0;
-export { LineHighlightElement };
+  classes: _propTypes.default.object,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
+  shape: _propTypes.default.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']).isRequired
+} : void 0;

package/LineChart/LineHighlightPlot.d.ts

@@ -1,23 +1,23 @@
 import * as React from 'react';
 import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
-import { LineHighlightElementProps } from './LineHighlightElement';
+import { LineHighlightElementProps } from "./LineHighlightElement.js";
 export interface LineHighlightPlotSlots {
-    lineHighlight?: React.JSXElementConstructor<LineHighlightElementProps>;
+  lineHighlight?: React.JSXElementConstructor<LineHighlightElementProps>;
 }
 export interface LineHighlightPlotSlotProps {
-    lineHighlight?: SlotComponentPropsFromProps<LineHighlightElementProps, {}, {}>;
+  lineHighlight?: SlotComponentPropsFromProps<LineHighlightElementProps, {}, {}>;
 }
 export interface LineHighlightPlotProps extends React.SVGAttributes<SVGSVGElement> {
-    /**
-     * Overridable component slots.
-     * @default {}
-     */
-    slots?: LineHighlightPlotSlots;
-    /**
-     * The props used for each component slot.
-     * @default {}
-     */
-    slotProps?: LineHighlightPlotSlotProps;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: LineHighlightPlotSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: LineHighlightPlotSlotProps;
 }
 /**
  * Demos:
@@ -31,6 +31,6 @@ export interface LineHighlightPlotProps extends React.SVGAttributes<SVGSVGElemen
  */
 declare function LineHighlightPlot(props: LineHighlightPlotProps): React.JSX.Element | null;
 declare namespace LineHighlightPlot {
-    var propTypes: any;
+  var propTypes: any;
 }
-export { LineHighlightPlot };
+export { LineHighlightPlot };

package/LineChart/LineHighlightPlot.js

@@ -1,21 +1,28 @@
+"use strict";
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LineHighlightPlot = LineHighlightPlot;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _useStore = require("../internals/store/useStore");
+var _useSelector = require("../internals/store/useSelector");
+var _LineHighlightElement = require("./LineHighlightElement");
+var _useScale = require("../hooks/useScale");
+var _constants = require("../constants");
+var _useLineSeries = require("../hooks/useLineSeries");
+var _getColor = _interopRequireDefault(require("./seriesConfig/getColor"));
+var _ChartProvider = require("../context/ChartProvider");
+var _useChartInteraction = require("../internals/plugins/featurePlugins/useChartInteraction");
+var _useAxis = require("../hooks/useAxis");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["slots", "slotProps"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { useStore } from "../internals/store/useStore.js";
-import { useSelector } from "../internals/store/useSelector.js";
-import { LineHighlightElement } from "./LineHighlightElement.js";
-import { getValueToPositionMapper } from "../hooks/useScale.js";
-import { DEFAULT_X_AXIS_KEY } from "../constants/index.js";
-import getColor from "./getColor.js";
-import { useLineSeries } from "../hooks/useSeries.js";
-import { useChartContext } from "../context/ChartProvider/index.js";
-import { selectorChartsInteractionXAxis } from "../internals/plugins/featurePlugins/useChartInteraction/index.js";
-import { useXAxes, useYAxes } from "../hooks/useAxis.js";
-import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Demos:
  *
@@ -31,21 +38,21 @@ function LineHighlightPlot(props) {
       slots,
       slotProps
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const seriesData = useLineSeries();
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const seriesData = (0, _useLineSeries.useLineSeriesContext)();
   const {
     xAxis,
     xAxisIds
-  } = useXAxes();
+  } = (0, _useAxis.useXAxes)();
   const {
     yAxis,
     yAxisIds
-  } = useYAxes();
+  } = (0, _useAxis.useYAxes)();
   const {
     instance
-  } = useChartContext();
-  const store = useStore();
-  const xAxisIdentifier = useSelector(store, selectorChartsInteractionXAxis);
+  } = (0, _ChartProvider.useChartContext)();
+  const store = (0, _useStore.useStore)();
+  const xAxisIdentifier = (0, _useSelector.useSelector)(store, _useChartInteraction.selectorChartsInteractionXAxis);
   const highlightedIndex = xAxisIdentifier?.index;
   if (highlightedIndex === undefined) {
     return null;
@@ -59,8 +66,8 @@ function LineHighlightPlot(props) {
   } = seriesData;
   const defaultXAxisId = xAxisIds[0];
   const defaultYAxisId = yAxisIds[0];
-  const Element = slots?.lineHighlight ?? LineHighlightElement;
-  return /*#__PURE__*/_jsx("g", _extends({}, other, {
+  const Element = slots?.lineHighlight ?? _LineHighlightElement.LineHighlightElement;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", (0, _extends2.default)({}, other, {
     children: stackingGroups.flatMap(({
       ids: groupIds
     }) => {
@@ -70,16 +77,17 @@ function LineHighlightPlot(props) {
           yAxisId = defaultYAxisId,
           stackedData,
           data,
-          disableHighlight
+          disableHighlight,
+          shape = 'circle'
         } = series[seriesId];
         if (disableHighlight || data[highlightedIndex] == null) {
           return null;
         }
-        const xScale = getValueToPositionMapper(xAxis[xAxisId].scale);
+        const xScale = (0, _useScale.getValueToPositionMapper)(xAxis[xAxisId].scale);
         const yScale = yAxis[yAxisId].scale;
         const xData = xAxis[xAxisId].data;
         if (xData === undefined) {
-          throw new Error(`MUI X: ${xAxisId === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisId}"`} should have data property to be able to display a line plot.`);
+          throw new Error(`MUI X: ${xAxisId === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisId}"`} should have data property to be able to display a line plot.`);
         }
         const x = xScale(xData[highlightedIndex]);
         const y = yScale(stackedData[highlightedIndex][1]); // This should not be undefined since y should not be a band scale
@@ -90,12 +98,13 @@ function LineHighlightPlot(props) {
         })) {
           return null;
         }
-        const colorGetter = getColor(series[seriesId], xAxis[xAxisId], yAxis[yAxisId]);
-        return /*#__PURE__*/_jsx(Element, _extends({
+        const colorGetter = (0, _getColor.default)(series[seriesId], xAxis[xAxisId], yAxis[yAxisId]);
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Element, (0, _extends2.default)({
           id: seriesId,
           color: colorGetter(highlightedIndex),
           x: x,
-          y: y
+          y: y,
+          shape: shape
         }, slotProps?.lineHighlight), `${seriesId}`);
       });
     })
@@ -110,11 +119,10 @@ process.env.NODE_ENV !== "production" ? LineHighlightPlot.propTypes = {
    * The props used for each component slot.
    * @default {}
    */
-  slotProps: PropTypes.object,
+  slotProps: _propTypes.default.object,
   /**
    * Overridable component slots.
    * @default {}
    */
-  slots: PropTypes.object
-} : void 0;
-export { LineHighlightPlot };
+  slots: _propTypes.default.object
+} : void 0;

package/LineChart/LinePlot.d.ts

@@ -1,17 +1,15 @@
 import * as React from 'react';
-import { LineElementProps, LineElementSlotProps, LineElementSlots } from './LineElement';
-import { LineItemIdentifier } from '../models/seriesType/line';
-export interface LinePlotSlots extends LineElementSlots {
-}
-export interface LinePlotSlotProps extends LineElementSlotProps {
-}
+import { LineElementProps, LineElementSlotProps, LineElementSlots } from "./LineElement.js";
+import { LineItemIdentifier } from "../models/seriesType/line.js";
+export interface LinePlotSlots extends LineElementSlots {}
+export interface LinePlotSlotProps extends LineElementSlotProps {}
 export interface LinePlotProps extends React.SVGAttributes<SVGSVGElement>, Pick<LineElementProps, 'slots' | 'slotProps' | 'skipAnimation'> {
-    /**
-     * Callback fired when a line item is clicked.
-     * @param {React.MouseEvent<SVGPathElement, MouseEvent>} event The event source of the callback.
-     * @param {LineItemIdentifier} lineItemIdentifier The line item identifier.
-     */
-    onItemClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, lineItemIdentifier: LineItemIdentifier) => void;
+  /**
+   * Callback fired when a line item is clicked.
+   * @param {React.MouseEvent<SVGPathElement, MouseEvent>} event The event source of the callback.
+   * @param {LineItemIdentifier} lineItemIdentifier The line item identifier.
+   */
+  onItemClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, lineItemIdentifier: LineItemIdentifier) => void;
 }
 /**
  * Demos:
@@ -25,6 +23,6 @@ export interface LinePlotProps extends React.SVGAttributes<SVGSVGElement>, Pick<
  */
 declare function LinePlot(props: LinePlotProps): React.JSX.Element;
 declare namespace LinePlot {
-    var propTypes: any;
+  var propTypes: any;
 }
-export { LinePlot };
+export { LinePlot };