@mui/x-charts 8.0.0-alpha.12 → 8.0.0-alpha.13

package/modern/models/axis.d.ts

@@ -1,5 +1,6 @@
 import type { ScaleBand, ScaleLogarithmic, ScalePower, ScaleTime, ScaleLinear, ScalePoint, ScaleOrdinal, ScaleSequential, ScaleThreshold } from '@mui/x-charts-vendor/d3-scale';
 import { SxProps } from '@mui/system/styleFunctionSx';
+import { MakeRequired } from '@mui/x-internals/types';
 import { ChartsAxisClasses } from "../ChartsAxis/axisClasses.js";
 import type { TickParams } from '../hooks/useTicks';
 import { ChartsTextProps } from "../ChartsText/index.js";
@@ -104,17 +105,54 @@ export interface ChartsAxisProps extends TickParams {
   sx?: SxProps;
 }
 export interface ChartsYAxisProps extends ChartsAxisProps {
+  axis?: 'y';
+}
+export interface ChartsXAxisProps extends ChartsAxisProps {
+  axis?: 'x';
   /**
-   * Position of the axis.
+   * The minimum gap in pixels between two tick labels.
+   * If two tick labels are closer than this minimum gap, one of them will be hidden.
+   * @default 4
    */
-  position?: 'left' | 'right';
+  tickLabelMinGap?: number;
 }
-export interface ChartsXAxisProps extends ChartsAxisProps {
+type AxisSideConfig<AxisProps extends ChartsAxisProps> = AxisProps extends ChartsXAxisProps ? {
   /**
    * Position of the axis.
+   *
+   * When set, the space for the axis is reserved, even if the axis is not displayed due to missing data.
+   *
+   * Set to 'none' to hide the axis.
+   *
+   * The first axis in the list will always have a default position.
    */
-  position?: 'top' | 'bottom';
-}
+  position?: 'top' | 'bottom' | 'none';
+  /**
+   * The height of the axis.
+   * @default 30
+   */
+  height?: number;
+} : AxisProps extends ChartsYAxisProps ? {
+  /**
+   * Position of the axis.
+   *
+   * When set, the space for the axis is reserved, even if the axis is not displayed due to missing data.
+   *
+   * Set to 'none' to hide the axis.
+   *
+   * The first axis in the list will always have a default position.
+   */
+  position?: 'left' | 'right' | 'none';
+  /**
+   * The width of the axis.
+   * @default 30
+   */
+  width?: number;
+} : {
+  position?: 'top' | 'bottom' | 'left' | 'right' | 'none';
+  height?: number;
+  width?: number;
+};
 export interface ChartsRotationAxisProps extends ChartsAxisProps {
   /**
    * The start angle (in deg).
@@ -242,7 +280,7 @@ export type AxisValueFormatterContext<S extends ScaleName = ScaleName> = {
    */
   scale: AxisScaleConfig[S]['scale'];
 };
