@mui/x-charts 8.11.2 → 8.12.0

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.js

@@ -0,0 +1,210 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import useEventCallback from '@mui/utils/useEventCallback';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
+import { getNextSeriesWithData, getPreviousSeriesWithData, seriesHasData } from "./useChartKeyboardNavigation.helpers.js";
+export const useChartKeyboardNavigation = ({
+  params,
+  store,
+  svgRef
+}) => {
+  const focusNextItem = useEventCallback(function focusNextItem() {
+    store.update(state => {
+      let {
+        type,
+        seriesId
+      } = state.keyboardNavigation.item ?? {};
+      if (type === undefined ||
+      // @ts-ignore sankey is not in MIT version
+      type === 'sankey' || seriesId === undefined || !seriesHasData(state.series.processedSeries, type, seriesId)) {
+        const nextSeries = getNextSeriesWithData(state.series.processedSeries, type, seriesId);
+        if (nextSeries === null) {
+          return _extends({}, state, {
+            keyboardNavigation: _extends({}, state.keyboardNavigation, {
+              item: null // No series to move the focus too.
+            })
+          });
+        }
+        type = nextSeries.type;
+        seriesId = nextSeries.seriesId;
+      }
+      const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+      return _extends({}, state, {
+        keyboardNavigation: _extends({}, state.keyboardNavigation, {
+          item: {
+            type,
+            seriesId,
+            dataIndex: ((state.keyboardNavigation.item?.dataIndex ?? -1) + 1) % dataLength
+          }
+        })
+      });
+    });
+  });
+  const focusPreviousItem = useEventCallback(function focusPreviousItem() {
+    store.update(state => {
+      let {
+        type,
+        seriesId
+      } = state.keyboardNavigation.item ?? {};
+      if (type === undefined ||
+      // @ts-ignore sankey is not in MIT version
+      type === 'sankey' || seriesId === undefined || !seriesHasData(state.series.processedSeries, type, seriesId)) {
+        const previousSeries = getPreviousSeriesWithData(state.series.processedSeries, type, seriesId);
+        if (previousSeries === null) {
+          return _extends({}, state, {
+            keyboardNavigation: _extends({}, state.keyboardNavigation, {
+              item: null // No series to move the focus too.} };
+            })
+          });
+        }
+        type = previousSeries.type;
+        seriesId = previousSeries.seriesId;
+      }
+      const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+      return _extends({}, state, {
+        keyboardNavigation: _extends({}, state.keyboardNavigation, {
+          item: {
+            type,
+            seriesId,
+            dataIndex: (dataLength + (state.keyboardNavigation.item?.dataIndex ?? 1) - 1) % dataLength
+          }
+        })
+      });
+    });
+  });
+  const focusPreviousSeries = useEventCallback(function focusPreviousSeries() {
+    let setNewSeries = false;
+    store.update(state => {
+      let {
+        type,
+        seriesId
+      } = state.keyboardNavigation.item ?? {};
+      const previousSeries = getPreviousSeriesWithData(state.series.processedSeries, type, seriesId);
+      if (previousSeries === null) {
+        return _extends({}, state, {
+          keyboardNavigation: _extends({}, state.keyboardNavigation, {
+            item: null // No series to move the focus too.
+          })
+        });
+      }
+      type = previousSeries.type;
+      seriesId = previousSeries.seriesId;
+      const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+      setNewSeries = true;
+      return _extends({}, state, {
+        keyboardNavigation: _extends({}, state.keyboardNavigation, {
+          item: {
+            type,
+            seriesId,
+            dataIndex: Math.min(dataLength - 1, state.keyboardNavigation.item?.dataIndex ?? 0)
+          }
+        })
+      });
+    });
+    return setNewSeries;
+  });
+  const focusNextSeries = useEventCallback(function focusNextSeries() {
+    let setNewSeries = false;
+    store.update(state => {
+      let {
+        type,
+        seriesId
+      } = state.keyboardNavigation.item ?? {};
+      const nextSeries = getNextSeriesWithData(state.series.processedSeries, type, seriesId);
+      if (nextSeries === null) {
+        return _extends({}, state, {
+          keyboardNavigation: _extends({}, state.keyboardNavigation, {
+            item: null // No series to move the focus too.
+          })
+        });
+      }
+      type = nextSeries.type;
+      seriesId = nextSeries.seriesId;
+      const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+      setNewSeries = true;
+      return _extends({}, state, {
+        keyboardNavigation: _extends({}, state.keyboardNavigation, {
+          item: {
+            type,
+            seriesId,
+            dataIndex: Math.min(dataLength - 1, state.keyboardNavigation.item?.dataIndex ?? 0)
+          }
+        })
+      });
+    });
+    return setNewSeries;
+  });
+  const removeFocus = useEventCallback(function removeFocus() {
+    store.update(state => {
+      if (state.keyboardNavigation.item === null) {
+        return state;
+      }
+      return _extends({}, state, {
+        keyboardNavigation: _extends({}, state.keyboardNavigation, {
+          item: null
+        })
+      });
+    });
+  });
+  React.useEffect(() => {
+    const element = svgRef.current;
+    if (!element || !params.enableKeyboardNavigation) {
+      return undefined;
+    }
+    function keyboardHandler(event) {
+      switch (event.key) {
+        case 'ArrowRight':
+          focusNextItem();
+          break;
+        case 'ArrowLeft':
+          focusPreviousItem();
+          break;
+        case 'ArrowDown':
+          {
+            const updatedStore = focusPreviousSeries();
+            if (updatedStore) {
+              // prevents scrolling
+              event.preventDefault();
+            }
+            break;
+          }
+        case 'ArrowUp':
+          {
+            const updatedStore = focusNextSeries();
+            if (updatedStore) {
+              // prevents scrolling
+              event.preventDefault();
+            }
+            break;
+          }
+        default:
+          break;
+      }
+    }
+    element.addEventListener('keydown', keyboardHandler);
+    element.addEventListener('blur', removeFocus);
+    return () => {
+      element.removeEventListener('keydown', keyboardHandler);
+      element.removeEventListener('blur', removeFocus);
+    };
+  }, [svgRef, focusNextItem, focusPreviousItem, removeFocus, focusPreviousSeries, focusNextSeries, params.enableKeyboardNavigation]);
+  useEnhancedEffect(() => store.update(prev => prev.keyboardNavigation.enableKeyboardNavigation === params.enableKeyboardNavigation ? prev : _extends({}, prev, {
+    keyboardNavigation: _extends({}, prev.keyboardNavigation, {
+      enableKeyboardNavigation: !!params.enableKeyboardNavigation
+    })
+  })), [store, params.enableKeyboardNavigation]);
+  return {
+    instance: {}
+  };
+};
+useChartKeyboardNavigation.getInitialState = params => ({
+  keyboardNavigation: {
+    item: null,
+    enableKeyboardNavigation: !!params.enableKeyboardNavigation
+  }
+});
+useChartKeyboardNavigation.params = {
+  enableKeyboardNavigation: true
+};

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.d.ts

