scripts

docs/pages/x/api/charts/bar-chart-pro.json

@@ -80,6 +80,7 @@
         "describedArgs": ["zoomData"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/bar-chart.json

@@ -73,6 +73,7 @@
         "describedArgs": ["event", "barItemIdentifier"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/heatmap.json

@@ -61,6 +61,7 @@
         "describedArgs": ["highlightedItem"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/line-chart-pro.json

@@ -73,6 +73,7 @@
         "describedArgs": ["zoomData"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/line-chart.json

@@ -66,6 +66,7 @@
     },
     "onLineClick": { "type": { "name": "func" } },
     "onMarkClick": { "type": { "name": "func" } },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/pie-chart.json

@@ -61,6 +61,7 @@
       }
     },
     "onItemClick": { "type": { "name": "func" } },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/responsive-chart-container-pro.json

@@ -39,6 +39,7 @@
       }
     },
     "plugins": { "type": { "name": "arrayOf", "description": "Array<object>" } },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "width": { "type": { "name": "number" } },
     "xAxis": {
       "type": {

docs/pages/x/api/charts/responsive-chart-container.json

@@ -32,6 +32,7 @@
       }
     },
     "plugins": { "type": { "name": "arrayOf", "description": "Array<object>" } },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "width": { "type": { "name": "number" } },
     "xAxis": {
       "type": {

docs/pages/x/api/charts/scatter-chart-pro.json

@@ -69,6 +69,7 @@
         "describedArgs": ["zoomData"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/scatter-chart.json

@@ -62,6 +62,7 @@
         "describedArgs": ["event", "scatterItemIdentifier"]
       }
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "rightAxis": {
       "type": { "name": "union", "description": "object<br>&#124;&nbsp;string" },
       "default": "null"

docs/pages/x/api/charts/spark-line-chart.json

@@ -36,6 +36,7 @@
       "type": { "name": "enum", "description": "'bar'<br>&#124;&nbsp;'line'" },
       "default": "'line'"
     },
+    "resolveSizeBeforeRender": { "type": { "name": "bool" }, "default": "false" },
     "showHighlight": { "type": { "name": "bool" }, "default": "false" },
     "showTooltip": { "type": { "name": "bool" }, "default": "false" },
     "slotProps": { "type": { "name": "object" }, "default": "{}" },

docs/translations/api-docs/charts/bar-chart-pro/bar-chart-pro.json

@@ -56,6 +56,9 @@
       "description": "Callback fired when the zoom has changed.",
       "typeDescriptions": { "zoomData": "Updated zoom data." }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/bar-chart/bar-chart.json

@@ -52,6 +52,9 @@
         "barItemIdentifier": "The bar item identifier."
       }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/heatmap/heatmap.json

@@ -35,6 +35,9 @@
       "description": "The callback fired when the highlighted item changes.",
       "typeDescriptions": { "highlightedItem": "The newly highlighted item." }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/line-chart-pro/line-chart-pro.json

@@ -53,6 +53,9 @@
       "description": "Callback fired when the zoom has changed.",
       "typeDescriptions": { "zoomData": "Updated zoom data." }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/line-chart/line-chart.json

@@ -49,6 +49,9 @@
     },
     "onLineClick": { "description": "Callback fired when a line element is clicked." },
     "onMarkClick": { "description": "Callback fired when a mark element is clicked." },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/pie-chart/pie-chart.json

@@ -34,6 +34,9 @@
       "typeDescriptions": { "highlightedItem": "The newly highlighted item." }
     },
     "onItemClick": { "description": "Callback fired when a pie arc is clicked." },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/responsive-chart-container-pro/responsive-chart-container-pro.json

@@ -28,6 +28,9 @@
     "plugins": {
       "description": "An array of plugins defining how to preprocess data. If not provided, the container supports line, bar, scatter and pie charts."
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "series": {
       "description": "The array of series to display. Each type of series has its own specificity. Please refer to the appropriate docs page to learn more about it."
     },

docs/translations/api-docs/charts/responsive-chart-container/responsive-chart-container.json

@@ -24,6 +24,9 @@
     "plugins": {
       "description": "An array of plugins defining how to preprocess data. If not provided, the container supports line, bar, scatter and pie charts."
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "series": {
       "description": "The array of series to display. Each type of series has its own specificity. Please refer to the appropriate docs page to learn more about it."
     },

docs/translations/api-docs/charts/scatter-chart-pro/scatter-chart-pro.json

@@ -47,6 +47,9 @@
       "description": "Callback fired when the zoom has changed.",
       "typeDescriptions": { "zoomData": "Updated zoom data." }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/scatter-chart/scatter-chart.json

@@ -43,6 +43,9 @@
         "scatterItemIdentifier": "The scatter item identifier."
       }
     },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "rightAxis": {
       "description": "Indicate which axis to display the right of the charts. Can be a string (the id of the axis) or an object <code>ChartsYAxisProps</code>."
     },

