---
label: energy-flow voorbeeld
description: Energie-flow visualisatie
type: energy-flow
author: maik
---

import React from 'react';

export default function EnergyFlowTemplate({ data }) {
  const { grid = 0, pv = 0, battery = 0 } = data ?? {};
  return (
    <div className="widget-flow">
      <span className={grid > 0 ? 'import' : 'export'}>{Math.abs(grid).toFixed(0)}W</span>
      <span>{pv.toFixed(0)}W ☀</span>
      <span>{battery.toFixed(0)}W 🔋</span>
    </div>
  );
}