@@ -0,0 +1,25 @@
+export declare const selectorChartsHasFocusedItem: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartKeyboardNavigation.types.js").UseChartKeyboardNavigationState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, boolean, any[]>;
+export declare const selectorChartsFocusedSeriesType: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartKeyboardNavigation.types.js").UseChartKeyboardNavigationState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, keyof import("../../../index.js").ChartsSeriesConfig | undefined, any[]>;
+export declare const selectorChartsFocusedSeriesId: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartKeyboardNavigation.types.js").UseChartKeyboardNavigationState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, import("../../../index.js").SeriesId | undefined, any[]>;
+export declare const selectorChartsFocusedDataIndex: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartKeyboardNavigation.types.js").UseChartKeyboardNavigationState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, number | undefined, any[]>;
+export declare const selectorChartsIsKeyboardNavigationEnabled: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartKeyboardNavigation.types.js").UseChartKeyboardNavigationState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, boolean, any[]>;

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.js

@@ -0,0 +1,7 @@
+import { createSelector } from "../../utils/selectors.js";
+const selectKeyboardNavigation = state => state.keyboardNavigation;
+export const selectorChartsHasFocusedItem = createSelector([selectKeyboardNavigation], keyboardNavigationState => keyboardNavigationState?.item != null);
+export const selectorChartsFocusedSeriesType = createSelector([selectKeyboardNavigation], keyboardNavigationState => keyboardNavigationState?.item?.type);
+export const selectorChartsFocusedSeriesId = createSelector([selectKeyboardNavigation], keyboardNavigationState => keyboardNavigationState?.item?.seriesId);
+export const selectorChartsFocusedDataIndex = createSelector([selectKeyboardNavigation], keyboardNavigationState => keyboardNavigationState?.item?.dataIndex);
+export const selectorChartsIsKeyboardNavigationEnabled = createSelector([selectKeyboardNavigation], keyboardNavigationState => !!keyboardNavigationState?.enableKeyboardNavigation);

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.types.d.ts

