Sourceful Energy

Scroll Area

Augments native scroll functionality for custom, cross-browser styling.

Installation

import { ScrollArea, ScrollBar } from "@sourceful-energy/ui"

Usage

Tags

Solar
Battery
EV
Grid
Inverter
Monitor
Schedule
Export
Import
Peak
Off-Peak
Smart

Examples

Device List

Connected Devices

Solar Inverter #1
Online
4.2 kW
Solar Inverter #2
Online
3.8 kW
Battery Storage
Charging
2.1 kW
EV Charger
Idle
0 kW
Smart Meter
Online
-
Heat Pump
Running
1.5 kW
Solar Inverter #3
Offline
0 kW
Wind Turbine
Online
0.8 kW

Horizontal Scroll

Solar
Battery
EV
Grid
Inverter
Monitor
Schedule
Export
Import
Peak
Off-Peak
Smart

Fixed Height Container

Monitor your energy production and consumption in real-time. Our dashboard provides comprehensive insights into your renewable energy system's performance.

Track solar generation, battery storage levels, and grid import/export data all in one place. Set up alerts for unusual patterns or when you reach energy goals.

The system automatically optimizes energy flow between your solar panels, battery, and the grid to maximize savings and minimize your carbon footprint.

Access historical data and trends to understand your energy patterns over time. Export reports for analysis or share with your energy provider.

Props

PropTypeDefaultDescription
type"auto" | "always" | "scroll" | "hover""hover"Describes the nature of scrollbar visibility.
scrollHideDelaynumber600Delay in ms before hiding scrollbars (for type 'scroll' or 'hover').
classNamestring-Additional CSS classes.

Accessibility

  • Built on Radix UI ScrollArea for consistent behavior
  • Keyboard scrolling works natively
  • Custom scrollbars maintain accessibility
  • Works with screen readers
Previous
Sheet
Next
Sites Map