Merge branch 'v4' into bugfix/slider-bugfixes

Author: KoolADE85

CHANGELOG.md

@@ -39,7 +39,7 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 - [#3398](https://github.com/plotly/dash/pull/3398) Modernize dcc.Input
 - [#3414](https://github.com/plotly/dash/pull/3414) Modernize dcc.Slider
 
-## [UNRELEASED]
+## [3.3.0] - 2025-11-12
 
 ## Added
 - [#3395](https://github.com/plotly/dash/pull/3396) Add position argument to hooks.devtool
@@ -53,10 +53,15 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 - [#3465](https://github.com/plotly/dash/pull/3465) Plotly cloud integrations, add devtool API, placeholder plotly cloud CLI & publish button, `dash[cloud]` extra dependencies. 
 
 ## Fixed
+- [#3490](https://github.com/plotly/dash/pull/3490) Fix stack overflow when circular callbacks are displayed on the devtool callback 
 - [#3395](https://github.com/plotly/dash/pull/3395) Fix Components added through set_props() cannot trigger related callback functions. Fix [#3316](https://github.com/plotly/dash/issues/3316)
 - [#3415](https://github.com/plotly/dash/pull/3415) Fix the error triggered when only a single no_update is returned for client-side callback functions with multiple Outputs. Fix [#3366](https://github.com/plotly/dash/issues/3366)
 - [#3416](https://github.com/plotly/dash/issues/3416) Fix DeprecationWarning in dash/_jupyter.py by migrating from deprecated ipykernel.comm.Comm to comm module
 - [#3488](https://github.com/plotly/dash/pull/3488) Fix pkgutil.find_loader removal in Python 3.14
+- [#3496](https://github.com/plotly/dash/pull/3496) Fix dcc.Graph infinite resize loop
+
+## Deprecated
+- [#3482](https://github.com/plotly/dash/pull/3482) Deprecate dash_table.DataTable with replacement from `dash[ag-grid]` extra requirement.
 
 ## [3.2.0] - 2025-07-31
 

CONTRIBUTING.md

@@ -80,13 +80,13 @@ Open a Bash terminal in the `dash` repository, Git Bash terminal for example on
 
   On some Linux/Mac environments, use `.` instead of `source`
   ```bash
-  $ python3 -m venv .venv/dev
-  $ source .venv/dev/bin/activate
+  $ python3 -m venv venv
+  $ source venv/bin/activate
   ```
 - Windows:
   ```bash
-  $ python -m venv .venv/dev
-  $ source .venv/dev/scripts/activate
+  $ python -m venv venv
+  $ source venv/scripts/activate
   ```
 
 Install dash and dependencies:

components/dash-core-components/package-lock.json

@@ -67,13 +67,13 @@
     "uniqid": "^5.4.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.28.0",
-    "@babel/core": "^7.28.0",
-    "@babel/eslint-parser": "^7.28.0",
+    "@babel/cli": "^7.28.3",
+    "@babel/core": "^7.28.5",
+    "@babel/eslint-parser": "^7.28.5",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/preset-env": "^7.28.0",
-    "@babel/preset-react": "^7.27.1",
-    "@babel/preset-typescript": "^7.27.1",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5",
+    "@babel/preset-typescript": "^7.28.5",
     "@plotly/dash-component-plugins": "^1.2.3",
     "@plotly/webpack-dash-dynamic-import": "^1.3.0",
     "@types/d3-format": "^3.0.4",
@@ -106,7 +106,7 @@
     "styled-jsx": "^5.1.7",
     "ts-jest": "^29.1.0",
     "typescript": "^5.8.3",
-    "webpack": "^5.101.0",
+    "webpack": "^5.102.1",
     "webpack-cli": "^5.1.4"
   },
   "optionalDependencies": {
@@ -122,6 +122,5 @@
   },
   "browserslist": [
     "last 9 years and not dead"
-  ],
-  "gitHead": "fdbd6e0b8dc2448175dad301ed9004c918332d34"
+  ]
 }

components/dash-core-components/package.json

@@ -393,6 +393,7 @@ class PlotlyGraph extends Component {
 
         gd.classList.add('dash-graph--pending');
 
+        // Calling resize enables layout.autosize in plotly.js
         Plotly.Plots.resize(gd)
             .catch(() => {})
             .finally(() => gd.classList.remove('dash-graph--pending'));
@@ -457,27 +458,6 @@ class PlotlyGraph extends Component {
         });
     }
 
-    getStyle() {
-        const {responsive} = this.props;
-        let {style} = this.props;
-
-        // When there is no forced responsive style, return the original style property
-        if (!responsive) {
-            return style;
-        }
-
-        // Otherwise, if the height is not set, we make the graph size equal to the parent one
-        if (!style) {
-            style = {};
-        }
-
-        if (!style.height) {
-            return Object.assign({height: '100%'}, style);
-        }
-
-        return style;
-    }
-
     componentDidMount() {
         const p = this.plot(this.props);
         this._queue = this.amendTraces(p, {}, this.props);
@@ -536,46 +516,33 @@ class PlotlyGraph extends Component {
     }
 
     render() {
-        const {className, id, loading_state} = this.props;
-        const style = this.getStyle();
-
-        if (window.dash_component_api) {
-            return (
-                <LoadingElement
-                    id={id}
-                    key={id}
-                    className={className}
-                    style={style}
-                    ref={this.parentElement}
-                >
-                    <ResizeDetector
-                        onResize={this.graphResize}
-                        targets={[this.parentElement, this.gd]}
-                    />
-                    <div
-                        ref={this.gd}
-                        style={{height: '100%', width: '100%'}}
-                    />
-                </LoadingElement>
-            );
+        const {className, id, loading_state, style = {}} = this.props;
+        if (this.isResponsive(this.props)) {
+            style.height ||= '100%';
         }
+
+        let Container = LoadingElement;
+        const containerProps = {
+            className,
+            id,
+            key: id,
+            ref: this.parentElement,
+            style,
+        };
+        if (!window.dash_component_api) {
+            Container = 'div';
+            containerProps['data-dash-is-loading'] =
+                loading_state?.is_loading || undefined;
+        }
+
         return (
-            <div
-                id={id}
-                key={id}
-                className={className}
-                style={style}
-                ref={this.parentElement}
-                data-dash-is-loading={
-                    (loading_state && loading_state.is_loading) || undefined
-                }
-            >
+            <Container {...containerProps}>
                 <ResizeDetector
                     onResize={this.graphResize}
                     targets={[this.parentElement, this.gd]}
                 />
                 <div ref={this.gd} style={{height: '100%', width: '100%'}} />
-            </div>
+            </Container>
         );
     }
 }