0.3.6 • Published 10 months ago
ha-lovelace-ts v0.3.6
lovelace_ts - HA Lovelace Config as TypeScript
Usage
- Setup a Node devenv - make sure you have
nodejs
andyarn
installed, create a directory, runyarn init
andyarn add ha-lovelace-ts
Setup your
tsconfig.json
file with at least these parameters:{ "compilerOptions": { "rootDir": ".", "jsx": "react", "jsxFactory": "h", "jsxFragmentFactory": "Fragment", }, }
Create an
index.tsx
file and start writing your UI. Here's an example:import { render, h } from 'ha-lovelace-ts' async function Blah() { return <area area='Blah' /> } export default render(<dashboard title='Robert'> <view title='Hia' path='phil' type="masonry"> <horizontal_stack> <entities entities={['a', 'b']} /> </horizontal_stack> </view> <view title='Hia' path='phil'> <Blah /> </view> </dashboard>)
Compile - run
yarn lovelace_ts build index.tsx output.yml
- Copy the generated file to your HA instance
Contributing Card Definitions
Take a look at src/contrib
and look at the existing definitions as examples.
0.3.6
10 months ago
0.3.5
10 months ago
0.3.4
1 year ago
0.3.3
1 year ago
0.3.0
2 years ago
0.3.2
2 years ago
0.3.1
2 years ago
0.2.1
2 years ago
0.2.0
2 years ago
0.1.9
3 years ago
0.1.8
3 years ago
0.1.7
3 years ago
0.1.6
3 years ago
0.1.5
3 years ago
0.1.4
3 years ago
0.1.3
3 years ago
0.1.2
3 years ago
0.1.1
3 years ago
0.1.0
3 years ago