koriwi/ha-component-kit

A Home Assistant React component library to generate dashboards with ease, This utilizises a massive list of Components / cards to use out of the box, a large range of hooks to build your own custom functionality, and a hell of a lot more! It's using web sockets to retrieve information from your home assistant instance so there's 0 latency!

Overview

This repository contains functionality to easily generate custom dashboards with react for Home Assistant using the official web socket connection that the standard lovelace dashboards use.

Try it out now! Demo

If you like anything here, be sure to 🌟 the repo!

Help me out?

As you can probably tell, 100s of hours have gone into this! I'd really appreciate a small donation as it will help me validate that my time is well spent and will guarantee future additional changes :) Buy me a coffee!

Get Started

There's an npm create command which will setup react, typescript, vite & hakit automatically for you with a terminal wizard!

  npm create hakit@latest

Or, if you want to install @hakit/core or @hakit/components manually on an existing project:

  npm install @hakit/core @hakit/components

Documentation

There's extensive documentation which should give you all the information you need to get started!

Home Assistant Addon

There's a Home Assistant Addon available which will serve your dashboard to a new sidebar link in home assistant making it easier to access your custom dashboard.

WIP - Next Release

• Theming - allow individual components to display different theme control, either by a hue shift or global change

Supported Cards

• AreaCard
• ButtonCard
• ClimateCard
• NEW CameraCard
• NEW CalendarCard
• EntitiesCard
• FabCard
• GarbageCollectionCard
• MediaPlayerCard
• PictureCard
• SensorCard
• SidebarCard
• TimeCard
• TriggerCard
• WeatherCard

Known Issues

• Anything else? Please, if you notice anything that doesn't feel / look right, please report it, i rely on user testing to make improvements.

What's next?

There's a Roadmap.md file with a few things i'm working on! Have your say! Vote for what you'd like to see next in upcoming features!

Contributors!

I welcome anyone who's willing to contribute to the package, if you're interested in helping out or have some suggestions to changes, please feel free to open a PR or an issue!

There's detailed instructions on how to get started if you want to introduce a new feature to the repository here.