Show card in the card picker #198

README.md

@@ -35,6 +35,24 @@ This card was inspired by [another great card](https://github.com/cbulock/lovela
 
 ## Config
 
+### Default card config
+
+When config is empty the card is initialized with the default config which you can find below. Once you start adding custom configuration the default configuration won't be applied hence if you wish to alter the default config please copy-paste it from the below listing.
+```yaml
+type: custom:battery-state-card
+secondary_info: "{last_changed}"
+filter:
+  include:
+    - name: "attributes.device_class"
+      value: "battery"
+sort:
+  by: "state"
+collapse: 8
+bulk_rename:
+  - from: " Battery"
+  - from: " level"
+```
+
 ### Card config
 | Name | Type | Default | Since | Description |
 |:-----|:-----|:-----|:-----|:-----|

src/custom-elements/battery-state-card.ts

@@ -53,6 +53,11 @@ export class BatteryStateCard extends LovelaceCard<IBatteryCardConfig> {
     async internalUpdate(configUpdated: boolean, hassUpdated: boolean) {
 
         if (this.batteryProvider == undefined || configUpdated) {
+            // checking whether we should apply default config
+            if (Object.keys(this.config).length == 1) {
+                this.config = getDefaultConfig();
+            }
+
             this.batteryProvider = new BatteryProvider(this.config);
         }
 
@@ -119,4 +124,22 @@ export class BatteryStateCard extends LovelaceCard<IBatteryCardConfig> {
         // +1 to account header
         return size + 1;
     }
+}
+
+const getDefaultConfig = () => <IBatteryStateCardConfig>{
+    sort: {
+        by: "state"
+    },
+    collapse: 8,
+    filter: {
+        include: [{
+            name: "attributes.device_class",
+            value: "battery"
+        }]
+    },
+    secondary_info: "{last_changed}",
+    bulk_rename: [
+        { from: " Battery" },
+        { from: " level" },
+    ]
 }

src/index.ts

@@ -2,6 +2,7 @@ import { BatteryStateEntity } from "./custom-elements/battery-state-entity";
 import { BatteryStateCard } from "./custom-elements/battery-state-card";
 import { log, printVersion } from "./utils";
 
+declare let window: HomeAssistantWindow;
 
 if (customElements.get("battery-state-entity") === undefined) {
     printVersion();
@@ -10,4 +11,12 @@ if (customElements.get("battery-state-entity") === undefined) {
 }
 else {
     log("Element seems to be defined already", "warn");
-}
+}
+
+window.customCards = window.customCards || [];
+window.customCards.push({
+    type: "battery-state-card",
+    name: "Battery state card",
+    preview: true,
+    description: "Customizable card for listing battery states/levels"
+});

src/typings.d.ts

@@ -307,3 +307,15 @@ interface IMap<T> {
 
 type IObjectOrString<T> = T | string;
 type ISimplifiedArray<T> = IObjectOrString<T> | IObjectOrString<T>[] | undefined;
+
+interface HomeAssistantWindow extends Window {
+    customCards: ICardInfo[] | undefined;
+}
+
+interface ICardInfo {
+    type: string;
+    name: string;
+    description: string;
+    preview?: boolean;
+    documentationURL?: string;
+}