Skip to content

Add state icon color option in range progress bar#259

Merged
ngocjohn merged 3 commits intodevfrom
feature-state-icon-color-of-the-energy-entity-in-the-range-progress-bar
Mar 17, 2026
Merged

Add state icon color option in range progress bar#259
ngocjohn merged 3 commits intodevfrom
feature-state-icon-color-of-the-energy-entity-in-the-range-progress-bar

Conversation

@ngocjohn
Copy link
Owner

Introduce an option to use the state color for icons in the range progress bar. This enhancement allows for better visual representation based on the entity's state.

Closes: #258

Copilot AI review requested due to automatic review settings March 17, 2026 15:51
@ngocjohn ngocjohn self-assigned this Mar 17, 2026
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

Adds a configuration option to let range/energy icons in the range progress bar inherit Home Assistant “state color”, aligning the card’s visuals with other HA UI elements.

Changes:

  • Extend RangeItemConfig with a new icon_state_color boolean option.
  • Expose the new option in the range item editor schema.
  • Render range/energy level icons with computed state-based color when enabled, adding a shared state-color computation helper.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 3 comments.

File Description
src/types/config/card/range-info.ts Adds icon_state_color to the range item config type.
src/ha/common/entity/state_active.ts Introduces a memoized _computeStateColor helper used to derive icon color from entity state.
src/editor/form/range-config-schema.ts Adds an editor toggle for “Icon State Color”.
src/components/shared/range/vsc-range-item.ts Applies state-based icon coloring when icon_state_color is enabled.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

@ngocjohn ngocjohn added the enhancement New feature or request label Mar 17, 2026
@ngocjohn ngocjohn merged commit c85d8d4 into dev Mar 17, 2026
4 checks passed
@ngocjohn ngocjohn deleted the feature-state-icon-color-of-the-energy-entity-in-the-range-progress-bar branch March 17, 2026 17:17
github-actions bot pushed a commit that referenced this pull request Mar 17, 2026
## [1.24.0-dev.1](v1.23.1-dev.2...v1.24.0-dev.1) (2026-03-17)

### Features

* Add state icon color option in range progress bar ([#259](#259)) ([c85d8d4](c85d8d4))

### Bug Fixes

* add error handling for missing card helpers ([a03fd88](a03fd88))
@github-actions
Copy link
Contributor

🎉 This PR is included in version 1.24.0-dev.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

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

Labels

enhancement New feature or request released on @beta

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants