diff --git a/package.json b/package.json index e0aa1cd..f4f3b03 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@tp/tp-date-input", - "version": "1.0.0", + "version": "1.1.0", "description": "", "main": "tp-date-input.js", "scripts": { @@ -13,8 +13,8 @@ "author": "trading_peter", "license": "Apache-2.0", "dependencies": { - "date-fns": "^2.28.0", - "date-fns-tz": "^1.3.3", - "lit": "^2.2.0" + "date-fns": "^2.0.0", + "date-fns-tz": "^2.0.0", + "lit": "^3.0.0" } } diff --git a/tp-date-input.js b/tp-date-input.js index ed1a528..e97bab0 100644 --- a/tp-date-input.js +++ b/tp-date-input.js @@ -181,7 +181,7 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) { super.firstUpdated(); this.listen(this, 'input', '_autoMoveCursor'); - const datepicker = this.querySelector('tp-datepicker'); + const datepicker = this.querySelector('tp-date-picker'); if (datepicker) { datepicker.addEventListener('value-changed', e => { this.value = e.detail; @@ -378,8 +378,9 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) { _setClass(idx) { switch (this._inputAssign[idx]) { case 'dd': + return 'day'; case 'MM': - return ''; + return 'month'; case 'y': return 'year'; } @@ -411,6 +412,10 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) { } } + if (this._inputAssign.length !== 3) { + console.error(this.tagname + ': Not all date parts where found. Make sure to have MM, dd, and y in your format string.'); + } + if (this.value) { this._onValueChanged(); } @@ -439,7 +444,7 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) { this.invalid = false; - if (this.value === null || this.value === undefined || this.value === 'Invalid date') { + if (this.value === null || this.value === undefined || this.value === 'Invalid date' || this.value === '') { this.date = null; this.value = null; this._input0 = '';