Add chartDivergingColors theming config option#13581
Add chartDivergingColors theming config option#13581sfc-gh-mbarnes merged 10 commits intodevelopfrom
chartDivergingColors theming config option#13581Conversation
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
✅ PR preview is ready!
|
There was a problem hiding this comment.
Pull request overview
This pull request adds a new chartDivergingColors theming configuration option that allows users to customize the diverging color scale used in Streamlit charts. The feature applies to built-in chart commands (st.line_chart, st.area_chart, st.bar_chart, st.scatter_chart) as well as st.vega_lite_chart, st.altair_chart, and st.plotly_chart. The PR also updates the Plotly diverging template from 11 to 10 color placeholders to maintain consistency with other color configurations.
Changes:
- Added
chartDivergingColorsconfiguration option to theme settings (protobuf, Python config, frontend theme) - Refactored chart color parsing logic in Python backend to eliminate code duplication
- Updated Plotly and Vega-Lite chart components to use the new diverging colors
- Added comprehensive test coverage (Python unit tests, TypeScript unit tests, and E2E tests)
Reviewed changes
Copilot reviewed 18 out of 24 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
proto/streamlit/proto/NewSession.proto |
Added chart_diverging_colors field to CustomThemeConfig message |
lib/streamlit/config.py |
Added chartDivergingColors theme configuration option with documentation |
lib/streamlit/runtime/app_session.py |
Refactored chart color parsing into reusable function and added diverging colors support |
lib/streamlit/elements/lib/streamlit_plotly_theme.py |
Updated Plotly template from 11 to 10 diverging color placeholders |
frontend/lib/src/theme/utils.ts |
Added validation and handling for chartDivergingColors in theme creation |
frontend/lib/src/theme/getColors.ts |
Added default diverging colors array to theme colors |
frontend/lib/src/components/elements/PlotlyChart/CustomTheme.tsx |
Updated to use theme's chartDivergingColors and removed unused function |
frontend/lib/src/components/elements/ArrowVegaLiteChart/CustomTheme.tsx |
Updated to use theme's chartDivergingColors from theme object |
frontend/component-v2-lib/src/theme.ts |
Added chartDivergingColors to StreamlitTheme interface |
e2e_playwright/theming/theme_chart_colors_test.py |
Added E2E test configuration for diverging colors |
e2e_playwright/theming/theme_chart_colors_app.py |
Added test scenarios for Altair and Plotly diverging color charts |
| Test files | Comprehensive unit and E2E test coverage for the new feature |
📈 Python coverage change detectedThe Python unit test coverage has increased by 0.0237%
✅ Coverage change is within normal range. Coverage by files
|
| const DIVERGING_7 = "#000028" | ||
| const DIVERGING_8 = "#000029" | ||
| const DIVERGING_9 = "#000030" |
There was a problem hiding this comment.
In order to support diverging color config consistent with other chart color configs, the plotly diverging template was updated from 11 placeholders to 10.
This does not change existing behavior since we were only providing 10 colors to slot into the 11 placeholders in our default diverging colors array anyway.
Rebalanced the default scale to account for 10 colors
8da2371 to
1750cc3
Compare
SummaryThis PR adds a new theming config option Key changes include:
Code QualityStrengths:
Minor observations:
Test CoveragePython Unit Tests:
Frontend Unit Tests:
E2E Tests:
The test coverage is comprehensive and follows the best practices documented in the project guidelines. Backwards CompatibilityProto Changes (Safe):
Plotly Template Change (Low Risk):
Frontend API:
No breaking changes identified. Security & RiskNo security concerns identified. The changes:
Regression risk is low because:
RecommendationsNo blocking issues found. The PR is well-implemented and follows the established patterns. Optional suggestions for future consideration:
VerdictAPPROVED: This PR adds a well-implemented, backwards-compatible theming feature with comprehensive test coverage. The code follows existing patterns, includes proper validation, and poses no security or regression risks. This is an automated AI review. Please verify the feedback and use your judgment. |
sfc-gh-mbarnes
left a comment
There was a problem hiding this comment.
Echoing approval above
Describe your changes
Adding a config option
chartDivergingColorsfor[theme]that controls the diverging colors passed toArrowVegaLightChart&PlotlyChartcomponents.These impact our built-in chart commands (
st.line_chart,st.area_chart,st.bar_chart, &st.scatter_chart) as well asst.vega_lite_chart,st.altair_chart, andst.plotly_chartNote: In order to support diverging color config consistent with other chart color configs, the plotly diverging template was updated from 11 placeholders to 10. This does not change existing behavior since we were only providing 10 colors to slot into the 11 placeholders in our default diverging colors array.
Testing Plan