docs/translations/api-docs/charts/spark-line-chart/spark-line-chart.json

@@ -26,6 +26,9 @@
       "typeDescriptions": { "highlightedItem": "The newly highlighted item." }
     },
     "plotType": { "description": "Type of plot used." },
+    "resolveSizeBeforeRender": {
+      "description": "The chart will try to wait for the parent container to resolve its size before it renders for the first time.<br>This can be useful in some scenarios where the chart appear to grow after the first render, like when used inside a grid."
+    },
     "showHighlight": {
       "description": "Set to <code>true</code> to highlight the value. With line, it shows a point. With bar, it shows a highlight band."
     },

packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx

@@ -230,6 +230,16 @@ BarChartPro.propTypes = {
    * @param {ZoomData[]} zoomData Updated zoom data.
    */
   onZoomChange: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts-pro/src/Heatmap/Heatmap.tsx

@@ -286,6 +286,16 @@ Heatmap.propTypes = {
    * @param {HighlightItemData | null} highlightedItem  The newly highlighted item.
    */
   onHighlightChange: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx

@@ -251,6 +251,16 @@ LineChartPro.propTypes = {
    * @param {ZoomData[]} zoomData Updated zoom data.
    */
   onZoomChange: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts-pro/src/ResponsiveChartContainerPro/ResponsiveChartContainerPro.tsx

@@ -93,6 +93,16 @@ ResponsiveChartContainerPro.propTypes = {
    * If not provided, the container supports line, bar, scatter and pie charts.
    */
   plugins: PropTypes.arrayOf(PropTypes.object),
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * The array of series to display.
    * Each type of series has its own specificity.

packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx

@@ -205,6 +205,16 @@ ScatterChartPro.propTypes = {
    * @param {ZoomData[]} zoomData Updated zoom data.
    */
   onZoomChange: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts/src/BarChart/BarChart.tsx

@@ -291,6 +291,16 @@ BarChart.propTypes = {
    * @param {BarItemIdentifier} barItemIdentifier The bar item identifier.
    */
   onItemClick: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts/src/LineChart/LineChart.tsx

@@ -326,6 +326,16 @@ LineChart.propTypes = {
    * Callback fired when a mark element is clicked.
    */
   onMarkClick: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts/src/PieChart/PieChart.tsx

@@ -328,6 +328,16 @@ PieChart.propTypes = {
    * Callback fired when a pie arc is clicked.
    */
   onItemClick: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts/src/ResponsiveChartContainer/ResponsiveChartContainer.tsx

@@ -98,6 +98,16 @@ ResponsiveChartContainer.propTypes = {
    * If not provided, the container supports line, bar, scatter and pie charts.
    */
   plugins: PropTypes.arrayOf(PropTypes.object),
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * The array of series to display.
    * Each type of series has its own specificity.

packages/x-charts/src/ScatterChart/ScatterChart.tsx

@@ -280,6 +280,16 @@ ScatterChart.propTypes = {
    * @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
    */
   onItemClick: PropTypes.func,
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.

packages/x-charts/src/SparkLineChart/SparkLineChart.tsx

@@ -320,6 +320,16 @@ SparkLineChart.propTypes = {
    * @default 'line'
    */
   plotType: PropTypes.oneOf(['bar', 'line']),
+  /**
+   * The chart will try to wait for the parent container to resolve its size
+   * before it renders for the first time.
+   *
+   * This can be useful in some scenarios where the chart appear to grow after
+   * the first render, like when used inside a grid.
+   *
+   * @default false
+   */
+  resolveSizeBeforeRender: PropTypes.bool,
   /**
    * Set to `true` to highlight the value.
    * With line, it shows a point.