@luftborn/custom-elements 2.5.7 → 2.6.0

package/demo/index.min.js

@@ -3001,7 +3001,22 @@ var CustomEvents_1 = require("../../framework/CustomEvents");
 var CustomFormatDateFieldElement = /** @class */ (function (_super) {
     __extends(CustomFormatDateFieldElement, _super);
     function CustomFormatDateFieldElement() {
-        return _super.call(this) || this;
+        var _this = _super.call(this) || this;
+        _this.defaultDateFormat = 'yyyy-mm-dd';
+        _this.supportedDateFormats = [
+            'ddmmyyyy',
+            'mmddyyyy',
+            'dd/mm/yyyy',
+            'mm/dd/yyyy',
+            'dd-mm-yyyy',
+            'mm-dd-yyyy',
+            'yyyy-mm-dd',
+            'yyyy-dd-mm',
+            'Month dd, yyyy',
+            'mm/dd/yy',
+            'dd/mm/yy',
+        ];
+        return _this;
     }
     Object.defineProperty(CustomFormatDateFieldElement.prototype, "value", {
         get: function () {
@@ -3054,9 +3069,13 @@ var CustomFormatDateFieldElement = /** @class */ (function (_super) {
         if (this.min) {
             this.date.setAttribute('min', this.min);
         }
-        if (this.dateFormat) {
+        if (this.dateFormat && this.supportedDateFormats.includes(this.dateFormat)) {
             this.display.placeholder = this.dateFormat;
         }
+        else {
+            this.display.placeholder = this.defaultDateFormat;
+            this.dateFormat = this.defaultDateFormat;
+        }
     };
     CustomFormatDateFieldElement.prototype.change = function ($event) {
         var _a;
@@ -3071,7 +3090,6 @@ var CustomFormatDateFieldElement = /** @class */ (function (_super) {
         this.onValidate.emit(new CustomEvents_1.CustomElementEventArgs(this.value, 'validate'));
     };
     CustomFormatDateFieldElement.prototype.formatDate = function () {
-        var _a;
         var date = this.date.valueAsDate;
         var year = date.getFullYear();
         var month = (date.getMonth() + 1).toString().padStart(2, '0');
@@ -3090,7 +3108,7 @@ var CustomFormatDateFieldElement = /** @class */ (function (_super) {
             'mm/dd/yy': month + "/" + day + "/" + year.toString().slice(-2),
             'dd/mm/yy': day + "/" + month + "/" + year.toString().slice(-2),
         };
-        return (_a = dateFormats[this.dateFormat]) !== null && _a !== void 0 ? _a : null;
+        return dateFormats[this.dateFormat];
     };
     CustomFormatDateFieldElement.prototype.showDatePicker = function () {
         if ((!!window.ApplePaySetupFeature || !!window.safari)) {
@@ -3328,7 +3346,8 @@ var DropDownListElement = /** @class */ (function (_super) {
     __extends(DropDownListElement, _super);
     function DropDownListElement() {
         var _this = _super.call(this) || this;
-        _this.optionTemplate = "\n    <option value='{0}'>\n       {1}\n    </option>";
+        _this.optionTemplate = "\n\t\t<option value='{0}'>\n\t\t{1}\n\t\t</option>";
+        _this.placeholderOptionTemplate = "\n\t\t<option selected disabled>\n\t\t{0}\n\t\t</option>";
         return _this;
     }
     Object.defineProperty(DropDownListElement.prototype, "value", {
@@ -3365,6 +3384,10 @@ var DropDownListElement = /** @class */ (function (_super) {
     DropDownListElement.prototype.addOptions = function () {
         var _this = this;
         this.select.innerHTML = "";
+        if (this.placeholder) {
+            this.select.insertAdjacentHTML('beforeend', StringUtil_1.StringUtil.StringFormat(this.placeholderOptionTemplate, this.placeholder));
+        }
+        ;
         this.options.forEach(function (element, index) {
             _this.select.insertAdjacentHTML('beforeend', StringUtil_1.StringUtil.StringFormat(_this.optionTemplate, element, element));
         });