@progress/kendo-dateinputs-common 0.2.0-dev.202301161405 → 0.2.0-dev.202301231327

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -545,6 +545,14 @@ var DateObject = /** @class */ (function () {
545
545
  literal: ""
546
546
  };
547
547
  });
548
+ var flatDateParts = dateParts.partMap
549
+ .map(function (x) {
550
+ return {
551
+ type: x.type,
552
+ pattern: x.pattern,
553
+ text: ""
554
+ };
555
+ });
548
556
  for (var i = 0; i < datePartsLiterals.length; i++) {
549
557
  var datePart = datePartsLiterals[i];
550
558
  for (var j = 0; j < datePart.pattern.length; j++) {
@@ -554,13 +562,23 @@ var DateObject = /** @class */ (function () {
554
562
  }
555
563
  i += datePart.pattern.length - 1;
556
564
  }
565
+ for (var i = 0; i < flatDateParts.length; i++) {
566
+ var datePart = flatDateParts[i];
567
+ for (var j = 0; j < datePart.pattern.length; j++) {
568
+ if (flatDateParts[i + j]) {
569
+ flatDateParts[i + j].text = datePart.pattern[j];
570
+ }
571
+ }
572
+ i += datePart.pattern.length - 1;
573
+ }
557
574
  var shouldResetPart = isInCaretMode && symbol === "M" && dateParts.partMap
558
575
  .filter(function (x) { return x.type === "month"; })
559
576
  .some(function (x) { return x.pattern.length > MONTH_PART_WITH_WORDS_THRESHOLD; });
560
577
  var parseResult = {
561
578
  value: null,
562
579
  switchPart: false,
563
- resetPart: shouldResetPart
580
+ resetPart: shouldResetPart,
581
+ hasInvalidDatePart: false
564
582
  };
565
583
  if (!currentChar) {
566
584
  if (isInCaretMode) {
@@ -594,13 +612,19 @@ var DateObject = /** @class */ (function () {
594
612
  var basePrefix = '';
595
613
  var baseSuffix = '';
596
614
  var suffix = '';
597
- var datePartStartIndex = originalFormat.indexOf(symbol);
598
- var datePartEndIndex = originalFormat.lastIndexOf(symbol);
599
- var segmentLength = datePartEndIndex - datePartStartIndex + 1;
615
+ var convertedBaseFormat = "";
616
+ for (var i = 0; i < flatDateParts.length; i++) {
617
+ convertedBaseFormat += flatDateParts[i].text;
618
+ }
600
619
  var hasFixedFormat = (this.format === baseFormat) ||
620
+ (this.format === convertedBaseFormat) ||
601
621
  (this.format === originalFormat) ||
602
622
  (this.format.length === originalFormat.length);
623
+ var datePartStartIndex = (hasFixedFormat ? convertedBaseFormat : originalFormat).indexOf(symbol);
624
+ var datePartEndIndex = (hasFixedFormat ? convertedBaseFormat : originalFormat).lastIndexOf(symbol);
625
+ var segmentLength = datePartEndIndex - datePartStartIndex + 1;
603
626
  var processedSegmentCharsCount = 0;
627
+ var formatToTextLengthDiff = originalFormat.length - rawInputValue.length;
604
628
  if (isInCaretMode || (!isInCaretMode && !this.autoCorrectParts)) {
605
629
  for (var i = 0; i < baseDate.length; i++) {
606
630
  if (baseFormat[i] === symbol) {
@@ -613,6 +637,11 @@ var DateObject = /** @class */ (function () {
613
637
  }
614
638
  processedSegmentCharsCount++;
615
639
  }
640
+ else if (formatToTextLengthDiff > 0) {
641
+ if (datePartText.length + formatToTextLengthDiff < segmentLength) {
642
+ datePartText += rawInputValue[i] || "";
643
+ }
644
+ }
616
645
  else {
617
646
  datePartText += rawInputValue[i] || "";
618
647
  }
@@ -627,13 +656,13 @@ var DateObject = /** @class */ (function () {
627
656
  baseSuffix += baseDate[i];
628
657
  }
629
658
  }
630
- if (hasFixedFormat && this.autoCorrectParts) {
631
- if (originalFormat.length < rawInputValue.length) {
659
+ if (hasFixedFormat) {
660
+ if (convertedBaseFormat.length < rawInputValue.length) {
632
661
  datePartText += currentChar;
633
662
  }
634
663
  else if (!isDeleting && originalFormat.length > rawInputValue.length) {
635
664
  var lengthDiff = originalFormat.length - rawInputValue.length;
636
- var trimmedDatePartText = datePartText.substring(0, datePartText.length - lengthDiff);
665
+ var trimmedDatePartText = datePartText.substr(0, datePartText.length - lengthDiff);
637
666
  if (trimmedDatePartText && trimmedDatePartText.length > 0) {
638
667
  datePartText = trimmedDatePartText;
639
668
  }
@@ -642,7 +671,7 @@ var DateObject = /** @class */ (function () {
642
671
  return extend(parseResult, { value: null, switchToNext: false });
643
672
  }
644
673
  }
645
- else {
674
+ if (!hasFixedFormat || (hasFixedFormat && !this.autoCorrectParts)) {
646
675
  processedSegmentCharsCount = 0;
647
676
  current = "";
648
677
  datePartText = "";
@@ -660,6 +689,11 @@ var DateObject = /** @class */ (function () {
660
689
  }
661
690
  processedSegmentCharsCount++;
662
691
  }
692
+ else if (formatToTextLengthDiff > 0) {
693
+ if (datePartText.length + formatToTextLengthDiff < segmentLength) {
694
+ datePartText += rawInputValue[i] || "";
695
+ }
696
+ }
663
697
  else {
664
698
  datePartText += rawInputValue[i] || "";
665
699
  }
@@ -669,24 +703,12 @@ var DateObject = /** @class */ (function () {
669
703
  prefix += rawInputValue[i] || "";
670
704
  }
671
705
  else {
672
- suffix += rawInputValue[i] || "";
706
+ suffix += rawInputValue[i - formatToTextLengthDiff] || "";
673
707
  }
674
708
  }
675
709
  if (originalFormat.length < rawInputValue.length) {
676
710
  datePartText += currentChar;
677
711
  }
678
- else if (!isDeleting && originalFormat.length > rawInputValue.length) {
679
- var lengthDiff = originalFormat.length - rawInputValue.length;
680
- var trimmedDatePartText = datePartText.substring(0, datePartText.length - lengthDiff);
681
- if (trimmedDatePartText && trimmedDatePartText.length > 0) {
682
- var originalDatePartText = datePartText;
683
- datePartText = trimmedDatePartText;
684
- if (prefix + datePartText + suffix !== rawInputValue) {
685
- // move trimmed characters to the suffix
686
- suffix = originalDatePartText.substring(datePartText.length) + suffix;
687
- }
688
- }
689
- }
690
712
  }
691
713
  }
692
714
  if (!isInCaretMode) {
@@ -720,8 +742,13 @@ var DateObject = /** @class */ (function () {
720
742
  var dayPeriod = this.matchDayPeriod(currentChar, symbol);
721
743
  var isZeroCurrentChar = currentChar === '0';
722
744
  var leadingZero = this.leadingZero || {};
723
- if (isZeroCurrentChar && !isInCaretMode) {
724
- var valueNumber = parseInt(resetSegmentValue ? currentChar : current + currentChar, 10);
745
+ if (isZeroCurrentChar) {
746
+ if (datePartText === "0") {
747
+ datePartText = current;
748
+ }
749
+ var valueNumber = parseToInt(resetSegmentValue ?
750
+ currentChar :
751
+ (isInCaretMode ? datePartText : current) + currentChar);
725
752
  if (valueNumber === 0 && !this.isAbbrMonth(dateParts.partMap, symbol)) {
726
753
  this.incrementLeadingZero(symbol);
727
754
  }
@@ -749,23 +776,15 @@ var DateObject = /** @class */ (function () {
749
776
  isInCaretMode ?
750
777
  datePartText :
751
778
  (current.substring(i) + currentChar);
752
- if (!this.autoCorrectParts) {
753
- tryParse = false;
754
- if (!isInCaretMode) {
755
- // try to make an exact match as there will be only 1 attempt
756
- middle = unpadZero(middle);
757
- middle = padZero(segmentLength - middle.length) + middle;
758
- }
759
- }
760
- if (isInCaretMode) {
761
- // try to make an exact match as there will be only 1 attempt
779
+ if (isInCaretMode || !this.autoCorrectParts) {
762
780
  tryParse = false;
763
781
  middle = unpadZero(middle);
782
+ middle = padZero(segmentLength - middle.length) + middle;
764
783
  }
765
784
  var middleNumber = parseInt(middle, 10);
766
785
  var candidateDateString = prefix + middle + suffix;
767
786
  parsedDate = this.intl.parseDate(candidateDateString, this.format, this.localeId);
768
- if (isInCaretMode && !hasFixedFormat && !isValidDate(parsedDate)) {
787
+ if (isInCaretMode && !isValidDate(parsedDate)) {
769
788
  // if part of the date is not available, e.g. "d"
770
789
  // but an expanded format like "F" is used
771
790
  // the element value can be "EEEE, February 1, 2022 3:04:05 AM"
@@ -775,7 +794,6 @@ var DateObject = /** @class */ (function () {
775
794
  // as "EEEE, February..." is not parsable
776
795
  if (this.autoCorrectParts) {
777
796
  parsedDate = this.intl.parseDate(basePrefix + middle + baseSuffix, this.format, this.localeId);
778
- datePartText = middle;
779
797
  }
780
798
  }
781
799
  var isCurrentCharParsable = !isNaN(parseInt(currentChar, 10)) || (isInCaretMode && isDeleting && currentChar === "");
@@ -802,13 +820,10 @@ var DateObject = /** @class */ (function () {
802
820
  if ((isInCaretMode && isValidDate(parsedDate)) || (!isInCaretMode && parsedDate)) {
803
821
  // move to next segment if the part will overflow with next char
804
822
  // when start from empty date (01, then 010), padded zeros should be trimmed
805
- var peekDate = this.intl.parseDate("" + prefix + this.peek(middle, patternValue) + suffix, this.format, this.localeId);
806
- var patternLength = this.patternLength(patternValue) || patternValue.length;
807
- var leadingZeroOffset = (this.leadingZero || {})[symbol] || 0;
808
- var patternSatisfied = (leadingZeroOffset + (unpadZero(middle) || currentChar).length) >= patternLength;
809
- var switchToNext = peekDate === null ||
810
- (leadingZero[symbol] && patternValue.length <= middle.length) ||
811
- patternSatisfied;
823
+ var peekValue = this.peek(middle, patternValue);
824
+ var peekDateString = "" + prefix + peekValue + suffix;
825
+ var peekDate = this.intl.parseDate(peekDateString, this.format, this.localeId);
826
+ var switchToNext = peekDate === null || (leadingZero[symbol] && patternValue.length <= middle.length) || false;
812
827
  if (this.shouldNormalizeCentury()) {
813
828
  parsedDate = this.normalizeCentury(parsedDate);
814
829
  }
@@ -836,14 +851,12 @@ var DateObject = /** @class */ (function () {
836
851
  }
837
852
  if (isInCaretMode && switchToNext) {
838
853
  if (symbol === "M") {
839
- if (segmentLength <= MONTH_PART_WITH_WORDS_THRESHOLD) {
840
- var datePartValue = parseToInt(datePartText);
841
- if (datePartValue >= 2) {
842
- switchToNext = true;
843
- }
844
- else {
845
- switchToNext = false;
846
- }
854
+ var datePartValue = parseToInt(datePartText);
855
+ if (datePartValue >= 2 || datePartText.length >= 2) {
856
+ switchToNext = true;
857
+ }
858
+ else {
859
+ switchToNext = false;
847
860
  }
848
861
  }
849
862
  else {
@@ -876,9 +889,6 @@ var DateObject = /** @class */ (function () {
876
889
  this.leadingZero = !this.isAbbrMonth(dateParts.partMap, symbol) ? (_b = {}, _b[symbol] = true, _b) : null;
877
890
  this.setExisting(symbol, false);
878
891
  }
879
- if (isInCaretMode && datePartText.length > segmentLength) {
880
- return extend(parseResult, { value: null, switchToNext: false });
881
- }
882
892
  if (!this.autoCorrectParts) {
883
893
  var datePartValue = void 0;
884
894
  var textToParse = isInCaretMode ? datePartText : middle;
@@ -889,20 +899,146 @@ var DateObject = /** @class */ (function () {
889
899
  return extend(parseResult, { value: null, switchToNext: false });
890
900
  }
891
901
  datePartValue = symbol === "M" ?
892
- clamp(parsedValue - JS_MONTH_OFFSET, 0, 12 - JS_MONTH_OFFSET) :
902
+ parsedValue - JS_MONTH_OFFSET :
893
903
  parsedValue;
894
- // if (!isEqual(newDate, this.value)) {
895
- this.setExisting(symbol, false);
896
- this.setInvalidDatePart(symbol, {
897
- value: datePartValue,
898
- date: cloneDate(this.value),
899
- startDate: this._partiallyInvalidDate.startDate || cloneDate(this.value)
900
- });
901
- // }
904
+ var isMonth = symbol === "M";
905
+ var isDay = symbol === "d";
906
+ var newValue = cloneDate(this._value);
907
+ var invalidDateParts = this._partiallyInvalidDate.invalidDateParts || {};
908
+ var year = invalidDateParts.y.value || newValue.getFullYear();
909
+ /* tslint:disable:no-shadowed-variable */
910
+ var month_1 = isMonth ? datePartValue : invalidDateParts.M.value || newValue.getMonth();
911
+ /* tslint:enable:no-shadowed-variable */
912
+ var day = isDay ? datePartValue : invalidDateParts.d.value || invalidDateParts.E.value || newValue.getDate();
913
+ var hour = invalidDateParts.h.value || invalidDateParts.H.value || newValue.getHours();
914
+ var minutes = invalidDateParts.m.value || newValue.getMinutes();
915
+ var seconds = invalidDateParts.s.value || newValue.getSeconds();
916
+ var milliseconds = invalidDateParts.S.value || newValue.getMilliseconds();
917
+ var dateCandidate = createDate(year, month_1, day, hour, minutes, seconds, milliseconds);
918
+ var dateCandidateExists = areDatePartsEqualTo(dateCandidate, year, month_1, day, hour, minutes, seconds, milliseconds);
919
+ var newValueCandidate = isMonth || isDay ?
920
+ this.modifyDateSymbolWithValue(newValue, symbol, isMonth ? month_1 : day) :
921
+ null;
922
+ var invalidDateFound = false;
923
+ if (isMonth && newValueCandidate) {
924
+ if (newValueCandidate.getMonth() === month_1) {
925
+ if (this.getExisting("d")) {
926
+ if (dateCandidateExists) {
927
+ newValue = cloneDate(dateCandidate);
928
+ this.resetInvalidDateSymbol(symbol);
929
+ }
930
+ else {
931
+ invalidDateFound = true;
932
+ this.setInvalidDatePart(symbol, {
933
+ value: month_1,
934
+ date: cloneDate(newValueCandidate),
935
+ // startDateOffset: offset,
936
+ startDate: cloneDate(this.value)
937
+ });
938
+ this.setExisting(symbol, false);
939
+ }
940
+ }
941
+ else if (dateCandidateExists) {
942
+ this.resetInvalidDateSymbol(symbol);
943
+ newValue = cloneDate(dateCandidate);
944
+ if (this.getExisting("M") && this.getExisting("y")) {
945
+ // changing from 28/Feb to 29/Feb to 29/March
946
+ this.setExisting("d", true);
947
+ this.resetInvalidDateSymbol("d");
948
+ }
949
+ }
950
+ else {
951
+ this.resetInvalidDateSymbol(symbol);
952
+ newValue = cloneDate(newValueCandidate);
953
+ }
954
+ }
955
+ else {
956
+ invalidDateFound = true;
957
+ this.setInvalidDatePart(symbol, {
958
+ value: month_1,
959
+ date: cloneDate(newValueCandidate),
960
+ // startDateOffset: offset,
961
+ startDate: cloneDate(this.value)
962
+ });
963
+ this.setExisting(symbol, false);
964
+ }
965
+ }
966
+ else if (isDay && newValueCandidate) {
967
+ if (newValueCandidate.getDate() === day) {
968
+ if (this.getExisting("M")) {
969
+ if (dateCandidateExists) {
970
+ newValue = cloneDate(dateCandidate);
971
+ this.resetInvalidDateSymbol(symbol);
972
+ }
973
+ else {
974
+ invalidDateFound = true;
975
+ this.setInvalidDatePart(symbol, {
976
+ value: day,
977
+ date: cloneDate(newValueCandidate),
978
+ // startDateOffset: offset,
979
+ startDate: cloneDate(this.value)
980
+ });
981
+ this.setExisting(symbol, false);
982
+ }
983
+ }
984
+ else if (dateCandidateExists) {
985
+ newValue = cloneDate(dateCandidate);
986
+ this.resetInvalidDateSymbol(symbol);
987
+ if (this.getExisting("d") && this.getExisting("y")) {
988
+ // changing from 31/Jan to 31/Feb to 28/Feb
989
+ this.setExisting("M", true);
990
+ this.resetInvalidDateSymbol("M");
991
+ }
992
+ }
993
+ else {
994
+ this.resetInvalidDateSymbol(symbol);
995
+ newValue = cloneDate(newValueCandidate);
996
+ }
997
+ }
998
+ else {
999
+ invalidDateFound = true;
1000
+ this.setInvalidDatePart(symbol, {
1001
+ value: day,
1002
+ date: cloneDate(this.value),
1003
+ // startDateOffset: offset,
1004
+ startDate: cloneDate(this.value)
1005
+ });
1006
+ this.setExisting(symbol, false);
1007
+ }
1008
+ }
1009
+ if (!invalidDateFound) {
1010
+ this.setExisting(symbol, true);
1011
+ if (isInCaretMode && !isValidDate(parsedDate)) {
1012
+ var valueCandidate = this.intl.parseDate(basePrefix + middle + baseSuffix, this.format, this.localeId);
1013
+ if (isValidDate(valueCandidate)) {
1014
+ this._value = valueCandidate;
1015
+ }
1016
+ }
1017
+ else {
1018
+ this._value = newValue;
1019
+ }
1020
+ if (this.getValue()) {
1021
+ this.resetInvalidDate();
1022
+ }
1023
+ }
1024
+ var switchToNext = false;
1025
+ if (symbol === "M") {
1026
+ if (parsedValue >= 2 || textToParse.length >= 2) {
1027
+ switchToNext = true;
1028
+ }
1029
+ else {
1030
+ switchToNext = false;
1031
+ }
1032
+ }
1033
+ else {
1034
+ switchToNext = hasFixedFormat ?
1035
+ textToParse.length === segmentLength :
1036
+ textToParse.length > segmentLength;
1037
+ }
902
1038
  return extend(parseResult, {
903
1039
  value: null,
904
- switchToNext: false,
905
- hasInvalidDatePart: true
1040
+ switchToNext: switchToNext,
1041
+ hasInvalidDatePart: invalidDateFound
906
1042
  });
907
1043
  }
908
1044
  }
@@ -925,6 +1061,12 @@ var DateObject = /** @class */ (function () {
925
1061
  DateObject.prototype.setLeadingZero = function (leadingZero) {
926
1062
  this.leadingZero = leadingZero;
927
1063
  };
1064
+ /**
1065
+ * @hidden
1066
+ */
1067
+ DateObject.prototype.getLeadingZero = function () {
1068
+ return this.leadingZero || {};
1069
+ };
928
1070
  /**
929
1071
  * @hidden
930
1072
  */
@@ -1008,7 +1150,6 @@ var DateObject = /** @class */ (function () {
1008
1150
  var dateFormatParts = this.intl.splitDateFormat(this.format, this.localeId);
1009
1151
  for (var i = 0; i < dateFormatParts.length; i++) {
1010
1152
  if (dateFormatParts[i].type === 'month' && dateFormatParts[i].names) {
1011
- // return this.intl.dateFormatNames(dateFormatParts[i].names);
1012
1153
  return this.intl.dateFormatNames(locale, dateFormatParts[i].names);
1013
1154
  }
1014
1155
  }
@@ -1220,15 +1361,8 @@ var DateObject = /** @class */ (function () {
1220
1361
  };
1221
1362
  DateObject.prototype.setInvalidDatePart = function (symbol, _a) {
1222
1363
  var _b = _a.value, value = _b === void 0 ? null : _b, _c = _a.date, date = _c === void 0 ? null : _c, _d = _a.startDateOffset, startDateOffset = _d === void 0 ? 0 : _d, _e = _a.startDate, startDate = _e === void 0 ? null : _e;
1223
- var clampedValue = value;
1224
- if (symbol === "d") {
1225
- clampedValue = clamp(isPresent(value) ? value : 1, 1, 31);
1226
- }
1227
- else if (symbol === "M") {
1228
- clampedValue = clamp(isPresent(value) ? value : 0, 0, 11);
1229
- }
1230
1364
  if (this._partiallyInvalidDate.invalidDateParts[symbol]) {
1231
- this._partiallyInvalidDate.invalidDateParts[symbol].value = clampedValue;
1365
+ this._partiallyInvalidDate.invalidDateParts[symbol].value = value;
1232
1366
  this._partiallyInvalidDate.invalidDateParts[symbol].date = date;
1233
1367
  this._partiallyInvalidDate.invalidDateParts[symbol].startDateOffset = startDateOffset;
1234
1368
  this._partiallyInvalidDate.startDate = startDate;
@@ -31,6 +31,7 @@ var CHANGE = "change";
31
31
  var defaultDateInputOptions = {
32
32
  format: "d",
33
33
  allowNulls: false,
34
+ hasPlaceholder: false,
34
35
  placeholder: null,
35
36
  cycleTime: true,
36
37
  locale: null,
@@ -303,6 +304,24 @@ var DateInput = /** @class */ (function (_super) {
303
304
  isInCaretMode: hasCaret,
304
305
  keyEvent: this.keyDownEvent
305
306
  });
307
+ var currentFormatChar = this.formatStateOnKeyDown.format[this.formatStateOnKeyDown.selectionStart] || "";
308
+ if (this.options.allowCaretMode && hasCaret && this.currentFormat.length !== this.elementValue.length) {
309
+ if (currentFormatChar &&
310
+ currentFormatChar.length > 0 &&
311
+ currentFormatChar !== Constants.formatSeparator) {
312
+ if (!diff || diff.length === 0) {
313
+ diff = [];
314
+ diff[0][0] = currentFormatChar;
315
+ diff[0][1] = e.data || "";
316
+ }
317
+ else if (diff[0] && diff[0][0] !== Constants.formatSeparator) {
318
+ if (diff[0][0] !== currentFormatChar) {
319
+ diff[0][0] = currentFormatChar;
320
+ diff[0][1] = e.data || "";
321
+ }
322
+ }
323
+ }
324
+ }
306
325
  if (hasCaret && (!diff || diff.length === 0)) {
307
326
  this.restorePreviousInputEventState();
308
327
  return;
@@ -375,10 +394,30 @@ var DateInput = /** @class */ (function (_super) {
375
394
  if (switchPart) {
376
395
  this.switchDateSegment(1);
377
396
  }
397
+ else {
398
+ if (this.options.format.length !== this.currentFormat.length &&
399
+ currentFormatChar && currentFormatChar !== "y") {
400
+ var elementValueLength = this.elementValue.length;
401
+ this.forceUpdate();
402
+ var selectionOffset = this.elementValue.length - elementValueLength;
403
+ this.setSelection({
404
+ start: currentSelection.start + selectionOffset,
405
+ end: currentSelection.start + selectionOffset
406
+ });
407
+ }
408
+ }
378
409
  }
379
410
  else {
380
- if (lastParseResultHasNoValue && !hasInvalidDatePart) {
381
- this.restorePreviousInputEventState();
411
+ if (lastParseResultHasNoValue) {
412
+ var hasLeadingZero = this.dateObject.getLeadingZero()[currentFormatChar];
413
+ if (switchPart) {
414
+ this.switchDateSegment(1);
415
+ }
416
+ else if (e.data === "0" && hasLeadingZero) {
417
+ }
418
+ else {
419
+ this.restorePreviousInputEventState();
420
+ }
382
421
  }
383
422
  }
384
423
  }
@@ -403,7 +442,10 @@ var DateInput = /** @class */ (function (_super) {
403
442
  }
404
443
  }
405
444
  else {
406
- if (!hasInvalidDatePart) {
445
+ var hasLeadingZero = this.dateObject.getLeadingZero()[currentFormatChar];
446
+ if (e.data === "0" && hasLeadingZero) {
447
+ }
448
+ else if (!hasInvalidDatePart) {
407
449
  this.restorePreviousInputEventState();
408
450
  }
409
451
  }
@@ -467,9 +509,14 @@ var DateInput = /** @class */ (function (_super) {
467
509
  if (this.triggerKeyDown({ event: e })) {
468
510
  return;
469
511
  }
512
+ var _a = this.selection, start = _a.start, end = _a.end;
470
513
  this.keyDownEvent = e;
471
514
  this.previousElementValue = this.element.value;
472
- var _a = this.selection, start = _a.start, end = _a.end;
515
+ this.formatStateOnKeyDown = {
516
+ format: this.currentFormat,
517
+ selectionStart: start,
518
+ selectionEnd: end
519
+ };
473
520
  this.previousElementSelection = { start: start, end: end };
474
521
  var autoSwitchKeys = (this.options.autoSwitchKeys || [])
475
522
  .map(function (x) { return x.toString().toLowerCase().trim(); });
@@ -739,11 +786,13 @@ var DateInput = /** @class */ (function (_super) {
739
786
  return;
740
787
  }
741
788
  }
789
+ this.interactionMode = DateInputInteractionMode.None;
742
790
  var _a = this.selection, selectionStart = _a.start, selectionEnd = _a.end;
743
791
  if (selectionStart < selectionEnd &&
744
792
  this.currentFormat[selectionStart] !== this.currentFormat[selectionEnd - 1]) {
745
793
  this.setSelection(this.selectionByIndex(offset > 0 ? selectionStart : selectionEnd - 1));
746
794
  this.resetSegmentValue = true;
795
+ this.interactionMode = DateInputInteractionMode.None;
747
796
  return;
748
797
  }
749
798
  var previousFormatSymbol = this.currentFormat[selectionStart];
@@ -774,6 +823,7 @@ var DateInput = /** @class */ (function (_super) {
774
823
  this.setSelection({ start: a, end: b });
775
824
  this.resetSegmentValue = true;
776
825
  }
826
+ this.interactionMode = DateInputInteractionMode.None;
777
827
  };
778
828
  DateInput.prototype.modifyDateSegmentValue = function (offset, symbol, event) {
779
829
  if (symbol === void 0) { symbol = ""; }
@@ -975,13 +1025,14 @@ var DateInput = /** @class */ (function (_super) {
975
1025
  var _a = this.dateObject.getTextAndFormat(format), currentText = _a.text, currentFormat = _a.format;
976
1026
  this.currentFormat = currentFormat;
977
1027
  this.currentText = currentText;
1028
+ var hasPlaceholder = this.options.hasPlaceholder || isPresent(this.options.placeholder);
978
1029
  var showPlaceholder = !this.isActive &&
979
- isPresent(this.options.placeholder) &&
1030
+ hasPlaceholder &&
980
1031
  !this.dateObject.hasValue();
981
- if (isPresent(this.options.placeholder)) {
1032
+ if (hasPlaceholder && isPresent(this.options.placeholder)) {
982
1033
  element.placeholder = this.options.placeholder;
983
1034
  }
984
- var newElementValue = !showPlaceholder ? currentText : "";
1035
+ var newElementValue = showPlaceholder ? "" : currentText;
985
1036
  this.previousElementValue = this.elementValue;
986
1037
  this.setElementValue(newElementValue);
987
1038
  if (this.isActive && !this.options.allowCaretMode && this.options.selectNearestSegmentOnFocus) {