Skip to content

Conversation

@shuoweil
Copy link
Contributor

@shuoweil shuoweil commented Jan 6, 2026

The table now automatically adapts to dark and light themes in environments like Colab and VS Code for anywidget mode.

Verified at:

  1. vs code notebook:
  • light mode: screen/5ne2xKyq6JGR5VQ
  • dark mode: screen/8cq6y3ugbs5wN3T
  1. colab notebook:
  • light mode: screen/92W8xCdjGtfkQgo
  • dark mode: screen/4uYykxKA7wTuhot

Fixes #<460861328> 🦕

    - Updates table_widget.css to use CSS variables for colors where possible.
    - Adds @media (prefers-color-scheme: dark) block to handle dark mode overrides.
    - Updates text and background colors to be legible in dark mode.
    - Adds unit test to verify CSS contains dark mode media query.
- Update TableWidget CSS with variables and media queries for dark mode.
- Pass CSS content via a new 'css_styles' traitlet to ensure reliable loading.
- Implement robust JavaScript logic to detect VS Code dark themes and
  recursively clear ancestor backgrounds, eliminating the 'white frame' issue.
- Reformat CSS and JS files to comply with project style guides.
- Add unit test for CSS traitlet population.
@shuoweil shuoweil self-assigned this Jan 6, 2026
@shuoweil shuoweil requested review from a team as code owners January 6, 2026 00:22
@shuoweil shuoweil requested a review from chelsea-lin January 6, 2026 00:22
@product-auto-label product-auto-label bot added size: l Pull request size is large. api: bigquery Issues related to the googleapis/python-bigquery-dataframes API. labels Jan 6, 2026
@shuoweil shuoweil marked this pull request as draft January 6, 2026 00:22
@shuoweil shuoweil removed the request for review from chelsea-lin January 6, 2026 00:22
@shuoweil shuoweil changed the title feat: Add dark mode and multi-column sort to anywidget feat: Add dark mode to anywidget mode Jan 6, 2026
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did not rewrite this file, I just reformat this file. In addition to the reformatting, a new set of tests for the dark mode "Theme detection" feature was also added. The newly added tests in table_widget.test.js are:

  • should add bigframes-dark-mode class in dark mode
  • should not add bigframes-dark-mode class in light mode

@product-auto-label product-auto-label bot added size: xl Pull request size is extra large. and removed size: l Pull request size is large. labels Jan 6, 2026
@shuoweil shuoweil requested a review from tswast January 6, 2026 20:11
@shuoweil shuoweil marked this pull request as ready for review January 6, 2026 21:39
Copy link
Collaborator

@tswast tswast left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks!

@shuoweil shuoweil enabled auto-merge (squash) January 7, 2026 22:30
@shuoweil shuoweil merged commit 2763b41 into main Jan 7, 2026
20 of 26 checks passed
@shuoweil shuoweil deleted the shuowei-anywidget-add-color-theme branch January 7, 2026 23:09
chelsea-lin added a commit that referenced this pull request Jan 22, 2026
PR created by the Librarian CLI to initialize a release. Merging this PR
will auto trigger a release.

Librarian Version: v0.7.0
Language Image:
us-central1-docker.pkg.dev/cloud-sdk-librarian-prod/images-prod/python-librarian-generator@sha256:e7cc6823efb073a8a26e7cefdd869f12ec228abfbd2a44aa9a7eacc284023677
<details><summary>bigframes: 2.33.0</summary>

##
[2.33.0](v2.32.0...v2.33.0)
(2026-01-22)

### Features

* add bigquery.ml.transform function (#2394)
([1f9ee37](1f9ee373))

* Add dark mode to anywidget mode (#2365)
([2763b41](2763b41d))

* Add max_columns control for anywidget mode (#2374)
([34b5975](34b5975f))

* Configure Biome for Consistent Code Style (#2364)
([81e27b3](81e27b3d))

* Add BigQuery ObjectRef functions to `bigframes.bigquery.obj` (#2380)
([9c3bbc3](9c3bbc36))

* Stabilize interactive table height to prevent notebook layout shifts
(#2378)
([a634e97](a634e976))

### Bug Fixes

* implement retry logic for cloud function endpoint fetching (#2369)
([0f593c2](0f593c27))

* Throw if write api commit op has stream_errors (#2385)
([7abfef0](7abfef05))

### Performance Improvements

* Avoid requery for some result downsample methods (#2219)
([95763ff](95763ff2))

</details>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

api: bigquery Issues related to the googleapis/python-bigquery-dataframes API. size: xl Pull request size is extra large.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants