This widget set consists of the following widgets:

Energy distribution
Energy consumption comparison

Pie chart

Time selector for energy consumption
Energy consumption per day/week/month
Self-sufficiency and self-consumption as two ring gauges
Battery storage with state of charge, power and remaining time
Energy costs of the selected period, including base fee and feed-in revenue
Dynamic electricity price as an hourly bar chart

Documentation

One page per widget, with every configuration field, recipes and troubleshooting:

Requirements

The widget set is built with React 19 and needs a vis-2 that runs on React 19 as well (2.20.1 and newer). An older vis-2 still runs on React 18 and cannot render these widgets — update vis-2 together with this adapter.

Changelog

3.0.3 (2026-10-26)

(@GermanBluefox) Distribution widget: feed-in reported by a separate power line return OID now shows the moving dot from home to the grid and the green circle, like a negative power line value does (#227)

3.0.2 (2026-10-26)

(hombach) Fixed the widget integration test for @iobroker/vis-2-widgets-testing 2.x: addWidget now receives a numeric timeout instead of a boolean, which otherwise made the test fail immediately ("truems exceeded") and blocked the release from being published
(hombach) Distribution widget: the computed size is now clamped to zero so the circle radii derived from it never turn into invalid negative SVG r values at very small widget sizes
(hombach) updated dependencies

3.0.1 (2026-10-16)

(@GermanBluefox) BREAKING: built with React 19 and MUI 9 - requires vis-2 2.20.1 or newer (React 19)
(@GermanBluefox) New widgets: self-sufficiency, battery storage, energy costs and dynamic electricity price
(@GermanBluefox) Tooltips for all configuration fields, a palette description for every widget and new documentation (docs/en, docs/de) with fresh screenshots
(@GermanBluefox) Distribution widget: animation done by the browser (much less CPU load); new options for line width, animation and raw values; fixed font size, Wh/kWh unit and house ring segments
(@GermanBluefox) Consumption widget: new chart types (line, area), legend, toolbox and decimals; fixed number of bars per month, missing last bar and bucket edges
(@GermanBluefox) Comparison widget: new options for sorting, decimals, vertical bars and value labels; fixed mixed-up units
(@GermanBluefox) Interval selector: configurable periods, "Now" button and date format
(@GermanBluefox) Layout fixes for large widgets; all charts follow the size of their container
(@GermanBluefox) Build: replaced adapter-react-v5 with gui-components, tasks.ts in TypeScript, federation manifest is shipped
(hombach) Fixed missing translation of "default radius size" (#527) and addressed repository checker findings (#526)

2.0.1 (2026-08-13)

(hombach) BREAKING: the comparison widget no longer auto-converts W→Wh / kW→kWh nor divides Wh values by 1000. It now shows the real datapoint unit and raw value; use the "factor" field for scaling (#243)
(hombach) Comparison widget: option to disable chart animations or set their duration (#416)
(hombach) Distribution widget: optional second value per node shown in the circle (e.g. a battery state of charge / SoC in %) (#416, #74)
(hombach) Consumption widget: added a per-device factor and a y-axis unit label (#451)
(hombach) Consumption widget: added a "stacked" option to preselect stacked vs grouped bars (#451)
(hombach) Migrated the widget sources from JavaScript/JSX to TypeScript
(hombach) Migrated the widget build from Create React App (react-scripts/craco) to Vite with module federation
(hombach) Fixed broken check and lint scripts (added tsconfig files, repaired ESLint flat config for JSX sources)
(hombach) Fixed duplicated "inner radius" field in the consumption comparison widget config (#393)
(hombach) Fixed unit of the feed-back (return) value not following the power line unit in the distribution widget (#212)
(hombach) Fixed wrong/missing Sunday data in the consumption widget (week view now starts correctly on Monday) (#270, #290)
(hombach) The comparison widget x-axis now uses the configured/detected device unit instead of always showing "kWh" (#243)
(hombach) Addressed repository checker findings: dependabot cooldown + @types/node major-ignore, removed self-referencing licenseInformation link, ignore .commitinfo (#512)
(hombach) Added a check-and-lint job to the CI workflow (#512)
(hombach) Updated echarts to v6 (#6)
(hombach) Updated TypeScript dev dependency to v6 (v7 still blocked by typescript-eslint)
(hombach) Updated @iobroker/adapter-react-v5 to v8 and added the @emotion/react + @emotion/styled dependencies required by MUI (#17)
(hombach) Removed the unused legacy ESLint stack (airbnb config, deprecated eqeqeq-fix, only-warn) and the dead .eslintrc.js from src-widgets
(hombach) Fixed copyright year (#461)
(hombach) Removed deprecated common.noConfig from io-package.json (#499)
(hombach) Fixed build failure by removing deprecated node-sass dependency
(hombach) testing for node.js 24 (#383)
(hombach) updated GitHub actions
(hombach) updated dependencies
(hombach) fixed repo checker warnings
(@GermanBluefox) Refactored the code

1.0.2 (2024-08-06)

(bluefox) updated packages

License

The MIT License (MIT)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Vis 2 Widgets Energy