{"id":13588810,"url":"https://github.com/maxwroc/battery-state-card","last_synced_at":"2026-04-02T15:46:59.669Z","repository":{"id":37372820,"uuid":"256292682","full_name":"maxwroc/battery-state-card","owner":"maxwroc","description":"Battery state card for Home Assistant","archived":false,"fork":false,"pushed_at":"2024-04-16T15:53:24.000Z","size":1420,"stargazers_count":980,"open_issues_count":57,"forks_count":41,"subscribers_count":12,"default_branch":"master","last_synced_at":"2025-04-09T07:02:52.456Z","etag":null,"topics":["battery","hassio","home-assistant","lovelace-custom-card","sensor"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/maxwroc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-04-16T18:07:43.000Z","updated_at":"2025-04-07T18:47:05.000Z","dependencies_parsed_at":"2023-12-20T18:29:23.846Z","dependency_job_id":"8bcce08b-4f03-45d3-b145-d75f56672c6b","html_url":"https://github.com/maxwroc/battery-state-card","commit_stats":{"total_commits":518,"total_committers":12,"mean_commits":"43.166666666666664","dds":0.2992277992277992,"last_synced_commit":"35344fce7a9f621c77352860dcdb305daa379d33"},"previous_names":[],"tags_count":42,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maxwroc%2Fbattery-state-card","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maxwroc%2Fbattery-state-card/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maxwroc%2Fbattery-state-card/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maxwroc%2Fbattery-state-card/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/maxwroc","download_url":"https://codeload.github.com/maxwroc/battery-state-card/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254518383,"owners_count":22084374,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["battery","hassio","home-assistant","lovelace-custom-card","sensor"],"created_at":"2024-08-01T15:06:57.071Z","updated_at":"2026-04-02T15:46:59.629Z","avatar_url":"https://github.com/maxwroc.png","language":"TypeScript","funding_links":["https://buymeacoffee.com/maxwroc"],"categories":["TypeScript","Dashboard Cards"],"sub_categories":["📋 Status \u0026 info rows"],"readme":"﻿\n\n# Battery State Card\n[![GitHub Release][releases-shield]][releases]\n[![GitHub All Releases][downloads-total-shield]][releases]\n[![hacs_badge][hacs-shield]][hacs]\n[![Coverage Status](https://coveralls.io/repos/github/maxwroc/battery-state-card/badge.svg?branch=master)](https://coveralls.io/github/maxwroc/battery-state-card?branch=master)\n[![Community Forum][forum-shield]][forum]\n[![Buy me a coffee][coffee-shield]][coffee-link]\n\n\u003c!-- ![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/maxwroc/battery-state-card/release-drafter.yml?label=tests) --\u003e\n\nBattery state card for [Home Assistant](https://github.com/home-assistant/home-assistant). It shows battery levels from connected devices (entities).\n\n## Overview\n\nThis card was inspired by [another great card](https://github.com/cbulock/lovelace-battery-entity) showing the battery states. I have decided to implement my own as there was no response for pull requests from author and I wanted to fix few things and also add couple new features.\n\n![image](https://user-images.githubusercontent.com/8268674/80753326-fabd1280-8b24-11ea-8f90-4c934793f231.png)\n\n## Breaking changes\n\n\u003cdetails\u003e\n  \u003csummary\u003eUpdate to v4.X.X\u003c/summary\u003e\n\n* The `display` entity data field has been renamed to `entity`. If you use `display.` prefix in filters (e.g. `name: \"display.platform\"`), update them to use `entity.` (e.g. `name: \"entity.platform\"`). The same applies to KString references like `{display.name}` — use `{entity.name}` instead.\n* The KString `between` function now uses an **inclusive** range. Previously `between(2,6,30)` would match values strictly between 2 and 6 (exclusive); now it matches values from 2 to 6 inclusive. If you relied on the exclusive behavior, adjust your thresholds accordingly.\n* The `{charging}` entity data field is now an object with `text` (string) and `is_active` (boolean) properties. If you use `{charging}` in `secondary_info` or other KStrings, update it to `{charging.text}`. You can also use `{charging.is_active}` to access the boolean charging state.\n* Default configuration is now shallow-merged with your custom config. Previously, specifying any custom config would discard all defaults. Now, default values (e.g. `sort`, `filter`, `collapse`, `bulk_rename`, `colors`, `secondary_info`) are applied for any properties you don't explicitly set. If you relied on the old behavior where defaults were fully replaced, you may need to explicitly override specific properties (e.g. `filter: {}` to disable the default filter).\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eUpdate to v3.X.X\u003c/summary\u003e\n\n* Secondary info last_updated / last_changed values. Now these values has to be put in quotes and curly braces e.g. `secondary_info: \"{last_updated}\"`\n* Secondary info charging indication. Now the value has to be in curly braces e.g. `secondary_info: \"{charging}\"`\n* Sorting setting has changed. Now it is called `sort` (previously \"sort_by_level\") and it can define multiple levels of sorting.\n* Color settings are now in a single config entry `colors` (\"color_thresholds\" and \"color_gradient\" settings are not working any more)\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eUpdate to v2.X.X\u003c/summary\u003e\n\n* When you want to use it as entity (e.g. in `entities` card) you need to use different type: `custom:battery-state-entity` instead of `custom:battery-state-card`.\n* Custom styles are not supported any more\n\u003c/details\u003e\n\n## Config\n\n### Default card config\n\nThe card comes with built-in defaults shown below. These defaults are shallow-merged with your custom config — any property you don't explicitly set will use its default value. To disable a default, override it explicitly (e.g. `filter: {}` to remove the default filter).\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{last_changed}\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: \"battery\"\n  exclude:\n    - name: \"entity_id\"\n      value: \"binary_sensor.*\"\nsort:\n  by: \"state\"\ncollapse: 8\nbulk_rename:\n  - from: \" Battery\"\n  - from: \" level\"\ncolors:\n  steps:\n    - '#ff0000'\n    - '#ffff00'\n    - '#00ff00'\n  gradient: true\n```\n\nThe following config resets all the above defaults, you can use it as a base config if you want to fully configure the card on your own\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: null\nfilter: {}\nsort: {}\ncollapse: 0\nbulk_rename: []\ncolors: {}\n```\n\n### Card config\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| type | string | **(required)** | v0.9.0 | Must be `custom:battery-state-entity` |\n| entities | list([Entity](#entity-object) \\| string) |  | v0.9.0 | List of entities. It can be collection of entity/group IDs (strings) instead of Entity objects.\n| title | string |  | v0.9.0 | Card title\n| sort | list([Sort](#sort-object) \\| string) |  | v3.0.0 | Sets the sorting options\n| group | number \\| list([Group](#group-object)) |  | v1.0.0 | Number of entities to show. Rest will be available in expandable section ([example](#sorted-list-and-collapsed-view)). Or list of entity/battery groups ([example](#battery-groups))\n| filter | [Filters](#filters) |  | v1.3.0 | Filter groups to automatically include or exclude entities ([example](#entity-filtering-and-bulk-renaming))\n| bulk_rename | list([Convert](#convert)) \\| [BulkRename](#bulk-rename) |  | v1.3.0 | Rename rules applied for all entities ([example](#entity-filtering-and-bulk-renaming))\n| theme | string |  | v3.3.0 | Name of the theme to apply (must be installed in Home Assistant). ([example](#using-themes))\n| default_config_base | boolean | `true` | v4.1.0 | Whether to use default config values (sort, collapse, colors, etc.) as a base for the card configuration. When set to `false` only user-specified settings are used. Useful when entities are managed externally (e.g. via auto-entities card).\n\n+[common options](#common-options) (if specified they will be applied to all entities)\n\n### Entity object\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| type | string | | v0.9.0 | Must be `custom:battery-state-entity` if used as entity row e.g. in entity-list card  |\n| entity | string | **(required)** | v0.9.0 | Entity ID\n| name | string |  | v0.9.0 | Entity name override\n| icon | string \\| null |  | v1.6.0 | Icon override. Set to a custom icon (e.g. `mdi:battery`), use entity attribute (e.g. `attributes.battery_icon`), or set to `null` to use the entity's default icon\n| attribute | string | | v0.9.0 | Name of attribute (override) to extract the value from. By default we look for values in the following attributes: `battery_level`, `battery`. If they are not present we take entity state.\n| multiplier | number | `1` | v0.9.0 | If the value is not in 0-100 range we can adjust it by specifying multiplier. E.g. if the values are in 0-10 range you can make them working by putting `10` as multiplier.\n\n +[common options](#common-options) (if specified they will override the card-level ones)\n\n### Common options\n\nThese options can be specified both per-entity and at the top level (affecting all entities).\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| colors | [ColorSettings](#color-settings) | (see [below](#default-colors)) | v3.0.0 | Color settings\n| tap_action | [TapAction](#tap-action) | more-info | v1.1.0 | Action that will be performed when this entity is tapped.\n| state_map | list([Convert](#convert))|  | v1.1.0 | Collection of value mappings. It is useful if your sensor doesn't produce numeric values. ([example](#non-numeric-state-values))\n| charging_state | [ChargingState](#charging-state-object) |  | v1.1.0 | Configuration for charging indication. ([example](#charging-state-indicators))\n| secondary_info | [KString](#keyword-string-kstring) |  | v3.0.0 | Secondary info text. It can be a custom text with keywords (dynamic values) ([example](#secondary-info))\n| round | number |  | v2.1.0 | Rounds the value to number of fractional digits\n| unit | string | `\"%\"` | v2.1.0 | Override for unit displayed next to the state/level value ([example](#other-use-cases))\n| value_override | [KString](#keyword-string-kstring) |  | v3.0.0 | Allows to override the battery level value. Note: when used the `multiplier`, `round`, `state_map` setting is ignored\n| non_battery_entity | boolean | `false` | v3.0.0 | Disables default battery state sources e.g. \"battery_level\" attribute\n| default_state_formatting | boolean | `true` | v3.1.0 | Can be used to disable default state formatting e.g. entity display precision setting\n| debug | boolean \\| string | `false` | v3.2.0 | Whether to show debug output (all available entity data). You can use entity_id if you want to debug specific one.\n| respect_visibility_setting | boolean | `true` | v3.3.0 | Whether to hide entities which are marked in the UI as hidden on dashboards.\n| unpack | boolean | `false` | v4.0.0 | Whether to unpack entities that have an `entity_id` array attribute (e.g. sensor groups) into separate batteries. ([example](#unpacking-grouped-entities))\n| style | string |  | v4.0.0 | Custom CSS rules injected into the element's shadow DOM. Allows targeting inner elements (e.g. `.name`, `.state`, `.icon`). Can be used together with card-level `theme`. ([example](#custom-styles))\n\n### Keyword string (KString)\n\nThis is a string value containing dynamic values. Data for dynamic values can be taken from entity properties, its attributes, other entity state/attributes, etc.\n\n| Type | Example | Description |\n|:-----|:-----|:-----|\n| Charging state | `\"{charging.text}\"` | Shows text specified in [ChargingState](#charging-state-object)\n| Entity property | `\"{last_updated}\"` | Current entity property. To ensure relative time, use the reltime() function via \"\\|\" (see below). E.g.: `\"Changed: {last_updated\\|reltime()}\"`\n| Entity attributes | `\"Remaining time: {attributes.remaining_time}\"` | Current entity attribute value.\n| Other entity data | `\"Since last charge: {sensor.tesla.attributes.distance}\"` | You can use full \"path\" to the other entity data\n\nKeywords support simple functions to convert the values\n\n| Func | Example | Description |\n|:-----|:-----|:-----|\n| round(\\[number\\]) | `\"{state\\|round(2)}\"` | Rounds the value to number of fractional digits. E.g. if state is 20.617 the output will be 20.62.\n| replace(\\[old_string\\],\\[new_string\\]) | `\"{attributes.friendly_name\\|replace(Battery level,)}\"` | Simple replace. E.g. if name contains \"Battery level\" string then it will be removed\n| multiply(\\[number\\]) | `\"{state\\|multiply(10)}\"` | Multiplies the value by given number\n| greaterthan(\\[threshold_number\\],\\[result_value\\]) | `\"{state\\|greaterthan(10,100)}\"` | Changes the value to a given one when the threshold is met. In the given example the value will be replaced to 100 when the current value is greater than 10\n| lessthan(\\[threshold_number\\],\\[result_value\\]) | `\"{state\\|lessthan(10,0)}\"` | Changes the value to a given one when the threshold is met. In the given example the value will be replaced to 0 when the current value is less than 10\n| between(\\[lower_threshold_number\\],[upper_threshold_number\\],\\[result_value\\]) | `\"{state\\|between(2,6,30)}\"` | Changes the value to a given one when the value is between two given numbers (inclusive). In the given example the value will be replaced to 30 when the current value is between 2 and 6 (including 2 and 6)\n| thresholds(\\[number1\\],\\[number2\\],...) | `\"{state\\|thresholds(22,89,200,450)}\"` | Converts the value to percentage based on given thresholds. In the given example values will be converted in the following way 20=\u003e0, 30=\u003e25, 99=\u003e50, 250=\u003e75, 555=\u003e100\n| abs() | `\"{state\\|abs()}\"` | Produces the absolute value\n| equals(\\[value\\],\\[result_value\\]) | `\"{state\\|equals(on,1)}\"` | Changes the value conditionally - whenever the initial value is equal the given one\n| reltime() | `\"Changed: {last_changed\\|reltime()}\"` | Converts date to relative time e.g. \"1 minute ago\"\n\nYou can execute functions one after another. For example if you have the value \"Battery level: 26.543234%\" and you want to extract and round the number then you can do the following: `\"{attribute.battery_level|replace(Battery level:,)|replace(%,)|round()} %\"` and the end result will be \"27\"\n\n### Sort object\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| by | string | **(required)** | v3.0.0 | Field of the entity used to sort (`\"state\"` or `\"name\"`)\n| desc | boolean | `false` | v3.0.0 | Whether to sort in descending order\n\n\nNote: you can simplify this setting and use just use strings if you want to keep ascending order e.g.:\n\n```yaml\nsort:\n  - \"name\"\n  - \"state\"\n```\n\nNote: the state and name values used for sorting are the ones you see rendered on the card (e.g. after state_map transformations). You can use raw entity values to sort by prefixing their names with `entity.`. E.g. `entity.last_changed` or `entity.attributes.battery_level` or `entity.state`\n\n### Color settings\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| steps | list([ColorStep](#color-step) \\| string) | **(required)** | v3.0.0 | List of colors or color steps\n| gradient | boolean | `false` | v3.0.0 | Whether to enable smooth color transition between steps\n\nNote: enabling `gradient` requires at least two colors/steps and all provided colors need to be in hex HTML format e.g. `#ff00bb`.\n\n#### Color step\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| value | number | **(required)** | v0.9.0 | Threshold value\n| color | string | `inherit` | v0.9.0 | CSS color which will be used for levels below or equal the value field. If not specified the default one is used (default icon/text color for current HA theme)\n\n#### Default colors\n| Value | Color | Description |\n|:------|:------|:------|\n| 20 | `var(--label-badge-red)` | If value is less or equal `20` the color will be red\n| 55 | `var(--label-badge-yellow)` | If value is less or equal `55` the color will be yellow\n| 100 | `var(--label-badge-green)` | If value is less or equal `100` the color will be green\n\nNote: the exact color is taken from CSS variable and it depends on your current template.\n\n### Filters\n| Name | Type | Default | Description |\n|:-----|:-----|:-----|:-----|\n| include | list([Filter](#filter-object)) |  | Filters for auto adding entities\n| exclude | list([Filter](#filter-object)) |  | Filters to remove entities dynamically\n\nNote: The action (include/exclude) is performed when at least one of the filters is matching (OR). Since v3.3.0 you can use [composite filters](#composite-filters) (`and`, `or`, `not`) to combine multiple conditions.\n\nNote: Include filters should rely on static entity properties. E.g. you should not add include filter which checks the `state` property. Include filters are processed only once - when page is loaded (to minimize perf impact).\n\n### Filter object\n| Name | Type | Default | Description |\n|:-----|:-----|:-----|:-----|\n| name | string | **(required)** | Name of the property/attribute. E.g. `state`, `computed.state`, `attribute.device_class`\n| operator | string |  | Operator for value comparison (see [filter operators](#filter-operators))\n| value | any |  | Value to compare the property/attribute to\n\n**Note:** In v4.1.0 the `state` value is the original entity state (something what you may find in the HA developer tools). If you use `state_map`, any other state transformation or if you want to filter based on the final state shown in the card please use `computed.state` instead.\n\n### Composite filters\n\nSince v3.3.0, you can create complex filter conditions using logical operators:\n\n| Name | Type | Since | Description |\n|:-----|:-----|:-----|:-----|\n| `and` | list([Filter](#filter-object)) | v3.3.0 | Matches when **all** filters in the list match\n| `or` | list([Filter](#filter-object)) | v3.3.0 | Matches when **any** filter in the list matches\n| `not` | list[Filter](#filter-object) | v3.3.0 | Inverts the result of the filter (matches when the filter doesn't match)\n\nComposite filters can be nested to create complex conditions.\n\n**Example: Using AND to match entities with both conditions**\n```yaml\nfilter:\n  include:\n    - and:\n        - name: entity_id\n          value: \"*_battery*\"\n        - name: state\n          operator: \"\u003c\"\n          value: 50\n```\n\n**Example: Using OR for multiple patterns**\n```yaml\nfilter:\n  include:\n    - or:\n        - name: entity_id\n          value: \"*_battery\"\n        - name: entity_id\n          value: \"*_power\"\n```\n\n**Example: Using NOT to exclude specific entities**\n```yaml\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\n  exclude:\n    - not:\n        name: state\n        operator: \"\u003c\"\n        value: 20\n```\n\n**Example: Complex nested conditions**\n```yaml\nfilter:\n  include:\n    - and:\n        - or:\n            - name: entity_id\n              value: \"sensor.*_battery\"\n            - name: \"attributes.device_class\"\n              value: battery\n        - not:\n            name: entity_id\n            value: \"*_exclude_*\"\n```\n\n### Filter operators\n\nOperator is an optional property. If operator is not specified it depends on `value` config property:\n* if `value` is not specified the default operator is `exists`\n* if `value` starts and ends with slash \"`/`\" or if it contains wildcard \"`*`\" the operator is `matches`\n* if `value` property is set but above conditions are not met the operator is \"`=`\"\n\n| Name | Since | Type |\n|:-----|:-----|:-----|\n| `\"exists\"` | v1.3.0 | It checks if field is present (e.g. to match entities having particular attribute regardless of the attribute value). It doesn't require `value` to be specified.\n| `\"not_exists\"` | v3.1.0 | It checks if field is not present (e.g. to match entities without particular attribute). It doesn't require `value` to be specified.\n| `\"=\"` | v1.3.0 | If value equals the one specified in `value` property.\n| `\"\u003e\"` | v1.3.0 | If value is greater than one specified in `value` property. Possible variant: `\"\u003e=\"`. Value must be numeric or datetime type.\n| `\"\u003c\"` | v1.3.0 | If value is lower than one specified in `value` property. Possible variant: `\"\u003c=\"`. Value must be numeric or datetime type.\n| `\"contains\"` | v1.3.0 | If value contains the one specified in `value` property. **Since v4.0.0**: Also supports arrays - checks if any array element contains the search string.\n| `\"matches\"` | v1.3.0 | If value matches the one specified in `value` property. You can use wildcards (e.g. `\"*_battery_level\"`) or regular expression (must be prefixed and followed by slash e.g. `\"/[a-z_]+_battery_level/\"`)\n\n**Example: Include entities with specific device label**\n```yaml\nfilter:\n  include:\n    - name: \"device.labels\"\n      operator: contains\n      value: \"office_stuff\"\n```\n\n**Example: Include only entities WITHOUT a specific label**\n```yaml\nfilter:\n  include:\n    - not:\n        name: \"device.labels\"\n        operator: contains\n        value: \"ignore_battery\"\n```\n\n**Example: Exclude entities not updated within the last 24 hours (show only stale devices)**\n```yaml\nfilter:\n  include:\n    - name: attributes.device_class\n      value: battery\n  exclude:\n    - name: last_updated\n      operator: \"\u003e\"\n      value: \"24h\"\n```\n\n### Tap-Action\n\nThe definition is similar to the default [tap-action](https://www.home-assistant.io/lovelace/actions/#tap-action) in HomeAssistant.\n| Name | Type | Default | Description |\n|:-----|:-----|:-----|:-----|\n| action | string | `more-info` | Action type, one of the following: `more-info`, `call-service`, `navigate`, `url`, `none`\n| service | [KString](#keyword-string-kstring) \\| string |  | Service to call when `action` defined as `call-service`. Eg. `\"notify.pushover\"`. Supports KString for dynamic values.\n| service_data | any |  | Service data to include when `action` defined as `call-service`. Supports KString in nested string values.\n| data | any |  | Additional data for the action. Supports KString in nested string values.\n| target | any |  | Target for the service call. Supports KString in nested string values.\n| navigation_path | [KString](#keyword-string-kstring) \\| string |  | Path to navigate to when `action` defined as `navigate`. Eg. `\"/lovelace/0\"`. Supports KString for dynamic values.\n| url_path | [KString](#keyword-string-kstring) \\| string |  | Url to navigate to when `action` defined as `url`. Eg. `\"https://www.home-assistant.io\"`. Supports KString for dynamic values.\n\nNote: From version 3.3.0 card supports all native Home Assistant actions and related functionalities: [Actions - Home Assistant](https://www.home-assistant.io/dashboards/actions/#tap-action)\n\n**KString support in actions:** Since v3.3.0, tap actions support [KString](#keyword-string-kstring) for dynamic values. This allows you to use entity data (state, attributes, etc.) in action parameters. KString processing happens just before the action is executed, ensuring up-to-date values.\n\n**Examples:**\n```yaml\n# Navigate to device page using device_id from entity attributes\ntap_action:\n  action: navigate\n  navigation_path: \"/config/devices/device/{attributes.device_id}\"\n\n# Open URL with dynamic content\ntap_action:\n  action: url\n  url_path: \"https://example.com/battery-report?level={state}\u0026device={attributes.device_name}\"\n\n# Call service with dynamic data\ntap_action:\n  action: call-service\n  service: \"notify.mobile_app\"\n  service_data:\n    message: \"Low battery alert: {state}%\"\n    title: \"Warning for {attributes.friendly_name}\"\n    data:\n      entity_id: \"{entity_id}\"\n      battery_level: \"{state}\"\n\n# Use KString functions in actions\ntap_action:\n  action: call-service\n  service: \"script.battery_notification\"\n  data:\n    rounded_level: \"{state|round(0)}\"\n    doubled_value: \"{state|multiply(2)|round(1)}\"\n```\n\n### Convert\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| from | any | **(required)** | v1.1.0 | Value to convert. Note it is type sensitive (eg. `false` != `\"false\"`)\n| to | any | **(required)** | v1.1.0 | Target value\n| display | string |  | v3.0.0 | Override for displayed entity state (when the current entity state matches the `from` value)\n\n### Bulk rename\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| rules | list([Convert](#convert)) |  | v3.1.0 | Rename rules applied for all entities\n| capitalize_first | bool | `true` | v3.1.0 | Whether to capitalize first letter ([example](#entity-filtering-and-bulk-renaming))\n\n### Charging-state object\n\nNote: All of these values are optional but at least `entity_id` or `state` or `attribute` is required.\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| entity_id | string |  | v1.1.0 | Other entity id where charging state can be found\n| attribute | list([Attribute](#attribute-object)) |  | v1.2.0 | List of attribute name-values indicating charging in progress\n| state | list(any) |  | v1.1.0 | List of values indicating charging in progress\n| icon | string |  | v1.1.0 | Icon to show when charging is in progress\n| secondary_info_text | [KString](#keyword-string-kstring) |  | v1.1.0 | Text to be shown when battery is charging. Supports dynamic values (e.g., `{state}`, `{attributes.x}`). To show it you need to have `secondary_info: \"{charging.text}\"` property set on entity. ([example](#secondary-info))\n\n### Attribute object\n\n| Name | Type | Default | Description |\n|:-----|:-----|:-----|:-----|\n| name | string | **(required)** | Name of the attribute. If the charging info is in an object use the path e.g. \"charger.is_charging\"\n| value | string |  | Value of the attribute\n\n### Group object\n\n| Name | Type | Default | Since | Description |\n|:-----|:-----|:-----|:-----|:-----|\n| name | string |  | v1.4.0 | Name of the group. Keywords available: `{min}`, `{max}`, `{count}`, `{range}`\n| secondary_info | string |  | v1.4.0 | Secondary info text, shown in the second line. Same keywords available as in `name`\n| icon | string |  | v1.4.0 | Group icon. It can be a static icon available in HA or dynamic one taken from one of the group items (`first`, `last`)\n| icon_color | string |  | v2.0.0 | Group icon color. It can be a static HTML (e.g. `#ff0000`) or dynamic (`first` or `last`) color value based on the battery colors in the group.\n| min | number |  | v1.4.0 | Minimal battery level. Batteries below that level won't be assigned to this group.\n| max | number |  | v1.4.0 | Maximal battery level. Batteries above that level won't be assigned to this group.\n| filter | list([Filter](#filter-object)) |  | v4.0.0 | Advanced filters for assigning batteries to the group (same filter syntax as card-level [filters](#filters)). When specified `min`/`max` are ignored. Supports [composite filters](#composite-filters).\n| by | string |  | v4.0.0 | Property path to automatically create sub-groups by (e.g. `\"area.name\"`). Each unique value becomes a separate group. Entities with missing values stay ungrouped. Can be combined with `filter`. ([example](#dynamic-grouping-with-by))\n| entities | list(string) |  | v1.4.0 | List of entity ids\n\n## Examples\n\nYou can use this component as a card or as an entity (e.g. in `entities card`);\n\n### Card view\nCard view is useful when you want to have cleaner config (you don't need to duplicate settings in every entity entry) and when you want to apply same settings (e.g. colors) for all the battery entities.\n\n![image](https://user-images.githubusercontent.com/8268674/79760617-3c291300-8318-11ea-8b97-006e3d537568.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Battery levels\"\nentities:\n  - sensor.bathroom_motion_battery_level\n  - sensor.bedroom_balcony_battery_level\n  - entity: \"sensor.bedroom_motion_battery_level\"\n    name: \"Bedroom motion sensor\"\n```\n\n### Entity view\nEntity view is useful when you want to add battery status next to other sensors (in the same card).\n\n![image](https://user-images.githubusercontent.com/8268674/79758073-cff8e000-8314-11ea-94e0-2059460ec4ea.png)\n\nNote: there is a different `type` used.\n\n```yaml\ntype: entities\ntitle: Other\nshow_header_toggle: false\nentities:\n  - sensor.energy_rpi_monthly\n  - sensor.home_assistant_v2_db\n  - sensor.hassio_online\n  - sensor.last_boot\n  - type: \"custom:battery-state-entity\"\n    entity: \"sensor.temp_outside_battery_numeric\"\n```\n\n### Custom colors\n\n#### Custom threshold colors\n\n![image](https://user-images.githubusercontent.com/8268674/79862088-6e487c80-83cd-11ea-8a84-4eecc3601ae2.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Custom color thresholds\"\ncolors:\n  steps:\n    - value: 35 # applied to all values below/equal\n      color: \"#8fffe1\"\n    - value: 45 # applied to all values below/equal\n      color: \"#8fbbff\"\n    - value: 60 # applied to all values below/equal\n      color: \"#978fff\"\n    - value: 100 # applied to all values below/equal\n      color: \"#fe8fff\"\nentities:\n  - entity: \"sensor.bathroom_motion_battery_level\"\n    name: \"Bathroom motion sensor\"\n  - entity: \"sensor.bedroom_balcony_battery_level\"\n    name: \"Bedroom balcony door sensor\"\n  - entity: \"sensor.bedroom_motion_battery_level\"\n    name: \"Bedroom motion sensor\"\n  - entity: \"sensor.bedroom_switch_battery_level\"\n    name: \"Bedroom Aqara switch\"\n  - entity: \"sensor.bedroomtemp_battery_level\"\n    name: \"Bedroom temp. sensor\"\n```\n\n#### Gradient colors\n\n![image](https://user-images.githubusercontent.com/8268674/79856685-8ec00900-83c4-11ea-82bf-b3df6385850f.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Color gradient\"\ncolors:\n  steps:\n    - \"#ff0000\" # red\n    - \"#ffff00\" # yellow\n    - \"#00ff00\" # green\n  gradient: true\nentities:\n  - entity: \"sensor.bathroom_motion_battery_level\"\n    name: \"Bathroom motion sensor\"\n  - entity: \"sensor.bedroom_balcony_battery_level\"\n    name: \"Bedroom balcony door sensor\"\n  - entity: \"sensor.bedroom_motion_battery_level\"\n    name: \"Bedroom motion sensor\"\n  - entity: \"sensor.bedroom_switch_battery_level\"\n    name: \"Bedroom Aqara switch\"\n  - entity: \"sensor.bedroomtemp_battery_level\"\n    name: \"Bedroom temp. sensor\"\n```\n\n#### Disabling colors\n\nWhen you put empty array in `steps` property you can disable colors.\n\n![image](https://user-images.githubusercontent.com/8268674/79975932-aa461500-8493-11ea-9947-f4513863ae53.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"No color\"\ncolors:\n  steps: []\nentities:\n  - sensor.bedroom_motion_battery_level\n  - sensor.bathroom_motion_battery_level\n  - sensor.bedroomtemp_battery_level\n  - sensor.bedroom_balcony_battery_level\n  - sensor.bedroom_switch_battery_level\n```\n\nYou can setup as well colors only for lower battery levels and leave the default one for the rest.\n\n![image](https://user-images.githubusercontent.com/8268674/79977247-d793c280-8495-11ea-82f1-78f48ad4fc5b.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"No color - selective\"\ncolors:\n  steps:\n    - value: 20\n      color: \"red\"\n    - value: 60\n      color: \"yellow\"\nentities:\n  - sensor.bedroom_motion_battery_level\n  - sensor.bathroom_motion_battery_level\n  - sensor.bedroomtemp_battery_level\n  - sensor.bedroom_balcony_battery_level\n  - sensor.bedroom_switch_battery_level\n```\n\n### Sorted list and collapsed view\n\n![ezgif com-resize](https://user-images.githubusercontent.com/8268674/80119122-31bd8200-8581-11ea-9221-aee943d0b1a0.gif)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Sorted list and collapsed view\"\nsort: \"state\"\ncollapse: 4\nentities:\n  - sensor.bedroom_motion_battery_level\n  - sensor.bathroom_motion_battery_level\n  - sensor.bedroomtemp_battery_level\n  - sensor.bedroom_balcony_battery_level\n  - sensor.bedroom_switch_battery_level\n```\n### Battery groups\n\nBattery groups allow you to group together set of batteries/entities based on couple conditions. You can use HA group entities to tell which entities should go to the group, or you can set min/max battery levels, or specify explicit list of entities which should be assigned to particular group. You can also use advanced filters (same syntax as the card-level [filters](#filters)) for more flexible group assignment.\n\nNote: If you have battery groups defined in Home Assistant you can use their IDs instead of single entity ID (in `entities` collection).\n\n![image](https://user-images.githubusercontent.com/8268674/84313600-aa42c700-ab5e-11ea-829e-394b292f3cbe.png)\n\n```yaml\ntype: 'custom:battery-state-card'\ntitle: Battery state card\nsort: \"state\"\ncollapse:\n  - name: 'Door sensors (min: {min}%, count: {count})' # special keywords in group name\n    secondary_info: 'Battery levels {range}%' # special keywords in group secondary info\n    icon: 'mdi:door'\n    entities: # explicit list of entities\n      - sensor.bedroom_balcony_battery_level\n      - sensor.main_door_battery_level\n      - sensor.living_room_balcony_battery_level\n  - group_id: \"group.motion_sensors_batteries\" # using HA group\n    secondary_info: No icon # Secondary info text\n    icon: null # removing default icon for this group (from HA group definition)\n  - group_id: \"group.temp_sensors_batteries\"\n    min: 99 # all entities below that level should show up as ungrouped\n    icon: 'mdi:thermometer' # override for HA group icon\nentities:\n  # if you need to specify some properties for any entity in the group\n  - entity: \"sensor.bedroom_balcony_battery_level\"\n    name: \"Bedroom balcony door\"\n    multiplier: 10\n  # entities from below HA group won't be grouped as there is no corresponding collapsed group\n  - group.switches_batteries\n```\n\n**Using filters in groups**\n\nYou can use advanced filters instead of `min`/`max` for more flexible group assignment. The filters use the same syntax as the card-level [filters](#filters), including support for [composite filters](#composite-filters) (`and`, `or`, `not`). All filters must match for a battery to be assigned to the group.\n\nNote: The order of groups matters. Each battery is assigned to the first group whose filters match. If a battery meets the conditions of multiple groups it will only appear in the earliest matching one.\n\n```yaml\ntype: 'custom:battery-state-card'\ntitle: Battery groups with filters\nsort: \"state\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\ncollapse:\n  - name: \"Office critical ({count})\"\n    icon: 'mdi:battery-alert'\n    filter:\n      - name: state\n        operator: \"\u003c\"\n        value: 20\n      - name: \"area.name\"\n        value: Office\n  - name: \"Low ({count})\"\n    icon: 'mdi:battery-low'\n    filter:\n      - name: state\n        operator: \"\u003c\"\n        value: 20\n  - name: \"OK ({count})\"\n    icon: 'mdi:battery'\n    filter:\n      - not:\n          name: state\n          operator: \"\u003c\"\n          value: 20\n```\n\n### Dynamic grouping with `by`\n\nInstead of defining groups manually, you can use the `by` property to automatically create groups based on an entity data property. Each unique value of the property becomes a separate group. Entities where the value is missing, null, or empty stay ungrouped.\n\n\u003e **Note:** When using dot-notation paths (e.g. `attributes.battery_type` or `area.name`), always wrap the value in quotes in YAML to prevent it from being interpreted as a nested key.\n\n**Group by area:**\n```yaml\ntype: \"custom:battery-state-card\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\ngroup:\n  - by: \"area.name\"\n```\n\n**Group by battery type (Battery Notes):**\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{attributes.battery_type}\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\ncollapse:\n  - by: \"attributes.battery_type\"\n    icon: \"mdi:battery-alert\"\n    icon_color: red\n    filter:\n      - name: state\n        operator: \"\u003c\"\n        value: 50\n  - by: \"area.name\"\n```\n\n**Group by area, excluding charging batteries:**\n```yaml\ntype: \"custom:battery-state-card\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\ngroup:\n  - by: \"area.name\"\n    secondary_info: \"Devices: {count}, {min}-{max}%\"\n    filter:\n      - name: \"charging.is_active\"\n        value: false\n```\n\n### Non-numeric state values\n\nIf your sensor doesn't produce numeric values you can use `state_map` property and provide mappings from one value to the other.\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"String values - state map\"\nentities:\n  - entity: \"binary_sensor.battery_state\"\n    name: \"Binary sensor state\"\n    state_map:\n      - from: \"on\"\n        to: 100\n      - from: \"off\"\n        to: 25\n  - entity: \"sensor.bedroom_motion\"\n    name: \"Sensor string attribute\"\n    attribute: \"replace_battery\"\n    state_map:\n      - from: false\n        to: 100\n      - from: true\n        to: 25\n```\n\n### Charging state indicators\n\nIf your device provides charging state you can configure it in the following way:\n\n![image](https://user-images.githubusercontent.com/8268674/80610521-5e661380-8a31-11ea-9c71-75e11c2ec009.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Charging indicators\"\nentities:\n  - entity: \"sensor.device_battery_numeric\"\n    charging_state: # uses other entity state value\n      entity_id: \"binary_sensor.device_charging\"\n      state: \"on\"\n  - entity: \"sensor.mi_roborock\"\n    charging_state: # uses sensor.mi_roborock state value\n      state: \"charging\"\n      icon: \"mdi:flash\"\n      color: \"yellow\"\n  - entity: \"sensor.samsung\"\n    charging_state: # uses is_charging attribute on sensor.samsung entity\n      attribute:\n        name: \"is_charging\"\n        value: \"yes\"\n```\n\nCard-level charging state configuration\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Charging indicators\"\ncharging_state:\n  attribute: # whenever one of below attributes is matching\n    - name: \"Battery State\"\n      value: \"Charging\"\n    - name: \"is_charging\"\n      value: true\n  state: # or if entity state matches one of the following\n    - \"charging\"\n    - \"Charging\"\nentities:\n  - sensor.device_battery_numeric\n  - sensor.mi_roborock\n  - sensor.samsung\n```\n\n### Entity filtering and bulk renaming\nIf you want to add battery entities automatically or if you want to see them only in specific conditions you can use filters.\n\nIf you add entities automatically you cannot specify properties for individual entities. It is possible though to specify card-level properties which will be applied to all entities (see [common options](#common-options)). For example if you wanted to set custom names (e.g. if your sensors are suffixed with some common string) you can use `bulk_rename` property to define renaming rules.\n\n![filters](https://user-images.githubusercontent.com/8268674/82096304-97240f00-96f8-11ea-9376-a9878f56ce94.png)\n\n```yaml\ntype: 'custom:battery-state-card'\ntitle: Filters\nsort: \"state\"\nbulk_rename:\n  - from: \"Battery Level\" # simple string replace (note: \"to\" is not required if you want to remove string)\n    to: \"sensor\"\n  - from: \"/\\\\s(temperature|temp)\\\\s/\" # regular expression\n    to: \" temp. \"\nentities:\n  # entities requiring additional properties can be added explicitly\n  - entity: \"sensor.temp_outside_battery_numeric\"\n    multiplier: 10\n    name: \"Outside temp. sensor\"\nfilter:\n  include: # filters for auto-adding\n    - name: entity_id # entities which id ends with \"_battery_level\"\n      value: \"*_battery_level\"\n    - name: \"attributes.device_class\" # and entities which device_class attribute equals \"battery\"\n      value: battery\n  exclude: # filters for removing\n    - name: state # exclude entities above 99% of battery level\n      value: 99\n      operator: \"\u003e\"\n```\n\nBulk rename using BulkRename object to disable capitalizing the first letter of entity name (enabled by default)\n\n```yaml\ntype: 'custom:battery-state-card'\ntitle: Filters\nsort: \"state\"\nbulk_rename:\n  rules:\n    - from: \"Battery Level\" # simple string replace (note: \"to\" is not required if you want to remove string)\n      to: \"sensor\"\n    - from: \"/\\\\s(temperature|temp)\\\\s/\" # regular expression\n      to: \" temp. \"\n  capitalize_first: false\nfilter:\n  include: # filters for auto-adding\n    - name: entity_id # entities which id ends with \"_battery_level\"\n      value: \"*_battery_level\"\n    - name: \"attributes.device_class\" # and entities which device_class attribute equals \"battery\"\n      value: battery\n```\n\n### Secondary info\n\n![image](https://user-images.githubusercontent.com/8268674/80970635-63510b80-8e13-11ea-8a9a-6bc8d873092b.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\nname: Secondary info\nsecondary_info: \"{last_updated}\" # applied to all entities which don't have the override\nentities:\n  - entity: \"sensor.bedroom_motion_battery_level\"\n    name: \"Bedroom motion sensor\"\n  - entity: \"sensor.mi_roborock\"\n    secondary_info: \"{charging.text}\" # only appears when charging is detected\n    charging_state:\n      attribute:\n        name: \"is_charging\"\n        value: true\n      secondary_info_text: \"Charging at {state}%\" # supports KString - shows current battery level\n  - entity: \"sensor.jacks_motorola\"\n    name: \"Jack's phone\"\n    secondary_info: \"Motorola\" # Static text\n```\n\n### Tap actions\n\n![image](https://user-images.githubusercontent.com/8268674/97094268-62bf6200-164b-11eb-8d7d-344f9842f85e.png)\n\n```yaml\ntype: 'custom:battery-state-card'name: Click\ncolors:\n  steps:\n    - '#ff0000'\n    - '#0000ff'\n    - '#00ff00'\n  gradient: true\nentities:\n  - entity: \"sensor.bedroom_motion_battery_level\"\n    name: More info\n    tap_action: more-info\n    value_override: 100\n  - entity: \"sensor.bathroom_motion_battery_level\"\n    name: Navigation path\n    tap_action:\n      action: navigate\n      navigation_path: /lovelace/1\n    value_override: 0\n  - entity: \"sensor.bedroomtemp_battery_level\"\n    name: Call service - Pushover\n    tap_action:\n      action: call-service\n      service: \"notify.pushover\"\n      service_data:\n        message: Call service works\n        title: Some title\n    value_override: 60\n  - entity: \"sensor.bedroom_balcony_battery_level\"\n    name: Url\n    tap_action:\n      action: url\n      url_path: 'http://reddit.com'\n    value_override: 20\n  - entity: \"sensor.bedroom_switch_battery_level\"\n    name: No action\n    value_override: 80\n\n```\n\n### Using Themes\n\nYou can apply any Home Assistant theme to the card using the `theme` property. The card will apply the theme's CSS variables to match your Home Assistant theme.\n\n```yaml\ntype: \"custom:battery-state-card\"\ntheme: slate  # Apply the \"slate\" theme\nentities:\n  - sensor.bedroom_motion_battery_level\n  - sensor.bathroom_motion_battery_level\n```\n\n**Light/Dark Mode Support**: The card automatically detects if your theme has separate light and dark modes and applies the appropriate mode based on Home Assistant's dark mode setting.\n\n### Custom styles\n\nYou can use the `style` property to inject custom CSS rules into the component's shadow DOM. This allows you to target inner HTML elements like `.name`, `.state`, `.icon`, `ha-card`, etc.\n\n#### Card-level custom styles\n\n```yaml\ntype: \"custom:battery-state-card\"\nstyle: |\n  ha-card {\n    background: #1E1E1E;\n  }\n  .name {\n    font-weight: bold;\n  }\nentities:\n  - sensor.bedroom_motion_battery_level\n  - sensor.bathroom_motion_battery_level\n```\n\nYou can also use CSS variables to customize the look:\n\n```yaml\ntype: \"custom:battery-state-card\"\nstyle: \":host { --ha-card-background: #1E1E1E; --primary-text-color: #E0E0E0; }\"\nentities:\n  - sensor.bedroom_motion_battery_level\n```\n\n#### Per-entity custom styles\n\nSince `style` is a [common option](#common-options), it can be set per-entity to style individual battery elements:\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Custom styled entities\"\nentities:\n  - entity: \"sensor.bedroom_battery\"\n    style: \".name { color: red; }\"\n  - sensor.bathroom_battery  # no custom style\n```\n\n#### Combining with themes\n\nYou can combine `style` with `theme`. Theme CSS variables are applied as inline styles on the host element, while custom `style` rules are injected into the shadow DOM â€” so both work independently:\n\n```yaml\ntype: \"custom:battery-state-card\"\ntheme: slate\nstyle: |\n  :host { --primary-color: #ff5722; }\n  .name { font-style: italic; }\nentities:\n  - sensor.bedroom_motion_battery_level\n```\n\n### Unpacking grouped entities\n\nSome entities (e.g. sensor groups or template sensors) contain an `entity_id` attribute with a list of other entity IDs. You can unpack these into separate battery entries.\n\nEntities in the `group` domain are always unpacked automatically. For entities in other domains (e.g. `sensor`) you can enable unpacking either per-entity or at the card level.\n\n#### Per-entity unpack\n\nUse `unpack: true` on a specific entity to unpack only that one:\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Sensor group batteries\"\nentities:\n  - entity: \"sensor.battery_group\"\n    unpack: true\n  - sensor.some_other_battery # this one is shown as-is\n```\n\n#### Card-level unpack\n\nUse `unpack: true` at the card level to automatically unpack all entities that have an `entity_id` array attribute:\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Auto-unpack all groups\"\nunpack: true\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\n```\n\nNote: When card-level `unpack` is enabled, any entity (regardless of domain) whose `entity_id` attribute is an array will be replaced by its child entities. Entities without an `entity_id` array attribute are unaffected.\n\n### Other use cases\n\n#### Signal strength\n\n\u003cimg width=\"476\" height=\"435\" alt=\"image\" src=\"https://github.com/user-attachments/assets/f807eec3-81e7-4ef7-a3fd-522d961d259f\" /\u003e\n\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{last_changed}\"\nicon: \u003e-\n  mdi:signal-cellular-{state|abs()|greaterthan(80,outline)|greaterthan(75,1)|greaterthan(60,2)|greaterthan(2,3)}\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: signal_strength\ncollapse: 7\nsort: state\nbulk_rename:\n  - from: \" Signal\"\n  - from: \" signal\"\n  - from: \" Strength\"\n  - from: \" strength\"\n  - from: \" RSSI\"\n  - from: \" numeric\"\ncolors:\n  steps:\n    - color: \"#ff0000\"\n      value: -90\n    - color: \"#ffff00\"\n      value: -80\n    - color: \"#00ff00\"\n      value: -50\n  gradient: true\n\n```\n\n#### HDD temperatures\n\n![image](https://user-images.githubusercontent.com/10567188/151678867-28bd47b9-fb66-42ed-a78a-390d55860634.png)\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: HDD temperatures\nicon: \"mdi:harddisk\"\ncolors:\n  steps:\n    - value: 26\n      color: blue\n    - value: 36\n      color: green\n    - value: 45\n      color: yellow\n    - value: 60\n      color: red\ntap_action:\n  action: more-info\ncollapse: 3\nsort:\n  by: state\n  desc: true\nunit: Â°C\nround: 0\nfilter:\n  include:\n    - name: entity_id\n      value: \"sensor.nasos_sd*\"\n    - name: entity_id\n      value: \"sensor.omv2_sd*\"\n    - name: entity_id\n      value: \"sensor.exnas_st12*temper*\"\n    - name: entity_id\n      value: \"sensor.*_disk_*_temperature\"\nentities:\n  - entity: \"sensor.vidik_temperature\"\n  - entity: \"sensor.exnas_d1_temperatures_temperature\"\n```\n\n#### Motion sensors (sorted by state and last changed property)\n\n![image](https://github.com/maxwroc/battery-state-card/assets/8268674/cd9291bf-1804-4783-9436-622c4b63fe56)\n\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: '{last_changed}'\nicon: '{state|equals(off,mdi:motion-sensor-off)|equals(on,mdi:motion-sensor)}'\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: motion\nsort:\n  - by: state\n    desc: true\n  - by: \"entity.last_changed\"\n    desc: true\ncolors:\n  steps:\n    - value: 0\n      color: inherit\n    - value: 1\n      color: var(--state-active-color)\nunit: null\nstate_map:\n  - from: 'off'\n    to: 0\n    display: Clear\n  - from: 'on'\n    to: 1\n    display: Detected\ncollapse: 8\n\n```\n\n#### Using default entity icons\n\nIf your entities already have appropriate icons defined and you want to keep them instead of using battery icons, set `icon` to `null`:\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Devices with original icons\"\nentities:\n  - entity: \"sensor.phone_battery\"\n    icon: null\n  - entity: \"sensor.tablet_battery\"\n    icon: null\n  - entity: \"sensor.watch_battery\"\n    icon: null\n```\n\nYou can also apply it to all entities using [common options](#common-options):\n\n```yaml\ntype: \"custom:battery-state-card\"\ntitle: \"Devices with original icons\"\nicon: null  # Apply to all entities\nfilter:\n  include:\n    - name: entity_id\n      value: \"*_battery\"\n```\n\n#### Default configuration to work with the \"Battery Notes\" integration\n\nThe \"HA-Battery_Notes HACS integration automatically adds additional information about all battery devices within your HA implementation, such as battery types, etc. The Configuration below automatically creates a table for all Battery Plus devices and shows the required type and number of devices.\n\n[HA-Battery-notes]: https://github.com/andrew-codechimp/HA-Battery-Notes\n\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{attributes.battery_type_and_quantity}\"\nfilter:\n  include:\n    - name: entity_id\n      value: \"*battery_plus\"\n  exclude:\n    - name: entity_id\n      value: \"binary_sensor.*\"\nsort:\n  by: state\n  desc: true\nbulk_rename:\n  - from: \" Battery\"\n  - from: \" level\"\ncolors:\n  steps:\n    - \"#ff0000\"\n    - \"#ffff00\"\n    - \"#00ff00\"\n  gradient: true\n```\n\n\n## Battery Notes\n\nThis card has built-in support for the [Battery Notes](https://github.com/andrew-codechimp/HA-Battery-Notes) integration. Battery Notes is a popular HACS integration that adds additional information about battery devices, such as battery type and quantity.\n\nWhen Battery Notes is installed it creates additional entities for each device (on the `battery_notes` platform). The card automatically **deduplicates** these entities: when both the original battery entity and the Battery Notes \"battery plus\" entity (with `state_class: measurement`) are present, the card keeps only the battery plus entity, which has the most up-to-date state and extra attributes like `battery_type`.\n\nThis deduplication is **enabled by default**. If you want to keep all entities (including duplicates), disable it:\n\n```yaml\ntype: \"custom:battery-state-card\"\nbattery_notes_dedup: false\n```\n\nWith deduplication active, Battery Notes attributes are available directly on the entity. You can reference them in `secondary_info`:\n\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{attributes.battery_type}\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\n```\n\nYou can also group batteries by battery type using the `by` property in [group config](#group-object):\n\n```yaml\ntype: \"custom:battery-state-card\"\nsecondary_info: \"{attributes.battery_type}\"\nfilter:\n  include:\n    - name: \"attributes.device_class\"\n      value: battery\nsort:\n  by: state\ncollapse:\n  - by: \"attributes.battery_type\"\n```\n\n## Installation\n\nOnce added to [HACS](https://community.home-assistant.io/t/custom-component-hacs/121727) add the following resource to your **lovelace** configuration (if you have yaml mode active)\n```yaml\nlovelace:\n  mode: yaml\n  resources:\n    - url: \"/hacsfiles/battery-state-card/battery-state-card.js\"\n      type: module\n```\n\nIf you don't have HACS you can download js file from [latest release](https://github.com/maxwroc/battery-state-card/releases/latest). Drop it then in `www` folder in your `config` directory. Next add the following entry in lovelace configuration\n```yaml\nresources:\n  - url: \"/local/battery-state-card.js\"\n    type: module\n```\n\n## Troubleshooting\n\nYou can turn on the debug output via `debug` setting. It can be turned on for all of the entities:\n\n```yaml\ndebug: true\n```\n\nOr single entity by specifying entity_id:\n```yaml\ndebug: \"sensor.owl_energy_signal_strength\"\n```\n\n![image](https://github.com/maxwroc/battery-state-card/assets/8268674/04a2b1c8-662a-4067-9231-1d8314914ed3)\n\nNote: \"Copy to clipboard\" is available only if you access your HA via https.\n\nAfter clicking on show/hide you will see the entity data which is available for the card to process.\n\n\u003cdetails\u003e\n  \u003csummary\u003eClick to see example output\u003c/summary\u003e\n\n```json\n{\n  \"entity_id\": \"sensor.owl_energy_signal_strength\",\n  \"state\": \"-72\",\n  \"attributes\": {\n    \"state_class\": \"measurement\",\n    \"event\": \"115a011a32e20100000172000031bbc85d69\",\n    \"unit_of_measurement\": \"dBm\",\n    \"assumed_state\": true,\n    \"device_class\": \"signal_strength\",\n    \"friendly_name\": \"Owl energy Signal strength\"\n  },\n  \"context\": {\n    \"id\": \"01HPC8X76DDZ4D3XK5BMH8KKFW\",\n    \"parent_id\": null,\n    \"user_id\": null\n  },\n  \"last_changed\": \"2024-02-11T14:24:59.597Z\",\n  \"last_updated\": \"2024-02-11T14:24:59.597Z\",\n  \"entity\": {\n    \"entity_id\": \"sensor.owl_energy_signal_strength\",\n    \"device_id\": \"91b4ffe9a73db4d1ee9482d0e7d94a84\",\n    \"platform\": \"rfxtrx\",\n    \"entity_category\": \"diagnostic\",\n    \"name\": \"Signal strength\"\n  },\n  \"device\": {\n    \"area_id\": \"outside\",\n    \"configuration_url\": null,\n    \"config_entries\": [\n      \"2c67d4fe27613df1b3de59a1f042dc5c\"\n    ],\n    \"connections\": [],\n    \"disabled_by\": null,\n    \"entry_type\": null,\n    \"hw_version\": null,\n    \"id\": \"91b4ffe9a73db4d1ee9482d0e7d94a84\",\n    \"identifiers\": [\n      [\n        \"rfxtrx\",\n        \"5a\",\n        \"1\",\n        \"32:e2\"\n      ]\n    ],\n    \"manufacturer\": null,\n    \"model\": \"ELEC2, CM119/160\",\n    \"name_by_user\": \"Owl energy\",\n    \"name\": \"ELEC2, CM119/160 32:e2\",\n    \"serial_number\": null,\n    \"sw_version\": null,\n    \"via_device_id\": null\n  },\n  \"area\": {\n    \"aliases\": [],\n    \"area_id\": \"outside\",\n    \"name\": \"Outside\",\n    \"picture\": null\n  }\n}\n```\n\u003c/details\u003e\n\nWhen you look at the entity data you can for example figure out what you can display using KString e.g. `Area: {area.name}, Device: {device.name_by_user}`\n\n## Development\n\u003cdetails\u003e\n  \u003csummary\u003eClick to expand\u003c/summary\u003e\n\n```shell\nnpm install\nnpm run build\n```\n\nBundled transpiled code will appear in `dist` directory.\n\nFor automatic compilation on detected changes use:\n```\nnpm run watch\n```\n\nThe `watch` script starts web server exposing dist dir so you can reference the local file in your HA via the following:\n\n```yaml\nlovelace:\n  resources:\n    - url: \"http://127.0.0.1:5501/dist/battery-state-card.js\"\n      type: module\n```\n\nNote: there is \"undocumented\" `value_override` property on the [entity object](#entity-object) which you can use for testing.\n\n### Testing\n\n```shell\nnpm run test\n```\n\nOr (to see tests coverage report)\n\n```shell\nnpm run test+coverage\n```\n\nTests in `card` and `entity` directory are e2e tests which run in Electron (headless) browser. All the other tests run in node env (hence they are much faster).\n\n\u003c/details\u003e\n\n## Do you like the card?\n\nIf you do like the card please star it on [GitHub](https://github.com/maxwroc/battery-state-card)!\n\nIf you want to show your support please\n\n[![Buy me a coffee][coffee-image]][coffee-link]\n\nThanks!\n\nIf you think that I deserve\n\n## License\n\nThis project is under the [MIT license](https://github.com/maxwroc/battery-state-card/blob/master/LICENSE).\n\n## Automatic notifications about low battery levels\n\nIt is not possible to do such a thing from the card level. If you want to get automatic notifications/alerts you can use the blueprint shared by sbyx:\n\nhttps://my.home-assistant.io/create-link/?redirect=blueprint_import\u0026blueprint_url=https%3A%2F%2Fgist.github.com%2Fsbyx%2F1f6f434f0903b872b84c4302637d0890\n\nClick on \"copy url\" button and paste it in your browser. If you have configured my.home-assistant.io already you should be redirected to the page in your HA where you can review the blueprint code and add it. Once you add it you can create automation based on it.\n\n## My other HA related repos\n[github-flexi-card](https://github.com/maxwroc/github-flexi-card) | [homeassistant-config](https://github.com/maxwroc/homeassistant) | [lovelace-card-boilerplate](https://github.com/maxwroc/lovelace-card-boilerplate)\n\n\n[releases]: https://github.com/maxwroc/battery-state-card/releases\n[releases-shield]: https://img.shields.io/github/release/maxwroc/battery-state-card.svg?style=popout\n[downloads-total-shield]: https://img.shields.io/github/downloads/maxwroc/battery-state-card/total\n[forum]: https://community.home-assistant.io/t/lovelace-battery-state-card/191535\n[forum-shield]: https://img.shields.io/badge/community-forum-brightgreen.svg?style=popout\n[hacs-shield]: https://img.shields.io/badge/HACS-Default-orange.svg\n[hacs]: https://hacs.xyz/docs/default_repositories\n[coffee-shield]: https://img.shields.io/badge/Buy_me_a-coffee-yellow?logo=buymeacoffee\u0026logoColor=ffffff\n[coffee-link]: https://buymeacoffee.com/maxwroc\n[coffee-image]: https://www.buymeacoffee.com/assets/img/custom_images/yellow_img.png\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaxwroc%2Fbattery-state-card","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmaxwroc%2Fbattery-state-card","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaxwroc%2Fbattery-state-card/lists"}