Dash Compose - A new package for composing component layouts

Dash Python
1

Hello! I’ve made a package called Dash Compose that gives an alternative way of writing dash layouts to the usual nested component constructors. A “hello world” example is given below, and you can read more about it (including some more complex/compelling use-cases) in the documentation here.

from dash import Dash, dcc, html
from dash.dependencies import Input, Output
from dash_compose import composition


@composition
def hello_world():
    """
    <div>
        <span>Hello </span>
        <span>world!</span>
    </div>
    """
    with Div() as container:
        yield Span("Hello ")
        with Span():
            yield "world!"
    return container


app = Dash()
app.layout = hello_world()


if __name__ == "__main__":
    app.run_server(debug=True)

Dash Compose was inspired by the way Textual and Dominate write layouts, which both reflect the tree-structure of HTML in your code. It also addresses some of my own experiences building/maintaining large Dash app codebases within a team.

Dash Compose is a bit magical in terms of how your code translates into component layouts, so I imagine some people will love it and others will hate it. Please both leave comments and suggestions!

2 Likes