đź“Ł Dash v1.15.0 Released - Julia Components, Simplified Callback Syntax, Fixed Table Tooltips and Copy & Paste, fixed dcc.Loading styling

Update: version 1.16 has been released since this was posted.

Overview

Dash v1.15.0 is a backwards compatible feature & bug fix release:

:arrow_right: Official Changelog


Give this a release a try with

pip install dash==1.15.0

and let us know how it goes!


Previous Releases


In More Detail

Added support for Dash.jl Julia components

We’ve been working on Dash for Julia (Dash.jl) for the last few months. Official documentation is coming soon but for now you can get started by viewing the instructions on the Dash.jl GitHub Repo.

Dash was designed from the start to be a language agnostic framework. The exact same components are written once in JavaScript and can be used in Python, R, or (new!) Julia.

These components are automatically generated from the “prop types” (sort of like a structured docstring) of the declarative JavaScript React components. This component generation happens before a component package is published and is accomplished by running a standard script included in the Dash component boilerplate.

In 1.15.0, running this script will automatically generate the Julia components. As a component author, you don’t need to know Julia nor write any Julia code nor even have Julia installed! The same goes for Dash for R.

We believe that there is a tremendous amount of duplicated effort in the data science libraries across languages. In 2013, we recognized that the web browser (and JavaScript) would become the universal application platform. With the declarative architecture behind plotly.js and Dash, we consolidate our effort into JavaScript and gain the Python, R, and Julia backends “for free”: Write once and generate three interfaces.

If you are a maintainer of a component library, then you’ll need to make the following changes to your package to support Julia:

  1. Upgrade to dash==1.15.0
  2. Modify the build step within package.json to include --jl-prefix <component-prefix>. <component-prefix> will be the prefix before each component and is used sort of as an alternative to namespaces. For example, dcc.Dropdown in Python is specified as dcc_dropdown in Julia. In this case, dcc is the <component-prefix>.
  3. Commit the build files to your master branch or to a build branch. In our repositories, we publish the build artifacts to the master branch while keeping these artifacts out of git in our dev branch. In your project, you may just include the artifacts in master and develop off of that branch.
  4. Update the README.md, community forum posts, and documentation of your component library to indicate how to install with Julia. When artifacts are published to GitHub, they can be installed directly from the repository. You don’t need to publish to Julia’s package manager. For example, these instructions would look something like (replacing the URL with your component GitHub repo):
    using Pkg
    Pkg.add(PackageSpec(url="https://github.com/plotly/dash-table.git", rev="master"))
    
  5. Share that you’ve added Julia support to your library as a show-and-tell topic in this community forum

As an example, see these pull requests that added Julia support:

If you need any help, then reach out to us on the forum or GitHub.

Simplified callback syntax: Input, Output, State don’t need to be in lists

This was a great community PR by @mbegel: Single input by mbegel · Pull Request #1180 · plotly/dash · GitHub. With this PR, we’ve simplified the app.callback signature by removing the square brackets & lists.

That is, instead of writing:

@app.callback(Output(...), [Input(...), Input(...)], [State(...), State(...)])

or

@app.callback(
    Output(...),
    [
        Input(...),
        Input(...)
    ],
    [
        State(...),
        State(...)
    ]
)

you can just write:

@app.callback(Output(...), Input(...), Input(...), State(...), State(...))

or

@app.callback(
    Output(...),
    Input(...),
    Input(...),
    State(...),
    State(...)
)

The order still matters: Outputs, then Inputs, then State.

Enjoy the simpler syntax! :beers:

Added parent_style and parent_className to dcc.Loading component.

This fixes an issue that @jimhendy brought up (thank you! :bowing_man:) in Percentage height of dcc.Loading children - #2 by jimhendy. See the full discussion & investigation in Graph dimension problem with dcc.Loading — regression (?) in DCC 1.9.1 · Issue #831 · plotly/dash-core-components · GitHub.

Fixed table regressions with tooltip alignment and copy/paste

DataTable tooltips weren’t working with horizontal scroll. This has been fixed in this release.Thanks to @tbillah for raising this issue in DataTable tooltip view appears limited to scope of page only - #3 by chriddyp. This has now been fixed.

Re copy paste: This worked when you used the keyboard to navigate and select cells (shift + arrow keys) but there was a bug when copying & pasting after using the mouse to select cells: shift + click. Special thanks to @geoforce for raising this issue in Copying from datatable - #3 by geoforce.

5 Likes

Hi, this looks very nice.

I am wondering what the State(…) is doing. As far as I can remember I did not come across this in the docs. Is this a way to access the state of an input element without triggering a callback when it changes?

Thank you very much.

Exactly - See “Dash Apps with State” in the second chapter of the tutorial: Part 2. Basic Callbacks | Dash for Python Documentation | Plotly

1 Like

Ahh I have missed it. Thank you!