@@ -0,0 +1,34 @@
+import { ChartPluginSignature } from "../../models/index.js";
+import { ChartSeriesType } from "../../../../models/seriesType/config.js";
+import { SeriesId } from "../../../../models/seriesType/common.js";
+export interface UseChartKeyboardNavigationInstance {}
+type SeriesItemIdentifier = {
+  /**
+   * The type of the series
+   */
+  type: ChartSeriesType;
+  /**
+   * The id of the series with focus.
+   */
+  seriesId: SeriesId;
+  /**
+   * The index of the data point with focus.
+   */
+  dataIndex: number;
+};
+export interface UseChartKeyboardNavigationState {
+  keyboardNavigation: {
+    item: null | SeriesItemIdentifier;
+    enableKeyboardNavigation: boolean;
+  };
+}
+type UseChartKeyboardNavigationParameters = {
+  enableKeyboardNavigation?: boolean;
+};
+export type UseChartKeyboardNavigationSignature = ChartPluginSignature<{
+  params: UseChartKeyboardNavigationParameters;
+  defaultizedParams: UseChartKeyboardNavigationParameters;
+  instance: UseChartKeyboardNavigationInstance;
+  state: UseChartKeyboardNavigationState;
+}>;
+export {};

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.types.js

@@ -0,0 +1 @@
+export {};

package/esm/internals/plugins/featurePlugins/useChartPolarAxis/getAxisIndex.js

