[Fix] Set default strolch-wc-debounced-input input colors to non-white

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "strolch-wc-debounced-input",
   "description": "Strolch WebComponent Debounced Input",
-  "version": "0.1.0",
+  "version": "0.1.6",
   "authors": [
     "Robert von Burg"
   ],
@@ -13,13 +13,13 @@
   "private": true,
   "repository": {
     "type": "git",
-    "url": "git@github.com:4treesCH/strolch-wc-debounced-input.git"
+    "url": "git@github.com:strolch-li/strolch-wc-debounced-input.git"
   },
-  "license": "https://github.com/4treesCH/strolch-wc-debounced-input/blob/master/LICENSE",
+  "license": "https://github.com/strolch-li/strolch-wc-debounced-input/blob/master/LICENSE",
-  "homepage": "https://github.com/4treesCH/strolch-wc-debounced-input",
+  "homepage": "https://github.com/strolch-li/strolch-wc-debounced-input",
   "ignore": [],
   "dependencies": {
-    "polymer": "Polymer/polymer#^1.11.3",
+    "polymer": "Polymer/polymer#^1.12.0",
 
     "iron-icon": "PolymerElements/iron-icon#^1.0.13",
     "iron-icons": "PolymerElements/iron-icons#^1.2.1",

strolch-wc-debounced-input.html

@@ -8,19 +8,22 @@
         <!-- Style -->
         <style is="custom-style">
             :host {
-                --focus-color: white;
+                --focus-color: var(--primary-color);
-                --regular-color: lightgrey;
+                --input-color: var(--primary-text-color);
+                --regular-color: var(--secondary-text-color);
                 --disabled-color: darkgrey;
                 display: block;
+
+                --input-padding: 4px;
             }
 
             paper-input {
                 --paper-input-container-color: var(--regular-color);
                 --paper-input-container-focus-color: var(--focus-color);
-                --paper-input-container-input-color: var(--focus-color);
+                --paper-input-container-input-color: var(--input-color);
                 --paper-input-container-input: {
                     font-size: 18px;
-                    padding: 4px;
+                    padding: var(--input-padding);
                 };
                 --paper-input-container-underline-disabled: {
                     border-bottom-style: solid;
@@ -52,7 +55,8 @@
 
         <!-- Content -->
         <paper-input id="inputElement"
-                     no-label-float
+                     label="[[label]]"
+                     no-label-float="[[noLabelFloat]]"
                      placeholder="[[placeholder]]"
                      value="{{input}}"
                      disabled$="[[disabled]]"
@@ -97,6 +101,13 @@
                     type: String,
                     value: "search"
                 },
+                label: {
+                    type: String
+                },
+                noLabelFloat: {
+                    type: Boolean,
+                    value: true
+                },
                 disabled: {
                     type: Boolean,
                     value: false
@@ -106,14 +117,7 @@
             <!-- Observers -->
             observeInput: function (newValue, oldValue) {
                 this.debounce("inputDebounce", function () {
-                    // save the previous value so it may be reset
+                    this._setInput(newValue, false);
-                    this.set("prevDebouncedInput", this.debouncedInput);
-                    // set the debounced input after delay
-                    this.set("debouncedInput", newValue);
-                    this.fire('strolch-wc-debounced-input-changed', {
-                        input: newValue,
-                        enterPressed: false
-                    });
                 }, 500);
             },
 
@@ -124,21 +128,27 @@
                 // if enter was pressed
                 if (event.keyCode === 13) {
                     this.debounce("inputDebounce", function () {
-                        // save the previous value so it may be reset
+                        this._setInput(this.input, true);
-                        this.set("prevDebouncedInput", this.debouncedInput);
-                        // set the debounced input after delay
-                        this.set("debouncedInput", this.input);
-                        this.fire('strolch-wc-debounced-input-changed', {
-                            input: this.input,
-                            enterPressed: true
-                        });
                     }, 200);
                 }
             },
 
+            _setInput: function (newValue, enterPressed) {
+                // save the previous value so it may be reset
+                this.set("prevDebouncedInput", this.debouncedInput);
+                // set the debounced input after delay
+                this.set("debouncedInput", newValue);
+                this.fire('strolch-wc-debounced-input-changed', {
+                    input: newValue,
+                    enterPressed: enterPressed
+                });
+            },
+
             <!-- Functions -->
-            onClearTapped: function (event) {
+            onClearTapped: function () {
                 this.setInputTerm("");
+                this.cancelDebouncer("inputDebounce");
+                this._setInput("", false);
             },
             undoLastInput: function () {
                 // apply the last debounced input