Dash

---
name: dash
description: "Use when building, debugging, testing, or maintaining Plotly Dash
  applications, callbacks, server backends, component packages, renderer
  internals, and Dash repository workflows."
disable-model-invocation: true
metadata:
  disco-role: operating
license: MIT
---

# Dash Repo Skill

Dash is Plotly's Python framework for building reactive web applications with
Python layouts, React component bundles, and server-side or clientside callbacks.
Use this repo skill when a task involves Dash application code, callback routing,
Dash server backends, component wrapper generation, the Dash renderer, or Dash
repo test/build workflows.

## Read first

- Read [references/package-overview.md](references/package-overview.md) for the
  installed package shape, public imports, optional extras, CLIs, and major
  subsystems.
- Read [references/troubleshooting.md](references/troubleshooting.md) for
  cross-cutting install/import, generated component, optional dependency, Node,
  browser, and stale-skill failures.
- Read [references/repo-provenance.md](references/repo-provenance.md) before
  deciding whether this skill matches a current Dash checkout.
- Run [scripts/check_dash_install.py](scripts/check_dash_install.py) when you
  need a safe import/optional-backend/CLI diagnostic before using deeper routes.

## Quick install and smoke check

For ordinary app use:

```bash
python -m pip install dash
python - <<'PY'
import dash
from dash import Dash, html, dcc, Input, Output
print(dash.__version__)
app = Dash(__name__)
app.layout = html.Div([dcc.Input(id="name"), html.Div(id="out")])
@app.callback(Output("out", "children"), Input("name", "value"))
def update(value):
    return value or ""
print(app.layout.to_plotly_json()["type"], len(app.callback_map))
PY
```

Choose extras only when the workflow needs them:

| Need | Install |
| --- | --- |
| Selenium/browser testing fixtures | `python -m pip install "dash[testing]"` |
| Diskcache background callbacks | `python -m pip install "dash[diskcache]"` |
| Celery background callbacks | `python -m pip install "dash[celery]"` plus a broker/result backend |
| FastAPI backend and WebSocket callbacks | `python -m pip install "dash[fastapi]"` |
| Quart backend | `python -m pip install "dash[quart]"` |
| `async def` callbacks on Flask | `python -m pip install "dash[async]"` |
| Component generation helpers | install Dash from a checkout with the development dependencies needed by the component package |

## Route by task

### Build or debug a Dash app

Use [sub-skills/app-callback-workflows/SKILL.md](sub-skills/app-callback-workflows/SKILL.md)
when the task mentions:

- `Dash(...)`, layout trees, `html`, `dcc`, `dash_table`, component IDs, assets,
  URL prefixes, Jupyter display, CSP hashes, or pages.
- `@app.callback`, `@dash.callback`, `Input`, `Output`, `State`, `MATCH`, `ALL`,
  `ALLSMALLER`, `ctx`, `callback_context`, `PreventUpdate`, `no_update`, or
  `Patch`.
- Clientside callbacks or `window.dash_clientside`.

Start with its [callbacks and layouts reference](sub-skills/app-callback-workflows/references/callbacks-and-layouts.md),
then use its smoke scripts for layout/callback/page checks.

### Select backends, async, WebSocket, background callbacks, hooks, or MCP

Use [sub-skills/server-backends-and-async/SKILL.md](sub-skills/server-backends-and-async/SKILL.md)
when the task mentions:

- Flask, FastAPI, Quart, ASGI, backend adapters, custom backends, or route
  handling.
- `async def` callbacks, `dash[async]`, `websocket_callbacks`, `websocket=True`,
  `persistent=True`, `ctx.websocket`, `set_props`, or WebSocket disconnects.
- `background=True`, `DiskcacheManager`, `CeleryManager`, `progress`, `running`,
  `cancel`, or callback caching.
- Dash hooks, WebSocket connection hooks, MCP resources/tools, or
  `configure_mcp_server`.

Run its [backend inspection script](sub-skills/server-backends-and-async/scripts/inspect_backends.py)
for a safe optional-extra report before promising backend coverage.

### Work on custom components, built-in components, resources, or renderer

Use [sub-skills/component-renderer-development/SKILL.md](sub-skills/component-renderer-development/SKILL.md)
when the task mentions:

- `dash-generate-components`, `dash-update-components`, `renderer`, component
  metadata, generated Python wrappers, R/Julia wrapper generation, or built-in
  component packages.
- `Component`, `to_plotly_json`, `_children_props`, `_js_dist`, `_css_dist`,
  `serve_locally`, `external_url`, `dev_package_path`, or resource fingerprints.
- `dash-renderer`, callback queues, `setProps`, `crawlLayout`, `paths`,
  `window.dash_component_api`, SharedWorker/WebSocket client, React versions, or
  JSX runtime problems.

Use its CLI-check scripts before running heavier Node or component builds.

### Choose tests, build/lint commands, or repo-maintenance workflow

Use [sub-skills/testing-and-maintenance/SKILL.md](sub-skills/testing-and-maintenance/SKILL.md)
when the task mentions:

- `pytest`, `dash_duo`, Selenium, ChromeDriver, Percy, renderer tests, component
  tests, `npm run build`, `npm run lint`, Black/flake8/pylint/eslint/prettier,
  or contribution policy.
- A patch to Dash source where you need a focused native test plan.

Follow its rule: never run all integration tests by default. Use focused files
and preserve enough output to see tracebacks and assertion context.

## Important boundaries

- Do not claim FastAPI, Quart, Diskcache, Celery, browser, renderer, or component
  build workflows are available until the relevant extra/tool/service is
  installed and checked.
- Do not use a CPU import check as proof of browser, Node, Celery broker, or
  WebSocket runtime behavior.
- For package-use tasks, prefer public APIs and bundled references/scripts in
  this skill. For repo-maintenance tasks, the testing sub-skill may tell you how
  to run focused commands in a current Dash checkout.
- If the current checkout commit, generated component wrapper state, or package
  version differs from [references/repo-provenance.md](references/repo-provenance.md),
  treat this skill as potentially stale and refresh it before relying on
  maintainer-specific details.