What’s New in Dash 4

Dash 4.0 updates the styling of Dash Core Components and introduces some new features.

Dash Core Components

Visual components styles have been updated with this release:

See the Dash Core Components documentation for examples.

Note: If your app uses custom CSS that targets Dash Core Components, you may need to update your stylesheets when upgrading to Dash 4.

Some component properties now have new defaults.

The default value of step for sliders is now only set to 1 if the min and max props are both integers. Otherwise, it is dynamically computed according to the available space for the slider.
For dcc.Dropdown, the default value of optionHeight is now ‘auto’, which supports text wrapping of lengthy text on small screens; you can still specify a numeric pixel height if desired.
For dcc.Dropdown, the default value for closeOnSelect is now True for single-select dropdowns and False for multi-select.

Dash 4.0 introduces the following new functionality on existing components:

dcc.DatePickerSingle and dcc.DatePickerRange now support translations.
dcc.Dropdown has a new labels property to customize strings used within the component.
dcc.Tab now accepts a width prop which can be a pixel or percentage width for an individual tab.
dcc.Tab now accepts other Dash Components for its label.
dcc.Upload has a new enable_folder_selection to support upload of folders.

The new dcc.Button works the same as html.Button but is styled to match other Dash Core Components.

from dash import dcc

dcc.Button("Click Me", id="my-button")

See the dcc.Button documentation for more examples.

If you use Dash Design Kit in your apps, you’ll need to upgrade to Dash Design Kit v3 or later to use Dash v4.