fix(chart/data): handle QueryObjectValidationError in _get_data_response

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
chore(deps-dev): bump the typescript-eslint group across 1 directory with 2 updates (#43038 )
2026-08-12 11:11:01 +00:00 · 2026-08-12 00:26:23 +00:00 · 2026-08-11 16:28:52 -07:00 · 2026-08-11 16:28:48 -07:00 · 2026-08-11 16:07:58 -07:00 · 2026-08-11 16:06:26 -07:00
360 changed files with 44983 additions and 14208 deletions
@@ -201,18 +201,23 @@ cypress-run-all() {
  # navigation flow under E2E. We diverge from the entrypoint on:
  #   --timeout 120: heavy dashboard import/export specs exceed the 60s
  #     default
-  #   --max-requests / --max-requests-jitter: recycle the worker under
-  #     test load to avoid leaks accumulating across the run
  #   superset.app:create_app(): explicit factory so we don't depend on
  #     FLASK_APP being exported
+  #
+  # No --max-requests, matching the entrypoint's default of 0 (recycling
+  # off). With a single worker a recycle takes the whole backend offline for
+  # the graceful-timeout drain — browser keep-alive connections hold it open
+  # for the full 30s — plus ~5s of app boot. A run issues ~3800 requests in
+  # ~8 minutes, so recycling every 500 produced seven ~35s outages per run
+  # and flaked whichever specs happened to navigate into one. Lowering
+  # --graceful-timeout is not enough: a dashboard load plus chart render
+  # needs 6-10s, which still lands inside the window.
  nohup gunicorn \
    --bind "127.0.0.1:$port" \
    --workers 1 \
    --worker-class gthread \
    --threads 20 \
    --timeout 120 \
-    --max-requests 500 \
-    --max-requests-jitter 50 \
    --access-logfile - \
    --error-logfile - \
    "superset.app:create_app()" \
@@ -294,16 +299,14 @@ playwright-run() {
  export PLAYWRIGHT_BASE_URL

  # See cypress-run-all() above for the args rationale (1 worker × 20
-  # gthread threads matching docker/entrypoints/run-server.sh, plus a
-  # 120s timeout and request-recycling for heavy E2E load).
+  # gthread threads matching docker/entrypoints/run-server.sh, a 120s
+  # timeout for heavy E2E load, and why worker recycling is off).
  nohup gunicorn \
    --bind "127.0.0.1:$port" \
    --workers 1 \
    --worker-class gthread \
    --threads 20 \
    --timeout 120 \
-    --max-requests 500 \
-    --max-requests-jitter 50 \
    --access-logfile - \
    --error-logfile - \
    "superset.app:create_app()" \
@@ -22,7 +22,7 @@ jobs:
  check-python-deps:
    runs-on: ubuntu-26.04
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -64,7 +64,7 @@ jobs:

      # Initializes the CodeQL tools for scanning.
      - name: Initialize CodeQL
-        uses: github/codeql-action/init@f205ea1c3313d32999d8d6a48b4f6530d4437b38 # v4.37.4
+        uses: github/codeql-action/init@5595ccaf912efad79be6eef63a5619ff05969be3 # v4.37.6
        with:
          languages: ${{ matrix.language }}
          # If you wish to specify custom queries, you can do so here or in a config file.
@@ -75,6 +75,6 @@ jobs:
          # queries: security-extended,security-and-quality

      - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@f205ea1c3313d32999d8d6a48b4f6530d4437b38 # v4.37.4
+        uses: github/codeql-action/analyze@5595ccaf912efad79be6eef63a5619ff05969be3 # v4.37.6
        with:
          category: "/language:${{matrix.language}}"
@@ -50,7 +50,7 @@ jobs:
    # You cannot use a liccheck.ini file in this workflow.
    runs-on: ubuntu-slim
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -221,6 +221,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -37,7 +37,7 @@ jobs:
          persist-credentials: false
          submodules: recursive
      - name: Setup Java
-        uses: actions/setup-java@03ad4de0992f5dab5e18fcb136590ce7c4a0ac95 # v5.6.0
+        uses: actions/setup-java@b6effb05e454b25005698d916606bdc6ffcbf961 # v5.7.0
        with:
          distribution: "temurin"
          java-version: "11"
@@ -46,4 +46,4 @@ jobs:
        run: bash .github/workflows/github-action-validator.sh

      - name: Check for security issues on GHA workflows
-        uses: zizmorcore/zizmor-action@6fc4b006235f201fdab3722e17240ab420d580e5 # v0.6.1
+        uses: zizmorcore/zizmor-action@3dc1ecc9bcb9e94e9b2c709687979e1298497054 # v0.6.2
@@ -23,7 +23,7 @@ jobs:
          persist-credentials: false
          submodules: recursive
      - name: Setup Java
-        uses: actions/setup-java@03ad4de0992f5dab5e18fcb136590ce7c4a0ac95 # v5.6.0
+        uses: actions/setup-java@b6effb05e454b25005698d916606bdc6ffcbf961 # v5.7.0
        with:
          distribution: "temurin"
          java-version: "11"
@@ -195,6 +195,6 @@ jobs:
    if: always()
    runs-on: ubuntu-26.04
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -108,8 +108,18 @@ jobs:
          fetch-depth: 0
          persist-credentials: false

+      # Keep workflow tooling on the triggering revision. Release tags can
+      # contain action pins that no longer satisfy the repository allowlist.
+      - name: Checkout workflow actions
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          ref: ${{ github.sha }}
+          path: workflow-source
+          persist-credentials: false
+          sparse-checkout: .github/actions
+
      - name: Setup Docker Environment
-        uses: ./.github/actions/setup-docker
+        uses: ./workflow-source/.github/actions/setup-docker
        with:
          dockerhub-user: ${{ secrets.DOCKERHUB_USER }}
          dockerhub-token: ${{ secrets.DOCKERHUB_TOKEN }}
@@ -122,7 +132,7 @@ jobs:
          node-version: 20

      - name: Setup supersetbot
-        uses: ./.github/actions/setup-supersetbot/
+        uses: ./workflow-source/.github/actions/setup-supersetbot/

      - name: Rebuild and push
        env:
@@ -171,7 +181,7 @@ jobs:
            --repo "$REPOSITORY" \
            --title "Scheduled Docker image refresh failed for ${LATEST_RELEASE}" \
            --label "infra:container" \
-            --label "bug" \
+            --label "#bug" \
            --body "The weekly Docker base-image refresh failed for release \`${LATEST_RELEASE}\`. Published images may be missing upstream base-layer security patches until this is resolved.

          Failed run: ${RUN_URL}"
@@ -41,7 +41,7 @@ jobs:
        ports:
          - 16379:6379
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -60,7 +60,7 @@ jobs:
    name: Build & Deploy
    runs-on: ubuntu-26.04
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -76,7 +76,7 @@ jobs:
          node-version-file: "./docs/.nvmrc"
      - name: Setup Python
        uses: ./.github/actions/setup-backend/
-      - uses: actions/setup-java@03ad4de0992f5dab5e18fcb136590ce7c4a0ac95 # v5.6.0
+      - uses: actions/setup-java@b6effb05e454b25005698d916606bdc6ffcbf961 # v5.7.0
        with:
          distribution: "zulu"
          java-version: "21"
@@ -355,6 +355,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -76,6 +76,6 @@ jobs:
    if: always()
    runs-on: ubuntu-26.04
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -182,11 +182,6 @@ jobs:
          docker run --rm $TAG bash -c \
          "npm ls --all --package-lock-only --depth=0 --json > /dev/null"

-      - name: Build Plugins Packages
-        run: |
-          docker run --rm $TAG bash -c \
-          "npm run plugins:build"
-
  test-storybook:
    needs: frontend-build
    if: needs.frontend-build.outputs.should-run == 'true'
@@ -214,6 +209,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -22,7 +22,7 @@ jobs:
  lint-test:
    runs-on: ubuntu-slim
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -178,6 +178,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -263,6 +263,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -166,6 +166,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -105,7 +105,7 @@ jobs:
      contents: read
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true

@@ -161,6 +161,6 @@ jobs:
    permissions:
      actions: read
    steps:
-      - uses: Kesin11/actions-timeline@7bf79990b7c09f5dfb570ac30b814ca597bd538e # v3.1.1
+      - uses: Kesin11/actions-timeline@57fc93f20c6da7fbc14063c6d24a2a5627c799ad # v3.2.0
        with:
          expand-composite-actions: true
@@ -24,6 +24,36 @@ assists people when migrating to a new version.

 ## Next

+- [42935](https://github.com/apache/superset/pull/42935): The MCP service now refuses to start (`MCPAuthConfigError`) when `MCP_JWT_ISSUER` trusts more than one issuer and no `MCP_USER_RESOLVER` is configured, instead of only logging a warning. This was already a documented misconfiguration (the default resolver isn't issuer-scoped, so distinct trusted issuers minting the same username/email would resolve to the same Superset user); deployments trusting multiple issuers must configure an `MCP_USER_RESOLVER` that derives its identity from the token's `iss` claim before upgrading. Single-issuer deployments are unaffected.
+- [42393](https://github.com/apache/superset/pull/42393): Exported dataset YAML now carries a `uuid` for each metric and column so that custom folder assignments (which reference metrics/columns by UUID) survive an import into another workspace. This affects any export bundle that contains datasets, not just a dataset export: chart, dashboard, database and full-asset exports all embed the same dataset YAML, so a dashboard exported from this release also fails to import into an older one even though no dataset was exported directly. As with `folders` and `currency_code_column`, the affected `datasets/` files fail schema validation (`Unknown field: uuid`) when imported into Superset releases that predate this change; regenerate or hand-edit exports for older targets in mixed-version fleets.
+- [42087](https://github.com/apache/superset/pull/42087): Stored calculated-column and metric expressions are validated when a query is built, under the same sub-query policy already applied to adhoc expressions. Previously only the dataset update path checked them on save, so expressions written by v1 import, by dataset duplication, or before that check existed were never validated. Since `ALLOW_ADHOC_SUBQUERY` defaults to `False` (see [19242](https://github.com/apache/superset/pull/19242)), a dataset whose stored expression contains a sub-query works before upgrading and afterwards fails at chart render with `Custom SQL fields cannot contain sub-queries.` There is no migration step, and the error does not name the offending dataset column, so audit stored expressions before upgrading: either rewrite them without the sub-query, or set `ALLOW_ADHOC_SUBQUERY = True` to keep the previous behaviour for both stored and adhoc expressions.
+
+### Selenium support removed — Playwright is now required for screenshots
+
+Selenium support has been removed. **Playwright is now required** for all
+report and thumbnail screenshot generation. Install it with:
+
+```bash
+pip install playwright && playwright install chromium
+```
+
+**Breaking config changes:**
+
+- `PLAYWRIGHT_REPORTS_AND_THUMBNAILS` feature flag removed (Playwright is the only backend now)
+- `WEBDRIVER_TYPE` config key removed (Playwright always uses Chromium)
+- `WEBDRIVER_CONFIGURATION` config key removed (Selenium-only)
+- `SCREENSHOT_PAGE_LOAD_WAIT` config key removed (Selenium-only)
+- `SCREENSHOT_SELENIUM_RETRIES` config key removed (Selenium-only)
+- `SCREENSHOT_WAIT_FOR_ERROR_MODAL_VISIBLE` config key removed (Selenium-only)
+- `SCREENSHOT_WAIT_FOR_ERROR_MODAL_INVISIBLE` config key removed (Selenium-only)
+- `MachineAuthProvider.authenticate_webdriver()` removed; use `authenticate_browser_context()` instead
+
+**What operators should do before upgrading:**
+
+1. Install Playwright: `pip install playwright && playwright install chromium`
+2. Remove any references to the removed config keys from custom `superset_config.py`
+3. If you subclassed `MachineAuthProvider`, remove any `authenticate_webdriver` override and migrate auth logic to `authenticate_browser_context`
+
 ### Soft delete is on by default, and purging is live

 `SOFT_DELETE` now ships **on** (`DEFAULT_FEATURE_FLAGS`), so deleting a
@@ -52,6 +82,33 @@ One caveat on turning soft delete back off: objects archived while it was on are
 **resurrected** into normal listings, since the rows were never removed — an
 emergency stop rather than a clean rollback.

+### Version history is on by default
+
+`VERSION_HISTORY` and `ENABLE_VERSIONING_CAPTURE` now both ship **on**. Every
+save of a chart, dashboard, or dataset writes version rows, and the version
+history panel appears on Explore and Dashboard pages. The two flip together
+deliberately: a panel with capture off renders an empty "No history yet" that
+misrepresents the entity as unchanged.
+
+**What operators should expect:**
+
+- **Storage growth.** Capture writes shadow rows per save, so the metadata
+  database grows with edit volume. The `version_history.prune_old_versions`
+  beat task removes rows whose transaction is older than
+  `SUPERSET_VERSION_HISTORY_RETENTION_DAYS` (default 30). A deployment that
+  replaces `CELERY_CONFIG` rather than inheriting it must carry both the
+  `superset.tasks.version_history_retention` import and the beat entry; a
+  startup warning names whichever is absent.
+- **`PUT` responses change shape.** Entity updates now return populated
+  `old_version_uuid` / `new_version_uuid` fields and an `ETag` header, which
+  were null or absent while capture was off.
+
+`ENABLE_VERSIONING_CAPTURE` is **retained permanently** as an operational
+kill-switch — not removed with the rollout toggles. Setting it to a falsy value
+stops capture within a restart, without a revert-and-redeploy. Unlike the
+soft-delete toggle, turning it off is a clean stop: existing version rows remain
+readable and no entity state is altered.
+
 ### Scheduled report execution now enforces one application deadline

 Scheduled report (not alert) executions are now governed by a single
@@ -80,6 +137,28 @@ Behavior changes to be aware of:
  if charts never mount. Thumbnails and non-report screenshots keep their
  previous behavior.

+### Embedded (guest token) API responses no longer echo database errors
+
+API responses served to a guest-token principal now carry a generic
+`An error occurred while fetching the data.` in place of the underlying error
+(`You don't have permission to access this resource.` on a 401/403), and drop
+the `stacktrace` and error `extra` payloads. Engine errors routinely quote
+catalog, schema, table and column names of the warehouse, which embedded
+viewers should not see. Errors Superset authors itself — access denials, OAuth2
+redirects, timeouts, payload validation — keep their message and type, though
+their `extra` is still reduced to the fields the client needs. Responses to
+every non-guest principal are unchanged, and the full error is still logged
+server-side.
+
+### `UnsavedChangesModal` no longer accepts a `zIndex` prop
+
+`@superset-ui/core`'s `UnsavedChangesModal` dropped its `zIndex` prop (and the
+hardcoded default it fed) in favor of letting Ant Design's own stacking
+handle placement. Callers passing `zIndex` to override the modal's layering
+will now get a TypeScript error and must remove the prop; keeping a manual
+override was exactly the footgun this change removes (see #42510). No
+callers in the Superset frontend codebase itself passed this prop.
+
 ### Principal listing APIs now honour related-field filters

 Two authorization-related listing behaviors changed for API clients. Neither
@@ -128,12 +207,24 @@ A new dashboard action exports every chart's data to a single multi-sheet
 requires a running Celery worker and a configured SMTP transport, since the task
 emails the requesting user a pre-signed download link. New config keys:
 `EXCEL_EXPORT_S3_BUCKET`, `EXCEL_EXPORT_S3_KEY_PREFIX`,
-`EXCEL_EXPORT_LINK_TTL_SECONDS`, `EXCEL_EXPORT_S3_CLIENT_KWARGS`, and
-`EXCEL_EXPORT_TABLE_VIZ_TYPES`.
+`EXCEL_EXPORT_LINK_TTL_SECONDS`, `EXCEL_EXPORT_S3_CLIENT_KWARGS`,
+`EXCEL_EXPORT_TABLE_VIZ_TYPES`, and `EXCEL_EXPORT_QUERY_CONTEXT_BUILDER`.

 The feature depends on `boto3`, which is **not** installed by default; install it
 with `pip install apache-superset[excel-export]`.

+Charts store their `query_context` only once they have been (re-)saved in
+Explore, so older charts may have none. For a fixed, conservative set of viz
+types (`table`, `big_number_total`, `big_number`, `pie`) the export rebuilds a
+query context from the chart's saved form data so those charts still export.
+The rebuild is a single-query mapping and does **not** reproduce plugin
+post-processing (pivot, rolling, forecast) or multi-query charts, so any chart of
+another type without a saved query context is skipped and listed in the email for
+the user to re-save. To cover those types, set `EXCEL_EXPORT_QUERY_CONTEXT_BUILDER`
+to a callable that receives the chart's form data and returns a query-context
+payload (or `None` to fall back to the built-in rebuild) — for example one backed
+by a service that runs the chart's real frontend `buildQuery`.
+
 A second mode, **Export Images to Excel**, embeds non-table charts as rendered
 images (which viz types stay tabular is controlled by
 `EXCEL_EXPORT_TABLE_VIZ_TYPES`). It renders through the headless webdriver, so the
@@ -481,7 +572,7 @@ Entity version history (the `version_transaction` / `*_version` shadow tables th
 |---|---|---|
 | `SUPERSET_VERSION_HISTORY_RETENTION_DAYS` | `30` | Version rows whose owning `version_transaction.issued_at` is older than this many days are pruned. Each entity's live row (`end_transaction_id IS NULL`) is always preserved, as are the live rows of its children and associations; closed historical rows (including the baseline) age out. Set to `0` or a negative value to disable pruning. |

-The task ships in the default `CeleryConfig` (both the `superset.tasks.version_history_retention` import and the beat entry). A deployment that overrides `CELERY_CONFIG` without the beat entry logs a startup warning. When the override explicitly defines `imports`, a missing retention module is also reported; an absent `imports` setting is not diagnosed because Celery may register tasks through `include`, autodiscovery, or worker startup imports. Retention only prunes whatever history exists — capture itself is gated separately by `ENABLE_VERSIONING_CAPTURE` (ships off).
+The task ships in the default `CeleryConfig` (both the `superset.tasks.version_history_retention` import and the beat entry). A deployment that overrides `CELERY_CONFIG` without the beat entry logs a startup warning. When the override explicitly defines `imports`, a missing retention module is also reported; an absent `imports` setting is not diagnosed because Celery may register tasks through `include`, autodiscovery, or worker startup imports. Retention only prunes whatever history exists — capture itself is gated separately by `ENABLE_VERSIONING_CAPTURE`, which now ships on.

 ### Deletion retention (soft-deleted entities are eventually purged)

@@ -491,7 +582,7 @@ Purging is **live by default** (`SOFT_DELETE_PURGE_DRY_RUN=False`), so the reten

 Deployments that replace the default `CELERY_CONFIG` must ensure workers register `superset.tasks.deletion_retention` and schedule the `deletion_retention.purge_soft_deleted` task themselves. The shipped Docker development config uses `imports` and includes both entries. While `SOFT_DELETE` is statically enabled, a missing beat entry logs a startup warning; when the override explicitly defines `imports`, a missing purge module is also reported.

-Operators can immediately erase a specific entity for compliance (GDPR) via `superset deletion-retention force-purge --uuid <uuid>`; this applies legacy hard-delete semantics — a live chart referencing a force-purged dataset is left without a datasource until re-pointed (the chart is not modified), and it purges the named entity even when it was never soft-deleted. Every purge writes an immutable, content-free audit record to the new `purge_audit_log` table that survives the entity it names: the **scheduled** purge fails closed (an entity whose audit row cannot be written is skipped and retried next run), while **force-purge** proceeds even if the audit write fails — the operator is present and deletion outranks audit for a compliance erasure.
+Operators can immediately erase a specific entity for compliance (GDPR) via `superset deletion-retention force-purge --uuid <uuid>`; this applies legacy hard-delete semantics — a live chart referencing a force-purged dataset is left without a datasource until re-pointed (the chart is not modified), and it purges the named entity even when it was never soft-deleted. Every scheduled evaluation writes a provisional, content-free record to the new `purge_audit_log` table before the cascade starts. Meaningful retained outcomes survive the entity they name. Consecutive scheduled evaluations with the same blocked outcome suppress only the redundant current provisional record; completed outcomes, outcome transitions, and every force-purge attempt remain independent and immutable. The **scheduled** purge fails closed when its provisional record cannot be written, while **force-purge** proceeds even if the audit write fails — the operator is present and deletion outranks audit for a compliance erasure. Operators can monitor `deletion_retention.blocked_audit_suppressed` and `deletion_retention.blocked_audit_dedupe_fallback` to verify suppression and fail-safe fallback behavior without changing the existing blocked-workload gauge.

 ### Recently Archived view and permanent delete (purge) endpoints

@@ -28,6 +28,7 @@ Alerts and reports are disabled by default. To turn them on, you'll need to chan
 - Users can customize the email subject by including date code placeholders, which will automatically be replaced with the corresponding UTC date when the email is sent. To enable this functionality, activate the `"DATE_FORMAT_IN_EMAIL_SUBJECT"` [feature flag](/admin-docs/configuration/configuring-superset#feature-flags). This enables date formatting in email subjects, preventing all reporting emails from being grouped into the same thread (optional for the reporting feature).
  - Use date codes from [strftime.org](https://strftime.org/) to create the email subject.
  - If no date code is provided, the original string will be used as the email subject.
+- Each alert/report has an "Include a link back to Superset" option (enabled by default) controlling whether the call-to-action link is included in email and Slack notifications. The link text in emails is configurable via `EMAIL_REPORTS_CTA`; the Slack message always uses "Explore in Superset". Uncheck the option when recipients should not receive a link to your Superset host, e.g. for external audiences.

 ##### Disable dry-run mode

@@ -174,6 +175,16 @@ ALERT_REPORTS_WEBHOOK_HTTPS_ONLY = True

 When enabled, Superset rejects webhook configurations that use `http://` URLs.

+#### Request Timeout
+
+Webhook deliveries use a socket timeout so a request can't hang forever if the webhook target is unreachable, which would otherwise leave the report schedule stuck in a `WORKING` state. Configure it with:
+
+```python
+ALERT_REPORTS_WEBHOOK_TIMEOUT = 60  # seconds
+```
+
+Set to `None` to disable the timeout (not recommended).
+
 #### Retry Behavior

 Superset automatically retries webhook deliveries on `429 Too Many Requests` and `5xx` server errors using exponential backoff. Retries are bounded to roughly 120 seconds of cumulative wall-clock time (worst case ~210 seconds, because the bound is checked against the time elapsed before each attempt, so the final request can begin just under the limit and still run its full request timeout), after which the delivery is abandoned.
@@ -54,8 +54,8 @@ celery --app=superset.tasks.celery_app:app beat

 To setup a result backend, you need to pass an instance of a derivative of `BaseCache` (`from
 flask_caching.backends.base import BaseCache`) to the RESULTS_BACKEND configuration key in your
-superset_config.py. You can use Memcached, Redis, S3 (https://pypi.python.org/pypi/s3werkzeugcache),
-memory or the file system (in a single server-type setup or for testing), or to write your own
+superset_config.py. You can use Memcached, Redis, S3, MinIO, memory
+or the file system (in a single server-type setup or for testing), or to write your own
 caching interface. Your `superset_config.py` may look something like:

 ```python
@@ -89,6 +89,12 @@ issues arise. Please clear your existing results cache store when upgrading an e
 - SQL Lab will _only run your queries asynchronously if_ you enable **Asynchronous Query Execution**
  in your database settings (Sources > Databases > Edit record).

+- In order to use dedicated results backend, additional python libraries must be installed. These libraries can be installed using pip.
+  - [redis-py](https://pypi.org/project/redis/) for Redis.
+  - [pylibmc](https://pypi.org/project/pylibmc/) for memcached
+  - [s3werkzeugcache](https://pypi.python.org/pypi/s3werkzeugcache) for S3
+  - [minio-flask-cache](https://github.com/greggailly/minio-flask-cache) for MinIO or other S3 compatible service
+
 ## Celery Flower

 Flower is a web based tool for monitoring the Celery cluster which you can install from pip:
@@ -15,9 +15,8 @@ fail-fast behavior ensures operators are immediately aware of infrastructure iss

 Superset uses [Flask-Caching](https://flask-caching.readthedocs.io/) for caching purposes.
 Flask-Caching supports various caching backends, including Redis (recommended), Memcached,
-SimpleCache (in-memory), or the local filesystem.
-[Custom cache backends](https://flask-caching.readthedocs.io/en/latest/#custom-cache-backends)
-are also supported.
+SimpleCache (in-memory), MinIO/S3, or the local filesystem.
+[Custom cache backends](https://flask-caching.readthedocs.io/en/latest/#custom-cache-backends) are also supported.

 Caching can be configured by providing dictionaries in
 `superset_config.py` that comply with [the Flask-Caching config specifications](https://flask-caching.readthedocs.io/en/latest/#configuring-flask-caching).
@@ -47,6 +46,7 @@ In order to use dedicated cache stores, additional python libraries must be inst
 - For Redis: we recommend the [redis](https://pypi.python.org/pypi/redis) Python package
 - Memcached: we recommend using [pylibmc](https://pypi.org/project/pylibmc/) client library as
  `python-memcached` does not handle storing binary data correctly.
+- MinIO (S3): we recommend using the [minio-flask-cache](https://github.com/greggailly/minio-flask-cache) package

 These libraries can be installed using pip.

@@ -134,6 +134,50 @@ CELERY_CONFIG = CustomCeleryConfig
 This will cache the top 5 most popular dashboards every hour. For other
 strategies, check the `superset/tasks/cache.py` file.

+### Warming Up Native Filter Options
+
+Native filter Value-type dropdown option queries (e.g. `SELECT DISTINCT column FROM table`) are
+cached the same way as chart data, via `DATA_CACHE_CONFIG`. However, the strategies above only warm
+up chart render queries, so the first user to open a dashboard's filter dropdown after a cache entry
+expires still triggers a fresh database query.
+
+The `native_filter_options` strategy pre-populates the cache for these dropdown queries. It reads
+each dashboard's `native_filter_configuration`, builds the same `filter_select` chart-data query the
+frontend would send, and executes it as the configured `SUPERSET_CACHE_WARMUP_USER`:
+
+```python
+class CustomCeleryConfig(CeleryConfig):
+    beat_schedule = {
+        **CeleryConfig.beat_schedule,
+        'cache-warmup-native-filters': {
+            'task': 'cache-warmup',
+            'schedule': crontab(minute=0, hour=3),  # daily at 03:00
+            'kwargs': {
+                'strategy_name': 'native_filter_options',
+                'dashboard_ids': [1, 2, 3],
+            },
+        },
+    }
+```
+
+Requirements and limitations:
+
+- `SUPERSET_CACHE_WARMUP_USER` must be set to a user with access to the dashboards and datasets
+  referenced by the native filters.
+- `DATA_CACHE_CONFIG` must use a backend that actually persists entries (Redis recommended); the
+  default `NullCache` discards writes, so warming has nothing to warm. The effective timeout also
+  needs to be positive — `NATIVE_FILTER_OPTIONS_CACHE_TIMEOUT = -1` disables cache writes for these
+  queries entirely, even with a working backend.
+- Schedule the warm-up at least as often as the effective native filter cache timeout (whichever of
+  `NATIVE_FILTER_OPTIONS_CACHE_TIMEOUT`, the chart/dataset/database timeout, or `DATA_CACHE_CONFIG`'s
+  default applies). A looser schedule still leaves a window of cold, unwarmed queries between expiry
+  and the next run — the daily example above assumes a TTL of a day or more.
+- Cache entries are warmed under the warm-up user's own cache partition, the same entry that user
+  would create by opening the filter dropdown manually. Users with a different role set or row-level
+  security context may still see a cache miss on first load.
+- Cascading/dependent native filters and search-term variants of filter option queries are not
+  warmed by this strategy.
+
 ## Caching Thumbnails

 This is an optional feature that can be turned on by activating its [feature flag](/admin-docs/configuration/configuring-superset#feature-flags) on config:
@@ -301,6 +345,24 @@ DISTRIBUTED_COORDINATION_CONFIG = {
 }
 ```

+By default, connections opened for `DISTRIBUTED_COORDINATION_CONFIG` (as well as
+`GLOBAL_ASYNC_QUERIES_CACHE_BACKEND`, which uses the same `RedisCache`/`RedisSentinelCache`
+backend) have no socket timeout. This can be overridden with `CACHE_REDIS_SOCKET_TIMEOUT` and
+`CACHE_REDIS_SOCKET_CONNECT_TIMEOUT`, both in seconds:
+
+```python
+DISTRIBUTED_COORDINATION_CONFIG = {
+    "CACHE_TYPE": "RedisCache",
+    "CACHE_REDIS_HOST": "localhost",
+    "CACHE_REDIS_PORT": 6379,
+    "CACHE_REDIS_SOCKET_TIMEOUT": 5,  # seconds
+    "CACHE_REDIS_SOCKET_CONNECT_TIMEOUT": 5,  # seconds
+}
+```
+
+These apply to `RedisSentinelCache` connections as well, covering both the sentinel-node
+connections and the resolved master connection.
+
 ### Distributed Lock TTL

 You can configure the default lock TTL (time-to-live) in seconds. Locks automatically expire after
@@ -307,6 +307,22 @@ to simplify the process of setting up a non-default root path across the service
 In `docker/.env-local` set `SUPERSET_APP_ROOT` to the desired prefix and then bring the
 services up with `docker compose up --detach`.

+### Swagger UI
+
+By default, Superset's Swagger UI and OpenAPI spec (enabled via `FAB_API_SWAGGER_UI`) are
+served by Flask-AppBuilder and don't account for a non-root `APPLICATION_ROOT` prefix. If
+you're running Superset behind a URL prefix and want the Swagger UI and OpenAPI spec to
+resolve correctly, set:
+
+```python
+FAB_API_SWAGGER_UI_SUPERSET_APP_ROOT = True
+```
+
+in your `superset_config.py` file. This serves an `APPLICATION_ROOT`-aware Swagger UI and
+OpenAPI spec at `/swagger/<version>` and `/api/<version>/_openapi` respectively, resolved
+through the configured prefix. This flag only takes effect when `FAB_API_SWAGGER_UI` is
+also enabled, and defaults to `False`.
+
 ## Custom OAuth2 Configuration

 Superset is built on Flask-AppBuilder (FAB), which supports many providers out of the box
@@ -315,6 +315,76 @@ Here's a concrete example:
  WHERE country_code = 'US'
  ```

+**Guest User Attributes**
+
+The `{{ get_guest_user_attribute('attribute_name') }}` macro returns a specific attribute value from the guest user context.
+This is useful when working with embedded Superset where guest tokens can contain custom attributes that need to be
+accessed in SQL queries.
+
+This macro only works when the current user is a guest user (authenticated via guest token). If the current user is
+not a guest user, or if the specified attribute doesn't exist, the macro will return `None` or the provided default value.
+
+If you have caching enabled in your Superset configuration, then by default the resolved value (whether it
+came from the guest token, a null attribute, or the provided default) will be used by Superset when
+calculating the cache key. A cache key is a unique identifier that determines if there's a cache hit in the
+future and Superset can retrieve cached data. Including the resolved value on every branch ensures two guests
+whose tokens render different SQL never share a cache entry.
+
+You can disable the inclusion of the attribute value in the calculation of the
+cache key by adding the following parameter to your Jinja code, but only do so
+when the value cannot affect the query results:
+
+```
+{{ get_guest_user_attribute('department', add_to_cache_keys=False) }}
+```
+
+You can also provide a default value if the attribute is not found:
+
+```
+{{ get_guest_user_attribute('region', default='US') }}
+```
+
+Here's a concrete example of using guest user attributes in a query:
+
+```sql
+SELECT *
+FROM sales_data
+WHERE region = '{{ get_guest_user_attribute("user_region", default="global") }}'
+  AND department = '{{ get_guest_user_attribute("department") }}'
+```
+
+:::warning[Security Warning]
+
+Guest token attributes come from the embedding application. By default,
+`get_guest_user_attribute()` escapes string values — including strings nested inside
+arrays and object values, and caller-supplied defaults — through the database dialect's
+literal rendering (the same mechanism as `url_param()`). This covers dialect-specific
+escape characters such as the backslash on MySQL/MariaDB, so the example above is safe
+to interpolate directly. If you pass `escape_result=False`, or interpolate non-string
+values (numbers, booleans), you are responsible for validating or allowlisting the
+values, since they originate outside Superset.
+
+If a guest attribute is an array and you plan to pipe it through the `|where_in` filter
+(for example `full_name IN {{ get_guest_user_attribute('names')|where_in }}`), call
+`get_guest_user_attribute('names', escape_result=False)`. `where_in` already applies its
+own dialect-safe quoting, so escaping the values twice can corrupt them (a value such as
+`O'Brien` would come back doubly escaped and match nothing).
+
+Only individual string values are escaped as SQL literals. Interpolating an entire array
+or object directly (rather than through `|where_in`, or by accessing a specific element)
+renders Python's string form of that structure, which is not valid SQL, and object keys
+are not escaped at all. Use `|where_in` for arrays, `|tojson` where you need a
+JSON-stringified value, or read individual keys/elements out of the structure yourself.
+
+The same double-escaping problem described above for `|where_in` applies to `|tojson`:
+pass `escape_result=False` before piping to `|tojson` (for example
+`{{ get_guest_user_attribute('profile', escape_result=False)|tojson }}`), since JSON
+already handles its own quoting and re-escaping a value first would corrupt it (a nested
+string such as `O'Brien` would come back as the altered `O''Brien` in the serialized
+JSON).
+
+:::
+
 ### Explicitly Including Values in Cache Key

 The `{{ cache_key_wrapper() }}` function explicitly instructs Superset to add a value to the
@@ -198,6 +198,51 @@ Available per-entity overrides are:
 When an override is set, it replaces `SUBJECTS_RELATED_TYPES` for that picker. When it is `None`,
 the picker inherits the global default.

+#### Looking Up Subjects via API
+
+Superset exposes a read-only REST API for resolving subjects:
+
+```
+GET /api/v1/security/subject/
+```
+
+The main use case is **id mapping** — given a user, role, or group id, callers (including
+extensions) can look up the corresponding subject entity, and vice versa. Access is gated by
+the `can_read` permission on the `Subject` resource, which is granted to **Admins only** by
+default, since subjects enumerate every user, role, and group on the instance. Callers without
+that permission receive a `403`. Only `GET` (list, get, info) is exposed — there is no create,
+update, or delete, because subjects are derived automatically from users, roles, and groups and
+kept in sync internally.
+
+**Resolve the subject for a given principal id** using [Rison](https://github.com/Nanonid/rison)
+query syntax:
+
+```
+GET /api/v1/security/subject/?q=(filters:!((col:user_id,opr:eq,value:5)))
+GET /api/v1/security/subject/?q=(filters:!((col:role_id,opr:eq,value:3)))
+GET /api/v1/security/subject/?q=(filters:!((col:group_id,opr:eq,value:2)))
+```
+
+**Filter by subject type or active status:**
+
+```
+GET /api/v1/security/subject/?q=(filters:!((col:type,opr:eq,value:1)))
+GET /api/v1/security/subject/?q=(filters:!((col:active,opr:eq,value:!t)))
+```
+
+The `type` column is an integer enum: `1` for User, `2` for Role, `3` for Group
+(`superset.subjects.types.SubjectType`).
+
+**Search by label:**
+
+```
+GET /api/v1/security/subject/?q=(filters:!((col:label,opr:subject_all_text,value:finance)))
+```
+
+Each subject in the response includes flat scalar ids (`user_id`, `role_id`, `group_id`) rather
+than a nested object, so callers can match directly on whichever id they already have — only the
+id field matching the subject's `type` is populated; the others are `null`.
+
 ### Dashboard Access Control

 Access to dashboards is managed via editors (subjects that have edit permissions to the dashboard).
@@ -277,6 +277,22 @@ second etc). Example:
 }
 ```

+## How do I expand all chart descriptions on a dashboard by default?
+
+Charts can have a markdown description, set in the chart's **Edit chart properties** dialog, that's
+hidden by default and toggled on a per-chart basis from the chart's context menu on a dashboard. If
+you'd rather have every chart's description expanded by default when the dashboard loads, add the
+`expand_all_slices` key to the dashboard JSON Metadata field:
+
+```json
+{
+  "expand_all_slices": true
+}
+```
+
+Charts that have already been manually expanded or collapsed on the dashboard keep that per-chart
+override (tracked in the `expanded_slices` key) regardless of the `expand_all_slices` setting.
+
 ## Does Superset work with [insert database engine here]?

 The [Connecting to Databases section](/user-docs/databases/) provides the best
@@ -165,6 +165,31 @@ You can also certify metrics if you'd like for your team in this view.
 - [Blog: Unlocking the Power of Virtual Datasets](https://preset.io/blog/unlocking-the-power-of-virtual-datasets-in-apache-superset/)
  :::

+### Native filters on semantic views
+
+When the `SEMANTIC_LAYERS` feature flag is enabled, Superset can connect to external semantic layers
+(such as dbt Semantic Layer or Cube) and expose their semantic views as data sources alongside your
+regular Datasets. Semantic views can be used as filter targets when adding a native (dashboard) filter,
+the same way a Dataset can.
+
+To add a filter on a semantic view:
+
+1. Open the dashboard, click the **⋮** (more options) menu, and select **Edit dashboard**.
+2. Open the Filter Bar and click **+ Add/Edit Filters**.
+3. Add a new filter and, in the datasource dropdown, select a semantic view. Semantic views are listed
+   alongside datasets and can be identified by their type.
+4. Select one of the semantic view's dimensions in the **Column** field, the same way you'd select a
+   column on a dataset.
+5. Configure the remaining filter options (filter type, default value, scope, etc.) and click **Save**.
+
+Any chart on the dashboard that's powered by the same semantic view is filtered by the selected
+dimension when the filter is applied.
+
+:::note
+Semantic views and native filter support for them are part of the experimental Semantic Layers
+feature and require the `SEMANTIC_LAYERS` feature flag to be enabled.
+:::
+
 ### Creating charts in Explore view

 Superset has 2 main interfaces for exploring data:
@@ -303,6 +328,10 @@ Conditional formatting rules highlight cells based on their values. Rules can be

 Each rule has a **"Use gradient"** toggle: enabled applies a varying opacity (lighter = further from threshold), disabled applies a solid fill at full opacity regardless of value.

+Each rule's color is set with a full color picker rather than a fixed dropdown of presets. Pick any custom color, or use the **Colors** preset swatches, which reference theme tokens (success, warning, error, and their background variants) so a rule's color updates automatically if the active theme changes, including switching between light and dark mode.
+
+When a rule targets a column with an active time comparison, a **Trend colors** preset also appears, letting you color cells green for an increase and red for a decrease (or the reverse).
+
 #### HTML Rendering in Table Cells

 Table chart cells can render raw HTML, enabling rich formatting such as hyperlinks, colored badges, and icons directly in the data. Enable this per-column in the chart's **Column Configuration** panel by toggling **Render HTML**.
@@ -129,3 +129,4 @@ The following URL parameters can be passed through the `urlParams` option in `da
 - **Guest tokens expire** — their lifetime is controlled by the `GUEST_TOKEN_JWT_EXP_SECONDS` config (default: 5 minutes). Refresh tokens before they expire using a token refresh mechanism in your host app.
 - **Row-level security** — pass `rls` rules in the guest token request to restrict which rows are visible to the embedded user.
 - **Allowed domains** — restrict which host origins can embed a dashboard by setting **Allowed Domains** per-dashboard in the _Embed_ settings modal. Superset checks the request's `Referer` header against this list before serving the embedded view; an empty list allows any origin, so configure this explicitly for production.
+- **Redacted errors** — API responses to a guest token report a generic `An error occurred while fetching the data.` instead of the underlying error, since engine errors quote catalog, schema, table and column names. Errors Superset raises itself — access denials, timeouts, payload validation — keep their message, and the full error is always available in the server logs.
@@ -352,6 +352,13 @@ The **Custom** time range picker accepts natural language expressions alongside

 These expressions are evaluated at query time, so saved charts always display data relative to the current date.

+### Downloading Drill to Detail and Drill By Results
+
+The **Drill to detail** and **Drill by** modals, available from a chart's context menu, show the row-level
+data behind a chart (or behind a specific data point, when one is selected). Use the **Download** button in
+the modal's toolbar to export the underlying result set as CSV or Excel (XLSX) without leaving the modal —
+the export isn't limited to the page currently visible in the table.
+
 :::resources

 - [Chart Walkthroughs](https://docs.preset.io/docs/chart-walkthroughs) - Detailed guides for most chart types
@@ -32,8 +32,13 @@ Notes on the generated workbook:
  Excel's 31-character limit; the chart id keeps names unique).
 - Charts nested in tabs are included.
 - Data reflects the dashboard's active filter state at the time of export.
- A chart with no saved query context is skipped and listed in the email; open
-  the chart in Explore and re-save it to include it next time.
+- A chart with no saved query context (charts only store one once they've been
+  re-saved in Explore) still exports when it is a `table`, `big_number`,
+  `big_number_total` or `pie`, by rebuilding the query from the chart's saved
+  form data. Charts of other types — and charts relying on post-processing the
+  rebuild can't reproduce — are skipped and listed in the email; open the chart
+  in Explore and re-save it to include it next time, or configure
+  `EXCEL_EXPORT_QUERY_CONTEXT_BUILDER`.
 - Row counts per sheet are capped the same way as the chart-level CSV/Excel
  export (`ROW_LIMIT`, bounded by `SQL_MAX_ROW`), and never exceed Excel's
  per-sheet maximum.
@@ -74,6 +79,7 @@ will not register.
 | `EXCEL_EXPORT_LINK_TTL_SECONDS` | `86400`                | Lifetime of the pre-signed download URL (24h).                                                                                                                                    |
 | `EXCEL_EXPORT_S3_CLIENT_KWARGS` | `{}`                   | Extra kwargs for `boto3.client("s3", ...)` — e.g. `region_name`, or `endpoint_url` for MinIO/LocalStack.                                                                          |
 | `EXCEL_EXPORT_TABLE_VIZ_TYPES`  | `None`                 | Viz types kept tabular in **Export Images to Excel** mode; every other type is embedded as an image. `None` uses the built-in default (`table`, `pivot_table`, `pivot_table_v2`). |
+| `EXCEL_EXPORT_QUERY_CONTEXT_BUILDER` | `None`            | Optional `Callable[[form_data_dict], dict \| None]` to build a query context for a chart missing a saved one, tried before the built-in form-data rebuild. Point it at a service that runs the chart's real frontend `buildQuery` to faithfully export viz types the built-in rebuild can't handle. Must return `None` when it can't build faithfully, so the export falls back. |

 Credentials and region resolve through the standard boto3 chain (environment
 variables, shared config, or instance role) unless overridden via
@@ -0,0 +1,92 @@
+---
+title: Number Formatting
+sidebar_position: 11
+description: Reference for the built-in D3-based number format presets available on chart metrics and axes
+keywords: [number format, d3 format, formatting, duration, memory, length, distance]
+---
+
+{/*
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements. See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership. The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied. See the License for the
+specific language governing permissions and limitations
+under the License.
+*/}
+
+# Number Formatting
+
+Most chart types expose a **Number format** control (labeled **D3 Format**, **Y Axis Format**, or similar depending on the chart) wherever a metric or numeric axis can be formatted. This is available from the **Customize** tab, or from the metric's popover editor, depending on the chart type. Selecting one of the built-in presets below applies that formatting to the values Superset renders in the chart.
+
+When an axis format control's chart has **Comparison display** set to **Percentage** (e.g. period-over-period comparisons), that control's choices are narrowed to percentage-only presets, hiding `SMART_NUMBER`, `~g`, and the duration/memory/length presets.
+
+You can also type a custom [D3 format string](https://github.com/d3/d3-format) directly into the control if none of the presets fit your needs.
+
+## Built-in presets
+
+### General
+
+| Key | Description |
+| --- | --- |
+| `SMART_NUMBER` | Adaptive formatting — automatically picks a reasonable precision based on the value |
+| `~g` | Original value, using D3's general-format specifier (trims trailing zeros; may switch to exponential notation for very large or small values) |
+
+### D3 format strings
+
+These are raw [D3 format specifiers](https://github.com/d3/d3-format#locale_format). The dropdown shows a live preview of each one against a sample value.
+
+| Format spec | What it does |
+| --- | --- |
+| `,d` | Integer, comma-grouped thousands |
+| `.1s` | SI-prefix notation, 1 significant digit |
+| `.3s` | SI-prefix notation, 3 significant digits |
+| `,.1%` | Percentage, 1 decimal place, comma-grouped |
+| `.2%` | Percentage, 2 decimal places |
+| `.3%` | Percentage, 3 decimal places |
+| `.4r` | Rounded to 4 significant digits |
+| `,.1f` | Fixed-point, 1 decimal place, comma-grouped |
+| `,.2f` | Fixed-point, 2 decimal places, comma-grouped |
+| `,.3f` | Fixed-point, 3 decimal places, comma-grouped |
+| `+,` | Comma-grouped, always shows the sign |
+| `$,.2f` | Currency, 2 decimal places, comma-grouped |
+
+### Duration
+
+| Key | Description |
+| --- | --- |
+| `DURATION` | Duration in ms (`66000` => `1m 6s`) |
+| `DURATION_SUB` | Duration in ms, with sub-second precision (`1.40008` => `1ms 400µs 80ns`) |
+| `DURATION_COL` | Duration in ms, colon-separated (`10500` => `0:00:10.5`) |
+
+### Memory
+
+| Key | Description |
+| --- | --- |
+| `MEMORY_DECIMAL` | Memory in bytes, decimal (`1024B` => `1.024kB`) |
+| `MEMORY_BINARY` | Memory in bytes, binary (`1024B` => `1KiB`) |
+| `MEMORY_TRANSFER_RATE_DECIMAL` | Memory transfer rate in bytes, decimal (`1024B` => `1.024kB/s`) |
+| `MEMORY_TRANSFER_RATE_BINARY` | Memory transfer rate in bytes, binary (`1024B` => `1KiB/s`) |
+
+### Distance / length
+
+| Key | Description |
+| --- | --- |
+| `LENGTH` | Length in meters, converted to kilometers (`12345m` => `12.35km`) |
+| `LENGTH_CM_KM` | Length in centimeters, converted to kilometers (`12345678cm` => `123.46km`) |
+| `LENGTH_CM_M` | Length in centimeters, converted to meters (`12345cm` => `123.45m`) |
+
+Use these when a metric's underlying values are stored in meters or centimeters but are easier to read at a coarser unit — for example, distances traveled, cable/pipe lengths, or elevation changes.
+
+## Currency
+
+Some chart types also expose currency-specific formatting, including a dynamic mode that reads the currency from a column value. See [Dynamic Currency Formatting](./creating-your-first-dashboard#dynamic-currency-formatting) for details.
@@ -58,15 +58,15 @@
    "@fontsource/inter": "^5.3.0",
    "@mdx-js/react": "^3.1.1",
    "@saucelabs/theme-github-codeblock": "^0.3.0",
-    "@storybook/addon-docs": "^10.5.5",
+    "@storybook/addon-docs": "^10.5.6",
    "@superset-ui/core": "^0.20.4",
    "@swc/core": "^1.15.47",
-    "antd": "^6.5.2",
-    "baseline-browser-mapping": "^2.11.7",
+    "antd": "^6.5.3",
+    "baseline-browser-mapping": "^2.11.12",
    "caniuse-lite": "^1.0.30001806",
-    "docusaurus-plugin-openapi-docs": "^5.1.2",
-    "docusaurus-theme-openapi-docs": "^5.1.2",
-    "js-yaml": "^5.2.2",
+    "docusaurus-plugin-openapi-docs": "^5.1.3",
+    "docusaurus-theme-openapi-docs": "^5.1.3",
+    "js-yaml": "^5.2.3",
    "json-bigint": "^1.0.0",
    "prism-react-renderer": "^2.4.1",
    "react": "^18.3.1",
@@ -77,8 +77,8 @@
    "react-table": "^7.8.0",
    "remark-import-partial": "^0.0.2",
    "reselect": "^5.2.0",
-    "storybook": "^10.5.5",
-    "swagger-ui-react": "^5.32.11",
+    "storybook": "^10.5.6",
+    "swagger-ui-react": "^5.32.12",
    "swc-loader": "^0.2.7",
    "tinycolor2": "^1.4.2",
    "unist-util-visit": "^5.1.0"
@@ -89,14 +89,14 @@
    "@eslint/js": "^9.39.2",
    "@types/js-yaml": "^4.0.9",
    "@types/react": "^19.1.8",
-    "@typescript-eslint/eslint-plugin": "^8.65.0",
-    "@typescript-eslint/parser": "^8.65.0",
+    "@typescript-eslint/eslint-plugin": "^8.66.0",
+    "@typescript-eslint/parser": "^8.66.0",
    "eslint": "^9.39.2",
    "eslint-plugin-react": "^7.37.5",
-    "globals": "^17.8.0",
-    "oxfmt": "^0.61.0",
+    "globals": "^17.9.0",
+    "oxfmt": "^0.62.0",
    "typescript": "~6.0.3",
-    "typescript-eslint": "^8.65.0",
+    "typescript-eslint": "^8.66.0",
    "webpack": "^5.109.2"
  },
  "browserslist": {
@@ -107,9 +107,9 @@
      },
      {
        "name": "VERSION_HISTORY",
-        "default": false,
+        "default": true,
        "lifecycle": "development",
-        "description": "Enables the version history panel on Explore and Dashboard pages. History only accrues while ``ENABLE_VERSIONING_CAPTURE`` is also on; with capture off the panel renders but stays empty."
+        "description": "Enables the version history panel on Explore and Dashboard pages. History only accrues while ``ENABLE_VERSIONING_CAPTURE`` is also on; with capture off the panel renders but stays empty, so the two ship with matching defaults and should be changed together."
      }
    ],
    "testing": [
@@ -221,12 +221,6 @@
        "lifecycle": "testing",
        "description": "When impersonating a user, use the email prefix instead of username"
      },
-      {
-        "name": "PLAYWRIGHT_REPORTS_AND_THUMBNAILS",
-        "default": false,
-        "lifecycle": "testing",
-        "description": "Replace Selenium with Playwright for reports and thumbnails. Supports deck.gl visualizations. Requires playwright pip package."
-      },
      {
        "name": "RLS_IN_SQLLAB",
        "default": false,
@@ -11383,6 +11383,13 @@
      },
      "User3": {
        "properties": {
+          "attributes": {
+            "additionalProperties": {
+              "nullable": true
+            },
+            "nullable": true,
+            "type": "object"
+          },
          "first_name": {
            "type": "string"
          },
@@ -29,7 +29,7 @@ maintainers:
  - name: craig-rueda
    email: craig@craigrueda.com
    url: https://github.com/craig-rueda
-version: 0.22.4 # See [README](https://github.com/apache/superset/blob/master/helm/superset/README.md#versioning) for version details.
+version: 0.22.5 # See [README](https://github.com/apache/superset/blob/master/helm/superset/README.md#versioning) for version details.
 dependencies:
  - name: postgresql
    version: 16.7.27
@@ -23,7 +23,7 @@ NOTE: This file is generated by helm-docs: https://github.com/norwoodj/helm-docs

 # superset

-![Version: 0.22.4](https://img.shields.io/badge/Version-0.22.4-informational?style=flat-square)
+![Version: 0.22.5](https://img.shields.io/badge/Version-0.22.5-informational?style=flat-square)

 Apache Superset is a modern, enterprise-ready business intelligence web application

@@ -328,6 +328,7 @@ class CeleryConfig:
        "superset.tasks.scheduler",
        "superset.tasks.thumbnails",
        "superset.tasks.cache",
+        "superset.tasks.slack",
    )
    broker_connection_retry_on_startup = True
    worker_prefetch_multiplier = 10
@@ -50,7 +50,7 @@ dependencies = [
    "flask-cors>=6.0.5, <7.0",
    "croniter>=6.2.4",
    "cron-descriptor",
-    "cryptography>=49.0.0, <50.0.0",
+    "cryptography>=50.0.0, <51.0.0",
    "deprecation>=2.1.0, <2.2.0",
    "flask>=2.2.5, <4.0.0",
    "flask-appbuilder>=5.2.2, <6.0.0",
@@ -68,19 +68,19 @@ dependencies = [
    # not just a connection-pool quirk. Needs dedicated investigation, not a
    # driver-compat-prep bump; revisit alongside the actual SQLAlchemy 2.0
    # core bump (discussion #40273, step 6).
-    "flask-sqlalchemy>=2.5.1, <3.0",
+    "flask-sqlalchemy>=2.5.1, <4.0",
    "flask-wtf>=1.3.0, <2.0",
    "geopy",
    "greenlet<=3.5.4, >=3.5.4",
    "gunicorn>=26.0.0, <27; sys_platform != 'win32'",
    "hashids>=1.3.1, <2",
    # holidays>=0.45 required for security fix
-    "holidays>=0.99, <1",
+    "holidays>=0.101, <1",
    "humanize",
    "isodate",
    "jsonpath-ng>=1.8.0, <2",
    "Mako>=1.2.2",
-    "markdown>=3.10.2",
+    "markdown>=3.10.3",
    # marshmallow 4 compatibility: see superset/marshmallow_compatibility.py for a
    # Flask-AppBuilder workaround. Tracking issue:
    # https://github.com/apache/superset/issues/33162
@@ -88,7 +88,7 @@ dependencies = [
    "marshmallow-union>=0.1.15.post1",
    "msgpack>=1.2.0, <1.3",
    "nh3>=0.3.5, <0.4",
-    "numpy>1.23.5, <2.3",
+    "numpy>=1.23.5, <2.5",
    "packaging",
    # --------------------------
    # pandas and related (wanting pandas[performance] without numba as it's 100+MB and not needed)
@@ -110,15 +110,15 @@ dependencies = [
    "PyJWT>=2.4.0, <3.0",
    "redis>=5.0.0, <9.0",
    "rison>=2.0.1, <3.0",
-    "selenium>=4.46.0, <5.0",
-    "shillelagh[gsheetsapi]>=1.4.4, <2.0",
+
+    "shillelagh[gsheetsapi]>=1.4.5, <2.0",
    "sshtunnel>=0.4.0, <0.5",
    "simplejson>=4.1.1",
    "slack_sdk>=3.43.0, <4",
    "sqlalchemy>=1.4.43, <2", # 1.4.43 adds the python-oracledb (oracle+oracledb) dialect
    "sqlalchemy-continuum>=1.6.0, <2.0.0",
    "sqlalchemy-utils>=0.42.1, <0.43", # expanding lowerbound to work with pydoris
-    "sqlglot>=30.14.0, <31",
+    "sqlglot>=30.16.0, <31", # 30.16.0 adds Trino inline UDF IF/CASE routine statement parsing
    # newer pandas needs 0.9+
    "tabulate>=0.10.0, <1.0",
    "typing-extensions>=4.16.0, <5",
@@ -131,7 +131,7 @@ dependencies = [

 [project.optional-dependencies]

-athena = ["pyathena[pandas]>=3.35.2, <4"]
+athena = ["pyathena[pandas]>=3.35.4, <4"]
 # No SQLAlchemy 2.0 support anywhere in this dialect's ecosystem today: our
 # own preset-io/sqlalchemy-aurora-data-api fork is dead since 2021, and the
 # more active community fork (cloud-utils/sqlalchemy-aurora-data-api) has an
@@ -143,7 +143,7 @@ bigquery = [
    # 1.17.1 is likely the final release: googleapis/python-bigquery-sqlalchemy
    # was archived 2026-05-16. Both 1.17.0 and 1.17.1 support SQLAlchemy 1.4/2.0.
    "sqlalchemy-bigquery>=1.17.1",
-    "google-cloud-bigquery>=3.42.2",
+    "google-cloud-bigquery>=3.42.3",
 ]
 clickhouse = ["clickhouse-connect>=1.6.0, <2.0"]
 cockroachdb = ["cockroachdb>=0.3.5, <0.4"]
@@ -204,7 +204,7 @@ fastmcp = [
 firebird = ["sqlalchemy-firebird>=0.8.0, <2.0.0"]
 firebolt = ["firebolt-sqlalchemy>=1.1.2, <2"]
 gevent = ["gevent>=26.7.0"]
-gsheets = ["shillelagh[gsheetsapi]>=1.4.4, <2"]
+gsheets = ["shillelagh[gsheetsapi]>=1.4.5, <2"]
 hana = ["hdbcli==2.29.25", "sqlalchemy_hana==3.0.3"]
 hive = [
    "pyhive[hive_pure_sasl]>=0.7.0",
@@ -234,7 +234,7 @@ ocient = [
 oracle = ["oracledb>=4.0.2, <5"]
 parseable = ["sqlalchemy-parseable>=0.1.6,<0.2.0"]
 pinot = ["pinotdb>=5.0.0, <10.0.0"]
-playwright = ["playwright>=1.61.0, <2"]
+playwright = ["playwright>=1.62.0, <2"]
 postgres = ["psycopg2-binary==2.9.12"]
 presto = ["pyhive[presto]>=0.6.5"]
 trino = ["trino>=0.338.0"]
@@ -248,8 +248,8 @@ redshift = ["sqlalchemy-redshift>=0.8.1, <0.9"]
 # and 2.0 (version numbers don't track SQLAlchemy compat monotonically); pin
 # to the newest 1.4-only release for now. Bump to >=2.0.0 in lockstep with
 # Superset's own SQLAlchemy 2.0 core bump (discussion #40273), not before.
-risingwave = ["sqlalchemy-risingwave>=1.4.1, <2.0.0"]
-shillelagh = ["shillelagh[all]>=1.4.4, <2"]
+risingwave = ["sqlalchemy-risingwave>=1.4.1, <3.0.0"]
+shillelagh = ["shillelagh[all]>=1.4.5, <2"]
 singlestore = ["sqlalchemy-singlestoredb>=1.2.1, <2"]
 snowflake = ["snowflake-sqlalchemy>=1.11.0, <2"]
 sqlite = ["syntaqlite>=0.7.0,<0.8.0"]
@@ -262,11 +262,11 @@ tdengine = [
    "taospy>=2.8.10",
    "taos-ws-py>=0.7.0"
 ]
-teradata = ["teradatasql>=20.0.0.63"]
+teradata = ["teradatasql>=20.0.0.64"]
 thumbnails = [] # deprecated, will be removed in 7.0
 vertica = ["sqlalchemy-vertica-python>= 0.6.3, < 0.7"]
 netezza = ["nzalchemy>= 11.1.2, < 11.2"]
-starrocks = ["starrocks>=1.3.3, <2"]
+starrocks = ["starrocks>=1.3.4, <2"]
 doris = ["pydoris>=1.2.0, <2.0.0"]
 oceanbase = ["oceanbase_py>=0.0.1.2"]
 ydb = ["ydb-sqlalchemy>=0.1.22", "ydb-sqlglot-plugin>=0.2.8"]
@@ -286,7 +286,7 @@ development = [
    "progress>=1.6.1,<2",
    "psutil",
    "pyfakefs",
-    "pyinstrument>=5.1.2,<6",
+    "pyinstrument>=5.1.3,<6",
    "pylint",
    "pytest<10.0.0", # cap below the next major until validated; the earlier <8 pin (current_app proxy timing) no longer reproduces
    "pytest-asyncio",
@@ -309,7 +309,7 @@ combine_as_imports = true
 include_trailing_comma = true
 line_length = 88
 known_first_party = "superset, apache-superset-core, apache-superset-extensions-cli"
-known_third_party = "alembic, apispec, backoff, celery, click, colorama, cron_descriptor, croniter, cryptography, dateutil, deprecation, flask, flask_appbuilder, flask_babel, flask_caching, flask_compress, flask_jwt_extended, flask_login, flask_migrate, flask_sqlalchemy, flask_talisman, flask_testing, flask_wtf, freezegun, geohash, geopy, holidays, humanize, isodate, jinja2, jwt, markdown, markupsafe, marshmallow, marshmallow-union, msgpack, nh3, numpy, pandas, parameterized, parsedatetime, pgsanity, polyline, rison, progress, pyarrow, sqlalchemy_bigquery, pyhive, pyparsing, pytest, pytest_mock, pytz, redis, requests, selenium, setuptools, shillelagh, simplejson, slack, sqlalchemy, sqlalchemy_utils, syntaqlite, typing_extensions, urllib3, werkzeug, wtforms, wtforms_json, yaml"
+known_third_party = "alembic, apispec, backoff, celery, click, colorama, cron_descriptor, croniter, cryptography, dateutil, deprecation, flask, flask_appbuilder, flask_babel, flask_caching, flask_compress, flask_jwt_extended, flask_login, flask_migrate, flask_sqlalchemy, flask_talisman, flask_testing, flask_wtf, freezegun, geohash, geopy, holidays, humanize, isodate, jinja2, jwt, markdown, markupsafe, marshmallow, marshmallow-union, msgpack, nh3, numpy, pandas, parameterized, parsedatetime, pgsanity, polyline, rison, progress, pyarrow, sqlalchemy_bigquery, pyhive, pyparsing, pytest, pytest_mock, pytz, redis, requests, setuptools, shillelagh, simplejson, slack, sqlalchemy, sqlalchemy_utils, syntaqlite, typing_extensions, urllib3, werkzeug, wtforms, wtforms_json, yaml"
 multi_line_output = 3
 order_by_type = false

@@ -535,6 +535,11 @@ authorized_licenses = [
 # Seems ok, might need legal review
 # https://github.com/urschrei/pypolyline/blob/master/LICENSE.md
 polyline = "2"
+# NumPy 2.x reports a combined SPDX license expression covering vendored
+# code (BSD-3-Clause AND 0BSD AND MIT AND Zlib AND CC0-1.0), all of which
+# are permissive OSI-approved licenses; the package itself remains
+# BSD-3-Clause. https://github.com/numpy/numpy/blob/main/LICENSE.txt
+numpy = "2"
 # --------------------------------------------------------------

 # TODO REMOVE THESE DEPS FROM CODEBASE
@@ -26,7 +26,7 @@ filelock>=3.20.3,<4.0.0
 brotli>=1.2.0,<2.0.0
 numexpr>=2.9.0
 # Security: CVE-2026-34073 (MEDIUM) - Improper Certificate Validation
-cryptography>=49.0.0,<50.0.0
+cryptography>=50.0.0,<51.0.0
 # Security: Snyk - XSS vulnerability in Mako templates
 mako>=1.3.11,<2.0.0
 # Security: CVE-2024-52338 (CRITICAL) - Deserialization of untrusted data in IPC/Parquet readers
@@ -20,10 +20,8 @@ attrs==25.3.0
    # via
    #   cattrs
    #   jsonschema
-    #   outcome
    #   referencing
    #   requests-cache
-    #   trio
 babel==2.17.0
    # via flask-babel
 backoff==2.2.1
@@ -53,9 +51,7 @@ cattrs==25.1.1
 celery==5.6.3
    # via apache-superset (pyproject.toml)
 certifi==2026.5.20
-    # via
-    #   requests
-    #   selenium
+    # via requests
 cffi==2.0.0
    # via
    #   cryptography
@@ -88,7 +84,7 @@ cron-descriptor==1.4.5
    # via apache-superset (pyproject.toml)
 croniter==6.2.4
    # via apache-superset (pyproject.toml)
-cryptography==49.0.0
+cryptography==50.0.0
    # via
    #   -r requirements/base.in
    #   apache-superset (pyproject.toml)
@@ -174,11 +170,9 @@ greenlet==3.5.4
    #   sqlalchemy
 gunicorn==26.0.0
    # via apache-superset (pyproject.toml)
-h11==0.16.0
-    # via wsproto
 hashids==1.3.1
    # via apache-superset (pyproject.toml)
-holidays==0.100
+holidays==0.102
    # via apache-superset (pyproject.toml)
 humanize==4.12.3
    # via apache-superset (pyproject.toml)
@@ -186,7 +180,6 @@ idna==3.15
    # via
    #   email-validator
    #   requests
-    #   trio
    #   url-normalize
 isodate==0.7.2
    # via
@@ -219,7 +212,7 @@ mako==1.3.12
    #   -r requirements/base.in
    #   apache-superset (pyproject.toml)
    #   alembic
-markdown==3.10.2
+markdown==3.10.3
    # via apache-superset (pyproject.toml)
 markdown-it-py==3.0.0
    # via rich
@@ -251,7 +244,7 @@ nh3==0.3.6
    # via apache-superset (pyproject.toml)
 numexpr==2.10.2
    # via -r requirements/base.in
-numpy==1.26.4
+numpy==2.4.6
    # via
    #   apache-superset (pyproject.toml)
    #   bottleneck
@@ -265,10 +258,6 @@ openpyxl==3.1.5
    # via pandas
 ordered-set==4.1.0
    # via flask-limiter
-outcome==1.3.0.post0
-    # via
-    #   trio
-    #   trio-websocket
 packaging==25.0
    # via
    #   apache-superset (pyproject.toml)
@@ -326,14 +315,12 @@ pyjwt==2.13.0
    #   flask-jwt-extended
 pynacl==1.6.2
    # via paramiko
-pyopenssl==26.3.0
+pyopenssl==26.4.0
    # via
    #   -r requirements/base.in
    #   shillelagh
 pyparsing==3.3.2
    # via apache-superset (pyproject.toml)
-pysocks==1.7.1
-    # via urllib3
 python-calamine==0.8.2
    # via pandas
 python-dateutil==2.9.0.post0
@@ -357,7 +344,7 @@ pyyaml==6.0.3
    # via
    #   apache-superset (pyproject.toml)
    #   apispec
-redis==8.0.1
+redis==8.1.0
    # via apache-superset (pyproject.toml)
 referencing==0.36.2
    # via
@@ -380,11 +367,9 @@ rpds-py==0.25.0
    # via
    #   jsonschema
    #   referencing
-selenium==4.46.0
-    # via apache-superset (pyproject.toml)
 setuptools==80.9.0
    # via -r requirements/base.in
-shillelagh==1.4.4
+shillelagh==1.4.5
    # via apache-superset (pyproject.toml)
 simplejson==4.1.1
    # via apache-superset (pyproject.toml)
@@ -396,10 +381,6 @@ six==1.17.0
    #   wtforms-json
 slack-sdk==3.43.0
    # via apache-superset (pyproject.toml)
-sniffio==1.3.1
-    # via trio
-sortedcontainers==2.4.0
-    # via trio
 sqlalchemy==1.4.54
    # via
    #   apache-superset (pyproject.toml)
@@ -418,7 +399,7 @@ sqlalchemy-utils==0.42.1
    #   apache-superset (pyproject.toml)
    #   apache-superset-core
    #   flask-appbuilder
-sqlglot==30.15.0
+sqlglot==30.16.0
    # via
    #   apache-superset (pyproject.toml)
    #   apache-superset-core
@@ -426,12 +407,6 @@ sshtunnel==0.4.0
    # via apache-superset (pyproject.toml)
 tabulate==0.10.0
    # via apache-superset (pyproject.toml)
-trio==0.33.0
-    # via
-    #   selenium
-    #   trio-websocket
-trio-websocket==0.12.2
-    # via selenium
 typing-extensions==4.16.0
    # via
    #   apache-superset (pyproject.toml)
@@ -443,7 +418,6 @@ typing-extensions==4.16.0
    #   pydantic-core
    #   pyopenssl
    #   referencing
-    #   selenium
    #   shillelagh
    #   typing-inspection
 typing-inspection==0.4.2
@@ -461,7 +435,6 @@ urllib3==2.7.0
    #   -r requirements/base.in
    #   requests
    #   requests-cache
-    #   selenium
 vine==5.1.0
    # via
    #   amqp
@@ -471,8 +444,6 @@ watchdog==6.0.0
    # via apache-superset (pyproject.toml)
 wcwidth==0.2.13
    # via prompt-toolkit
-websocket-client==1.8.0
-    # via selenium
 werkzeug==3.1.6
    # via
    #   -r requirements/base.in
@@ -483,8 +454,6 @@ werkzeug==3.1.6
    #   flask-login
 wrapt==1.17.2
    # via deprecated
-wsproto==1.2.0
-    # via trio-websocket
 wtforms==3.2.2
    # via
    #   apache-superset (pyproject.toml)
@@ -48,10 +48,8 @@ attrs==25.3.0
    #   cattrs
    #   cyclopts
    #   jsonschema
-    #   outcome
    #   referencing
    #   requests-cache
-    #   trio
 authlib==1.6.12
    # via fastmcp-slim
 babel==2.17.0
@@ -122,7 +120,6 @@ certifi==2026.5.20
    #   httpcore
    #   httpx
    #   requests
-    #   selenium
 cffi==2.0.0
    # via
    #   -c requirements/base-constraint.txt
@@ -182,7 +179,7 @@ croniter==6.2.4
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
-cryptography==49.0.0
+cryptography==50.0.0
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -363,7 +360,7 @@ google-auth-oauthlib==1.2.1
    # via
    #   pandas-gbq
    #   pydata-google-auth
-google-cloud-bigquery==3.42.2
+google-cloud-bigquery==3.43.0
    # via
    #   apache-superset
    #   pandas-gbq
@@ -400,15 +397,13 @@ gunicorn==26.0.0
    #   apache-superset
 h11==0.16.0
    # via
-    #   -c requirements/base-constraint.txt
    #   httpcore
    #   uvicorn
-    #   wsproto
 hashids==1.3.1
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
-holidays==0.100
+holidays==0.102
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -434,7 +429,6 @@ idna==3.15
    #   email-validator
    #   httpx
    #   requests
-    #   trio
    #   url-normalize
 importlib-metadata==8.7.0
    # via
@@ -521,7 +515,7 @@ mako==1.3.12
    #   -c requirements/base-constraint.txt
    #   alembic
    #   apache-superset
-markdown==3.10.2
+markdown==3.10.3
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -581,7 +575,7 @@ nh3==0.3.6
    #   apache-superset
 nodeenv==1.8.0
    # via pre-commit
-numpy==1.26.4
+numpy==2.4.6
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -619,11 +613,6 @@ ordered-set==4.1.0
    #   flask-limiter
 orjson==3.11.9
    # via trino
-outcome==1.3.0.post0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   trio
-    #   trio-websocket
 packaging==25.0
    # via
    #   -c requirements/base-constraint.txt
@@ -776,7 +765,7 @@ pygments==2.20.0
    #   rich
 pyhive==0.7.0
    # via apache-superset
-pyinstrument==5.1.2
+pyinstrument==5.1.3
    # via apache-superset
 pyjwt==2.13.0
    # via
@@ -791,7 +780,7 @@ pynacl==1.6.2
    # via
    #   -c requirements/base-constraint.txt
    #   paramiko
-pyopenssl==26.3.0
+pyopenssl==26.4.0
    # via
    #   -c requirements/base-constraint.txt
    #   google-auth
@@ -803,10 +792,6 @@ pyparsing==3.3.2
    #   matplotlib
 pyperclip==1.10.0
    # via fastmcp-slim
-pysocks==1.7.1
-    # via
-    #   -c requirements/base-constraint.txt
-    #   urllib3
 pytest==7.4.4
    # via
    #   apache-superset
@@ -874,7 +859,7 @@ pyyaml==6.0.3
    #   fastmcp-slim
    #   jsonschema-path
    #   pre-commit
-redis==8.0.1
+redis==8.1.0
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -934,10 +919,6 @@ s3transfer==0.16.0
    # via boto3
 secretstorage==3.5.0
    # via keyring
-selenium==4.46.0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   apache-superset
 semver==3.0.4
    # via apache-superset-extensions-cli
 setuptools==80.9.0
@@ -948,7 +929,7 @@ setuptools==80.9.0
    #   pydata-google-auth
    #   zope-event
    #   zope-interface
-shillelagh==1.4.4
+shillelagh==1.4.5
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -968,14 +949,7 @@ slack-sdk==3.43.0
    #   -c requirements/base-constraint.txt
    #   apache-superset
 sniffio==1.3.1
-    # via
-    #   -c requirements/base-constraint.txt
-    #   anyio
-    #   trio
-sortedcontainers==2.4.0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   trio
+    # via anyio
 sqlalchemy==1.4.54
    # via
    #   -c requirements/base-constraint.txt
@@ -1002,7 +976,7 @@ sqlalchemy-utils==0.42.1
    #   apache-superset
    #   apache-superset-core
    #   flask-appbuilder
-sqlglot==30.15.0
+sqlglot==30.16.0
    # via
    #   -c requirements/base-constraint.txt
    #   apache-superset
@@ -1039,15 +1013,6 @@ tqdm==4.67.1
    #   prophet
 trino==0.338.0
    # via apache-superset
-trio==0.33.0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   selenium
-    #   trio-websocket
-trio-websocket==0.12.2
-    # via
-    #   -c requirements/base-constraint.txt
-    #   selenium
 typing-extensions==4.16.0
    # via
    #   -c requirements/base-constraint.txt
@@ -1067,7 +1032,6 @@ typing-extensions==4.16.0
    #   pydantic-core
    #   pyopenssl
    #   referencing
-    #   selenium
    #   shillelagh
    #   starlette
    #   typing-inspection
@@ -1100,7 +1064,6 @@ urllib3==2.7.0
    #   docker
    #   requests
    #   requests-cache
-    #   selenium
 uvicorn==0.37.0
    # via
    #   fastmcp-slim
@@ -1124,10 +1087,6 @@ wcwidth==0.2.13
    # via
    #   -c requirements/base-constraint.txt
    #   prompt-toolkit
-websocket-client==1.8.0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   selenium
 websockets==15.0.1
    # via fastmcp-slim
 werkzeug==3.1.6
@@ -1142,10 +1101,6 @@ wrapt==1.17.2
    # via
    #   -c requirements/base-constraint.txt
    #   deprecated
-wsproto==1.2.0
-    # via
-    #   -c requirements/base-constraint.txt
-    #   trio-websocket
 wtforms==3.2.2
    # via
    #   -c requirements/base-constraint.txt
@@ -42,6 +42,7 @@ RETRYABLE_STATUS_CODES: frozenset[int] = frozenset({429})
 PATTERNS = {
    "python": [
        r"^\.github/workflows/.*python",
+        r"^\.github/workflows/scheduled-docker-image-refresh\.yml$",
        r"^docker-compose-image-tag\.yml$",
        r"^tests/",
        r"^superset/",
@@ -1,82 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import { SAMPLE_DASHBOARD_1 } from 'cypress/utils/urls';
-import { drag } from 'cypress/utils';
-import { interceptGet } from './utils';
-import { interceptFiltering as interceptCharts } from '../explore/utils';
-
-function editDashboard() {
-  cy.getBySel('edit-dashboard-button').click();
-}
-
-function dragComponent(
-  component = 'Unicode Cloud',
-  target = 'card-title',
-  withFiltering = true,
-) {
-  if (withFiltering) {
-    cy.getBySel('dashboard-charts-filter-search-input').type(component, {
-      force: true,
-    });
-    cy.wait('@filtering');
-  }
-  cy.wait(500);
-  drag(`[data-test="${target}"]`, component).to(
-    '[data-test="grid-content"] [data-test="dragdroppable-object"]',
-  );
-}
-
-function visitEdit(sampleDashboard = SAMPLE_DASHBOARD_1) {
-  interceptCharts();
-  interceptGet();
-
-  if (sampleDashboard === SAMPLE_DASHBOARD_1) {
-    cy.createSampleDashboards([0]);
-  }
-
-  cy.visit(sampleDashboard);
-  cy.wait('@get');
-  editDashboard();
-  cy.get('.grid-container').should('exist');
-  cy.wait('@filtering');
-  cy.wait(500);
-}
-
-describe('Dashboard edit', () => {
-  describe('Components', () => {
-    beforeEach(() => {
-      visitEdit();
-    });
-
-    it('should add charts', () => {
-      cy.get('body').then($body => {
-        if ($body.find('.ant-modal-wrap').length > 0) {
-          cy.get('body').type('{esc}', { force: true });
-          cy.wait(1000);
-          cy.get('.ant-modal-close').click({ force: true });
-          cy.wait(500);
-        }
-      });
-      cy.get('input[type="checkbox"]').scrollIntoView();
-      cy.get('input[type="checkbox"]').click({ force: true });
-      dragComponent();
-      cy.getBySel('dashboard-component-chart-holder').should('have.length', 1);
-    });
-  });
-});
@@ -138,6 +138,7 @@ export function prepareDashboardFilters(
            chart_customization_config: [],
            timed_refresh_immune_slices: [],
            expanded_slices: {},
+            expand_all_slices: false,
            refresh_frequency: 0,
            color_scheme: '',
            label_colors: {},
@@ -79,34 +79,6 @@ export function waitForChartLoad(chart: ChartSpec) {
  });
 }

-/**
- * Drag an element and drop it to another element.
- * Usage:
- *    drag(source).to(target);
- */
-export function drag(selector: string, content: string | number | RegExp) {
-  const dataTransfer = { data: {} };
-  return {
-    to(target: string | Cypress.Chainable) {
-      cy.get('.dragdroppable')
-        .contains(selector, content)
-        .trigger('mousedown', { which: 1, force: true });
-      cy.get('.dragdroppable')
-        .contains(selector, content)
-        .trigger('dragstart', { dataTransfer, force: true });
-      cy.get('.dragdroppable')
-        .contains(selector, content)
-        .trigger('drag', { force: true });
-
-      (typeof target === 'string' ? cy.get(target) : target)
-        .trigger('dragover', { dataTransfer, force: true })
-        .trigger('drop', { dataTransfer, force: true })
-        .trigger('dragend', { dataTransfer, force: true })
-        .trigger('mouseup', { which: 1, force: true });
-    },
-  };
-}
-
 export function resize(selector: string) {
  return {
    to(cordX: number, cordY: number) {
@@ -77,7 +77,7 @@ module.exports = {
    // @ant-design/colors and @ant-design/fast-color are allowed through because
    // @ant-design/icons >= 6.3 deep-imports the ESM build of @ant-design/colors
    // from its CJS output, so babel-jest must transform those files.
-    'node_modules/(?!@ant-design/(colors|fast-color)|@formatjs/.*|d3-(array|interpolate|color|time|scale|time-format|format)|internmap|@mapbox/tiny-sdf|remark-gfm|(?!@ngrx|(?!deck.gl)|d3-scale)|markdown-table|micromark-*.|decode-named-character-reference|character-entities|mdast-util-*.|unist-util-*.|ccount|escape-string-regexp|nanoid|uuid|@rjsf/*.|@x0k/.*|echarts|zrender|fetch-mock|pretty-ms|parse-ms|ol|@babel/runtime|@emotion|cheerio|cheerio/lib|parse5|dom-serializer|entities|htmlparser2|rehype-sanitize|hast-util-sanitize|unified|unist-.*|hast-.*|hastscript|refractor|rehype-.*|remark-.*|mdast-.*|micromark-.*|parse-entities|character-reference-invalid|is-alphanumerical|is-alphabetical|is-decimal|is-hexadecimal|property-information|space-separated-tokens|comma-separated-tokens|bail|devlop|zwitch|longest-streak|geostyler|geostyler-.*|(?!geostyler)lodash|react-error-boundary|react-json-tree|react-base16-styling|lodash-es|rbush|quickselect|react-diff-viewer-continued|storybook/*.|json-stringify-pretty-compact|@x0k/json-schema-merge)',
+    'node_modules/(?!@ant-design/(colors|fast-color)|@formatjs/.*|d3-(array|interpolate|color|time|scale|time-format|format|selection)|internmap|@mapbox/tiny-sdf|remark-gfm|(?!@ngrx|(?!deck.gl)|d3-scale)|markdown-table|micromark-*.|decode-named-character-reference|character-entities|mdast-util-*.|unist-util-*.|ccount|escape-string-regexp|nanoid|uuid|@rjsf/*.|@x0k/.*|echarts|zrender|fetch-mock|pretty-ms|parse-ms|ol|@babel/runtime|@emotion|cheerio|cheerio/lib|parse5|dom-serializer|entities|htmlparser2|rehype-sanitize|hast-util-sanitize|unified|unist-.*|hast-.*|hastscript|refractor|rehype-.*|remark-.*|mdast-.*|micromark-.*|parse-entities|character-reference-invalid|is-alphanumerical|is-alphabetical|is-decimal|is-hexadecimal|property-information|space-separated-tokens|comma-separated-tokens|bail|devlop|zwitch|longest-streak|geostyler|geostyler-.*|(?!geostyler)lodash|react-error-boundary|react-json-tree|react-base16-styling|lodash-es|rbush|quickselect|react-diff-viewer-continued|storybook/*.|json-stringify-pretty-compact|@x0k/json-schema-merge)',
  ],
  preset: 'ts-jest',
  transform: {
@@ -276,6 +276,19 @@
          "test*WithInitialValues"
        ]
      }
+    ],
+
+    // === ESLint rules ===
+    "no-restricted-imports": [
+      "error",
+      {
+        "paths": [
+          {
+            "name": "lodash",
+            "message": "Please use tree-shakeable lodash-es instead"
+          }
+        ]
+      }
    ]
  },
  "overrides": [
@@ -158,7 +158,7 @@
    "@visx/xychart": "^4.0.0",
    "ag-grid-community": "36.0.2",
    "ag-grid-react": "36.0.2",
-    "antd": "^6.5.2",
+    "antd": "^6.5.3",
    "chrono-node": "^2.10.1",
    "classnames": "^2.2.5",
    "content-disposition": "^2.0.1",
@@ -176,7 +176,7 @@
    "geostyler-openlayers-parser": "^5.7.1",
    "geostyler-style": "11.0.2",
    "geostyler-wfs-parser": "^3.0.1",
-    "google-auth-library": "^10.9.1",
+    "google-auth-library": "^11.0.0",
    "immer": "^11.1.15",
    "interweave": "^13.1.1",
    "jquery": "^4.0.0",
@@ -186,12 +186,12 @@
    "lodash": "^4.18.1",
    "lodash-es": "^4.18.1",
    "mapbox-gl": "^3.27.0",
-    "markdown-to-jsx": "^9.9.0",
+    "markdown-to-jsx": "^9.10.2",
    "match-sorter": "^8.3.0",
    "memoize-one": "^6.0.0",
    "mousetrap": "^1.6.5",
    "mustache": "^4.2.0",
-    "nanoid": "^6.0.0",
+    "nanoid": "^6.0.1",
    "ol": "^10.10.0",
    "query-string": "9.4.1",
    "re-resizable": "^6.11.2",
@@ -203,7 +203,7 @@
    "react-dnd-html5-backend": "^11.1.3",
    "react-dom": "^18.3.0",
    "react-google-recaptcha": "^3.1.0",
-    "react-intersection-observer": "^10.1.0",
+    "react-intersection-observer": "^11.0.0",
    "react-json-tree": "^0.20.0",
    "react-lines-ellipsis": "^0.16.1",
    "react-loadable": "^5.5.0",
@@ -216,7 +216,7 @@
    "react-table": "^7.8.0",
    "react-transition-group": "^4.4.5",
    "react-virtualized-auto-sizer": "^1.0.26",
-    "react-window": "^1.8.10",
+    "react-window": "^2.3.0",
    "redux": "^4.2.1",
    "redux-localstorage": "^0.4.1",
    "redux-thunk": "^2.1.0",
@@ -250,16 +250,16 @@
    "@babel/register": "^7.29.7",
    "@babel/runtime": "^7.29.7",
    "@babel/runtime-corejs3": "^7.29.7",
-    "@babel/types": "^7.29.7",
+    "@babel/types": "^7.29.8",
    "@emotion/babel-plugin": "^11.13.5",
    "@emotion/jest": "^11.14.2",
    "@formatjs/intl-durationformat": "^0.10.18",
    "@istanbuljs/nyc-config-typescript": "^1.0.1",
-    "@playwright/test": "^1.61.1",
+    "@playwright/test": "^1.62.1",
    "@pmmmwh/react-refresh-webpack-plugin": "^0.6.2",
-    "@storybook/addon-docs": "10.5.5",
-    "@storybook/addon-links": "10.5.5",
-    "@storybook/react-webpack5": "10.5.5",
+    "@storybook/addon-docs": "10.5.6",
+    "@storybook/addon-links": "10.5.6",
+    "@storybook/react-webpack5": "10.5.6",
    "@storybook/test-runner": "0.24.4",
    "@svgr/webpack": "^8.1.0",
    "@swc/core": "^1.15.47",
@@ -284,19 +284,18 @@
    "@types/react-redux": "^7.1.10",
    "@types/react-router-dom": "^5.3.3",
    "@types/react-transition-group": "^4.4.12",
-    "@types/react-window": "^1.8.8",
    "@types/redux-localstorage": "^1.0.8",
    "@types/redux-mock-store": "^1.0.6",
    "@types/rison": "0.1.0",
    "@types/tinycolor2": "^1.4.3",
    "@types/unzipper": "^0.10.11",
-    "@typescript-eslint/eslint-plugin": "^8.65.0",
+    "@typescript-eslint/eslint-plugin": "^8.66.0",
    "@typescript-eslint/parser": "^8.63.0",
    "babel-jest": "^30.4.1",
    "babel-loader": "^10.1.1",
    "babel-plugin-dynamic-import-node": "^2.3.3",
    "babel-plugin-jsx-remove-data-test-id": "^3.0.0",
-    "baseline-browser-mapping": "^2.11.7",
+    "baseline-browser-mapping": "^2.11.12",
    "cheerio": "1.2.0",
    "concurrently": "^10.0.4",
    "copy-webpack-plugin": "^14.0.0",
@@ -308,12 +307,12 @@
    "eslint-plugin-i18n-strings": "file:eslint-rules/eslint-plugin-i18n-strings",
    "eslint-plugin-icons": "file:eslint-rules/eslint-plugin-icons",
    "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-jest-dom": "^5.6.0",
+    "eslint-plugin-jest-dom": "^5.10.1",
    "eslint-plugin-lodash": "^8.0.0",
    "eslint-plugin-no-only-tests": "^3.4.0",
    "eslint-plugin-react-prefer-function-component": "^5.0.0",
    "eslint-plugin-react-you-might-not-need-an-effect": "^1.0.1",
-    "eslint-plugin-storybook": "10.5.5",
+    "eslint-plugin-storybook": "10.5.6",
    "eslint-plugin-testing-library": "^7.16.2",
    "eslint-plugin-theme-colors": "file:eslint-rules/eslint-plugin-theme-colors",
    "fetch-mock": "^12.6.0",
@@ -327,13 +326,13 @@
    "jest-websocket-mock": "^2.5.0",
    "js-yaml-loader": "^1.2.2",
    "jsdom": "^30.0.1",
-    "lerna": "^9.0.4",
+    "lerna": "^10.0.0",
    "lightningcss": "^1.33.0",
    "mini-css-extract-plugin": "^2.10.2",
    "minimizer-webpack-plugin": "^5.6.1",
    "open-cli": "^9.0.0",
-    "oxfmt": "^0.61.0",
-    "oxlint": "^1.76.0",
+    "oxfmt": "^0.62.0",
+    "oxlint": "^1.77.0",
    "po2json": "^0.4.5",
    "postcss-styled-syntax": "^0.7.2",
    "process": "^0.11.10",
@@ -344,13 +343,13 @@
    "source-map": "^0.8.0",
    "source-map-support": "^0.5.21",
    "speed-measure-webpack-plugin": "^1.6.0",
-    "storybook": "10.5.5",
+    "storybook": "10.5.6",
    "style-loader": "^4.0.0",
    "stylelint": "^17.14.1",
    "swc-loader": "^0.2.7",
    "ts-jest": "^29.4.12",
    "tscw-config": "^1.1.2",
-    "tsx": "^4.23.1",
+    "tsx": "^4.23.5",
    "typescript": "5.4.5",
    "unzipper": "^0.12.5",
    "wait-on": "^9.1.0",
@@ -106,10 +106,9 @@
    "@testing-library/jest-dom": "*",
    "@testing-library/react": "^15.0.0",
    "@testing-library/user-event": "*",
-    "@types/lodash": "^4.17.24",
+    "@types/lodash": "^4.17.25",
    "@types/react": "*",
    "@types/react-loadable": "*",
-    "@types/react-window": "^1.8.8",
    "@types/tinycolor2": "*",
    "typescript": "^5.0.0"
  },
@@ -160,6 +160,43 @@ test('Theme.setConfig correctly applies algorithm changes', () => {
  expect(serialized.algorithm).toBe(ThemeAlgorithm.DARK);
 });

+test('Theme.setConfig with baseTheme merges the config over the base theme tokens', () => {
+  const baseTheme: AnyThemeConfig = {
+    token: { colorPrimary: '#111111', colorError: '#ff0000' },
+  };
+  const theme = Theme.fromConfig();
+  theme.setConfig({ token: { colorPrimary: '#0000ff' } }, baseTheme);
+
+  // Config wins for colorPrimary; the base theme fills the untouched colorError.
+  expect(theme.theme.colorPrimary).toBe('#0000ff');
+  expect(theme.theme.colorError).toBe('#ff0000');
+});
+
+test('Theme.setConfig with baseTheme keeps the base theme ECharts overrides', () => {
+  const baseTheme = {
+    token: { colorPrimary: '#111111' },
+    echartsOptionsOverrides: { backgroundColor: '#123456' },
+    echartsOptionsOverridesByChartType: {
+      pie: { itemStyle: { borderWidth: 2 } },
+    },
+  } as AnyThemeConfig & {
+    echartsOptionsOverrides: Record<string, unknown>;
+    echartsOptionsOverridesByChartType: Record<string, unknown>;
+  };
+  const theme = Theme.fromConfig();
+
+  // In-place update whose config sets no ECharts overrides: the base theme's
+  // overrides must survive, the same way its tokens do.
+  theme.setConfig({ token: { colorPrimary: '#0000ff' } }, baseTheme);
+
+  expect(theme.theme.echartsOptionsOverrides).toEqual({
+    backgroundColor: '#123456',
+  });
+  expect(theme.theme.echartsOptionsOverridesByChartType).toEqual({
+    pie: { itemStyle: { borderWidth: 2 } },
+  });
+});
+
 test('Theme.toggleDarkMode switches to dark algorithm when toggling dark mode on', () => {
  const theme = Theme.fromConfig();

@@ -64,10 +64,12 @@ export class Theme {
   * @param config - The theme configuration
   * @param baseTheme - Optional base theme to apply under the config
   */
-  static fromConfig(
+  // Merge a config over an optional base theme (arrays replace rather than
+  // deep-merge; a colorPrimary override without colorLink aligns colorLink).
+  private static mergeConfig(
    config?: AnyThemeConfig,
    baseTheme?: AnyThemeConfig,
-  ): Theme {
+  ): AnyThemeConfig | undefined {
    let mergedConfig: AnyThemeConfig | undefined = config;

    if (baseTheme && config) {
@@ -76,9 +78,9 @@ export class Theme {
      );

      // In Ant Design v5, colorLink derives from colorInfo, not colorPrimary.
-      // Currently we expectlinks to follow the brand/primary color. When the user
-      // overrides colorPrimary without explicitly setting colorLink, update the
-      // merged colorLink so links match the new primary palette.
+      // We expect links to follow the brand/primary color, so when a config
+      // overrides colorPrimary without setting colorLink, align the merged
+      // colorLink with the new primary palette.
      if (config.token?.colorPrimary && !config.token?.colorLink) {
        const mToken = mergedConfig?.token;
        if (mToken) {
@@ -89,7 +91,14 @@ export class Theme {
      mergedConfig = baseTheme;
    }

-    return new Theme({ config: mergedConfig });
+    return mergedConfig;
+  }
+
+  static fromConfig(
+    config?: AnyThemeConfig,
+    baseTheme?: AnyThemeConfig,
+  ): Theme {
+    return new Theme({ config: Theme.mergeConfig(config, baseTheme) });
  }

  private static getFilteredAntdTheme(
@@ -110,12 +119,14 @@ export class Theme {
  }

  /**
-   * Update the theme using any theme configuration
-   * Automatically handles both AntdThemeConfig and SerializableThemeConfig
-   * Dark mode should be specified via the algorithm property in the config
+   * Update the theme using any theme configuration, optionally merged over a
+   * base theme. Automatically handles both AntdThemeConfig and
+   * SerializableThemeConfig. Dark mode should be specified via the algorithm
+   * property in the config.
   */
-  setConfig(config: AnyThemeConfig): void {
-    const antdConfig = normalizeThemeConfig(config);
+  setConfig(config: AnyThemeConfig, baseTheme?: AnyThemeConfig): void {
+    const mergedConfig = Theme.mergeConfig(config, baseTheme) ?? config;
+    const antdConfig = normalizeThemeConfig(mergedConfig);

    if (antdConfig.token?.colorPrimary && !antdConfig.token?.colorLink) {
      antdConfig.token.colorLink = antdConfig.token.colorPrimary;
@@ -124,11 +135,11 @@ export class Theme {
    // First phase: Let Ant Design compute the tokens
    const tokens = Theme.getFilteredAntdTheme(antdConfig);

-    // Extract Superset-specific properties from top-level config.
-    // These are custom properties that aren't part of Ant Design's token system
-    // but need to be passed through to the SupersetTheme for ECharts customization.
+    // Extract Superset-specific properties from the merged config (not the raw
+    // config) so a base theme's ECharts overrides survive in-place updates, the
+    // same way the Ant Design tokens above are taken from the merged config.
    const { echartsOptionsOverrides, echartsOptionsOverridesByChartType } =
-      config as AnyThemeConfig & {
+      mergedConfig as AnyThemeConfig & {
        echartsOptionsOverrides?: any;
        echartsOptionsOverridesByChartType?: Record<string, any>;
      };
@@ -36,6 +36,7 @@ import type {
  QueryResponse,
  TimeFormatter,
 } from '@superset-ui/core';
+import { type RGBColor } from '@superset-ui/core/components';
 import { GenericDataType } from '@apache-superset/core/common';
 import { sharedControls, sharedControlComponents } from './shared-controls';

@@ -494,7 +495,7 @@ export type ConditionalFormattingConfig = {
  targetValueLeft?: number;
  targetValueRight?: number;
  column?: string;
-  colorScheme?: string;
+  colorScheme?: RGBColor | string;
  toAllRow?: boolean;
  toTextColor?: boolean;
  useGradient?: boolean;
@@ -68,6 +68,11 @@ export const D3_FORMAT_OPTIONS: [string, string][] = [
    'MEMORY_TRANSFER_RATE_BINARY',
    t('Memory transfer rate in bytes - binary (1024B => 1KiB/s)'),
  ],
+  ['NETWORK_THROUGHPUT', t('Network throughput in bits/s (1000000 => 1Mbps)')],
+  [
+    'NETWORK_THROUGHPUT_FROM_BYTES',
+    t('Network throughput in bytes/s as bits (1000000 => 8Mbps)'),
+  ],
  ['LENGTH', t('Length in m (12345m => 12.35km)')],
  ['LENGTH_CM_KM', t('Length in cm (12345678cm => 123.46km)')],
  ['LENGTH_CM_M', t('Length in cm (12345cm => 123.45m)')],
@@ -19,7 +19,7 @@
 import memoizeOne from 'memoize-one';
 import { isString, isBoolean } from 'lodash-es';
 import { isBlank } from '@apache-superset/core/utils';
-import { addAlpha, DataRecord } from '@superset-ui/core';
+import { addAlpha, DataRecord, rgbaToHex } from '@superset-ui/core';
 import tinycolor from 'tinycolor2';
 import {
  ColorFormatters,
@@ -27,6 +27,7 @@ import {
  ConditionalFormattingConfig,
  MultipleValueComparators,
  ResolvedColorFormatterResult,
+  ColorSchemeEnum,
 } from '../types';

 export const round = (num: number, precision = 0) =>
@@ -71,6 +72,9 @@ export const getOpacity = (
  );
 };

+const isSpecialColor = (value: unknown): value is ColorSchemeEnum =>
+  Object.values(ColorSchemeEnum).includes(value as ColorSchemeEnum);
+
 export const getColorFunction = (
  {
    operator,
@@ -270,19 +274,51 @@ export const getColorFunction = (
    if (compareResult === false) return undefined;
    const { cutoffValue, extremeValue } = compareResult;

-    // If useGradient is explicitly false, return solid color
-    if (useGradient === false) {
+    if (typeof colorScheme === 'string') {
+      if (isSpecialColor(colorScheme)) {
+        return colorScheme;
+      }
+
+      if (
+        useGradient === false ||
+        (useGradient === undefined && colorScheme.length === 9)
+      ) {
+        if (alpha === false) {
+          return colorScheme.length === 9
+            ? colorScheme.slice(0, 7)
+            : colorScheme;
+        }
+        return colorScheme;
+      }
+
+      const cleanHex =
+        colorScheme.length === 9 ? colorScheme.slice(0, 7) : colorScheme;
+
+      if (alpha === undefined || alpha) {
+        return addAlpha(
+          cleanHex,
+          getOpacity(value, cutoffValue, extremeValue, minOpacity, maxOpacity),
+        );
+      }
      return colorScheme;
    }
+    // If useGradient is explicitly false, return solid color
+    if (useGradient === false || useGradient === undefined) {
+      if (alpha === false) {
+        return rgbaToHex({ ...colorScheme, a: 1 });
+      }
+      return rgbaToHex(colorScheme);
+    }

+    const baseHexColor = rgbaToHex({ ...colorScheme, a: 1 });
    // Otherwise apply gradient (default behavior for backward compatibility)
    if (alpha === undefined || alpha) {
      return addAlpha(
-        colorScheme,
+        baseHexColor,
        getOpacity(value, cutoffValue, extremeValue, minOpacity, maxOpacity),
      );
    }
-    return colorScheme;
+    return baseHexColor;
  };
 };

@@ -952,3 +952,167 @@ test('correct column boolean config', () => {
  expect(colorFormatters[3].getColorFromValue(true)).toEqual('#FF0000FF');
  expect(colorFormatters[3].getColorFromValue(false)).toEqual('#FF0000FF');
 });
+
+test('should return hex color when colorScheme is an RGB object', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.None,
+      colorScheme: { r: 255, g: 128, b: 0, a: 1 },
+      column: 'name',
+    },
+    strValues,
+  );
+  expect(colorFunction('Diana')).toEqual('#ff8000');
+  expect(colorFunction('Carlos')).toEqual('#ff8000');
+  expect(colorFunction('Brian')).toEqual('#ff8000');
+});
+
+test('should return token name as-is when colorScheme is a string token', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.None,
+      colorScheme: 'Green',
+      column: 'name',
+    },
+    strValues,
+  );
+  expect(colorFunction('Diana')).toEqual('Green');
+  expect(colorFunction('Carlos')).toEqual('Green');
+  expect(colorFunction('Brian')).toEqual('Green');
+});
+
+test('should return solid hex color when useGradient is false or true', () => {
+  const columnConfig = [
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: { r: 0, g: 47, b: 255, a: 1 },
+      column: 'count',
+      useGradient: false,
+    },
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: { r: 255, g: 166, b: 0, a: 1 },
+      column: 'count',
+      useGradient: true,
+    },
+  ];
+  const colorFormatters = getColorFormatters(columnConfig, mockData);
+  expect(colorFormatters.length).toEqual(2);
+
+  // First formatter with useGradient: false should return solid color
+  expect(colorFormatters[0].column).toEqual('count');
+  expect(colorFormatters[0].getColorFromValue(100)).toEqual('#002fff');
+
+  // Second formatter with useGradient: true should return gradient color
+  expect(colorFormatters[1].column).toEqual('count');
+  expect(colorFormatters[1].getColorFromValue(100)).toEqual('#ffa600FF');
+});
+
+test('should return hex color without alpha for GreaterThan operator with RGB colorScheme', () => {
+  const config = {
+    operator: Comparator.GreaterThan,
+    targetValue: 50,
+    colorScheme: { r: 255, g: 0, b: 0, a: 1 },
+    useGradient: true,
+  };
+
+  const columnValues = [10, 50, 100];
+
+  const alpha = false;
+  const colorFunction = getColorFunction(config, columnValues, alpha);
+
+  expect(colorFunction(100)).toEqual('#ff0000');
+});
+
+test('should preserve alpha from colorScheme when useGradient is false', () => {
+  const config = {
+    operator: Comparator.None,
+    colorScheme: { r: 255, g: 0, b: 0, a: 0.5 },
+    useGradient: false,
+  };
+
+  const colorFunction = getColorFunction(config, [10, 20, 30]);
+  const result = colorFunction(20);
+
+  expect(result).not.toBe('#ff0000');
+  expect(result).not.toBe('rgb(255, 0, 0)');
+});
+
+test('should force opaque color when useGradient is false but alpha is explicitly false', () => {
+  const config = {
+    operator: Comparator.None,
+    colorScheme: { r: 255, g: 0, b: 0, a: 0.5 },
+    useGradient: false,
+  };
+
+  const colorFunction = getColorFunction(config, [10, 20, 30], false);
+  const result = colorFunction(20);
+
+  expect(result).toBe('#ff0000');
+});
+
+test('should return colorScheme as-is when alpha is false and length is 7', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: '#FF0000',
+      useGradient: false,
+      column: 'count',
+    },
+    countValues,
+    false,
+  );
+
+  expect(colorFunction(100)).toEqual('#FF0000');
+});
+
+test('should preserve alpha when alpha is undefined and colorScheme has 9 chars', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: '#FF000080',
+      useGradient: false,
+      column: 'count',
+    },
+    countValues,
+  );
+
+  expect(colorFunction(100)).toEqual('#FF000080');
+});
+
+test('should preserve alpha when alpha is true and colorScheme has 9 chars', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: '#FF000080',
+      useGradient: false,
+      column: 'count',
+    },
+    countValues,
+    true,
+  );
+
+  expect(colorFunction(100)).toEqual('#FF000080');
+});
+
+test('should strip alpha channel when alpha is false and colorScheme has 9 chars', () => {
+  const colorFunction = getColorFunction(
+    {
+      operator: Comparator.GreaterThan,
+      targetValue: 50,
+      colorScheme: '#FF000080',
+      useGradient: false,
+      column: 'count',
+    },
+    countValues,
+    false,
+  );
+
+  expect(colorFunction(100)).toEqual('#FF0000');
+  expect(colorFunction(100)).toHaveLength(7);
+});
@@ -68,7 +68,7 @@
    "d3-time": "^3.1.0",
    "d3-time-format": "^4.1.0",
    "dayjs": "^1.11.21",
-    "dompurify": "^3.4.12",
+    "dompurify": "^3.4.13",
    "fetch-retry": "^6.0.0",
    "handlebars": "^4.7.9",
    "jed": "^1.1.1",
@@ -102,7 +102,7 @@
    "@types/d3-time": "^3.0.4",
    "@types/d3-time-format": "^4.0.3",
    "@types/jquery": "^4.0.1",
-    "@types/lodash": "^4.17.24",
+    "@types/lodash": "^4.17.25",
    "@types/node": "^26.1.2",
    "@types/prop-types": "^15.7.15",
    "@types/react-syntax-highlighter": "^15.5.13",
@@ -123,7 +123,6 @@
    "@testing-library/user-event": "*",
    "@types/react": "*",
    "@types/react-loadable": "*",
-    "@types/react-window": "^1.8.8",
    "@types/tinycolor2": "*",
    "antd": "^6.0.0",
    "nanoid": "*",
@@ -18,7 +18,7 @@
 */

 import { useState, useEffect, useRef, useCallback } from 'react';
-import { isEqual } from 'lodash';
+import { isEqual } from 'lodash-es';
 import { ParentSize } from '@visx/responsive';
 import { t } from '@apache-superset/core/translation';
 import {
@@ -49,9 +49,14 @@ export type ReactifyProps = {
  className?: string;
 };

+export interface ReactifyUnmountContext<Props extends object = object> {
+  container?: HTMLDivElement;
+  props: Readonly<Props & ReactifyProps>;
+}
+
 // TODO: add more React lifecycle callbacks as needed
-export type LifeCycleCallbacks = {
-  componentWillUnmount?: () => void;
+export type LifeCycleCallbacks<Props extends object = object> = {
+  componentWillUnmount?: (this: ReactifyUnmountContext<Props>) => void;
 };

 export interface RenderFuncType<Props> {
@@ -76,7 +81,7 @@ export type ReactifiedComponent<Props> = ForwardRefExoticComponent<
 // `ReactifiedComponent<Props>` explicitly.
 export default function reactify<Props extends object>(
  renderFn: RenderFuncType<Props>,
-  callbacks?: LifeCycleCallbacks,
+  callbacks?: LifeCycleCallbacks<Props>,
 ): ComponentType<Props & ReactifyProps> {
  const ReactifiedComponent = forwardRef<
    ReactifiedComponentRef,
@@ -89,8 +94,10 @@ export default function reactify<Props extends object>(
    // assignment only happens for committed renders (safe under Concurrent
    // Mode) and is in place before the passive unmount effect reads it.
    const propsRef = useRef(props);
+    const committedContainerRef = useRef<HTMLDivElement>();
    useLayoutEffect(() => {
      propsRef.current = props;
+      committedContainerRef.current = containerRef.current ?? undefined;
    });

    // Expose container via ref for external access
@@ -104,6 +111,22 @@ export default function reactify<Props extends object>(
      [],
    );

+    // Cleanup on unmount
+    useEffect(
+      () => () => {
+        if (callbacks?.componentWillUnmount) {
+          // Preserve the legacy `this.props` access pattern and snapshot the
+          // last committed container because React clears refs before passive
+          // effect cleanup runs on unmount.
+          callbacks.componentWillUnmount.call({
+            container: committedContainerRef.current,
+            props: propsRef.current,
+          });
+        }
+      },
+      [],
+    );
+
    // Execute renderFn on mount and every update (mimics componentDidMount + componentDidUpdate)
    useEffect(() => {
      if (containerRef.current) {
@@ -118,24 +141,6 @@ export default function reactify<Props extends object>(
      }
    });

-    // Cleanup on unmount
-    useEffect(
-      () => () => {
-        if (callbacks?.componentWillUnmount) {
-          // Preserve legacy behavior where `this` was a component instance
-          // exposing `props`. The class version cleared `this.container`
-          // before invoking componentWillUnmount, so mirror that here to
-          // prevent callbacks from touching a DOM node that's being torn
-          // down.
-          callbacks.componentWillUnmount.call({
-            container: undefined,
-            props: propsRef.current,
-          });
-        }
-      },
-      [],
-    );
-
    const { id, className } = props;

    return <div ref={containerRef} id={id} className={className} />;
@@ -17,6 +17,7 @@
 * under the License.
 */
 import tinycolor from 'tinycolor2';
+import { type RGBColor } from '@superset-ui/core/components';

 const rgbRegex = /^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/;
 export function getContrastingColor(color: string, thresholds = 186) {
@@ -120,3 +121,45 @@ export function rgbToHex(red: number, green: number, blue: number) {

  return `#${r}${g}${b}`;
 }
+
+export function rgbaToHex(rgb: RGBColor): string {
+  const { r, g, b, a = 1 } = rgb;
+  const clampChannel = (value: number) =>
+    Math.min(255, Math.max(0, Math.round(value)));
+  const clampAlpha = (value: number) => Math.min(1, Math.max(0, value));
+  const toHex = (value: number) => {
+    const hex = value.toString(16);
+    return hex.length === 1 ? `0${hex}` : hex;
+  };
+  const hexColor = `#${toHex(clampChannel(r))}${toHex(clampChannel(g))}${toHex(clampChannel(b))}`;
+  const clampedAlpha = clampAlpha(a);
+  if (clampedAlpha !== 1) {
+    return `${hexColor}${toHex(Math.round(clampedAlpha * 255))}`;
+  }
+  return hexColor;
+}
+
+export const forceHexAlpha = (color: string | RGBColor): string => {
+  if (typeof color === 'object' && color !== null) {
+    return rgbaToHex({ ...color, a: 0.6 });
+  }
+
+  let hex = color.startsWith('#') ? color : `#${color}`;
+
+  // Expand shorthand hex (#rgb, #rgba) to full length before appending or
+  // replacing the alpha channel, otherwise the result is not a valid 6- or
+  // 8-digit CSS hex color.
+  if (hex.length === 4 || hex.length === 5) {
+    hex = `#${hex
+      .slice(1)
+      .split('')
+      .map(char => char + char)
+      .join('')}`;
+  }
+
+  if (hex.length === 9) {
+    return `${hex.slice(0, -2)}99`;
+  }
+
+  return `${hex}99`;
+};
@@ -17,6 +17,7 @@
 * under the License.
 */

+import { useState } from 'react';
 import { Button } from '../Button';
 import { Modal } from './Modal';
 import type { ModalProps, ModalFuncProps } from './types';
@@ -179,3 +180,74 @@ ModalFunctions.args = {
  maskClosable: true,
  mask: true,
 };
+
+/**
+ * Two top-level Modals that are React siblings, not nested inside one
+ * another (e.g. a "View query" modal and a confirmation dialog it can
+ * trigger, like `UnsavedChangesModal`). Ant Design only assigns an
+ * automatically-incremented z-index when a Modal is nested inside another
+ * *currently open* Modal's React tree, so two siblings always fall back to
+ * the same static z-index and are tie-broken by DOM order: whichever
+ * `.ant-modal-wrap` was inserted later paints on top.
+ *
+ * With `destroyOnHidden={false}` (Ant Design's default), a Modal's wrap
+ * node is created once, lazily, on first open, and is never removed or
+ * recreated afterward. So the modal that happens to have been opened
+ * *first ever*, not most recently, keeps winning the DOM-order tiebreak
+ * even after being closed and reopened. Toggle "Reproduce stale DOM order"
+ * off to see the fix: with `destroyOnHidden`, every open recreates the wrap
+ * node at the end of the document, so DOM order (and stacking) always
+ * matches true open-recency and no manual z-index is ever needed.
+ *
+ * To see the bug: click "Open A", close it, then "Open B", then "Open A"
+ * again -- with the toggle on, A renders behind B despite being the modal
+ * that was opened most recently.
+ */
+export const SiblingModalStacking = ({
+  reproduceStaleDomOrder,
+}: {
+  reproduceStaleDomOrder: boolean;
+}) => {
+  const [showA, setShowA] = useState(false);
+  const [showB, setShowB] = useState(false);
+  return (
+    <div>
+      <Button onClick={() => setShowA(true)} buttonStyle="secondary">
+        Open A
+      </Button>
+      <Button onClick={() => setShowB(true)} buttonStyle="secondary">
+        Open B
+      </Button>
+      <Modal
+        name="modal-a"
+        title="Modal A"
+        show={showA}
+        onHide={() => setShowA(false)}
+        destroyOnHidden={!reproduceStaleDomOrder}
+      >
+        Modal A content
+      </Modal>
+      <Modal
+        name="modal-b"
+        title="Modal B"
+        show={showB}
+        onHide={() => setShowB(false)}
+        destroyOnHidden={!reproduceStaleDomOrder}
+      >
+        Modal B content
+      </Modal>
+    </div>
+  );
+};
+
+SiblingModalStacking.args = {
+  reproduceStaleDomOrder: true,
+};
+
+SiblingModalStacking.argTypes = {
+  reproduceStaleDomOrder: {
+    control: 'boolean',
+    description:
+      'On: Ant Design default behavior, a modal opened once keeps its DOM position forever (the bug from #42510). Off: destroyOnHidden, DOM order always matches true open-recency (the fix).',
+  },
+};
@@ -0,0 +1,122 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { render, screen, waitFor } from '@superset-ui/core/spec';
+import type { ColumnsType } from 'antd/es/table';
+import { Table } from './index';
+
+// These tests exercise VirtualTable's react-window v2 `Grid` wiring
+// (`cellComponent`/`cellProps`/`gridRef`), which previously had no direct
+// coverage - `Table.test.tsx` only exercises the non-virtualized code path.
+
+interface BasicData {
+  columnName: string;
+  columnType: string;
+}
+
+const testData: BasicData[] = [
+  { columnName: 'Number', columnType: 'Numerical' },
+  { columnName: 'String', columnType: 'Physical' },
+  { columnName: 'Date', columnType: 'Virtual' },
+];
+
+const testColumns: ColumnsType<BasicData> = [
+  {
+    title: 'Column Name',
+    dataIndex: 'columnName',
+    key: 'columnName',
+    width: 150,
+  },
+  {
+    title: 'Column Type',
+    dataIndex: 'columnType',
+    key: 'columnType',
+    width: 150,
+  },
+];
+
+test('virtualized table renders headers and row content through the react-window Grid', async () => {
+  render(
+    <Table
+      columns={testColumns}
+      data={testData}
+      virtualize
+      height={200}
+      usePagination={false}
+    />,
+  );
+
+  await waitFor(() =>
+    testColumns.forEach(column =>
+      expect(
+        screen
+          .getAllByText(column.title as string)
+          .find(el => el.closest('th')),
+      ).toBeInTheDocument(),
+    ),
+  );
+
+  testData.forEach(row => {
+    expect(screen.getByText(row.columnName)).toBeInTheDocument();
+  });
+});
+
+test('virtualized table cells keep the DOM hooks other code (cypress, downloadAsImage) relies on', async () => {
+  const { container } = render(
+    <Table
+      columns={testColumns}
+      data={testData}
+      virtualize
+      height={200}
+      usePagination={false}
+    />,
+  );
+
+  await waitFor(() => {
+    expect(container.querySelector('.virtual-grid')).toBeInTheDocument();
+    expect(
+      container.querySelectorAll('.virtual-table-cell').length,
+    ).toBeGreaterThan(0);
+  });
+});
+
+test('cell render functions receive their row data via cellProps rather than a stale closure', async () => {
+  const columnsWithRender: ColumnsType<BasicData> = [
+    {
+      title: 'Column Name',
+      dataIndex: 'columnName',
+      key: 'columnName',
+      width: 150,
+      render: (value: string) => `rendered:${value}`,
+    },
+  ];
+
+  render(
+    <Table
+      columns={columnsWithRender}
+      data={testData}
+      virtualize
+      height={200}
+      usePagination={false}
+    />,
+  );
+
+  await waitFor(() => {
+    expect(screen.getByText('rendered:Number')).toBeInTheDocument();
+  });
+});
@@ -24,10 +24,14 @@ import {
 } from 'antd/es/table';
 import classNames from 'classnames';
 import { useResizeDetector } from 'react-resize-detector';
-import { useEffect, useRef, useState, useCallback, CSSProperties } from 'react';
-import { VariableSizeGrid as Grid } from 'react-window';
+import { useRef, useState, useCallback, type UIEvent } from 'react';
+import {
+  Grid,
+  type CellComponentProps,
+  type GridImperativeAPI,
+} from 'react-window';
 import { safeHtmlSpan } from '@superset-ui/core';
-import { useTheme, styled } from '@apache-superset/core/theme';
+import { useTheme, styled, SupersetTheme } from '@apache-superset/core/theme';

 import { TableSize, ETableAction } from './index';

@@ -71,6 +75,59 @@ const StyledTable = styled(AntTable)(
 const SMALL = 39;
 const MIDDLE = 47;

+interface VirtualGridCellProps {
+  mergedColumns: AntTableProps<any>['columns'];
+  rawData: readonly object[];
+  cellSize: number;
+  allowHTML: boolean;
+  theme: SupersetTheme;
+}
+
+// Rendered via `cellComponent`, so it must be a stable reference (module scope)
+// rather than defined inline on every render of the enclosing table -
+// otherwise react-window would treat it as a new component type each render
+// and remount every cell. All the data it needs is threaded through
+// `cellProps` instead of being closed over.
+const VirtualGridCell = ({
+  columnIndex,
+  rowIndex,
+  style,
+  mergedColumns,
+  rawData,
+  cellSize,
+  allowHTML,
+  theme,
+}: CellComponentProps<VirtualGridCellProps>) => {
+  const data: any = rawData?.[rowIndex];
+  // Set default content
+  let content = data?.[(mergedColumns as any)?.[columnIndex]?.dataIndex];
+  // Check if the column has a render function
+  const render = mergedColumns?.[columnIndex]?.render;
+  if (typeof render === 'function') {
+    // Use render function to generate formatted content using column's render function
+    content = render(content, data, rowIndex);
+  }
+
+  if (allowHTML && typeof content === 'string') {
+    content = safeHtmlSpan(content);
+  }
+
+  return (
+    <StyledCell
+      className={classNames('virtual-table-cell', {
+        'virtual-table-cell-last':
+          columnIndex === (mergedColumns?.length ?? 0) - 1,
+      })}
+      style={style}
+      title={typeof content === 'string' ? content : undefined}
+      theme={theme}
+      height={cellSize}
+    >
+      {content}
+    </StyledCell>
+  );
+};
+
 const VirtualTable = <RecordType extends object>(
  props: VirtualTableProps<RecordType>,
 ) => {
@@ -126,19 +183,15 @@ const VirtualTable = <RecordType extends object>(
      (lastColumn.width as number) + Math.floor(tableWidth - totalWidth);
  }

-  const gridRef = useRef<any>();
+  const gridRef = useRef<GridImperativeAPI>(null);
  const [connectObject] = useState<any>(() => {
    const obj = {};
    Object.defineProperty(obj, 'scrollLeft', {
-      get: () => {
-        if (gridRef.current) {
-          return gridRef.current?.state?.scrollLeft;
-        }
-        return 0;
-      },
+      get: () => gridRef.current?.element?.scrollLeft ?? 0,
      set: (scrollLeft: number) => {
-        if (gridRef.current) {
-          gridRef.current.scrollTo({ scrollLeft });
+        const element = gridRef.current?.element;
+        if (element) {
+          element.scrollLeft = scrollLeft;
        }
      },
    });
@@ -146,14 +199,11 @@ const VirtualTable = <RecordType extends object>(
    return obj;
  });

-  const resetVirtualGrid = () => {
-    gridRef.current?.resetAfterIndices({
-      columnIndex: 0,
-      shouldForceUpdate: true,
-    });
-  };
-
-  useEffect(() => resetVirtualGrid, [tableWidth, columns, size]);
+  // No manual cache-reset is needed here (react-window v2 has no
+  // `resetAfterIndices`-style API): `columnWidth` below is a fresh inline
+  // closure over `mergedColumns` on every render, so react-window's internal
+  // size cache - which is invalidated whenever the `columnWidth`/`rowHeight`
+  // function reference changes - recomputes automatically.

  /*
   * antd Table has a runtime error when it tries to fire the onChange event triggered from a pageChange
@@ -166,7 +216,10 @@ const VirtualTable = <RecordType extends object>(
     * We intentionally leave horizontal scroll where it was so user can focus on
     * specific range of columns as they page through data
     */
-    gridRef.current?.scrollTo?.({ scrollTop: 0 });
+    const element = gridRef.current?.element;
+    if (element) {
+      element.scrollTop = 0;
+    }

    onChange?.(
      {
@@ -192,61 +245,31 @@ const VirtualTable = <RecordType extends object>(
    const cellSize = size === TableSize.Middle ? MIDDLE : SMALL;
    return (
      <Grid
-        ref={gridRef}
+        gridRef={gridRef}
        className="virtual-grid"
        columnCount={mergedColumns.length}
        columnWidth={(index: number) => {
          const { width = DEFAULT_COL_WIDTH } = mergedColumns[index];
          return width as number;
        }}
-        height={height || (scroll!.y as number)}
        rowCount={rawData.length}
        rowHeight={() => cellSize}
-        width={tableWidth}
-        onScroll={({ scrollLeft }: { scrollLeft: number }) => {
-          onScroll({ scrollLeft });
+        style={{
+          height: height || (scroll!.y as number),
+          width: tableWidth,
        }}
-      >
-        {({
-          columnIndex,
-          rowIndex,
-          style,
-        }: {
-          columnIndex: number;
-          rowIndex: number;
-          style: CSSProperties;
-        }) => {
-          const data: any = rawData?.[rowIndex];
-          // Set default content
-          let content =
-            data?.[(mergedColumns as any)?.[columnIndex]?.dataIndex];
-          // Check if the column has a render function
-          const render = mergedColumns[columnIndex]?.render;
-          if (typeof render === 'function') {
-            // Use render function to generate formatted content using column's render function
-            content = render(content, data, rowIndex);
-          }
-
-          if (allowHTML && typeof content === 'string') {
-            content = safeHtmlSpan(content);
-          }
-
-          return (
-            <StyledCell
-              className={classNames('virtual-table-cell', {
-                'virtual-table-cell-last':
-                  columnIndex === mergedColumns.length - 1,
-              })}
-              style={style}
-              title={typeof content === 'string' ? content : undefined}
-              theme={theme}
-              height={cellSize}
-            >
-              {content}
-            </StyledCell>
-          );
+        cellComponent={VirtualGridCell}
+        cellProps={{
+          mergedColumns,
+          rawData,
+          cellSize,
+          allowHTML,
+          theme,
        }}
-      </Grid>
+        onScroll={(event: UIEvent<HTMLDivElement>) => {
+          onScroll({ scrollLeft: event.currentTarget.scrollLeft });
+        }}
+      />
    );
  };

@@ -16,7 +16,15 @@
 * specific language governing permissions and limitations
 * under the License.
 */
-import { render, screen, userEvent } from '@superset-ui/core/spec';
+import { useState } from 'react';
+import {
+  render,
+  screen,
+  userEvent,
+  waitFor,
+  within,
+} from '@superset-ui/core/spec';
+import { Modal, RawAntdTooltip } from '@superset-ui/core/components';
 import { UnsavedChangesModal } from '.';

 test('should render nothing if showModal is false', () => {
@@ -94,3 +102,173 @@ test('should only call handleSave when clicking the Save button', async () => {
  expect(mockOnHide).not.toHaveBeenCalled();
  expect(mockOnConfirmNavigation).not.toHaveBeenCalled();
 });
+
+// Regression coverage for the underlying bug (#42510): this modal could
+// render BEHIND another already-open modal (e.g. a draggable "View query"
+// modal). Two plain top-level Modal siblings (neither nested inside the
+// other's React tree) fall back to the same static z-index, tie-broken by
+// DOM order: whichever `.ant-modal-wrap` comes later in the document paints
+// on top -- `destroyOnHidden` is what makes every open recreate this
+// modal's wrap fresh at the end of the document, so it wins that tie. But
+// the real #42510 repro isn't actually a tie: "View query" renders as a
+// dropdown menu item's label, and Ant Design's Menu.Item wraps every item's
+// content in a Tooltip (even one that never opens), which hands its
+// children a real elevated z-index via React context. That's why this
+// modal also sets an explicit `zIndex` -- comfortably above what that
+// inherited context can produce -- rather than relying on DOM order alone.
+function dialogWrap(titleText: string) {
+  const dialogs = screen.queryAllByRole('dialog');
+  // rc-util's `useId` hook always returns the same mocked id ("test-id") in
+  // test environments, so with two dialogs open at once their
+  // `aria-labelledby` ids collide and `getByRole('dialog', { name })` can't
+  // tell them apart. Find each by its title text instead.
+  const dialog = dialogs.find(d => within(d).queryByText(titleText));
+  return dialog?.closest<HTMLElement>('.ant-modal-wrap') ?? null;
+}
+
+test('renders above an already-open modal that also has no elevated z-index', async () => {
+  render(
+    <>
+      <Modal show title="Other open modal" onHide={() => {}}>
+        <div>Other modal content</div>
+      </Modal>
+      <UnsavedChangesModal
+        showModal
+        onHide={() => {}}
+        handleSave={() => {}}
+        onConfirmNavigation={() => {}}
+      />
+    </>,
+  );
+
+  const otherWrap = await waitFor(() => {
+    const wrap = dialogWrap('Other open modal');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+  const unsavedChangesWrap = await waitFor(() => {
+    const wrap = dialogWrap('Unsaved Changes');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+
+  // eslint-disable-next-line no-bitwise
+  expect(
+    otherWrap.compareDocumentPosition(unsavedChangesWrap) &
+      Node.DOCUMENT_POSITION_FOLLOWING,
+  ).toBeTruthy();
+});
+
+// This is the actual #42510 repro, not just a tied-sibling stand-in: "View
+// query" is rendered as a dropdown menu item's label, so Ant Design's
+// Menu.Item silently wraps it in a Tooltip (title/open both stay falsy, it
+// never visibly opens) purely for its own ellipsis-title behavior. That
+// Tooltip still supplies a real, elevated z-index to its children via
+// context, so the modal nested inside it doesn't tie with a plain top-level
+// modal the way the previous test's "Other open modal" does -- DOM order
+// can't be the tie-breaker for two z-indexes that were never equal.
+test('renders above a modal nested in a menu item Tooltip wrapper, which gets a real elevated z-index', async () => {
+  render(
+    <>
+      <RawAntdTooltip title={null} open={false}>
+        <Modal show title="View query" onHide={() => {}}>
+          <div>query body</div>
+        </Modal>
+      </RawAntdTooltip>
+      <UnsavedChangesModal
+        showModal
+        onHide={() => {}}
+        handleSave={() => {}}
+        onConfirmNavigation={() => {}}
+      />
+    </>,
+  );
+
+  const viewQueryWrap = await waitFor(() => {
+    const wrap = dialogWrap('View query');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+  const unsavedChangesWrap = await waitFor(() => {
+    const wrap = dialogWrap('Unsaved Changes');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+
+  // The Tooltip wrapper does give "View query" a real inline z-index above
+  // the base -- confirming this test actually exercises an elevated,
+  // non-tied sibling rather than accidentally falling back to the tied
+  // case the previous test already covers.
+  expect(Number(viewQueryWrap.style.zIndex)).toBeGreaterThan(0);
+  expect(Number(unsavedChangesWrap.style.zIndex)).toBeGreaterThan(
+    Number(viewQueryWrap.style.zIndex),
+  );
+});
+
+test('still renders on top after being opened, closed, and reopened once the other modal is already open', async () => {
+  function Harness() {
+    const [showOther, setShowOther] = useState(false);
+    const [showUnsaved, setShowUnsaved] = useState(false);
+    return (
+      <>
+        <button type="button" onClick={() => setShowOther(true)}>
+          open other
+        </button>
+        <button type="button" onClick={() => setShowUnsaved(true)}>
+          open unsaved
+        </button>
+        <Modal
+          show={showOther}
+          title="Other open modal"
+          onHide={() => setShowOther(false)}
+        >
+          <div>Other modal content</div>
+        </Modal>
+        <UnsavedChangesModal
+          showModal={showUnsaved}
+          onHide={() => setShowUnsaved(false)}
+          handleSave={() => {}}
+          // Mirrors real callers: confirming navigation is what dismisses
+          // this modal, not `onHide` directly (see the Discard-button test
+          // above -- clicking Discard never calls `onHide` on its own).
+          onConfirmNavigation={() => setShowUnsaved(false)}
+        />
+      </>
+    );
+  }
+
+  render(<Harness />);
+
+  // Open this modal once -- e.g. some other in-app action tripped it --
+  // before the modal it's supposed to interrupt has ever been opened. Its
+  // wrap node gets created now, first in the document.
+  userEvent.click(screen.getByText('open unsaved'));
+  await waitFor(() => expect(dialogWrap('Unsaved Changes')).not.toBeNull());
+  userEvent.click(await screen.findByRole('button', { name: /discard/i }));
+  await waitFor(() => expect(dialogWrap('Unsaved Changes')).toBeNull());
+
+  // Now open the modal it's meant to interrupt for the first time.
+  userEvent.click(screen.getByText('open other'));
+  const otherWrap = await waitFor(() => {
+    const wrap = dialogWrap('Other open modal');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+
+  // Reopen this modal -- the real scenario the bug report describes. If its
+  // wrap node were still the one created on the first open above, it would
+  // be stuck earlier in the document than `otherWrap` and render behind it
+  // again.
+  userEvent.click(screen.getByText('open unsaved'));
+  const unsavedChangesWrap = await waitFor(() => {
+    const wrap = dialogWrap('Unsaved Changes');
+    expect(wrap).not.toBeNull();
+    return wrap as HTMLElement;
+  });
+
+  // eslint-disable-next-line no-bitwise
+  expect(
+    otherWrap.compareDocumentPosition(unsavedChangesWrap) &
+      Node.DOCUMENT_POSITION_FOLLOWING,
+  ).toBeTruthy();
+});
@@ -17,13 +17,10 @@
 * under the License.
 */
 import { t } from '@apache-superset/core/translation';
+import { useTheme } from '@apache-superset/core/theme';
 import { Icons, Modal, Typography, Button } from '@superset-ui/core/components';
 import type { FC, ReactElement } from 'react';

-// Ant Design's default modal zIndex is 1000. Using a higher value ensures
-// this dialog always renders above other open modals (e.g. a draggable View SQL modal).
-const UNSAVED_CHANGES_MODAL_Z_INDEX = 1300;
-
 export type UnsavedChangesModalProps = {
  showModal: boolean;
  onHide: () => void;
@@ -31,7 +28,6 @@ export type UnsavedChangesModalProps = {
  onConfirmNavigation: () => void;
  title?: string;
  body?: string;
-  zIndex?: number;
 };

 export const UnsavedChangesModal: FC<UnsavedChangesModalProps> = ({
@@ -41,32 +37,61 @@ export const UnsavedChangesModal: FC<UnsavedChangesModalProps> = ({
  onConfirmNavigation,
  title = 'Unsaved Changes',
  body = "If you don't save, changes will be lost.",
-  zIndex = UNSAVED_CHANGES_MODAL_Z_INDEX,
-}: UnsavedChangesModalProps): ReactElement => (
-  <Modal
-    centered
-    responsive
-    onHide={onHide}
-    show={showModal}
-    width="444px"
-    zIndex={zIndex}
-    title={
-      <>
-        <Icons.WarningOutlined iconSize="m" style={{ marginRight: 8 }} />
-        {title}
-      </>
-    }
-    footer={
-      <>
-        <Button buttonStyle="secondary" onClick={onConfirmNavigation}>
-          {t('Discard')}
-        </Button>
-        <Button buttonStyle="primary" onClick={handleSave}>
-          {t('Save')}
-        </Button>
-      </>
-    }
-  >
-    <Typography.Text>{body}</Typography.Text>
-  </Modal>
-);
+}: UnsavedChangesModalProps): ReactElement => {
+  const theme = useTheme();
+  return (
+    <Modal
+      centered
+      responsive
+      onHide={onHide}
+      show={showModal}
+      width="444px"
+      // This modal always interrupts something already on screen (a
+      // draggable "View query" modal, an in-progress form, etc). Ant
+      // Design only assigns a higher z-index automatically when a Modal is
+      // nested inside another *currently open Modal's* React tree. This
+      // one is always a top-level sibling of whatever it interrupts, so on
+      // its own it would fall back to the same static base z-index -- BUT
+      // the modal it's interrupting isn't always a plain top-level sibling
+      // itself: "View query" is rendered as a dropdown menu item's label,
+      // and Ant Design's Menu.Item silently wraps every item's content in
+      // a Tooltip (even when that tooltip never opens), which supplies a
+      // real ZIndexContext to its children. That gives the nested "View
+      // query" Modal a genuinely higher, non-tied z-index (theme's popup
+      // base plus ~200) than this modal's plain base value, so DOM order
+      // alone (destroyOnHidden below) can't win the tie -- there isn't
+      // one. An explicit zIndex, comfortably above any such context-fed
+      // value, guarantees this modal isn't shadowed by a sibling that
+      // happens to inherit an elevated stacking context.
+      zIndex={theme.zIndexPopupBase + 1000}
+      // Without destroyOnHidden, a Modal's portal node is created once
+      // (lazily, on first open) and then left in place forever, so if this
+      // dialog is ever opened once before whatever it's interrupting is
+      // opened, a later reopen would go right back to that stale,
+      // now-too-early DOM position. destroyOnHidden tears the portal down
+      // on every close so every open recreates it fresh at the end of the
+      // DOM, keeping DOM order (the tie-breaker for any modals that
+      // genuinely do share this one's base z-index) tracking true
+      // open-recency.
+      destroyOnHidden
+      title={
+        <>
+          <Icons.WarningOutlined iconSize="m" style={{ marginRight: 8 }} />
+          {title}
+        </>
+      }
+      footer={
+        <>
+          <Button buttonStyle="secondary" onClick={onConfirmNavigation}>
+            {t('Discard')}
+          </Button>
+          <Button buttonStyle="primary" onClick={handleSave}>
+            {t('Save')}
+          </Button>
+        </>
+      }
+    >
+      <Typography.Text>{body}</Typography.Text>
+    </Modal>
+  );
+};
@@ -0,0 +1,86 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import NumberFormatter from '../NumberFormatter';
+import { NumberFormatFunction } from '../types';
+
+const BITS_PER_BYTE = 8;
+const BASE = 1000;
+const SUFFIXES = [
+  'bps',
+  'kbps',
+  'Mbps',
+  'Gbps',
+  'Tbps',
+  'Pbps',
+  'Ebps',
+  'Zbps',
+  'Ybps',
+  'Rbps',
+  'Qbps',
+];
+
+function formatThroughput(
+  decimals: number,
+  fromBytes: boolean,
+): NumberFormatFunction {
+  return value => {
+    if (value === 0) {
+      return `0${SUFFIXES[0]}`;
+    }
+
+    const sign = value > 0 ? '' : '-';
+    const magnitude = Math.abs(value);
+    const bits = fromBytes ? magnitude * BITS_PER_BYTE : magnitude;
+    let i = Math.max(
+      0,
+      Math.min(
+        SUFFIXES.length - 1,
+        Math.floor(Math.log(bits) / Math.log(BASE)),
+      ),
+    );
+    let scaled = parseFloat((bits / Math.pow(BASE, i)).toFixed(decimals));
+
+    if (scaled >= BASE && i < SUFFIXES.length - 1) {
+      i += 1;
+      scaled = parseFloat((bits / Math.pow(BASE, i)).toFixed(decimals));
+    }
+
+    return `${sign}${scaled}${SUFFIXES[i]}`;
+  };
+}
+
+export default function createThroughputFormatter(
+  config: {
+    description?: string;
+    id?: string;
+    label?: string;
+    decimals?: number;
+    fromBytes?: boolean;
+  } = {},
+) {
+  const { description, id, label, decimals = 2, fromBytes = false } = config;
+
+  return new NumberFormatter({
+    description,
+    formatFunc: formatThroughput(decimals, fromBytes),
+    id: id ?? 'throughput_format',
+    label: label ?? `Throughput formatter`,
+  });
+}
@@ -36,3 +36,4 @@ export { default as createSiAtMostNDigitFormatter } from './factories/createSiAt
 export { default as createSmartNumberFormatter } from './factories/createSmartNumberFormatter';
 export { default as getSmallNumberFormatter } from './getSmallNumberFormatter';
 export { default as createLengthFormatter } from './factories/createLengthFormatter';
+export { default as createThroughputFormatter } from './factories/createThroughputFormatter';
@@ -54,7 +54,12 @@ class LRUCache<T> {
    if (typeof key !== 'string') {
      throw new TypeError('The LRUCache key must be string.');
    }
-    if (this.cache.size >= this.capacity) {
+    if (this.cache.has(key)) {
+      // Overwriting an existing key must not evict anything: the entry count is
+      // unchanged. Deleting first also refreshes the key's recency, since
+      // Map#set keeps the original insertion position for existing keys.
+      this.cache.delete(key);
+    } else if (this.cache.size >= this.capacity) {
      // Forward-compat: TS 6.0 types IteratorResult.value as `string | undefined`
      // when not explicitly checked; guard before passing to Map#delete.
      const oldestKey = this.cache.keys().next().value;
@@ -45,7 +45,16 @@ describe('reactify(renderFn)', () => {
    content: 'ghi',
  };

-  const willUnmountCb = jest.fn();
+  let latestUnmountContext:
+    | {
+        container?: HTMLDivElement;
+        props?: { content?: string; id?: string };
+      }
+    | undefined;
+
+  const willUnmountCb = jest.fn(function captureUnmountContext() {
+    latestUnmountContext = this as typeof latestUnmountContext;
+  });

  const TheChart = reactify(renderFn);
  const TheChartWithWillUnmountHook = reactify(renderFn, {
@@ -66,12 +75,22 @@ describe('reactify(renderFn)', () => {
  }

  function AnotherTestComponent() {
-    return <TheChartWithWillUnmountHook id="another_test" />;
+    const [content, setContent] = useState('abc');
+
+    useEffect(() => {
+      const timer = setTimeout(() => {
+        setContent('def');
+      }, 10);
+      return () => clearTimeout(timer);
+    }, []);
+
+    return <TheChartWithWillUnmountHook id="another_test" content={content} />;
  }

  beforeEach(() => {
    (renderFn as jest.Mock).mockClear();
    willUnmountCb.mockClear();
+    latestUnmountContext = undefined;
  });

  test('returns a React component and re-renders on prop changes', async () => {
@@ -126,9 +145,22 @@ describe('reactify(renderFn)', () => {
    expect(anotherRenderFn).toHaveBeenCalled();
    unmount();
  });
-  test('calls willUnmount hook when it is provided', () => {
+  test('calls willUnmount hook with the committed container and latest props', async () => {
    const { unmount } = render(<AnotherTestComponent />);
+
+    await waitFor(() => {
+      expect(screen.getByText('def')).toBeInTheDocument();
+    });
+
+    const committedContainer = screen.getByText('def').parentElement;
+
    unmount();
+
    expect(willUnmountCb).toHaveBeenCalledTimes(1);
+    expect(latestUnmountContext?.props).toMatchObject({
+      id: 'another_test',
+      content: 'def',
+    });
+    expect(latestUnmountContext?.container).toBe(committedContainer);
  });
 });
@@ -22,6 +22,8 @@ import {
  addAlpha,
  hexToRgb,
  rgbToHex,
+  rgbaToHex,
+  forceHexAlpha,
 } from '@superset-ui/core';

 describe('color utils', () => {
@@ -106,4 +108,51 @@ describe('color utils', () => {
      expect(rgbToHex(0, 0, 0)).toBe('#000000');
    });
  });
+  describe('rgbaToHex', () => {
+    test('omits the alpha channel for opaque colors', () => {
+      expect(rgbaToHex({ r: 255, g: 0, b: 0 })).toBe('#ff0000');
+      expect(rgbaToHex({ r: 255, g: 0, b: 0, a: 1 })).toBe('#ff0000');
+    });
+    test('appends the alpha channel for translucent colors', () => {
+      expect(rgbaToHex({ r: 0, g: 150, b: 0, a: 0.2 })).toBe('#00960033');
+      expect(rgbaToHex({ r: 0, g: 0, b: 0, a: 0.5 })).toBe('#00000080');
+    });
+    test('fully transparent colors keep an explicit 00 alpha', () => {
+      expect(rgbaToHex({ r: 255, g: 255, b: 255, a: 0 })).toBe('#ffffff00');
+    });
+    test('zero-pads single-digit channels', () => {
+      expect(rgbaToHex({ r: 1, g: 2, b: 3 })).toBe('#010203');
+    });
+    test('rounds fractional channel values', () => {
+      expect(rgbaToHex({ r: 254.6, g: 0.4, b: 0 })).toBe('#ff0000');
+    });
+    test('clamps out-of-range channel and alpha values', () => {
+      expect(rgbaToHex({ r: 300, g: -10, b: 0 })).toBe('#ff0000');
+      expect(rgbaToHex({ r: 0, g: 0, b: 0, a: 1.5 })).toBe('#000000');
+      expect(rgbaToHex({ r: 0, g: 0, b: 0, a: -0.5 })).toBe('#00000000');
+    });
+  });
+  describe('forceHexAlpha', () => {
+    test('appends 60% alpha to a 6-digit hex string', () => {
+      expect(forceHexAlpha('#ff0000')).toBe('#ff000099');
+    });
+    test('adds the # prefix when missing', () => {
+      expect(forceHexAlpha('ff0000')).toBe('#ff000099');
+    });
+    test('replaces the existing alpha on an 8-digit hex string', () => {
+      expect(forceHexAlpha('#ff000033')).toBe('#ff000099');
+    });
+    test('converts an RGBColor object using 60% alpha', () => {
+      expect(forceHexAlpha({ r: 255, g: 0, b: 0 })).toBe('#ff000099');
+    });
+    test('overrides the alpha of a translucent RGBColor object', () => {
+      expect(forceHexAlpha({ r: 0, g: 150, b: 0, a: 0.2 })).toBe('#00960099');
+    });
+    test('expands a shorthand 3-digit hex string before adding alpha', () => {
+      expect(forceHexAlpha('#fff')).toBe('#ffffff99');
+    });
+    test('expands a shorthand 4-digit hex string before replacing alpha', () => {
+      expect(forceHexAlpha('#ff03')).toBe('#ffff0099');
+    });
+  });
 });
@@ -0,0 +1,131 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { NumberFormatter, createThroughputFormatter } from '@superset-ui/core';
+
+test('creates an instance of NumberFormatter', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter).toBeInstanceOf(NumberFormatter);
+});
+
+test('uses default id and label', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter.id).toBe('throughput_format');
+  expect(formatter.label).toBe('Throughput formatter');
+});
+
+test('accepts a custom id, label and description', () => {
+  const formatter = createThroughputFormatter({
+    id: 'custom_id',
+    label: 'Custom label',
+    description: 'Custom description',
+  });
+  expect(formatter.id).toBe('custom_id');
+  expect(formatter.label).toBe('Custom label');
+  expect(formatter.description).toBe('Custom description');
+});
+
+test('formats bits per second without converting', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(0)).toBe('0bps');
+  expect(formatter(500)).toBe('500bps');
+  expect(formatter(1500)).toBe('1.5kbps');
+  expect(formatter(8888)).toBe('8.89kbps');
+  expect(formatter(1000000)).toBe('1Mbps');
+  expect(formatter(1500000)).toBe('1.5Mbps');
+  expect(formatter(1500000000)).toBe('1.5Gbps');
+});
+
+test('scales bits per second across the full range of suffixes', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(Math.pow(1000, 1))).toBe('1kbps');
+  expect(formatter(Math.pow(1000, 2))).toBe('1Mbps');
+  expect(formatter(Math.pow(1000, 3))).toBe('1Gbps');
+  expect(formatter(Math.pow(1000, 4))).toBe('1Tbps');
+  expect(formatter(Math.pow(1000, 5))).toBe('1Pbps');
+  expect(formatter(Math.pow(1000, 6))).toBe('1Ebps');
+  expect(formatter(Math.pow(1000, 7))).toBe('1Zbps');
+  expect(formatter(Math.pow(1000, 8))).toBe('1Ybps');
+  expect(formatter(Math.pow(1000, 9))).toBe('1Rbps');
+  expect(formatter(Math.pow(1000, 10))).toBe('1Qbps');
+});
+
+test('converts bytes per second to bits per second with fromBytes', () => {
+  const formatter = createThroughputFormatter({ fromBytes: true });
+  expect(formatter(0)).toBe('0bps');
+  expect(formatter(1)).toBe('8bps');
+  expect(formatter(100)).toBe('800bps');
+  expect(formatter(125)).toBe('1kbps');
+  expect(formatter(1111)).toBe('8.89kbps');
+  expect(formatter(187500)).toBe('1.5Mbps');
+  expect(formatter(1000000)).toBe('8Mbps');
+  expect(formatter(125000000)).toBe('1Gbps');
+});
+
+test('scales bytes per second across the full range of suffixes', () => {
+  const formatter = createThroughputFormatter({ fromBytes: true });
+  expect(formatter(Math.pow(1000, 1) / 8)).toBe('1kbps');
+  expect(formatter(Math.pow(1000, 5) / 8)).toBe('1Pbps');
+  expect(formatter(Math.pow(1000, 10) / 8)).toBe('1Qbps');
+});
+
+test('promotes to the next suffix when rounding reaches the base', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(999.999)).toBe('1kbps');
+  expect(formatter(999999)).toBe('1Mbps');
+  expect(formatter(999999999)).toBe('1Gbps');
+  expect(formatter(-999999)).toBe('-1Mbps');
+
+  const fromBytes = createThroughputFormatter({ fromBytes: true });
+  expect(fromBytes(124999.99)).toBe('1Mbps');
+
+  const formatter0decimals = createThroughputFormatter({ decimals: 0 });
+  expect(formatter0decimals(999.6)).toBe('1kbps');
+});
+
+test('clamps to the largest suffix beyond the known range', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(Math.pow(1000, 11))).toBe('1000Qbps');
+  expect(formatter(Math.pow(1000, 12))).toBe('1000000Qbps');
+});
+
+test('clamps to the smallest suffix below one bit per second', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(0.4)).toBe('0.4bps');
+
+  const fromBytes = createThroughputFormatter({ fromBytes: true });
+  expect(fromBytes(0.05)).toBe('0.4bps');
+});
+
+test('formats negative rates', () => {
+  const formatter = createThroughputFormatter();
+  expect(formatter(-1500)).toBe('-1.5kbps');
+
+  const fromBytes = createThroughputFormatter({ fromBytes: true });
+  expect(fromBytes(-187500)).toBe('-1.5Mbps');
+});
+
+test('rounds according to the decimals option', () => {
+  const formatter0decimals = createThroughputFormatter({ decimals: 0 });
+  expect(formatter0decimals(0)).toBe('0bps');
+  expect(formatter0decimals(8888)).toBe('9kbps');
+
+  const formatter3decimals = createThroughputFormatter({ decimals: 3 });
+  expect(formatter3decimals(8888)).toBe('8.888kbps');
+});
@@ -53,6 +53,27 @@ test('LRU operations', () => {
  expect(cache.capacity).toBe(3);
 });

+test('overwriting an existing key does not evict another entry', () => {
+  const cache = lruCache<string>(2);
+  cache.set('a', 'a');
+  cache.set('b', 'b');
+  cache.set('b', 'b2');
+  expect(cache.size).toBe(2);
+  expect(cache.has('a')).toBe(true);
+  expect(cache.get('b')).toBe('b2');
+});
+
+test('overwriting an existing key refreshes its recency', () => {
+  const cache = lruCache<string>(2);
+  cache.set('a', 'a');
+  cache.set('b', 'b');
+  // `a` becomes the most recently used, so `b` is evicted next
+  cache.set('a', 'a2');
+  cache.set('c', 'c');
+  expect(cache.has('b')).toBe(false);
+  expect(cache.values()).toEqual(['a2', 'c']);
+});
+
 test('LRU handle null and undefined', () => {
  const cache = lruCache();
  cache.set('a', null);
@@ -0,0 +1,74 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Locator, Page } from '@playwright/test';
+
+/**
+ * Unconditional pause between drag events, letting react-dnd's HTML5 backend
+ * commit its monitor state before the next event fires. Deliberately not in
+ * `TIMEOUT`: that object holds wait *ceilings* (a wait may finish sooner),
+ * whereas this is a fixed sleep that always costs what it says.
+ */
+const REACT_DND_SETTLE_MS = 50;
+
+/**
+ * Drives an HTML5 drag-and-drop using synthetic native drag events.
+ *
+ * The dashboard grid uses react-dnd with the HTML5 backend
+ * (`react-dnd-html5-backend`), which listens for native `dragstart` /
+ * `dragenter` / `dragover` / `drop` events rather than the mouse events that
+ * Playwright's built-in `locator.dragTo()` produces. To trigger it we dispatch
+ * the native drag sequence ourselves, threading a single shared `DataTransfer`
+ * object through every event so react-dnd's monitor sees a consistent payload.
+ *
+ * Mirrors the synthetic-event sequence used by the deprecated Cypress `drag`
+ * helper (cypress-base/cypress/utils/index.ts).
+ *
+ * @param page - Playwright page (used to mint the shared DataTransfer)
+ * @param source - The draggable element (or a descendant; drag events bubble)
+ * @param target - The drop target element
+ */
+export async function html5DragAndDrop(
+  page: Page,
+  source: Locator,
+  target: Locator,
+): Promise<void> {
+  // Note: we intentionally do not scrollIntoView the source. The chart card list
+  // is virtualized, so a separate scroll action can detach the element between
+  // resolution and use; dispatchEvent only requires the node to be attached.
+
+  // A single DataTransfer shared across every event in the sequence: react-dnd's
+  // HTML5 backend reads/writes drag state through it, so reusing one handle is
+  // what makes the monitor treat this as one coherent drag.
+  const dataTransfer = await page.evaluateHandle(() => new DataTransfer());
+
+  await source.dispatchEvent('dragstart', { dataTransfer });
+  // react-dnd's HTML5 backend commits monitor state (the active drag source) on a
+  // microtask after dragstart; a short settle avoids a race where dragover/drop
+  // fire before the backend considers a drag to be in progress.
+  await page.waitForTimeout(REACT_DND_SETTLE_MS);
+  // dragenter must precede dragover for react-dnd to register the hover target.
+  await target.dispatchEvent('dragenter', { dataTransfer });
+  await target.dispatchEvent('dragover', { dataTransfer });
+  await page.waitForTimeout(REACT_DND_SETTLE_MS);
+  await target.dispatchEvent('drop', { dataTransfer });
+  await source.dispatchEvent('dragend', { dataTransfer });
+
+  await dataTransfer.dispose();
+}
@@ -17,12 +17,29 @@
 * under the License.
 */

-import { Page, Download, Locator } from '@playwright/test';
-import { Menu } from '../components/core';
+import { Page, Download, Locator, expect } from '@playwright/test';
+import { Button, Input, Menu, Tabs } from '../components/core';
 import { DashboardFilterBar } from '../components/dashboard';
 import { gotoWithRetry } from '../helpers/navigation';
+import { html5DragAndDrop } from '../helpers/dnd';
 import { TIMEOUT } from '../utils/constants';

+/** Tabs of the dashboard builder side pane, by their rendered label. */
+type BuilderTab = 'Charts' | 'Layout elements';
+
+/**
+ * Built-in draggable layout elements, by their rendered label (see
+ * `src/dashboard/components/gridComponents/new/`). Extension-provided elements
+ * carry dynamic names and are not covered here.
+ */
+type LayoutElementLabel =
+  | 'Tabs'
+  | 'Row'
+  | 'Column'
+  | 'Header'
+  | 'Text / Markdown'
+  | 'Divider';
+
 /**
 * Dashboard Page object for interacting with dashboards.
 */
@@ -32,9 +49,28 @@ export class DashboardPage {

  private static readonly SELECTORS = {
    DASHBOARD_HEADER: '[data-test="dashboard-header-container"]',
+    CHART_GRID_COMPONENT: '[data-test="chart-grid-component"]',
+    // `:visible` so the locator empties out as loaders hide; see
+    // waitForLoadersToSettle.
+    LOADING_INDICATOR: '[aria-label="Loading"]:visible',
    DASHBOARD_MENU_TRIGGER: '[data-test="actions-trigger"]',
    // The header-actions-menu is the data-test for the dropdown menu content
    HEADER_ACTIONS_MENU: '[data-test="header-actions-menu"]',
+    EDIT_BUTTON: '[data-test="edit-dashboard-button"]',
+    BUILDER_PANE: '[data-test="dashboard-builder-sidepane"]',
+    CHARTS_SEARCH: '[data-test="dashboard-charts-filter-search-input"]',
+    CHART_CARD: '[data-test="chart-card"]',
+    EMPTY_DROPTARGET: '[data-test="grid-content"] .empty-droptarget',
+    NEW_COMPONENT: '[data-test="new-component"]',
+    CHART_HOLDER: '[data-test="dashboard-component-chart-holder"]',
+    GRID_CONTENT: '[data-test="grid-content"]',
+    DELETE_COMPONENT: '[data-test="dashboard-delete-component-button"]',
+    MARKDOWN_EDITOR: '[data-test="dashboard-markdown-editor"]',
+    EDITABLE_TITLE: '[data-test="editable-title-input"]',
+    // Ace exposes no data-test hooks; these are its own stable DOM classes.
+    ACE_CONTENT: '.ace_content',
+    ACE_TEXT_INPUT: '.ace_text-input',
+    RESIZE_HANDLE_BOTTOM: '.resizable-container-handle--bottom',
  } as const;

  constructor(page: Page) {
@@ -60,12 +96,16 @@ export class DashboardPage {

  /**
   * Wait for the dashboard header to be visible.
+   *
+   * The header container renders well before the grid does, so this only
+   * establishes that the dashboard route mounted — pair it with
+   * {@link waitForChartsToLoad} before asserting on chart content.
   */
  async waitForLoad(options?: { timeout?: number }): Promise<void> {
    const timeout = options?.timeout ?? TIMEOUT.PAGE_LOAD;
-    await this.page.waitForSelector(DashboardPage.SELECTORS.DASHBOARD_HEADER, {
-      timeout,
-    });
+    await this.page
+      .locator(DashboardPage.SELECTORS.DASHBOARD_HEADER)
+      .waitFor({ state: 'visible', timeout });
  }

  /**
@@ -73,37 +113,80 @@ export class DashboardPage {
   */
  getChart(chartId: number): Locator {
    return this.page.locator(
-      `[data-test="chart-grid-component"][data-test-chart-id="${chartId}"]`,
+      `${DashboardPage.SELECTORS.CHART_GRID_COMPONENT}[data-test-chart-id="${chartId}"]`,
    );
  }

  /**
-   * Wait for all charts on the dashboard to finish loading.
-   * Waits until no loading indicators are visible on the page.
+   * Wait for the dashboard's charts to mount and finish loading.
+   *
+   * Waiting only for loading indicators to clear is not enough: the grid mounts
+   * its spinners after the header renders, so a "no visible loader" check
+   * called straight after {@link waitForLoad} passes instantly against a
+   * dashboard that has not started rendering anything. Waiting for at least one
+   * chart grid component first makes the absence of loaders mean "charts
+   * finished" rather than "charts have not begun".
+   *
+   * Only for dashboards that have charts — on an empty one this waits out
+   * `timeout` rather than returning. Use {@link waitForGridToLoad} there.
   */
  async waitForChartsToLoad(options?: { timeout?: number }): Promise<void> {
    const timeout = options?.timeout ?? TIMEOUT.API_RESPONSE;

-    // Use browser-context evaluation to check visibility directly.
-    // Loading indicators ([aria-label="Loading"]) may persist in the DOM as hidden
-    // elements after charts finish loading. This checks that none are currently visible,
-    // returning immediately when charts are already loaded (no timeout penalty).
-    await this.page.waitForFunction(
-      () => {
-        const loaders = document.querySelectorAll('[aria-label="Loading"]');
-        if (loaders.length === 0) return true;
-        return Array.from(loaders).every(el => {
-          const style = getComputedStyle(el);
-          return (
-            style.display === 'none' ||
-            style.visibility === 'hidden' ||
-            style.opacity === '0'
-          );
-        });
-      },
-      undefined,
-      { timeout },
-    );
+    await this.page
+      .locator(DashboardPage.SELECTORS.CHART_GRID_COMPONENT)
+      .first()
+      .waitFor({ state: 'attached', timeout });
+
+    await this.waitForLoadersToSettle(timeout);
+  }
+
+  /**
+   * Wait for the dashboard grid to mount and any loading indicators to clear.
+   *
+   * The counterpart to {@link waitForChartsToLoad} for a dashboard with no
+   * charts on it: the grid container renders whatever the grid holds, so it
+   * gives the "the page got past the header" evidence that a chart component
+   * cannot. Prefer {@link waitForChartsToLoad} whenever charts are expected —
+   * this cannot tell a grid that rendered empty from one whose charts have not
+   * begun rendering.
+   */
+  async waitForGridToLoad(options?: { timeout?: number }): Promise<void> {
+    const timeout = options?.timeout ?? TIMEOUT.API_RESPONSE;
+
+    // Attached rather than visible: an empty grid collapses to zero height,
+    // which Playwright counts as not visible.
+    await this.page
+      .locator(DashboardPage.SELECTORS.GRID_CONTENT)
+      .first()
+      .waitFor({ state: 'attached', timeout });
+
+    await this.waitForLoadersToSettle(timeout);
+  }
+
+  /**
+   * Resolve once no loading indicator is visible.
+   *
+   * Loading indicators persist in the DOM as hidden elements after charts
+   * finish, so this waits for none to be *visible* rather than for none to
+   * exist. The `:visible` engine resolves to zero elements when they are all
+   * hidden, which is what `detached` then matches — and it returns immediately
+   * when they are already settled, with no timeout penalty.
+   *
+   * Deliberately not a `getComputedStyle` check in an evaluated function:
+   * `display` does not inherit, so a loader inside a `display: none` ancestor
+   * computes to its own `display: block` and reads as visible, hanging the wait
+   * until the timeout. Playwright's visibility check accounts for ancestors.
+   *
+   * Loader absence is also the state of a dashboard that has not started
+   * rendering, which is why every caller pairs this with a wait for the content
+   * it expects.
+   */
+  private async waitForLoadersToSettle(timeout: number): Promise<void> {
+    await this.page
+      .locator(DashboardPage.SELECTORS.LOADING_INDICATOR)
+      .first()
+      .waitFor({ state: 'detached', timeout });
  }

  /**
@@ -136,14 +219,13 @@ export class DashboardPage {
   * Open the dashboard header actions menu (three-dot menu)
   */
  async openHeaderActionsMenu(): Promise<void> {
-    await this.page.click(DashboardPage.SELECTORS.DASHBOARD_MENU_TRIGGER);
+    await this.page
+      .locator(DashboardPage.SELECTORS.DASHBOARD_MENU_TRIGGER)
+      .click();
    // Wait for the dropdown menu to appear
-    await this.page.waitForSelector(
-      DashboardPage.SELECTORS.HEADER_ACTIONS_MENU,
-      {
-        state: 'visible',
-      },
-    );
+    await this.page
+      .locator(DashboardPage.SELECTORS.HEADER_ACTIONS_MENU)
+      .waitFor({ state: 'visible' });
  }

  /**
@@ -178,4 +260,198 @@ export class DashboardPage {
    await menu.selectSubmenuItem('Download', optionText);
    return downloadPromise;
  }
+
+  /**
+   * Enter dashboard edit mode and wait for the builder side pane to appear.
+   */
+  async enterEditMode(): Promise<void> {
+    const editButton = new Button(
+      this.page,
+      DashboardPage.SELECTORS.EDIT_BUTTON,
+    );
+    await editButton.click();
+    await this.page
+      .locator(DashboardPage.SELECTORS.BUILDER_PANE)
+      .waitFor({ state: 'visible' });
+  }
+
+  /**
+   * The builder side pane's tab bar (Charts / Layout elements).
+   */
+
+  /**
+   * Switch the builder side pane to one of its tabs.
+   * @param tab - 'Charts' (existing slices) or 'Layout elements' (new components)
+   */
+  private async openBuilderTab(tab: BuilderTab): Promise<void> {
+    // Scoped to `.ant-tabs` because that is the root the shared Tabs component
+    // expects.
+    const builderTabs = new Tabs(
+      this.page,
+      this.page
+        .locator(`${DashboardPage.SELECTORS.BUILDER_PANE} .ant-tabs`)
+        .first(),
+    );
+    await builderTabs.clickTab(tab);
+  }
+
+  /**
+   * Locator for chart-holder components currently placed on the grid.
+   * Markdown components are chart holders too — use
+   * {@link getMarkdownEditors} when the assertion must exclude them.
+   */
+  getChartHolders(): Locator {
+    return this.page.locator(DashboardPage.SELECTORS.CHART_HOLDER);
+  }
+
+  /**
+   * Drag an existing chart from the Charts pane onto the dashboard grid.
+   * Requires edit mode to be active.
+   * @param sliceName - The slice name to search for and drag
+   */
+  async addChartByName(sliceName: string): Promise<void> {
+    await this.openBuilderTab('Charts');
+    const search = new Input(this.page, DashboardPage.SELECTORS.CHARTS_SEARCH);
+    await search.fill(sliceName);
+    const card = this.page
+      .locator(DashboardPage.SELECTORS.CHART_CARD)
+      .filter({ hasText: sliceName })
+      .first();
+    await card.waitFor({ state: 'visible' });
+    await html5DragAndDrop(this.page, card, this.dropTarget());
+  }
+
+  /**
+   * Drag a new Layout element (by its label) onto the dashboard grid.
+   * Requires edit mode to be active.
+   * @param label - The new-component label, e.g. 'Text / Markdown'
+   */
+  async addLayoutElement(label: LayoutElementLabel): Promise<void> {
+    await this.openBuilderTab('Layout elements');
+    const source = this.page
+      .locator(DashboardPage.SELECTORS.NEW_COMPONENT)
+      .filter({ hasText: label })
+      .first();
+    await source.waitFor({ state: 'visible' });
+    await html5DragAndDrop(this.page, source, this.dropTarget());
+  }
+
+  /**
+   * The grid's empty drop target, which the grid renders while in edit mode.
+   *
+   * Only resolves while the grid is still empty. Dropping a second component
+   * needs a target relative to the already-placed one, not this.
+   */
+  private dropTarget(): Locator {
+    return this.page.locator(DashboardPage.SELECTORS.EMPTY_DROPTARGET).first();
+  }
+
+  /**
+   * Hover the first placed chart-holder and click its delete button (edit mode).
+   */
+  async deleteChartHolder(): Promise<void> {
+    const holder = this.getChartHolders().first();
+    await holder.hover();
+    const deleteButton = new Button(
+      this.page,
+      holder.locator(DashboardPage.SELECTORS.DELETE_COMPONENT),
+    );
+    await deleteButton.click();
+  }
+
+  /**
+   * Locator for markdown editor components on the grid.
+   */
+  getMarkdownEditors(): Locator {
+    return this.page.locator(DashboardPage.SELECTORS.MARKDOWN_EDITOR);
+  }
+
+  /**
+   * The rendered ace document inside a markdown component. Present only once
+   * the component has entered its editing state.
+   *
+   * Exposed as a locator rather than routed through the `AceEditor` component:
+   * that component reads and writes through `ace.edit(...)` in page context,
+   * which both bypasses the real keystroke path under test and gives up
+   * web-first retries on assertions.
+   *
+   * @param markdownEditor - A locator from {@link getMarkdownEditors}
+   */
+  getMarkdownAceContent(markdownEditor: Locator): Locator {
+    return markdownEditor.locator(DashboardPage.SELECTORS.ACE_CONTENT);
+  }
+
+  /**
+   * Ace's hidden textarea inside a markdown component — the element that
+   * receives keystrokes.
+   *
+   * @param markdownEditor - A locator from {@link getMarkdownEditors}
+   */
+  getMarkdownAceInput(markdownEditor: Locator): Locator {
+    return markdownEditor.locator(DashboardPage.SELECTORS.ACE_TEXT_INPUT);
+  }
+
+  /**
+   * Click the dashboard title, moving focus off whichever grid component holds
+   * it. Committing a markdown edit needs a click on some other element, and the
+   * title is the one that is always present regardless of what is on the grid.
+   *
+   * In edit mode the click focuses the title's input. That is a state change,
+   * not a no-op — but it edits nothing on its own, so it leaves the component
+   * under test untouched.
+   */
+  async blurToDashboardTitle(): Promise<void> {
+    await this.page
+      .locator(DashboardPage.SELECTORS.EDITABLE_TITLE)
+      .first()
+      .click();
+  }
+
+  /**
+   * Drag a grid component's bottom resize handle down by `deltaY` pixels.
+   * Requires edit mode. Uses the mouse because the resize handle is driven by
+   * `react-resizable`, which tracks real pointer movement.
+   *
+   * @param component - The grid component to resize
+   * @param deltaY - Pixels to drag downwards (positive grows the component)
+   * @returns The component's height before and after the drag
+   */
+  async resizeComponent(
+    component: Locator,
+    deltaY: number,
+  ): Promise<{ heightBefore: number; heightAfter: number }> {
+    const boxBefore = await component.boundingBox();
+    if (!boxBefore) {
+      throw new Error('Cannot resize a component that is not visible');
+    }
+
+    const handle = component
+      .locator(DashboardPage.SELECTORS.RESIZE_HANDLE_BOTTOM)
+      .last();
+    const handleBox = await handle.boundingBox();
+    if (!handleBox) {
+      throw new Error('Resize handle is not visible');
+    }
+
+    const startX = handleBox.x + handleBox.width / 2;
+    const startY = handleBox.y + handleBox.height / 2;
+    await this.page.mouse.move(startX, startY);
+    await this.page.mouse.down();
+    // Multiple steps so react-resizable sees a drag rather than a teleport.
+    await this.page.mouse.move(startX, startY + deltaY, { steps: 10 });
+    await this.page.mouse.up();
+
+    await expect
+      .poll(async () => (await component.boundingBox())?.height, {
+        message: 'Component height did not change after resize',
+      })
+      .not.toBe(boxBefore.height);
+
+    const boxAfter = await component.boundingBox();
+    if (!boxAfter) {
+      throw new Error('Component disappeared during resize');
+    }
+
+    return { heightBefore: boxBefore.height, heightAfter: boxAfter.height };
+  }
 }
@@ -25,8 +25,13 @@ import {
  buildSingleRowDashboardLayout,
 } from '../../helpers/api/dashboard';
 import { getDatasetByName } from '../../helpers/api/dataset';
+import { extractIdFromResponse } from '../../helpers/api/assertions';
 import { DashboardPage } from '../../pages/DashboardPage';
 import { TIMEOUT } from '../../utils/constants';
+import {
+  buildFilterJsonMetadata,
+  buildSelectFilter,
+} from './dashboard-test-helpers';

 const DATASET_NAME = 'birth_names';
 const FILTER_COLUMN = 'gender';
@@ -59,12 +64,10 @@ testWithAssets(
      params: JSON.stringify(chartParams),
    });
    expect(chartResp.ok()).toBe(true);
-    const chart = await chartResp.json();
-    const chartId: number = chart.id ?? chart.result?.id;
+    const chartId = await extractIdFromResponse(chartResp);
    testAssets.trackChart(chartId);

    // Create dashboard with chart in position_json and a native filter in json_metadata
-    const filterId = `NATIVE_FILTER-${Math.random().toString(36).slice(2, 10)}`;
    const positionJson = buildSingleRowDashboardLayout([
      {
        id: chartId,
@@ -74,39 +77,17 @@ testWithAssets(
      },
    ]);

-    const jsonMetadata = {
-      native_filter_configuration: [
-        {
-          id: filterId,
-          name: 'Gender',
-          filterType: 'filter_select',
-          type: 'NATIVE_FILTER',
-          targets: [
-            {
-              datasetId,
-              column: { name: FILTER_COLUMN },
-            },
-          ],
-          controlValues: {
-            multiSelect: false,
-            enableEmptyFilter: false,
-            defaultToFirstItem: false,
-            inverseSelection: false,
-            searchAllOptions: false,
-          },
-          defaultDataMask: { filterState: {}, extraFormData: {} },
-          cascadeParentIds: [],
-          scope: { rootPath: ['ROOT_ID'], excluded: [] },
+    const jsonMetadata = buildFilterJsonMetadata({
+      chartsInScope: [chartId],
+      nativeFilters: [
+        buildSelectFilter({
+          datasetId,
+          column: FILTER_COLUMN,
          chartsInScope: [chartId],
-        },
+          name: 'Gender',
+        }),
      ],
-      chart_configuration: {},
-      cross_filters_enabled: false,
-      global_chart_configuration: {
-        scope: { rootPath: ['ROOT_ID'], excluded: [] },
-        chartsInScope: [chartId],
-      },
-    };
+    });

    const dashResp = await apiPostDashboard(page, {
      dashboard_title: `clear_all_repro_${Date.now()}`,
@@ -115,8 +96,7 @@ testWithAssets(
      json_metadata: JSON.stringify(jsonMetadata),
    });
    expect(dashResp.ok()).toBe(true);
-    const dashBody = await dashResp.json();
-    const dashboardId: number = dashBody.result?.id ?? dashBody.id;
+    const dashboardId = await extractIdFromResponse(dashResp);
    testAssets.trackDashboard(dashboardId);

    // Associate chart with the dashboard so it actually renders
@@ -62,6 +62,8 @@ interface TestDashboardResult {
 interface CreateTestDashboardOptions {
  /** Prefix for generated name (default: 'test_dashboard') */
  prefix?: string;
+  /** Publish the dashboard on creation (default: false, the API default) */
+  published?: boolean;
 }

 /**
@@ -86,6 +88,8 @@ export async function createTestDashboard(

  const response = await apiPostDashboard(page, {
    dashboard_title: name,
+    // Serialized as JSON, which drops undefined — no need to omit the key.
+    published: options?.published,
  });

  if (!response.ok()) {
@@ -106,6 +110,113 @@ export async function createTestDashboard(
  return { id, name };
 }

+/** Scope covering the whole dashboard — every filter built here is unscoped. */
+const ROOT_SCOPE = { rootPath: ['ROOT_ID'], excluded: [] };
+
+interface DataMask {
+  filterState: Record<string, unknown>;
+  extraFormData: Record<string, unknown>;
+}
+
+export interface NativeFilterConfig {
+  id: string;
+  name: string;
+  filterType: string;
+  type: string;
+  targets: Array<{ datasetId: number; column: { name: string } }>;
+  controlValues: Record<string, boolean>;
+  defaultDataMask: DataMask;
+  cascadeParentIds: string[];
+  scope: typeof ROOT_SCOPE;
+  chartsInScope: number[];
+}
+
+interface SelectFilterOptions {
+  /** Dataset backing the filtered column. */
+  datasetId: number;
+  /** Column the filter targets. */
+  column: string;
+  /** Charts the filter applies to. */
+  chartsInScope: number[];
+  /** Label shown in the filter bar (default: the column name). */
+  name?: string;
+  /**
+   * Value preselected when the dashboard loads. Omit for a filter that starts
+   * unset — the distinction is load-bearing: a preselected filter is applied to
+   * the initial chart-data request, an unset one is not.
+   */
+  defaultValue?: string;
+}
+
+/**
+ * Builds one `filter_select` native filter for a dashboard's `json_metadata`.
+ * The filter id is generated here because no test needs to know it — filters are
+ * addressed through the filter bar UI, not by id.
+ */
+export function buildSelectFilter(
+  options: SelectFilterOptions,
+): NativeFilterConfig {
+  const { datasetId, column, chartsInScope, name, defaultValue } = options;
+  return {
+    id: `NATIVE_FILTER-${Math.random().toString(36).slice(2, 10)}`,
+    name: name ?? column,
+    filterType: 'filter_select',
+    type: 'NATIVE_FILTER',
+    targets: [{ datasetId, column: { name: column } }],
+    controlValues: {
+      multiSelect: false,
+      enableEmptyFilter: false,
+      defaultToFirstItem: false,
+      inverseSelection: false,
+      searchAllOptions: false,
+    },
+    defaultDataMask:
+      defaultValue === undefined
+        ? { filterState: {}, extraFormData: {} }
+        : {
+            filterState: { value: [defaultValue] },
+            extraFormData: {
+              filters: [{ col: column, op: 'IN', val: [defaultValue] }],
+            },
+          },
+    cascadeParentIds: [],
+    scope: ROOT_SCOPE,
+    chartsInScope,
+  };
+}
+
+interface FilterMetadataOptions {
+  /** Charts the dashboard's global filter scope covers. */
+  chartsInScope: number[];
+  nativeFilters: NativeFilterConfig[];
+  /**
+   * Display Controls, serialized as-is. Kept untyped and pass-through: only one
+   * spec builds them, so a second builder would be speculative.
+   */
+  chartCustomizations?: Record<string, unknown>[];
+}
+
+/**
+ * Builds the `json_metadata` envelope a filtered dashboard needs. Cross-filters
+ * are off so a click on one chart cannot perturb another test's assertions.
+ */
+export function buildFilterJsonMetadata(
+  options: FilterMetadataOptions,
+): Record<string, unknown> {
+  return {
+    native_filter_configuration: options.nativeFilters,
+    ...(options.chartCustomizations && {
+      chart_customization_config: options.chartCustomizations,
+    }),
+    chart_configuration: {},
+    cross_filters_enabled: false,
+    global_chart_configuration: {
+      scope: ROOT_SCOPE,
+      chartsInScope: options.chartsInScope,
+    },
+  };
+}
+
 export interface DashboardChartSpec {
  /** Sent as the chart's top-level `viz_type` and injected into its params. */
  viz_type: string;
@@ -30,7 +30,12 @@ import {
  buildSingleRowDashboardLayout,
 } from '../../helpers/api/dashboard';
 import { getDatasetByName } from '../../helpers/api/dataset';
+import { extractIdFromResponse } from '../../helpers/api/assertions';
 import { DashboardPage } from '../../pages/DashboardPage';
+import {
+  buildFilterJsonMetadata,
+  buildSelectFilter,
+} from './dashboard-test-helpers';

 // Record video regardless of pass/fail (before/after clips).
 testWithAssets.use({ video: 'on' });
@@ -72,8 +77,7 @@ testWithAssets(
      params: JSON.stringify(chartParams),
    });
    expect(chartResp.ok()).toBe(true);
-    const chart = await chartResp.json();
-    const chartId: number = chart.id ?? chart.result?.id;
+    const chartId = await extractIdFromResponse(chartResp);
    testAssets.trackChart(chartId);

    const positionJson = buildSingleRowDashboardLayout([
@@ -86,33 +90,21 @@ testWithAssets(
    ]);

    // 2. json_metadata: one dashboard filter + one Display Control.
-    const filterId = `NATIVE_FILTER-${Math.random().toString(36).slice(2, 10)}`;
    const customizationId = `CHART_CUSTOMIZATION-${Math.random()
      .toString(36)
      .slice(2, 10)}`;

-    const jsonMetadata = {
-      native_filter_configuration: [
-        {
-          id: filterId,
-          name: 'Gender',
-          filterType: 'filter_select',
-          type: 'NATIVE_FILTER',
-          targets: [{ datasetId, column: { name: FILTER_COLUMN } }],
-          controlValues: {
-            multiSelect: false,
-            enableEmptyFilter: false,
-            defaultToFirstItem: false,
-            inverseSelection: false,
-            searchAllOptions: false,
-          },
-          defaultDataMask: { filterState: {}, extraFormData: {} },
-          cascadeParentIds: [],
-          scope: { rootPath: ['ROOT_ID'], excluded: [] },
+    const jsonMetadata = buildFilterJsonMetadata({
+      chartsInScope: [chartId],
+      nativeFilters: [
+        buildSelectFilter({
+          datasetId,
+          column: FILTER_COLUMN,
          chartsInScope: [chartId],
-        },
+          name: 'Gender',
+        }),
      ],
-      chart_customization_config: [
+      chartCustomizations: [
        {
          id: customizationId,
          type: 'CHART_CUSTOMIZATION',
@@ -127,13 +119,7 @@ testWithAssets(
          removed: false,
        },
      ],
-      chart_configuration: {},
-      cross_filters_enabled: false,
-      global_chart_configuration: {
-        scope: { rootPath: ['ROOT_ID'], excluded: [] },
-        chartsInScope: [chartId],
-      },
-    };
+    });

    const dashResp = await apiPostDashboard(page, {
      dashboard_title: `display_control_repro_${Date.now()}`,
@@ -142,8 +128,7 @@ testWithAssets(
      json_metadata: JSON.stringify(jsonMetadata),
    });
    expect(dashResp.ok()).toBe(true);
-    const dashBody = await dashResp.json();
-    const dashboardId: number = dashBody.result?.id ?? dashBody.id;
+    const dashboardId = await extractIdFromResponse(dashResp);
    testAssets.trackDashboard(dashboardId);

    const linkResp = await apiPut(page, `api/v1/chart/${chartId}`, {
@@ -155,14 +140,22 @@ testWithAssets(
    const dashboardPage = new DashboardPage(page);
    await dashboardPage.gotoById(dashboardId);
    await dashboardPage.waitForLoad({ timeout: 30000 });
-    await dashboardPage.waitForChartsToLoad({ timeout: 8000 }).catch(() => {});
+
+    /**
+     * Best-effort settle after each mutation. Every assertion below targets the
+     * filter bar rather than chart content, so a chart that is still querying
+     * must not fail the test — but giving charts a chance to finish keeps the
+     * bar from being re-rendered underneath the assertions.
+     */
+    const settleCharts = () =>
+      dashboardPage.waitForChartsToLoad({ timeout: 8000 }).catch(() => {});
+
+    await settleCharts();
    const filterBar = await dashboardPage.waitForFilterBar();

    // Both the Gender filter and the Time grain Display Control should render.
    await expect(dashboardPage.getDisplayControlsHeader()).toBeVisible();
    await expect(dashboardPage.getDisplayControl('Time grain')).toBeVisible();
-    // eslint-disable-next-line no-console
-    console.log('STEP 1: Display control "Time grain" is present in the bar.');
    await shot('01-initial-bar');

    // 4. Open the filters config modal via the settings gear.
@@ -172,40 +165,26 @@ testWithAssets(
    // 5. Delete the "Time grain" Display Control in the modal sidebar.
    await modal.removeDisplayControl('Time grain');
    await expect(modal.getRemovedMarker()).toBeVisible();
-    // eslint-disable-next-line no-console
-    console.log('STEP 2: Display control marked (Removed) in modal.');
    await shot('03-modal-removed');

    // 6. Save the modal.
    await modal.clickSave();
    await modal.waitForHidden({ timeout: 20000 });
-    await dashboardPage.waitForChartsToLoad({ timeout: 8000 }).catch(() => {});
+    await settleCharts();
    await shot('04-after-save');

-    const goneAfterSave = await dashboardPage
-      .getDisplayControl('Time grain')
-      .isVisible()
-      .catch(() => false);
-    // eslint-disable-next-line no-console
-    console.log(
-      `STEP 3: After save, "Time grain" visible in bar = ${goneAfterSave}`,
-    );
-
    // 7. Click Apply Filters.
    await filterBar.applyIfEnabled();
-    await dashboardPage.waitForChartsToLoad({ timeout: 8000 }).catch(() => {});
+    await settleCharts();
+    /**
+     * Hold before asserting. The bug this guards against is the control coming
+     * *back*, and `toHaveCount(0)` passes the instant it is absent — so without
+     * a pause the assertion can sample the gap before the re-render and pass on
+     * a dashboard that is about to fail. The wait is the reappearance window.
+     */
    await page.waitForTimeout(1500);
    await shot('05-after-apply');

-    const reappeared = await dashboardPage
-      .getDisplayControl('Time grain')
-      .isVisible()
-      .catch(() => false);
-    // eslint-disable-next-line no-console
-    console.log(
-      `STEP 4: After Apply Filters, "Time grain" reappeared = ${reappeared}`,
-    );
-
    // The deleted Display Control must stay gone.
    await expect(
      dashboardPage.getDisplayControl('Time grain'),
@@ -0,0 +1,200 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+/**
+ * Dashboard edit-mode component tests — these replace the deprecated Cypress
+ * spec cypress-base/cypress/e2e/dashboard/editmode.test.ts, deleted in the same
+ * change. They cover the chart/markdown drag-and-drop workflows that the
+ * upstream Cypress notes flagged as the one part of edit mode that genuinely
+ * requires E2E coverage ("Chart drag/drop functionality requires true E2E
+ * testing"). The grid uses react-dnd with the HTML5 backend, so drags are
+ * driven by synthetic native drag events (see helpers/dnd.ts).
+ *
+ * Coverage here is a superset of the Cypress spec, which by the time of the
+ * migration held a single "should add charts" test — its "Color consistency"
+ * block had already been dropped upstream as permanently skipped (it read
+ * per-series colors off an `.nv-legend-symbol` SVG `fill` that ECharts, which
+ * renders to <canvas>, no longer produces). That color-precedence logic is
+ * covered by Jest/RTL, not by E2E.
+ */
+
+import {
+  testWithAssets,
+  expect,
+  type TestAssets,
+} from '../../helpers/fixtures';
+import { apiPostChart } from '../../helpers/api/chart';
+import { getDatasetByName } from '../../helpers/api/dataset';
+import { extractIdFromResponse } from '../../helpers/api/assertions';
+import { DashboardPage } from '../../pages/DashboardPage';
+import { createTestDashboard } from './dashboard-test-helpers';
+import type { Page, TestInfo } from '@playwright/test';
+
+const DATASET_NAME = 'birth_names';
+
+/**
+ * How long one click on the markdown component gets to bring up the ace editor
+ * before the retry loop tries again, and how long the whole loop gets. The
+ * per-attempt budget is deliberately short: the failure mode is a swallowed
+ * click, and retrying is cheaper than waiting out the full budget once.
+ */
+const MARKDOWN_EDIT_ATTEMPT_TIMEOUT = 2000;
+const MARKDOWN_EDIT_TOTAL_TIMEOUT = 20000;
+
+/** Downward drag distance for the resize assertion — several grid rows. */
+const RESIZE_DELTA_PX = 150;
+
+/** Create a hermetic chart from birth_names, NOT placed on any dashboard. */
+async function createChart(
+  page: Page,
+  testAssets: TestAssets,
+  testInfo: TestInfo,
+): Promise<string> {
+  const dataset = await getDatasetByName(page, DATASET_NAME);
+  if (!dataset) {
+    throw new Error(`Dataset ${DATASET_NAME} not found`);
+  }
+  const sliceName = `edit_mode_chart_${Date.now()}_${testInfo.parallelIndex}`;
+  const resp = await apiPostChart(page, {
+    slice_name: sliceName,
+    viz_type: 'big_number_total',
+    datasource_id: dataset.id,
+    datasource_type: 'table',
+    params: JSON.stringify({
+      datasource: `${dataset.id}__table`,
+      viz_type: 'big_number_total',
+      metric: 'count',
+    }),
+  });
+  expect(resp.ok()).toBe(true);
+  testAssets.trackChart(await extractIdFromResponse(resp));
+  return sliceName;
+}
+
+/**
+ * Create the empty published dashboard every test in this file starts from,
+ * open it, and enter edit mode. Returns the page object positioned on the
+ * builder, ready for a drag.
+ */
+async function openEmptyDashboardInEditMode(
+  page: Page,
+  testAssets: TestAssets,
+  testInfo: TestInfo,
+): Promise<DashboardPage> {
+  const { id } = await createTestDashboard(page, testAssets, testInfo, {
+    prefix: 'edit_mode',
+    published: true,
+  });
+
+  const dashboard = new DashboardPage(page);
+  await dashboard.gotoById(id);
+  await dashboard.waitForLoad();
+  await dashboard.enterEditMode();
+  return dashboard;
+}
+
+testWithAssets(
+  'edit mode: add a chart to the dashboard via drag-and-drop',
+  async ({ page, testAssets }, testInfo) => {
+    const sliceName = await createChart(page, testAssets, testInfo);
+    const dashboard = await openEmptyDashboardInEditMode(
+      page,
+      testAssets,
+      testInfo,
+    );
+
+    await expect(dashboard.getChartHolders()).toHaveCount(0);
+    await dashboard.addChartByName(sliceName);
+    await expect(dashboard.getChartHolders()).toHaveCount(1);
+  },
+);
+
+testWithAssets(
+  'edit mode: remove an added chart from the dashboard',
+  async ({ page, testAssets }, testInfo) => {
+    const sliceName = await createChart(page, testAssets, testInfo);
+    const dashboard = await openEmptyDashboardInEditMode(
+      page,
+      testAssets,
+      testInfo,
+    );
+
+    await dashboard.addChartByName(sliceName);
+    await expect(dashboard.getChartHolders()).toHaveCount(1);
+
+    await dashboard.deleteChartHolder();
+    await expect(dashboard.getChartHolders()).toHaveCount(0);
+  },
+);
+
+testWithAssets(
+  'edit mode: add a markdown component via drag-and-drop',
+  async ({ page, testAssets }, testInfo) => {
+    // Heaviest edit-mode flow (drag + ace edit + commit + mouse resize); give it
+    // extra headroom so it stays reliable when the suite runs in parallel.
+    testWithAssets.slow();
+    const dashboard = await openEmptyDashboardInEditMode(
+      page,
+      testAssets,
+      testInfo,
+    );
+
+    await dashboard.addLayoutElement('Text / Markdown');
+    const editor = dashboard.getMarkdownEditors().first();
+    await expect(editor).toBeVisible();
+
+    // Enter edit mode by focusing the component. The markdown enters edit on a
+    // document-level focus handler attached after mount, so a single early click
+    // can be missed under load; retry until the ace editor appears. Click the
+    // rendered "Header 1" heading element specifically (never the trailing
+    // hyperlink in the default content), so a stray click can't navigate away.
+    const aceContent = dashboard.getMarkdownAceContent(editor);
+    const heading = editor.locator('h1', { hasText: 'Header 1' });
+    await expect(async () => {
+      if (await aceContent.isVisible()) return;
+      await heading.click();
+      await expect(aceContent).toBeVisible({
+        timeout: MARKDOWN_EDIT_ATTEMPT_TIMEOUT,
+      });
+    }).toPass({ timeout: MARKDOWN_EDIT_TOTAL_TIMEOUT });
+    await expect(aceContent).toContainText('Header 1');
+    await expect(aceContent).toContainText('markdown formatting');
+
+    // Replace the content and confirm the edit is reflected.
+    const aceInput = dashboard.getMarkdownAceInput(editor);
+    await aceInput.press('ControlOrMeta+a');
+    await aceInput.press('Delete');
+    await aceInput.pressSequentially('Test resize');
+    await expect(aceContent).toContainText('Test resize');
+
+    // Commit by clicking outside the component. Ace unmounting is what proves
+    // the component left its editing state — the wrapper contains "Test resize"
+    // either way, since ace holds that text before the click too.
+    await dashboard.blurToDashboardTitle();
+    await expect(aceContent).toBeHidden();
+    await expect(editor).toContainText('Test resize');
+
+    // Resize via the bottom handle and confirm the component grew taller.
+    const { heightBefore, heightAfter } = await dashboard.resizeComponent(
+      editor,
+      RESIZE_DELTA_PX,
+    );
+    expect(heightAfter).toBeGreaterThan(heightBefore);
+  },
+);
@@ -39,26 +39,32 @@ import {
  apiPostDashboard,
  buildSingleRowDashboardLayout,
 } from '../../helpers/api/dashboard';
+import { getDatasetByName } from '../../helpers/api/dataset';
+import { extractIdFromResponse } from '../../helpers/api/assertions';
 import { DashboardPage } from '../../pages/DashboardPage';
+import { TIMEOUT } from '../../utils/constants';
+import {
+  buildFilterJsonMetadata,
+  buildSelectFilter,
+} from './dashboard-test-helpers';

 const DATASET_NAME = 'birth_names';
 const FILTER_COLUMN = 'gender';
 const FILTER_VALUE = 'boy';

-async function findDatasetIdByName(page: any, name: string): Promise<number> {
-  const query = `(filters:!((col:table_name,opr:eq,value:'${name}')))`;
-  const resp = await page.request.get(`api/v1/dataset/?q=${query}`);
-  const body = await resp.json();
-  if (!body.result?.length) {
-    throw new Error(`Dataset ${name} not found`);
-  }
-  return body.result[0].id;
-}
-
 testWithAssets(
  'Mixed chart applies dashboard filter to both queries (#29519)',
  async ({ page, testAssets }) => {
-    const datasetId = await findDatasetIdByName(page, DATASET_NAME);
+    // Four API round-trips of setup precede a full dashboard load with a
+    // preselected native filter, matching the other dashboard specs that build
+    // their fixtures over the API rather than importing them.
+    testWithAssets.setTimeout(TIMEOUT.SLOW_TEST);
+
+    const dataset = await getDatasetByName(page, DATASET_NAME);
+    if (!dataset) {
+      throw new Error(`Dataset ${DATASET_NAME} not found`);
+    }
+    const datasetId = dataset.id;

    const chartParams = {
      datasource: `${datasetId}__table`,
@@ -86,10 +92,9 @@ testWithAssets(
      params: JSON.stringify(chartParams),
    });
    expect(chartResp.ok()).toBe(true);
-    const chartId: number = (await chartResp.json()).id;
+    const chartId = await extractIdFromResponse(chartResp);
    testAssets.trackChart(chartId);

-    const filterId = `NATIVE_FILTER-${Math.random().toString(36).slice(2, 10)}`;
    const positionJson = buildSingleRowDashboardLayout([
      {
        id: chartId,
@@ -98,39 +103,20 @@ testWithAssets(
        height: 60,
      },
    ]);
-    const jsonMetadata = {
-      native_filter_configuration: [
-        {
-          id: filterId,
-          name: 'Gender',
-          filterType: 'filter_select',
-          type: 'NATIVE_FILTER',
-          targets: [{ datasetId, column: { name: FILTER_COLUMN } }],
-          controlValues: {
-            multiSelect: false,
-            enableEmptyFilter: false,
-            defaultToFirstItem: false,
-            inverseSelection: false,
-            searchAllOptions: false,
-          },
-          defaultDataMask: {
-            filterState: { value: [FILTER_VALUE] },
-            extraFormData: {
-              filters: [{ col: FILTER_COLUMN, op: 'IN', val: [FILTER_VALUE] }],
-            },
-          },
-          cascadeParentIds: [],
-          scope: { rootPath: ['ROOT_ID'], excluded: [] },
+    // Preselect the filter value so it is already applied on the dashboard's
+    // first chart-data request — that request is what the assertions inspect.
+    const jsonMetadata = buildFilterJsonMetadata({
+      chartsInScope: [chartId],
+      nativeFilters: [
+        buildSelectFilter({
+          datasetId,
+          column: FILTER_COLUMN,
          chartsInScope: [chartId],
-        },
+          name: 'Gender',
+          defaultValue: FILTER_VALUE,
+        }),
      ],
-      chart_configuration: {},
-      cross_filters_enabled: false,
-      global_chart_configuration: {
-        scope: { rootPath: ['ROOT_ID'], excluded: [] },
-        chartsInScope: [chartId],
-      },
-    };
+    });
    const dashResp = await apiPostDashboard(page, {
      dashboard_title: `mixed_filter_repro_${Date.now()}`,
      published: true,
@@ -138,8 +124,7 @@ testWithAssets(
      json_metadata: JSON.stringify(jsonMetadata),
    });
    expect(dashResp.ok()).toBe(true);
-    const dashBody = await dashResp.json();
-    const dashboardId: number = dashBody.result?.id ?? dashBody.id;
+    const dashboardId = await extractIdFromResponse(dashResp);
    testAssets.trackDashboard(dashboardId);

    await apiPut(page, `api/v1/chart/${chartId}`, {
@@ -128,16 +128,15 @@ test('non-admin user can view a themed dashboard without 403 or infinite spinner

    // --- NON-ADMIN USER PHASE (page has no cached auth via test.use) ---

-    // 4. Instrument network: track any /api/v1/theme/ requests and 403 responses
+    // 4. Instrument network: track any /api/v1/theme/ request, with its status.
+    // Recording the status rather than asserting on a separate 403-only array
+    // keeps the diagnostic — a failure prints whether the calls were forbidden
+    // or merely unexpected — without a second, subsumed assertion.
    const themeApiRequests: string[] = [];
-    const forbiddenResponses: string[] = [];
    page.on('response', response => {
      const url = response.url();
      if (url.includes('/api/v1/theme/')) {
-        themeApiRequests.push(url);
-      }
-      if (response.status() === 403 && url.includes('/api/v1/theme/')) {
-        forbiddenResponses.push(url);
+        themeApiRequests.push(`${response.status()} ${url}`);
      }
    });

@@ -152,14 +151,19 @@ test('non-admin user can view a themed dashboard without 403 or infinite spinner
    const dashboardPage = new DashboardPage(page);
    await dashboardPage.gotoById(dashboardId!);

-    // 7. Assert dashboard fully loads (not stuck on infinite spinner)
+    // 7. Assert dashboard fully loads (not stuck on infinite spinner).
+    // The dashboard is created with no position_json, so its grid renders
+    // empty — there is no chart to wait for, only the grid itself.
    await dashboardPage.waitForLoad({ timeout: TIMEOUT.PAGE_LOAD });
-    await dashboardPage.waitForChartsToLoad();
+    await dashboardPage.waitForGridToLoad();

-    // 8. Assert no /api/v1/theme/ requests were made (theme data comes from dashboard response)
-    expect(themeApiRequests).toHaveLength(0);
-    // Assert no 403 responses on /api/v1/theme/ (scoped to avoid login/unrelated 403 noise)
-    expect(forbiddenResponses).toHaveLength(0);
+    // 8. A non-admin must render the themed dashboard without ever calling the
+    // theme API — theme data rides along on the dashboard response, and the
+    // endpoint itself is admin-only, so any call here would 403 and break them.
+    expect(
+      themeApiRequests,
+      'Non-admin dashboard load must not call the theme API',
+    ).toHaveLength(0);
  } finally {
    // Cleanup: delete test resources using admin context
    if (dashboardId) {
@@ -707,12 +707,8 @@ const config: ControlPanelConfig = {
                const extraColorChoices = hasTimeComparison
                  ? [
                      {
-                        value: ColorSchemeEnum.Green,
-                        label: t('Green for increase, red for decrease'),
-                      },
-                      {
-                        value: ColorSchemeEnum.Red,
-                        label: t('Red for increase, green for decrease'),
+                        label: t('Trend colors'),
+                        colors: [ColorSchemeEnum.Green, ColorSchemeEnum.Red],
                      },
                    ]
                  : [];
@@ -154,12 +154,8 @@ test('extraColorChoices included when time comparison is enabled', () => {

  expect(result.extraColorChoices).toEqual([
    {
-      value: ColorSchemeEnum.Green,
-      label: expect.stringContaining('Green for increase'),
-    },
-    {
-      value: ColorSchemeEnum.Red,
-      label: expect.stringContaining('Red for increase'),
+      label: expect.stringContaining('Trend colors'),
+      colors: [ColorSchemeEnum.Green, ColorSchemeEnum.Red],
    },
  ]);
  expect(result.columnOptions).not.toEqual(
@@ -28,6 +28,14 @@ import { convertUTCTimestampToLocal } from './utils';
 // Define a minimal constructor interface for use in this file.
 interface CalHeatMapInstance {
  init(config: Record<string, unknown>): void;
+  destroy(): null;
+}
+
+const calendarInstances = new WeakMap<HTMLElement, CalHeatMapInstance[]>();
+
+export function destroyCalendarInstances(element: HTMLElement) {
+  calendarInstances.get(element)?.forEach(calendar => calendar.destroy());
+  calendarInstances.delete(element);
 }
 const CalHeatMap = CalHeatMapImport as unknown as new () => CalHeatMapInstance;

@@ -82,6 +90,10 @@ function Calendar(element: HTMLElement, props: CalendarProps) {
    colorRangeStart,
  } = props;

+  destroyCalendarInstances(element);
+  const instances: CalHeatMapInstance[] = [];
+  calendarInstances.set(element, instances);
+
  const container = d3Select(element)
    .classed('superset-legacy-chart-calendar', true)
    .style('height', height);
@@ -120,12 +132,13 @@ function Calendar(element: HTMLElement, props: CalendarProps) {
    const colorScheme = getSequentialSchemeRegistry().get(linearColorScheme);
    const colorScale = colorScheme
      ? colorScheme.createLinearScale(extents)
-      : (_v: number) => '#ccc'; // fallback if scheme not found
+      : () => '#ccc'; // fallback if scheme not found

    const legend = d3Range(steps).map(i => extents[0] + step * i);
    const legendColors = legend.map(x => colorScale(x));

    const cal = new CalHeatMap();
+    instances.push(cal);
    cal.init({
      start: convertUTCTimestampToLocal(data.start),
      data: timestamps,
@@ -19,7 +19,13 @@
 import { reactify } from '@superset-ui/core';
 import { styled, css, useTheme } from '@apache-superset/core/theme';
 import { Global } from '@emotion/react';
-import Component from './Calendar';
+import Component, { destroyCalendarInstances } from './Calendar';
+
+function componentWillUnmount(this: { container?: HTMLDivElement }) {
+  if (this.container) {
+    destroyCalendarInstances(this.container);
+  }
+}

 // Type-erase the render function to allow flexible prop spreading in the wrapper.
 // The Calendar render function has typed props, but the wrapper passes props via spread
@@ -29,6 +35,7 @@ const ReactComponent = reactify(
    container: HTMLDivElement,
    props: Record<string, unknown>,
  ) => void,
+  { componentWillUnmount },
 );

 interface CalendarWrapperProps {
@@ -0,0 +1,20 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export const CALENDAR_TOOLTIP_CLASS = 'superset-legacy-chart-calendar-tooltip';
@@ -12,6 +12,7 @@
 import d3tip from 'd3-tip';
 import { t } from '@apache-superset/core/translation';
 import { getContrastingColor } from '@superset-ui/core';
+import { CALENDAR_TOOLTIP_CLASS } from '../tooltip';

 var d3 = typeof require === 'function' ? require('d3') : window.d3;

@@ -22,7 +23,7 @@ var CalHeatMap = function () {

  var self = this;
  self.tip = d3tip()
-    .attr('class', 'd3-tip')
+    .attr('class', `d3-tip ${CALENDAR_TOOLTIP_CLASS}`)
    .direction('n')
    .offset([-5, 0])
    .html(
@@ -33,7 +34,7 @@ var CalHeatMap = function () {
    `,
    );
  self.legendTip = d3tip()
-    .attr('class', 'd3-tip')
+    .attr('class', `d3-tip ${CALENDAR_TOOLTIP_CLASS}`)
    .direction('n')
    .offset([-5, 0])
    .html(d => self.options.valueFormatter(d));
@@ -3444,6 +3445,14 @@ CalHeatMap.prototype = {
  destroy: function (callback) {
    'use strict';

+    this.tip.destroy();
+    this.legendTip.destroy();
+
+    // init() can fail validation before creating the calendar root.
+    if (!this.root) {
+      return null;
+    }
+
    this.root
      .transition()
      .duration(this.options.animationDuration)
@@ -0,0 +1,585 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { Component, memo, StrictMode, type ReactNode } from 'react';
+import {
+  act,
+  cleanup,
+  render,
+  screen,
+  waitFor,
+} from 'spec/helpers/testing-library';
+import { CALENDAR_TOOLTIP_CLASS } from '../src/tooltip';
+
+interface MockCalHeatMapConfig {
+  itemSelector: Element;
+}
+
+type MetricNameInput = string | string[];
+
+let mockNextInstanceId = 0;
+let mockNextOwnerId = 0;
+let mockInitCallCount = 0;
+let mockThrowOnInitCall: number | null = null;
+let mockDestroyCallCount = 0;
+let mockDestroyedInstanceIds: string[] = [];
+
+const mockTheme = {
+  colorBgElevated: '#ffffff',
+};
+
+jest.mock('../src/vendor/cal-heatmap', () => ({
+  __esModule: true,
+  default: class MockCalHeatMap {
+    private instanceId?: string;
+
+    private tooltips: HTMLElement[] = [];
+
+    init(config: MockCalHeatMapConfig) {
+      const {
+        CALENDAR_TOOLTIP_CLASS: mockCalendarTooltipClass,
+      } = require('../src/tooltip');
+
+      mockInitCallCount += 1;
+      if (mockThrowOnInitCall === mockInitCallCount) {
+        throw new Error('Mock CalHeatMap init failure');
+      }
+
+      mockNextInstanceId += 1;
+      this.instanceId = String(mockNextInstanceId);
+
+      const owner = config.itemSelector.closest(
+        '.superset-legacy-chart-calendar',
+      ) as HTMLElement | null;
+      if (!owner) {
+        throw new Error('Expected tooltip owner calendar container');
+      }
+
+      if (!owner.dataset.tooltipOwner) {
+        mockNextOwnerId += 1;
+        owner.dataset.tooltipOwner = `calendar-owner-${mockNextOwnerId}`;
+      }
+
+      const { tooltipOwner } = owner.dataset;
+      if (!tooltipOwner) {
+        throw new Error('Expected owner-specific tooltip marker');
+      }
+
+      this.tooltips = [0, 1].map(index => {
+        const tooltip = global.document.createElement('div');
+        tooltip.className = ['d3-tip', mockCalendarTooltipClass].join(' ');
+        tooltip.dataset.tooltipOwner = tooltipOwner;
+        tooltip.dataset.tooltipInstance = this.instanceId;
+        tooltip.dataset.tooltipIndex = String(index);
+        tooltip.textContent = `${tooltipOwner}-tooltip-${this.instanceId}-${index}`;
+        global.document.body.appendChild(tooltip);
+        return tooltip;
+      });
+    }
+
+    destroy() {
+      mockDestroyCallCount += 1;
+      if (this.instanceId) {
+        mockDestroyedInstanceIds.push(this.instanceId);
+      }
+      this.tooltips.forEach(tooltip => tooltip.remove());
+      this.tooltips = [];
+      return null;
+    }
+  },
+}));
+
+const ReactCalendar = require('../src/ReactCalendar').default;
+const Calendar = require('../src/Calendar').default;
+
+interface CalendarHarnessProps {
+  firstMetricNames: MetricNameInput;
+  secondMetricNames?: MetricNameInput;
+  showFirstCalendar?: boolean;
+}
+
+interface CalendarErrorBoundaryProps {
+  children: ReactNode;
+}
+
+interface CalendarErrorBoundaryState {
+  hasError: boolean;
+}
+
+const CALENDAR_START = 1704067200000;
+
+function createCalendarProps(metricNames: MetricNameInput) {
+  const normalizedMetricNames = Array.isArray(metricNames)
+    ? metricNames
+    : [metricNames];
+
+  return {
+    data: {
+      data: Object.fromEntries(
+        normalizedMetricNames.map((metricName, index) => [
+          metricName,
+          {
+            [String(CALENDAR_START)]: index * 2 + 1,
+            [String(CALENDAR_START + 86400000)]: index * 2 + 2,
+          },
+        ]),
+      ),
+      domain: 'month',
+      range: 1,
+      start: CALENDAR_START,
+      subdomain: 'day',
+    },
+    height: 160,
+    domainGranularity: 'month',
+    linearColorScheme: 'schemeRdYlBu',
+    showLegend: false,
+    showMetricName: true,
+    showValues: false,
+    steps: 3,
+    subdomainGranularity: 'day',
+    timeFormatter: (value: number | string) => String(value),
+    valueFormatter: (value: number) => String(value),
+    verboseMap: Object.fromEntries(
+      normalizedMetricNames.map(metricName => [metricName, metricName]),
+    ),
+  };
+}
+
+class CalendarErrorBoundary extends Component<
+  CalendarErrorBoundaryProps,
+  CalendarErrorBoundaryState
+> {
+  state: CalendarErrorBoundaryState = {
+    hasError: false,
+  };
+
+  static getDerivedStateFromError() {
+    return { hasError: true };
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return <div>Calendar fallback</div>;
+    }
+
+    return this.props.children;
+  }
+}
+
+const StableSecondCalendar = memo(function StableSecondCalendar({
+  metricNames,
+}: {
+  metricNames: MetricNameInput;
+}) {
+  return (
+    <div data-test="calendar-second">
+      <ReactCalendar {...createCalendarProps(metricNames)} />
+    </div>
+  );
+});
+
+function CalendarHarness({
+  firstMetricNames,
+  secondMetricNames = 'second-metric',
+  showFirstCalendar = true,
+}: CalendarHarnessProps) {
+  return (
+    <>
+      {showFirstCalendar ? (
+        <div data-test="calendar-first">
+          <ReactCalendar {...createCalendarProps(firstMetricNames)} />
+        </div>
+      ) : null}
+      <StableSecondCalendar metricNames={secondMetricNames} />
+    </>
+  );
+}
+
+function getCalendarOwner(testId: string) {
+  const owner = screen
+    .getByTestId(testId)
+    .querySelector('.superset-legacy-chart-calendar');
+
+  if (!(owner instanceof HTMLElement)) {
+    throw new Error(`Expected mounted calendar owner for ${testId}`);
+  }
+
+  return owner;
+}
+
+function getTooltipOwnerId(owner: HTMLElement) {
+  const tooltipOwnerId = owner.dataset.tooltipOwner;
+
+  if (!tooltipOwnerId) {
+    throw new Error('Expected mounted calendar to have a tooltip owner id');
+  }
+
+  return tooltipOwnerId;
+}
+
+function getOwnerTooltips(tooltipOwnerId: string) {
+  return Array.from(
+    document.querySelectorAll<HTMLElement>(
+      `.d3-tip[data-tooltip-owner="${tooltipOwnerId}"]`,
+    ),
+  );
+}
+
+function getCalendarTooltips() {
+  return Array.from(
+    document.querySelectorAll<HTMLElement>(`.${CALENDAR_TOOLTIP_CLASS}`),
+  );
+}
+
+function getTooltipInstanceIds(tooltips: HTMLElement[]) {
+  return Array.from(
+    new Set(tooltips.map(tooltip => tooltip.dataset.tooltipInstance)),
+  )
+    .filter((tooltipInstanceId): tooltipInstanceId is string =>
+      Boolean(tooltipInstanceId),
+    )
+    .sort();
+}
+
+function getSingleTooltipInstanceId(tooltips: HTMLElement[]) {
+  const tooltipInstanceIds = getTooltipInstanceIds(tooltips);
+
+  expect(tooltipInstanceIds).toHaveLength(1);
+
+  return tooltipInstanceIds[0];
+}
+
+function flushPendingTimersIfNeeded() {
+  try {
+    act(() => {
+      jest.runOnlyPendingTimers();
+    });
+  } catch {
+    // Ignore tests that did not opt into fake timers.
+  }
+}
+
+afterEach(() => {
+  cleanup();
+  flushPendingTimersIfNeeded();
+  jest.useRealTimers();
+  mockNextInstanceId = 0;
+  mockNextOwnerId = 0;
+  mockInitCallCount = 0;
+  mockThrowOnInitCall = null;
+  mockDestroyCallCount = 0;
+  mockDestroyedInstanceIds = [];
+  document.body.innerHTML = '';
+});
+
+test('rerender and unmount clean up only the affected calendar tooltips', () => {
+  jest.useFakeTimers();
+
+  const { rerender, unmount } = render(
+    <CalendarHarness firstMetricNames="first-metric-initial" />,
+  );
+
+  const firstCalendarOwner = getCalendarOwner('calendar-first');
+  const secondCalendarOwner = getCalendarOwner('calendar-second');
+
+  const firstTooltipOwnerId = getTooltipOwnerId(firstCalendarOwner);
+  const secondTooltipOwnerId = getTooltipOwnerId(secondCalendarOwner);
+
+  const firstInitialTooltips = getOwnerTooltips(firstTooltipOwnerId);
+  const secondInitialTooltips = getOwnerTooltips(secondTooltipOwnerId);
+
+  expect(firstInitialTooltips).toHaveLength(2);
+  expect(secondInitialTooltips).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    4,
+  );
+
+  const firstInitialInstanceId =
+    getSingleTooltipInstanceId(firstInitialTooltips);
+  const secondInitialInstanceId = getSingleTooltipInstanceId(
+    secondInitialTooltips,
+  );
+
+  rerender(<CalendarHarness firstMetricNames="first-metric-rerendered" />);
+
+  const firstRerenderedTooltips = getOwnerTooltips(firstTooltipOwnerId);
+  const secondPreservedTooltips = getOwnerTooltips(secondTooltipOwnerId);
+
+  expect(firstRerenderedTooltips).toHaveLength(2);
+  expect(secondPreservedTooltips).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    4,
+  );
+  expect(firstInitialTooltips.every(tooltip => !tooltip.isConnected)).toBe(
+    true,
+  );
+  expect(secondInitialTooltips.every(tooltip => tooltip.isConnected)).toBe(
+    true,
+  );
+
+  expect(getSingleTooltipInstanceId(firstRerenderedTooltips)).not.toEqual(
+    firstInitialInstanceId,
+  );
+  expect(getSingleTooltipInstanceId(secondPreservedTooltips)).toEqual(
+    secondInitialInstanceId,
+  );
+
+  rerender(
+    <CalendarHarness
+      firstMetricNames="first-metric-rerendered"
+      showFirstCalendar={false}
+    />,
+  );
+
+  expect(getOwnerTooltips(firstTooltipOwnerId)).toHaveLength(0);
+  expect(getOwnerTooltips(secondTooltipOwnerId)).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    2,
+  );
+  expect(
+    getSingleTooltipInstanceId(getOwnerTooltips(secondTooltipOwnerId)),
+  ).toEqual(secondInitialInstanceId);
+
+  unmount();
+});
+
+test('multi-metric calendar rerender and unmount clean up every owned tooltip while preserving siblings', () => {
+  jest.useFakeTimers();
+
+  const { rerender, unmount } = render(
+    <CalendarHarness
+      firstMetricNames={['first-metric-a', 'first-metric-b']}
+      secondMetricNames="second-metric-initial"
+    />,
+  );
+
+  const firstCalendarOwner = getCalendarOwner('calendar-first');
+  const secondCalendarOwner = getCalendarOwner('calendar-second');
+
+  const firstTooltipOwnerId = getTooltipOwnerId(firstCalendarOwner);
+  const secondTooltipOwnerId = getTooltipOwnerId(secondCalendarOwner);
+
+  const firstInitialTooltips = getOwnerTooltips(firstTooltipOwnerId);
+  const secondInitialTooltips = getOwnerTooltips(secondTooltipOwnerId);
+
+  expect(firstInitialTooltips).toHaveLength(4);
+  expect(secondInitialTooltips).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    6,
+  );
+
+  const firstInitialInstanceIds = getTooltipInstanceIds(firstInitialTooltips);
+  const secondInitialInstanceIds = getTooltipInstanceIds(secondInitialTooltips);
+
+  expect(firstInitialInstanceIds).toHaveLength(2);
+  expect(secondInitialInstanceIds).toHaveLength(1);
+
+  rerender(
+    <CalendarHarness
+      firstMetricNames={['first-metric-c', 'first-metric-d']}
+      secondMetricNames="second-metric-initial"
+    />,
+  );
+
+  const firstRerenderedTooltips = getOwnerTooltips(firstTooltipOwnerId);
+  const secondPreservedTooltips = getOwnerTooltips(secondTooltipOwnerId);
+
+  expect(firstRerenderedTooltips).toHaveLength(4);
+  expect(secondPreservedTooltips).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    6,
+  );
+  expect(firstInitialTooltips.every(tooltip => !tooltip.isConnected)).toBe(
+    true,
+  );
+  expect(secondInitialTooltips.every(tooltip => tooltip.isConnected)).toBe(
+    true,
+  );
+
+  expect(getTooltipInstanceIds(firstRerenderedTooltips)).toHaveLength(2);
+  expect(getTooltipInstanceIds(firstRerenderedTooltips)).not.toEqual(
+    firstInitialInstanceIds,
+  );
+  expect(getTooltipInstanceIds(secondPreservedTooltips)).toEqual(
+    secondInitialInstanceIds,
+  );
+
+  rerender(
+    <CalendarHarness
+      firstMetricNames={['first-metric-c', 'first-metric-d']}
+      secondMetricNames="second-metric-initial"
+      showFirstCalendar={false}
+    />,
+  );
+
+  expect(getOwnerTooltips(firstTooltipOwnerId)).toHaveLength(0);
+  expect(getOwnerTooltips(secondTooltipOwnerId)).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    2,
+  );
+  expect(getTooltipInstanceIds(getOwnerTooltips(secondTooltipOwnerId))).toEqual(
+    secondInitialInstanceIds,
+  );
+
+  unmount();
+});
+
+test('Calendar destroys previously initialized metric instances after a later metric init failure', () => {
+  const calendarOwner = document.createElement('div');
+  document.body.appendChild(calendarOwner);
+
+  mockThrowOnInitCall = 2;
+
+  expect(() => {
+    Calendar(calendarOwner, {
+      ...createCalendarProps(['failing-metric-a', 'failing-metric-b']),
+      theme: mockTheme,
+    });
+  }).toThrow('Mock CalHeatMap init failure');
+
+  const failedRenderTooltips = getOwnerTooltips(
+    getTooltipOwnerId(calendarOwner),
+  );
+  const failedRenderInstanceIds = getTooltipInstanceIds(failedRenderTooltips);
+
+  expect(failedRenderTooltips).toHaveLength(2);
+  expect(failedRenderInstanceIds).toHaveLength(1);
+
+  mockThrowOnInitCall = null;
+  Calendar(calendarOwner, {
+    ...createCalendarProps('recovered-metric'),
+    theme: mockTheme,
+  });
+
+  const recoveredTooltips = getOwnerTooltips(getTooltipOwnerId(calendarOwner));
+
+  expect(failedRenderTooltips.every(tooltip => !tooltip.isConnected)).toBe(
+    true,
+  );
+  expect(recoveredTooltips).toHaveLength(2);
+  expect(getTooltipInstanceIds(recoveredTooltips)).not.toEqual(
+    failedRenderInstanceIds,
+  );
+});
+
+test('surviving calendar rerender preserves sibling cleanup after another calendar unmounts', () => {
+  jest.useFakeTimers();
+
+  const { rerender, unmount } = render(
+    <CalendarHarness
+      firstMetricNames="first-metric-initial"
+      secondMetricNames="second-metric-initial"
+    />,
+  );
+
+  const firstCalendarOwner = getCalendarOwner('calendar-first');
+  const secondCalendarOwner = getCalendarOwner('calendar-second');
+
+  const firstTooltipOwnerId = getTooltipOwnerId(firstCalendarOwner);
+  const secondTooltipOwnerId = getTooltipOwnerId(secondCalendarOwner);
+
+  const secondInitialInstanceId = getSingleTooltipInstanceId(
+    getOwnerTooltips(secondTooltipOwnerId),
+  );
+
+  rerender(
+    <CalendarHarness
+      firstMetricNames="first-metric-initial"
+      secondMetricNames="second-metric-initial"
+      showFirstCalendar={false}
+    />,
+  );
+
+  expect(getOwnerTooltips(firstTooltipOwnerId)).toHaveLength(0);
+  expect(getOwnerTooltips(secondTooltipOwnerId)).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    2,
+  );
+
+  rerender(
+    <CalendarHarness
+      firstMetricNames="first-metric-initial"
+      secondMetricNames="second-metric-rerendered"
+      showFirstCalendar={false}
+    />,
+  );
+
+  const secondRerenderedTooltips = getOwnerTooltips(secondTooltipOwnerId);
+
+  expect(getOwnerTooltips(firstTooltipOwnerId)).toHaveLength(0);
+  expect(secondRerenderedTooltips).toHaveLength(2);
+  expect(document.querySelectorAll(`.${CALENDAR_TOOLTIP_CLASS}`)).toHaveLength(
+    2,
+  );
+  expect(getSingleTooltipInstanceId(secondRerenderedTooltips)).not.toEqual(
+    secondInitialInstanceId,
+  );
+
+  unmount();
+});
+
+test('StrictMode unmount cleans up calendar tooltips for multi-metric calendars', () => {
+  const { unmount } = render(
+    <StrictMode>
+      <ReactCalendar
+        {...createCalendarProps(['strict-metric-a', 'strict-metric-b'])}
+      />
+    </StrictMode>,
+  );
+
+  expect(getCalendarTooltips()).toHaveLength(4);
+
+  unmount();
+
+  expect(getCalendarTooltips()).toHaveLength(0);
+});
+
+test('ErrorBoundary fallback destroys partially initialized tooltips after a later init failure', async () => {
+  const consoleErrorSpy = jest
+    .spyOn(console, 'error')
+    .mockImplementation(() => undefined);
+
+  mockThrowOnInitCall = 2;
+
+  try {
+    const { unmount } = render(
+      <CalendarErrorBoundary>
+        <ReactCalendar
+          {...createCalendarProps(['failing-metric-a', 'failing-metric-b'])}
+        />
+      </CalendarErrorBoundary>,
+    );
+
+    await waitFor(() => {
+      expect(screen.getByText('Calendar fallback')).toBeInTheDocument();
+    });
+
+    await waitFor(() => {
+      expect(getCalendarTooltips()).toHaveLength(0);
+    });
+
+    expect(mockDestroyCallCount).toBe(2);
+    expect(mockDestroyedInstanceIds).toEqual(['1']);
+
+    unmount();
+
+    expect(getCalendarTooltips()).toHaveLength(0);
+  } finally {
+    consoleErrorSpy.mockRestore();
+  }
+});
@@ -0,0 +1,136 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { CALENDAR_TOOLTIP_CLASS } from '../src/tooltip';
+
+// The vendor file is @ts-nocheck, so its export lacks type info.
+// Mirror the minimal constructor interface defined in Calendar.ts.
+interface CalHeatMapInstance {
+  init(config: Record<string, unknown>): void;
+  destroy(): null;
+}
+
+const createSVGPointDescriptor = Object.getOwnPropertyDescriptor(
+  window.SVGSVGElement.prototype,
+  'createSVGPoint',
+);
+
+function installCreateSVGPointMock() {
+  Object.defineProperty(window.SVGSVGElement.prototype, 'createSVGPoint', {
+    configurable: true,
+    value: () => ({
+      matrixTransform: () => ({ x: 0, y: 0 }),
+    }),
+  });
+}
+
+function restoreCreateSVGPointMock() {
+  if (createSVGPointDescriptor) {
+    Object.defineProperty(
+      window.SVGSVGElement.prototype,
+      'createSVGPoint',
+      createSVGPointDescriptor,
+    );
+  } else {
+    delete (
+      window.SVGSVGElement.prototype as Partial<
+        Pick<SVGSVGElement, 'createSVGPoint'>
+      >
+    ).createSVGPoint;
+  }
+}
+
+function getCalendarTooltips() {
+  return Array.from(
+    document.querySelectorAll<HTMLElement>(`.${CALENDAR_TOOLTIP_CLASS}`),
+  );
+}
+
+afterEach(() => {
+  jest.resetModules();
+  restoreCreateSVGPointMock();
+  document.body.innerHTML = '';
+});
+
+test('CalHeatMap destroy tolerates partially initialized instances', () => {
+  let CalHeatMap!: new () => CalHeatMapInstance;
+  jest.isolateModules(() => {
+    // eslint-disable-next-line global-require
+    CalHeatMap = require('../src/vendor/cal-heatmap')
+      .default as new () => CalHeatMapInstance;
+  });
+
+  const partiallyInitializedHeatmap = new CalHeatMap();
+
+  expect(() => partiallyInitializedHeatmap.destroy()).not.toThrow();
+  expect(getCalendarTooltips()).toHaveLength(0);
+});
+
+test('CalHeatMap destroy removes only the destroyed instance tooltips', () => {
+  installCreateSVGPointMock();
+
+  let CalHeatMap!: new () => CalHeatMapInstance;
+  jest.isolateModules(() => {
+    // eslint-disable-next-line global-require
+    CalHeatMap = require('../src/vendor/cal-heatmap')
+      .default as new () => CalHeatMapInstance;
+  });
+
+  const firstCalendar = document.createElement('div');
+  const secondCalendar = document.createElement('div');
+  document.body.append(firstCalendar, secondCalendar);
+
+  const firstHeatmap = new CalHeatMap();
+  firstHeatmap.init({
+    itemSelector: firstCalendar,
+    paintOnLoad: false,
+    tooltip: true,
+    valueFormatter: String,
+    timeFormatter: String,
+  });
+
+  const firstTooltips = getCalendarTooltips();
+  expect(firstTooltips).toHaveLength(2);
+
+  const secondHeatmap = new CalHeatMap();
+  secondHeatmap.init({
+    itemSelector: secondCalendar,
+    paintOnLoad: false,
+    tooltip: true,
+    valueFormatter: String,
+    timeFormatter: String,
+  });
+
+  const allTooltips = getCalendarTooltips();
+  const secondTooltips = allTooltips.filter(
+    tooltip => !firstTooltips.includes(tooltip),
+  );
+
+  expect(secondTooltips).toHaveLength(2);
+
+  firstHeatmap.destroy();
+
+  expect(firstTooltips.every(tooltip => !tooltip.isConnected)).toBe(true);
+  expect(secondTooltips.every(tooltip => tooltip.isConnected)).toBe(true);
+  expect(getCalendarTooltips()).toHaveLength(2);
+
+  secondHeatmap.destroy();
+
+  expect(getCalendarTooltips()).toHaveLength(0);
+});
@@ -690,11 +690,11 @@ export default function transformProps(
      })()
    : xAxisFormatter;

+  const yAxisTitleMarginPx = convertInteger(yAxisTitleMargin);
+  const xAxisTitleMarginPx = convertInteger(xAxisTitleMargin);
  const addYAxisTitleOffset =
-    !!(yAxisTitle || yAxisTitleSecondary) &&
-    convertInteger(yAxisTitleMargin) !== 0;
-  const addXAxisTitleOffset =
-    !!xAxisTitle && convertInteger(xAxisTitleMargin) !== 0;
+    !!(yAxisTitle || yAxisTitleSecondary) && yAxisTitleMarginPx !== 0;
+  const addXAxisTitleOffset = !!xAxisTitle && xAxisTitleMarginPx !== 0;
  const baseChartPadding = getPadding(
    showLegend,
    legendOrientation,
@@ -703,8 +703,8 @@ export default function transformProps(
    legendMargin,
    addXAxisTitleOffset,
    yAxisTitlePosition,
-    convertInteger(yAxisTitleMargin),
-    convertInteger(xAxisTitleMargin),
+    yAxisTitleMarginPx,
+    xAxisTitleMarginPx,
  );
  const legendData = series
    .filter(
@@ -748,8 +748,8 @@ export default function transformProps(
    effectiveLegendMargin,
    addXAxisTitleOffset,
    yAxisTitlePosition,
-    convertInteger(yAxisTitleMargin),
-    convertInteger(xAxisTitleMargin),
+    yAxisTitleMarginPx,
+    xAxisTitleMarginPx,
  );

  const { setDataMask = () => {}, onContextMenu } = hooks;
@@ -764,7 +764,7 @@ export default function transformProps(
    xAxis: {
      type: xAxisType,
      name: xAxisTitle,
-      nameGap: convertInteger(xAxisTitleMargin),
+      nameGap: xAxisTitleMarginPx,
      nameLocation: 'middle',
      axisLabel: {
        hideOverlap: !(xAxisType === AxisType.Time && xAxisLabelRotation !== 0),
@@ -821,7 +821,7 @@ export default function transformProps(
        },
        scale: truncateYAxis,
        name: yAxisTitle,
-        nameGap: convertInteger(yAxisTitleMargin),
+        nameGap: yAxisTitleMarginPx,
        nameLocation: yAxisTitlePosition === 'Left' ? 'middle' : 'end',
        alignTicks,
      },
@@ -844,6 +844,8 @@ export default function transformProps(
        },
        scale: truncateYAxis,
        name: yAxisTitleSecondary,
+        nameGap: yAxisTitleMarginPx,
+        nameLocation: yAxisTitlePosition === 'Left' ? 'middle' : 'end',
        alignTicks,
      },
    ],
@@ -55,15 +55,19 @@ import { getDefaultTooltip } from '../utils/tooltip';
 import { Refs } from '../types';
 import { getContributionLabel } from './utils';

-const percentFormatter = getNumberFormatter(NumberFormats.PERCENT_2_POINT);
+const defaultPercentFormatter = getNumberFormatter(
+  NumberFormats.PERCENT_2_POINT,
+);

 export function parseParams({
  params,
  numberFormatter,
+  percentFormatter = defaultPercentFormatter,
  sanitizeName = false,
 }: {
  params: Pick<CallbackDataParams, 'name' | 'value' | 'percent'>;
  numberFormatter: ValueFormatter;
+  percentFormatter?: ValueFormatter;
  sanitizeName?: boolean;
 }): string[] {
  const { name: rawName = '', value, percent } = params;
@@ -296,6 +300,9 @@ export default function transformProps(
    currencyCodeColumn,
    detectedCurrency,
  );
+  const percentFormatter = numberFormat?.endsWith('%')
+    ? getNumberFormatter(numberFormat)
+    : defaultPercentFormatter;

  let data = rawData;
  const otherRows: DataRecord[] = [];
@@ -446,6 +453,7 @@ export default function transformProps(
    const [name, formattedValue, formattedPercent] = parseParams({
      params,
      numberFormatter,
+      percentFormatter,
    });
    switch (labelType) {
      case EchartsPieLabelType.Key:
@@ -566,6 +574,7 @@ export default function transformProps(
        const [name, formattedValue, formattedPercent] = parseParams({
          params,
          numberFormatter,
+          percentFormatter,
          sanitizeName: true,
        });
        if (params?.data?.isOther) {
@@ -318,6 +318,14 @@ export default function transformProps(
      rebaseToPercentChange(forecastRebasedData, xAxisLabel || DTTM_ALIAS)
    : forecastRebasedData;
  const isHorizontal = orientation === OrientationType.Horizontal;
+  // rebasedData's keys have already been through rebaseForecastDatum, which
+  // renames a key to its verboseMap entry when one is configured for that
+  // metric. extraMetricLabels must be mapped the same way, or a sort-only
+  // metric with a verbose_name set would silently fail to match here (and in
+  // extractSeries below, which has the same requirement).
+  const extraMetricLabels = extractExtraMetrics(chartProps.rawFormData)
+    .map(getMetricLabel)
+    .map(label => verboseMap[label] ?? label);
  const { totalStackedValues, thresholdValues } = extractDataTotalValues(
    rebasedData,
    {
@@ -325,11 +333,9 @@ export default function transformProps(
      percentageThreshold,
      xAxisCol: xAxisLabel,
      legendState,
+      extraMetricLabels,
    },
  );
-  const extraMetricLabels = extractExtraMetrics(chartProps.rawFormData).map(
-    getMetricLabel,
-  );

  const isMultiSeries = groupBy.length || metrics?.length > 1;
  const xAxisDataType = dataTypes?.[xAxisLabel] ?? dataTypes?.[xAxisOrig];
@@ -296,7 +296,13 @@ function Echart(
            }
          : {};

+      // ECharts' built-in ARIA descriptions are off by default so behavior
+      // doesn't change for existing deployments; a theme or chart's options
+      // can opt in (or further customize aria handling) by overriding this.
+      const ariaDefault = { aria: { enabled: false } };
+
      const themedEchartOptions = mergeEchartsThemeOverrides(
+        ariaDefault,
        baseTheme,
        echartOptions,
        globalOverrides,
@@ -387,6 +387,7 @@ export function extractDataTotalValues(
    percentageThreshold: number;
    xAxisCol: string;
    legendState?: LegendState;
+    extraMetricLabels?: string[];
  },
 ): {
  totalStackedValues: number[];
@@ -394,11 +395,18 @@ export function extractDataTotalValues(
 } {
  const totalStackedValues: number[] = [];
  const thresholdValues: number[] = [];
-  const { stack, percentageThreshold, xAxisCol, legendState } = opts;
+  const {
+    stack,
+    percentageThreshold,
+    xAxisCol,
+    legendState,
+    extraMetricLabels,
+  } = opts;
+  const excludedKeys = new Set([xAxisCol, ...(extraMetricLabels ?? [])]);
  if (stack) {
    data.forEach(datum => {
      const values = Object.keys(datum).reduce((prev, curr) => {
-        if (curr === xAxisCol) {
+        if (excludedKeys.has(curr)) {
          return prev;
        }
        if (legendState && !legendState[curr]) {
@@ -1243,3 +1243,55 @@ test('regression #37921: multi-metric Query A with groupby does not duplicate fi
    expect(name).not.toMatch(/score_one,\s+score_two/);
  }
 });
+
+test('y-axis title position: Left sets nameLocation to middle', () => {
+  const chartProps = createEchartsTimeseriesTestChartProps<
+    EchartsMixedTimeseriesFormData,
+    EchartsMixedTimeseriesProps
+  >({
+    ...MIXED_TIMESERIES_CHART_PROPS_DEFAULTS,
+    defaultQueriesData: queriesData,
+    formData: {
+      ...formData,
+      yAxisTitlePosition: 'Left',
+      yAxisTitleMargin: 20,
+    },
+    queriesData,
+  });
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+  const yAxis = transformed.echartOptions.yAxis as Array<{
+    nameGap: number;
+    nameLocation: string;
+  }>;
+
+  expect(yAxis[0].nameGap).toEqual(20);
+  expect(yAxis[0].nameLocation).toEqual('middle');
+  expect(yAxis[1].nameGap).toEqual(20);
+  expect(yAxis[1].nameLocation).toEqual('middle');
+});
+
+test('y-axis title position: non-Left sets nameLocation to end', () => {
+  const chartProps = createEchartsTimeseriesTestChartProps<
+    EchartsMixedTimeseriesFormData,
+    EchartsMixedTimeseriesProps
+  >({
+    ...MIXED_TIMESERIES_CHART_PROPS_DEFAULTS,
+    defaultQueriesData: queriesData,
+    formData: {
+      ...formData,
+      yAxisTitlePosition: 'Top',
+      yAxisTitleMargin: 30,
+    },
+    queriesData,
+  });
+  const transformed = transformProps(chartProps as EchartsMixedTimeseriesProps);
+  const yAxis = transformed.echartOptions.yAxis as Array<{
+    nameGap: number;
+    nameLocation: string;
+  }>;
+
+  expect(yAxis[0].nameGap).toEqual(30);
+  expect(yAxis[0].nameLocation).toEqual('end');
+  expect(yAxis[1].nameGap).toEqual(30);
+  expect(yAxis[1].nameLocation).toEqual('end');
+});
@@ -311,6 +311,26 @@ describe('Pie label string template', () => {
    ).toEqual('Tablet:123,456\n55.50%');
  });

+  test('should format percentages using a percentage number format', () => {
+    expect(
+      format({
+        label_type: 'template',
+        label_template: '{name}:{value}\n{percent}',
+        number_format: '.1%',
+      }),
+    ).toEqual('Tablet:12345600.0%\n55.5%');
+  });
+
+  test('should use the default percentage format when number format is absent', () => {
+    expect(
+      format({
+        label_type: 'template',
+        label_template: '{name}:{value}\n{percent}',
+        number_format: undefined,
+      }),
+    ).toEqual('Tablet:123k\n55.50%');
+  });
+
  test('should be compatible with ECharts raw variable syntax', () => {
    expect(
      format({
@@ -755,6 +755,55 @@ describe('Does transformProps transform series correctly', () => {
    });
  });

+  test('should exclude a verbose-named sort-only metric from the stacked total (#42881)', () => {
+    // rebaseForecastDatum renames a data column to its verboseMap entry when
+    // one is configured, so extraMetricLabels (derived from raw metric
+    // labels) must be resolved through the same verboseMap to still match —
+    // otherwise the sort-only metric's value leaks back into the total.
+    const sortMetricVerboseMap = { sort_metric: 'Sort By Metric' };
+    const sortFormData: SqlaFormData = {
+      ...formData,
+      onlyTotal: true,
+      groupby: [],
+      metrics: ['San Francisco', 'New York', 'Boston'],
+      timeseries_limit_metric: 'sort_metric',
+      x_axis_sort: 'sort_metric',
+    };
+    const sortQueriesData: ChartDataResponseResult[] = [
+      createTestQueryData(
+        createTestData(
+          [
+            {
+              'San Francisco': 32,
+              'New York': 0,
+              Boston: 0,
+              'Sort By Metric': 2,
+            },
+          ],
+          { intervalMs: 300000000 },
+        ),
+      ),
+    ];
+    const chartProps = createTestChartProps({
+      formData: sortFormData,
+      queriesData: sortQueriesData,
+      datasource: { verboseMap: sortMetricVerboseMap },
+    });
+
+    const transformedSeries = transformProps(chartProps).echartOptions
+      .series as seriesType[];
+
+    const totalLabels = transformedSeries
+      .flatMap((series, seriesIndex) =>
+        series.data.map((value, dataIndex) =>
+          series.label.formatter({ value, dataIndex, seriesIndex }),
+        ),
+      )
+      .filter(label => label !== '');
+
+    expect(totalLabels).toEqual(['32']);
+  });
+
  test('should show labels on values >= percentageThreshold if onlyTotal is false', () => {
    const chartProps = createTestChartProps({ formData, queriesData });

--- a/Show More
+++ b/Show More