-export type AxisConfig<S extends ScaleName = ScaleName, V = any, AxisProps = ChartsXAxisProps | ChartsYAxisProps> = {
+export type AxisConfig<S extends ScaleName = ScaleName, V = any, AxisProps extends ChartsAxisProps = ChartsXAxisProps | ChartsYAxisProps> = {
   /**
    * Id used to identify the axis.
    */
@@ -260,7 +298,7 @@ export type AxisConfig<S extends ScaleName = ScaleName, V = any, AxisProps = Cha
   /**
    * The data used by `'band'` and `'point'` scales.
    */
-  data?: V[];
+  data?: readonly V[];
   /**
    * The key used to retrieve `data` from the `dataset` prop.
    */
@@ -280,6 +318,13 @@ export type AxisConfig<S extends ScaleName = ScaleName, V = any, AxisProps = Cha
    * If `true`, Reverse the axis scaleBand.
    */
   reverse?: boolean;
+  /**
+   * The offset of the axis in pixels. It can be used to move the axis from its default position.
+   * X-axis: A top axis will move up, and a bottom axis will move down.
+   * Y-axis: A left axis will move left, and a right axis will move right.
+   * @default 0
+   */
+  offset?: number;
   /**
    * Defines the axis scale domain based on the min/max values of series linked to it.
    * - 'nice': Rounds the domain at human friendly values.
@@ -290,9 +335,9 @@ export type AxisConfig<S extends ScaleName = ScaleName, V = any, AxisProps = Cha
     min: number;
     max: number;
   });
-} & Omit<Partial<AxisProps>, 'axisId'> & Partial<Omit<AxisScaleConfig[S], 'scale'>> & TickParams & AxisConfigExtension;
+} & Omit<Partial<AxisProps>, 'axisId'> & Partial<Omit<AxisScaleConfig[S], 'scale'>> & AxisSideConfig<AxisProps> & TickParams & AxisConfigExtension;
 export interface AxisConfigExtension {}
-export type AxisDefaultized<S extends ScaleName = ScaleName, V = any, AxisProps = ChartsXAxisProps | ChartsYAxisProps> = Omit<AxisConfig<S, V, AxisProps>, 'scaleType'> & AxisScaleConfig[S] & AxisScaleComputedConfig[S] & {
+export type AxisDefaultized<S extends ScaleName = ScaleName, V = any, AxisProps extends ChartsAxisProps = ChartsXAxisProps | ChartsYAxisProps> = MakeRequired<Omit<AxisConfig<S, V, AxisProps>, 'scaleType'>, 'offset'> & AxisScaleConfig[S] & AxisSideConfig<AxisProps> & AxisScaleComputedConfig[S] & {
   /**
    * An indication of the expected number of ticks.
    */
@@ -320,4 +365,5 @@ export interface ChartsAxisData {
    * The mapping of series ids to their value for this particular axis index.
    */
   seriesValues: Record<string, number | null | undefined>;
-}
+}
+export {};

package/modern/models/colorMapping.d.ts

@@ -33,7 +33,7 @@ export interface OrdinalColorConfig<Value = number | Date | string> {
    * The value to map.
    * If undefined, it will be integers from 0 to the number of colors.
    */
-  values?: Value[];
+  values?: readonly Value[];
   /**
    * The color palette.
    * Items equal to `values[k]` will get the color of `colors[k]`.

package/modern/models/index.d.ts

@@ -1,5 +1,4 @@
 export * from "./seriesType/index.js";
-export * from "./layout.js";
 export * from "./stacking.js";
 export type { AxisConfig, ChartsYAxisProps, ChartsXAxisProps, ScaleName, ContinuousScaleName, ChartsAxisData } from './axis';
 export type { PropsFromSlot } from '@mui/x-internals/slots';

package/modern/models/index.js

@@ -1,5 +1,4 @@
 export * from "./seriesType/index.js";
-export * from "./layout.js";
 export * from "./stacking.js";
 
 // Utils shared across the X packages

package/modern/models/seriesType/bar.d.ts

@@ -6,7 +6,7 @@ export interface BarSeriesType extends CommonSeriesType<number | null>, Cartesia
   /**
    * Data associated to each bar.
    */
-  data?: (number | null)[];
+  data?: readonly (number | null)[];
   /**
    * The key used to retrieve data from the dataset.
    */

package/modern/models/seriesType/config.d.ts

@@ -76,6 +76,6 @@ export type ChartSeriesDefaultized<T extends ChartSeriesType> = ChartsSeriesConf
 } : ChartsSeriesConfig[T]['series'];
 export type ChartItemIdentifier<T extends ChartSeriesType> = ChartsSeriesConfig[T]['itemIdentifier'];
 export type DatasetElementType<T> = {
-  [key: string]: T;
+  [key: string]: Readonly<T>;
 };
 export type DatasetType<T = number | string | Date | null | undefined> = DatasetElementType<T>[];

package/modern/models/seriesType/line.d.ts

@@ -29,7 +29,7 @@ export interface LineSeriesType extends CommonSeriesType<number | null>, Cartesi
   /**
    * Data associated to the line.
    */
-  data?: (number | null)[];
+  data?: readonly (number | null)[];
   /**
    * The key used to retrieve data from the dataset.
    */

package/modern/models/seriesType/pie.d.ts

@@ -27,7 +27,7 @@ export type DefaultizedPieValueType = PieValueType & Omit<D3PieArcDatum<any>, 'd
 export type ChartsPieSorting = 'none' | 'asc' | 'desc' | ((a: number, b: number) => number);
 export interface PieSeriesType<TData = PieValueType> extends CommonSeriesType<TData> {
   type: 'pie';
-  data: TData[];
+  data: Readonly<TData[]>;
   /**
    * The radius between circle center and the beginning of the arc.
    * Can be a number (in px) or a string with a percentage such as '50%'.

package/modern/models/seriesType/scatter.d.ts

@@ -11,7 +11,7 @@ export type ScatterValueType = {
 };
 export interface ScatterSeriesType extends CommonSeriesType<ScatterValueType | null>, CartesianSeriesType {
   type: 'scatter';
-  data?: ScatterValueType[];
+  data?: readonly ScatterValueType[];
   markerSize?: number;
   /**
    * The label to display on the tooltip or the legend. It can be a string or a function.

package/modern/models/z-axis.d.ts

@@ -2,7 +2,7 @@ import type { ScaleOrdinal, ScaleSequential, ScaleThreshold } from '@mui/x-chart
 import { ContinuousColorConfig, OrdinalColorConfig, PiecewiseColorConfig } from "./colorMapping.js";
 export interface ZAxisConfig<V = any> {
   id: string;
-  data?: V[];
+  data?: readonly V[];
   /**
    * The key used to retrieve `data` from the `dataset` prop.
    */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-charts",
-  "version": "8.0.0-alpha.12",
+  "version": "8.0.0-alpha.13",
   "description": "The community edition of the Charts components (MUI X).",
   "author": "MUI Team",
   "main": "./index.js",
@@ -38,8 +38,8 @@
     "react-is": "^18.3.1 || ^19.0.0",
     "reselect": "^5.1.1",
     "use-sync-external-store": "^1.4.0",
-    "@mui/x-internals": "8.0.0-alpha.12",
-    "@mui/x-charts-vendor": "8.0.0-alpha.10"
+    "@mui/x-charts-vendor": "8.0.0-alpha.13",
+    "@mui/x-internals": "8.0.0-alpha.13"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",