@@ -1,4 +1,4 @@
-import { isBandScale } from "../../../isBandScale.js";
+import { isOrdinalScale } from "../../../scaleGuards.js";
 import { clampAngleRad } from "../../../clampAngle.js";
 
 /**
@@ -11,7 +11,7 @@ export function getAxisIndex(axisConfig, pointerValue) {
     data: axisData,
     reverse
   } = axisConfig;
-  if (!isBandScale(scale)) {
+  if (!isOrdinalScale(scale)) {
     throw new Error('MUI X Charts: getAxisValue is not implemented for polare continuous axes.');
   }
   if (!axisData) {

package/esm/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.js

@@ -12,6 +12,7 @@ import { getSVGPoint } from "../../../getSVGPoint.js";
 import { generatePolar2svg, generateSvg2polar, generateSvg2rotation } from "./coordinateTransformation.js";
 import { getAxisIndex } from "./getAxisIndex.js";
 import { selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/index.js";
+import { checkHasInteractionPlugin } from "../useChartInteraction/checkHasInteractionPlugin.js";
 export const useChartPolarAxis = ({
   params,
   store,
@@ -78,9 +79,10 @@ export const useChartPolarAxis = ({
   const mousePosition = React.useRef({
     isInChart: false
   });
+  const hasInteractionPlugin = checkHasInteractionPlugin(instance);
   React.useEffect(() => {
     const element = svgRef.current;
-    if (!isInteractionEnabled || element === null || params.disableAxisListener) {
+    if (!isInteractionEnabled || !hasInteractionPlugin || element === null || params.disableAxisListener) {
       return () => {};
     }
 
@@ -94,13 +96,13 @@ export const useChartPolarAxis = ({
     const panEndHandler = instance.addInteractionListener('panEnd', event => {
       if (!event.detail.activeGestures.move) {
         mousePosition.current.isInChart = false;
-        instance.cleanInteraction();
+        instance.cleanInteraction?.();
       }
     });
     const pressEndHandler = instance.addInteractionListener('quickPressEnd', event => {
       if (!event.detail.activeGestures.move && !event.detail.activeGestures.pan) {
         mousePosition.current.isInChart = false;
-        instance.cleanInteraction();
+        instance.cleanInteraction?.();
       }
     });
     const gestureHandler = event => {
@@ -112,12 +114,12 @@ export const useChartPolarAxis = ({
         const svgRect = element.getBoundingClientRect();
         if (srcEvent.clientX < svgRect.left || srcEvent.clientX > svgRect.right || srcEvent.clientY < svgRect.top || srcEvent.clientY > svgRect.bottom) {
           mousePosition.current.isInChart = false;
-          instance.cleanInteraction();
+          instance.cleanInteraction?.();
           return;
         }
         const svgPoint = getSVGPoint(element, srcEvent);
         mousePosition.current.isInChart = true;
-        instance.setPointerCoordinate(svgPoint);
+        instance.setPointerCoordinate?.(svgPoint);
         return;
       }
 
@@ -128,7 +130,7 @@ export const useChartPolarAxis = ({
       // Test if it's in the drawing area
       if (!instance.isPointInside(svgPoint.x, svgPoint.y, event.detail.target)) {
         if (mousePosition.current.isInChart) {
-          instance?.cleanInteraction();
+          instance.cleanInteraction?.();
           mousePosition.current.isInChart = false;
         }
         return;
@@ -139,7 +141,7 @@ export const useChartPolarAxis = ({
       const maxRadius = radiusAxisWithScale[usedRadiusAxisId].scale.range()[1];
       if (radiusSquare > maxRadius ** 2) {
         if (mousePosition.current.isInChart) {
-          instance?.cleanInteraction();
+          instance.cleanInteraction?.();
           mousePosition.current.isInChart = false;
         }
         return;
@@ -158,7 +160,7 @@ export const useChartPolarAxis = ({
       pressHandler.cleanup();
       pressEndHandler.cleanup();
     };
-  }, [svgRef, store, center, radiusAxisWithScale, usedRadiusAxisId, rotationAxisWithScale, usedRotationAxisId, instance, params.disableAxisListener, isInteractionEnabled, svg2rotation]);
+  }, [svgRef, store, center, radiusAxisWithScale, usedRadiusAxisId, rotationAxisWithScale, usedRotationAxisId, instance, params.disableAxisListener, isInteractionEnabled, svg2rotation, hasInteractionPlugin]);
   React.useEffect(() => {
     const element = svgRef.current;
     const onAxisClick = params.onAxisClick;

package/esm/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.types.d.ts

@@ -69,5 +69,6 @@ export type UseChartPolarAxisSignature<SeriesType extends ChartSeriesType = Char
   defaultizedParams: UseChartPolarAxisDefaultizedParameters;
   state: UseChartPolarAxisState;
   instance: UseChartPolarAxisInstance;
-  dependencies: [UseChartInteractionSignature, UseChartSeriesSignature<SeriesType>];
+  dependencies: [UseChartSeriesSignature<SeriesType>];
+  optionalDependencies: [UseChartInteractionSignature];
 }>;

package/esm/internals/plugins/models/seriesConfig/getSeriesWithDefaultValues.types.d.ts

@@ -1,3 +1,3 @@
 import type { ChartSeries, ChartSeriesType } from "../../../../models/seriesType/config.js";
 import type { AllSeriesType } from "../../../../models/seriesType/index.js";
-export type GetSeriesWithDefaultValues<T extends ChartSeriesType> = (series: AllSeriesType<T>, seriesIndex: number, colors: string[]) => ChartSeries<T>;
+export type GetSeriesWithDefaultValues<T extends ChartSeriesType> = (series: AllSeriesType<T>, seriesIndex: number, colors: readonly string[]) => ChartSeries<T>;

package/esm/internals/scaleGuards.d.ts

@@ -0,0 +1,11 @@
+import type { ScaleBand } from '@mui/x-charts-vendor/d3-scale';
+import { D3OrdinalScale, D3Scale } from "../models/axis.js";
+export declare function isOrdinalScale<T extends {
+  toString(): string;
+}>(scale: D3Scale<T>): scale is D3OrdinalScale<T>;
+export declare function isBandScale<T extends {
+  toString(): string;
+}>(scale: D3Scale<T>): scale is ScaleBand<T>;
+export declare function isPointScale<T extends {
+  toString(): string;
+}>(scale: D3Scale<T>): scale is D3OrdinalScale<T>;

package/esm/internals/scaleGuards.js

@@ -0,0 +1,9 @@
+export function isOrdinalScale(scale) {
+  return scale.bandwidth !== undefined;
+}
+export function isBandScale(scale) {
+  return isOrdinalScale(scale) && scale.paddingOuter !== undefined;
+}
+export function isPointScale(scale) {
+  return isOrdinalScale(scale) && !('paddingOuter' in scale);
+}

package/esm/locales/elGR.d.ts

@@ -12,6 +12,102 @@ export declare const elGR: {
           toolbarExport?: string | undefined;
           toolbarExportPrint?: string | undefined;
           toolbarExportImage?: ((mimeType: import("./utils/imageMimeTypes.js").ChartImageExportMimeType | (string & {})) => string) | undefined;
+          chartTypeBar?: string | undefined;
+          chartTypeColumn?: string | undefined;
+          chartTypeLine?: string | undefined;
+          chartTypeArea?: string | undefined;
+          chartTypePie?: string | undefined;
+          chartPaletteLabel?: string | undefined;
+          chartPaletteNameRainbowSurge?: string | undefined;
+          chartPaletteNameBlueberryTwilight?: string | undefined;
+          chartPaletteNameMangoFusion?: string | undefined;
+          chartPaletteNameCheerfulFiesta?: string | undefined;
+          chartPaletteNameStrawberrySky?: string | undefined;
+          chartPaletteNameBlue?: string | undefined;
+          chartPaletteNameGreen?: string | undefined;
+          chartPaletteNamePurple?: string | undefined;
+          chartPaletteNameRed?: string | undefined;
+          chartPaletteNameOrange?: string | undefined;
+          chartPaletteNameYellow?: string | undefined;
+          chartPaletteNameCyan?: string | undefined;
+          chartPaletteNamePink?: string | undefined;
+          chartConfigurationSectionChart?: string | undefined;
+          chartConfigurationSectionAxes?: string | undefined;
+          chartConfigurationSectionTooltip?: string | undefined;
+          chartConfigurationSectionLegend?: string | undefined;
+          chartConfigurationSectionColumns?: string | undefined;
+          chartConfigurationSectionBars?: string | undefined;
+          chartConfigurationSectionLines?: string | undefined;
+          chartConfigurationSectionAreas?: string | undefined;
+          chartConfigurationSectionArcs?: string | undefined;
+          chartConfigurationGrid?: string | undefined;
+          chartConfigurationBorderRadius?: string | undefined;
+          chartConfigurationCategoryGapRatio?: string | undefined;
+          chartConfigurationBarGapRatio?: string | undefined;
+          chartConfigurationStacked?: string | undefined;
+          chartConfigurationShowToolbar?: string | undefined;
+          chartConfigurationSkipAnimation?: string | undefined;
+          chartConfigurationInnerRadius?: string | undefined;
+          chartConfigurationOuterRadius?: string | undefined;
+          chartConfigurationColors?: string | undefined;
+          chartConfigurationHideLegend?: string | undefined;
+          chartConfigurationShowMark?: string | undefined;
+          chartConfigurationHeight?: string | undefined;
+          chartConfigurationWidth?: string | undefined;
+          chartConfigurationSeriesGap?: string | undefined;
+          chartConfigurationTickPlacement?: string | undefined;
+          chartConfigurationTickLabelPlacement?: string | undefined;
+          chartConfigurationCategoriesAxisLabel?: string | undefined;
+          chartConfigurationSeriesAxisLabel?: string | undefined;
+          chartConfigurationXAxisPosition?: string | undefined;
+          chartConfigurationYAxisPosition?: string | undefined;
+          chartConfigurationSeriesAxisReverse?: string | undefined;
+          chartConfigurationTooltipPlacement?: string | undefined;
+          chartConfigurationTooltipTrigger?: string | undefined;
+          chartConfigurationLegendPosition?: string | undefined;
+          chartConfigurationLegendDirection?: string | undefined;
+          chartConfigurationBarLabels?: string | undefined;
+          chartConfigurationColumnLabels?: string | undefined;
+          chartConfigurationInterpolation?: string | undefined;
+          chartConfigurationPaddingAngle?: string | undefined;
+          chartConfigurationCornerRadius?: string | undefined;
+          chartConfigurationArcLabels?: string | undefined;
+          chartConfigurationStartAngle?: string | undefined;
+          chartConfigurationEndAngle?: string | undefined;
+          chartConfigurationPieTooltipTrigger?: string | undefined;
+          chartConfigurationPieLegendPosition?: string | undefined;
+          chartConfigurationPieLegendDirection?: string | undefined;
+          chartConfigurationOptionNone?: string | undefined;
+          chartConfigurationOptionValue?: string | undefined;
+          chartConfigurationOptionAuto?: string | undefined;
+          chartConfigurationOptionTop?: string | undefined;
+          chartConfigurationOptionTopLeft?: string | undefined;
+          chartConfigurationOptionTopRight?: string | undefined;
+          chartConfigurationOptionBottom?: string | undefined;
+          chartConfigurationOptionBottomLeft?: string | undefined;
+          chartConfigurationOptionBottomRight?: string | undefined;
+          chartConfigurationOptionLeft?: string | undefined;
+          chartConfigurationOptionRight?: string | undefined;
+          chartConfigurationOptionAxis?: string | undefined;
+          chartConfigurationOptionItem?: string | undefined;
+          chartConfigurationOptionHorizontal?: string | undefined;
+          chartConfigurationOptionVertical?: string | undefined;
+          chartConfigurationOptionBoth?: string | undefined;
+          chartConfigurationOptionStart?: string | undefined;
+          chartConfigurationOptionMiddle?: string | undefined;
+          chartConfigurationOptionEnd?: string | undefined;
+          chartConfigurationOptionExtremities?: string | undefined;
+          chartConfigurationOptionTick?: string | undefined;
+          chartConfigurationOptionMonotoneX?: string | undefined;
+          chartConfigurationOptionMonotoneY?: string | undefined;
+          chartConfigurationOptionCatmullRom?: string | undefined;
+          chartConfigurationOptionLinear?: string | undefined;
+          chartConfigurationOptionNatural?: string | undefined;
+          chartConfigurationOptionStep?: string | undefined;
+          chartConfigurationOptionStepBefore?: string | undefined;
+          chartConfigurationOptionStepAfter?: string | undefined;
+          chartConfigurationOptionBumpX?: string | undefined;
+          chartConfigurationOptionBumpY?: string | undefined;
         };
       };
     };

package/esm/locales/elGR.js

@@ -11,5 +11,105 @@ export const elGRLocaleText = {
   // Toolbar Export Menu
   toolbarExportPrint: 'Εκτύπωση',
   toolbarExportImage: mimeType => `Εξαγωγή ως ${imageMimeTypes[mimeType] ?? mimeType}`
+
+  // Charts renderer configuration
+  // chartTypeBar: 'Bar',
+  // chartTypeColumn: 'Column',
+  // chartTypeLine: 'Line',
+  // chartTypeArea: 'Area',
+  // chartTypePie: 'Pie',
+  // chartPaletteLabel: 'Color palette',
+  // chartPaletteNameRainbowSurge: 'Rainbow Surge',
+  // chartPaletteNameBlueberryTwilight: 'Blueberry Twilight',
+  // chartPaletteNameMangoFusion: 'Mango Fusion',
+  // chartPaletteNameCheerfulFiesta: 'Cheerful Fiesta',
+  // chartPaletteNameStrawberrySky: 'Strawberry Sky',
+  // chartPaletteNameBlue: 'Blue',
+  // chartPaletteNameGreen: 'Green',
+  // chartPaletteNamePurple: 'Purple',
+  // chartPaletteNameRed: 'Red',
+  // chartPaletteNameOrange: 'Orange',
+  // chartPaletteNameYellow: 'Yellow',
+  // chartPaletteNameCyan: 'Cyan',
+  // chartPaletteNamePink: 'Pink',
+  // chartConfigurationSectionChart: 'Chart',
+  // chartConfigurationSectionColumns: 'Columns',
+  // chartConfigurationSectionBars: 'Bars',
+  // chartConfigurationSectionAxes: 'Axes',
+  // chartConfigurationGrid: 'Grid',
+  // chartConfigurationBorderRadius: 'Border radius',
+  // chartConfigurationCategoryGapRatio: 'Category gap ratio',
+  // chartConfigurationBarGapRatio: 'Series gap ratio',
+  // chartConfigurationStacked: 'Stacked',
+  // chartConfigurationShowToolbar: 'Show toolbar',
+  // chartConfigurationSkipAnimation: 'Skip animation',
+  // chartConfigurationInnerRadius: 'Inner radius',
+  // chartConfigurationOuterRadius: 'Outer radius',
+  // chartConfigurationColors: 'Colors',
+  // chartConfigurationHideLegend: 'Hide legend',
+  // chartConfigurationShowMark: 'Show mark',
+  // chartConfigurationHeight: 'Height',
+  // chartConfigurationWidth: 'Width',
+  // chartConfigurationSeriesGap: 'Series gap',
+  // chartConfigurationTickPlacement: 'Tick placement',
+  // chartConfigurationTickLabelPlacement: 'Tick label placement',
+  // chartConfigurationCategoriesAxisLabel: 'Categories axis label',
+  // chartConfigurationSeriesAxisLabel: 'Series axis label',
+  // chartConfigurationXAxisPosition: 'X-axis position',
+  // chartConfigurationYAxisPosition: 'Y-axis position',
+  // chartConfigurationSeriesAxisReverse: 'Reverse series axis',
+  // chartConfigurationTooltipPlacement: 'Placement',
+  // chartConfigurationTooltipTrigger: 'Trigger',
+  // chartConfigurationLegendPosition: 'Position',
+  // chartConfigurationLegendDirection: 'Direction',
+  // chartConfigurationBarLabels: 'Bar labels',
+  // chartConfigurationColumnLabels: 'Column labels',
+  // chartConfigurationInterpolation: 'Interpolation',
+  // chartConfigurationSectionTooltip: 'Tooltip',
+  // chartConfigurationSectionLegend: 'Legend',
+  // chartConfigurationSectionLines: 'Lines',
+  // chartConfigurationSectionAreas: 'Areas',
+  // chartConfigurationSectionArcs: 'Arcs',
+  // chartConfigurationPaddingAngle: 'Padding angle',
+  // chartConfigurationCornerRadius: 'Corner radius',
+  // chartConfigurationArcLabels: 'Arc labels',
+  // chartConfigurationStartAngle: 'Start angle',
+  // chartConfigurationEndAngle: 'End angle',
+  // chartConfigurationPieTooltipTrigger: 'Trigger',
+  // chartConfigurationPieLegendPosition: 'Position',
+  // chartConfigurationPieLegendDirection: 'Direction',
+
+  // Common option labels
+  // chartConfigurationOptionNone: 'None',
+  // chartConfigurationOptionValue: 'Value',
+  // chartConfigurationOptionAuto: 'Auto',
+  // chartConfigurationOptionTop: 'Top',
+  // chartConfigurationOptionTopLeft: 'Top Left',
+  // chartConfigurationOptionTopRight: 'Top Right',
+  // chartConfigurationOptionBottom: 'Bottom',
+  // chartConfigurationOptionBottomLeft: 'Bottom Left',
+  // chartConfigurationOptionBottomRight: 'Bottom Right',
+  // chartConfigurationOptionLeft: 'Left',
+  // chartConfigurationOptionRight: 'Right',
+  // chartConfigurationOptionAxis: 'Axis',
+  // chartConfigurationOptionItem: 'Item',
+  // chartConfigurationOptionHorizontal: 'Horizontal',
+  // chartConfigurationOptionVertical: 'Vertical',
+  // chartConfigurationOptionBoth: 'Both',
+  // chartConfigurationOptionStart: 'Start',
+  // chartConfigurationOptionMiddle: 'Middle',
+  // chartConfigurationOptionEnd: 'End',
+  // chartConfigurationOptionExtremities: 'Extremities',
+  // chartConfigurationOptionTick: 'Tick',
+  // chartConfigurationOptionMonotoneX: 'Monotone X',
+  // chartConfigurationOptionMonotoneY: 'Monotone Y',
+  // chartConfigurationOptionCatmullRom: 'Catmull-Rom',
+  // chartConfigurationOptionLinear: 'Linear',
+  // chartConfigurationOptionNatural: 'Natural',
+  // chartConfigurationOptionStep: 'Step',
+  // chartConfigurationOptionStepBefore: 'Step Before',
+  // chartConfigurationOptionStepAfter: 'Step After',
+  // chartConfigurationOptionBumpX: 'Bump X',
+  // chartConfigurationOptionBumpY: 'Bump Y',
 };
 export const elGR = getChartsLocalization(elGRLocaleText);