Overhaul battery panel: responsive layout, configurable options, enterprise-level UI

- Responsive layout adapts to any panel size (mobile to widescreen)
  - Auto-switches between column/row layout based on dimensions
  - Gracefully degrades in tiny panels (hides stats, keeps battery)
  - Font sizes scale dynamically to available space

- New configurable options via Grafana panel editor:
  - Colours category: low/mid/high battery colours
  - Thresholds category: configurable low/high % boundaries (was hardcoded 30/70)
  - Appearance category: gradient fill, orientation (vertical/horizontal),
    charging animation, border width
  - Display category: individual show/hide toggles for percentage, rate,
    low/high stats, charging status
  - Data category: decimal places, regression toggle

- Fixed bugs:
  - Gradient ID now unique per panel instance (fixes multi-panel dashboards)
  - Battery fill uses clipPath so it respects rounded corners
  - Proper 'No data' empty state

- Horizontal battery orientation for wide/short panels
- Pulse animation when charging (configurable)
- Status badge with themed colours (charging/discharging/stable)
- Moved options interface to shared types.ts
- Updated stale e2e tests to match current component

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

tests/panel.spec.ts

@@ -9,27 +9,13 @@ test('should display "No data" in case panel data is empty', async ({
   await expect(panelEditPage.panel.locator).toContainText('No data');
 });
 
-test('should display circle when data is passed to the panel', async ({
+test('should display the battery panel when data is passed', async ({
   panelEditPage,
   readProvisionedDataSource,
   page,
 }) => {
   const ds = await readProvisionedDataSource({ fileName: 'datasources.yml' });
   await panelEditPage.datasource.set(ds.name);
-  await panelEditPage.setVisualization('ChargeViz Battery Panel');
-  await expect(page.getByTestId('simple-panel-circle')).toBeVisible();
-});
-
-test('should display series counter when "Show series counter" option is enabled', async ({
-  gotoPanelEditPage,
-  readProvisionedDashboard,
-  page,
-}) => {
-  const dashboard = await readProvisionedDashboard({ fileName: 'dashboard.json' });
-  const panelEditPage = await gotoPanelEditPage({ dashboard, id: '1' });
-  const options = panelEditPage.getCustomOptions('ChargeViz Battery Panel');
-  const showSeriesCounter = options.getSwitch('Show series counter');
-
-  await showSeriesCounter.check();
-  await expect(page.getByTestId('simple-panel-series-counter')).toBeVisible();
+  await panelEditPage.setVisualization('Battery Panel');
+  await expect(page.getByTestId('charge-viz-panel')).toBeVisible();
 });