Last updated Aug 26, 2025

Dashboard UI bridge (EAP)

Forge's EAP offers experimental features to selected users for testing and feedback purposes. These features are unsupported and not recommended for use in production environments. They are also subject to change without notice. For more details, see Forge EAP, Preview, and GA.

To participate, you can sign up for the EAP here.

Note: You must also opt-in to the open beta of Dashboards in Atlassian Home. See the guide on how to opt-in.

The Dashboard UI bridge is a JavaScript API that enables Forge dashboard widgets to securely integrate with dashboards in Atlassian Home.

Install the Dashboard UI bridge using the @forge/dashboards-bridge npm package. Import @forge/dashboards-bridge using a bundler, such as Webpack.

You can start by creating a new app from one of the Custom UI templates. In the static/hello-world directory, run npm install && npm build to bundle the static web application template with the Dashboard UI bridge into the static/hello-world/build directory. Use this directory as the resource path in the Forge app's manifest.yml.

In the template, use the bridge in static/hello-world/src/View.js like this:

1
2
import { widget } from "@forge/dashboards-bridge";

// Set preview configuration for widget picker
widget.setPreviewConfig({
  title: "My Widget Preview",
  description: "Preview description",
});

For widget edit functionality, use the bridge in static/hello-world-edit/src/Edit.js like this:

1
2
import { widgetEdit } from "@forge/dashboards-bridge";

// Handle save events
widgetEdit.onSave(async (config, { widgetId }) => {
  console.log("Widget saved!", config, widgetId);
});

// Handle product save events
widgetEdit.onProductSave(async (config) => {
  return config; // Return config to save in product
});