Add option to set prefix for the attribute (#1)

.github/settings.yml

@@ -16,7 +16,7 @@ labels:
   - name: "Wont Fix"
     color: "ffffff"
   - name: "Enhancement"
-    color: a2eeef
+    color: "a2eeef"
   - name: "Documentation"
     color: "008672"
   - name: "Stale"

README.md

@@ -4,10 +4,12 @@ This element is **not** all that useful as a card (it can be used for that to),
 
 ## Options
 
-| Name | Type | Default | Description
+| Name | Type | Requirement | Description
 | ---- | ---- | ------- | -----------
 | type | string | **Required** | `custom:state-attribute-element`
 | entity | string | **Required** | The entity_id of the entity you want to show.
+| attribute | string | **Required** | The attribute of the entity you want to show.
+| prefix | string | **Optional** | The entity_id of the entity you want to show.
 
 ## Installation
 
@@ -43,4 +45,5 @@ Add a custom element in your `ui-lovelace.yaml`
           - type: custom:state-attribute-element
             entity: sensor.my_sensor
             attribute: my_attribute
+            prefix: "My prefix string: "
 ```

VERSION

@@ -1 +1 @@
-0.0.1
+0.0.2

state-attribute-element.js

@@ -1,10 +1,15 @@
 class StateAttributeElement extends HTMLElement {
   set hass(hass) {
     const entityId = this.config.entity;
+    const prefix_string = this.config.prefix
     const attr = this.config.attribute;
     const state = hass.states[entityId].attributes[attr];
     const card = document.createElement('state-attribute-element');
-    this.innerHTML = state;
+    if (prefix_string) {
+      this.innerHTML = prefix_string + state;
+    } else {
+      this.innerHTML = state;
+    }
   }
   setConfig(config) {
     if (!config.entity) {