diff --git a/package-lock.json b/package-lock.json index 82e75248bf..2f64b4a843 100644 --- a/package-lock.json +++ b/package-lock.json @@ -93,8 +93,6 @@ "stylelint": "^13.11.0", "stylelint-config-prettier": "^8.0.2", "stylelint-webpack-plugin": "~2.1.0", - "text-mask-addons": "^3.8.0", - "text-mask-core": "^5.1.2", "tslib": "^2.3.0", "tslint": "^6.1.3", "tslint-config-prettier": "^1.18.0", @@ -24218,18 +24216,6 @@ "node": ">=0.10" } }, - "node_modules/text-mask-addons": { - "version": "3.8.0", - "resolved": "https://registry.npmjs.org/text-mask-addons/-/text-mask-addons-3.8.0.tgz", - "integrity": "sha1-F7Ye9mWk82gR8uofAaIjtL5hqyY=", - "dev": true - }, - "node_modules/text-mask-core": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/text-mask-core/-/text-mask-core-5.1.2.tgz", - "integrity": "sha1-gN1evgSCV1fkZhnmkUB6n4s8G28=", - "dev": true - }, "node_modules/text-table": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz", @@ -45708,18 +45694,6 @@ "integrity": "sha512-wiBrwC1EhBelW12Zy26JeOUkQ5mRu+5o8rpsJk5+2t+Y5vE7e842qtZDQ2g1NpX/29HdyFeJ4nSIhI47ENSxlQ==", "dev": true }, - "text-mask-addons": { - "version": "3.8.0", - "resolved": "https://registry.npmjs.org/text-mask-addons/-/text-mask-addons-3.8.0.tgz", - "integrity": "sha1-F7Ye9mWk82gR8uofAaIjtL5hqyY=", - "dev": true - }, - "text-mask-core": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/text-mask-core/-/text-mask-core-5.1.2.tgz", - "integrity": "sha1-gN1evgSCV1fkZhnmkUB6n4s8G28=", - "dev": true - }, "text-table": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz", diff --git a/packages/stark-ui/src/modules/input-mask-directives/directives/abstract-stark-text-mask-base-directive.service.ts b/packages/stark-ui/src/modules/input-mask-directives/directives/abstract-stark-text-mask-base-directive.service.ts index 2a0c9c323a..29a73be7bc 100644 --- a/packages/stark-ui/src/modules/input-mask-directives/directives/abstract-stark-text-mask-base-directive.service.ts +++ b/packages/stark-ui/src/modules/input-mask-directives/directives/abstract-stark-text-mask-base-directive.service.ts @@ -104,6 +104,7 @@ export abstract class AbstractStarkTextMaskBaseDirective< return; } let value = event.target["value"]; + //by pass the normal call of the event to show the guide if needed. event.stopImmediatePropagation(); event.stopPropagation(); if (this.maskRef) { diff --git a/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.spec.ts b/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.spec.ts index 28b47d9fc8..a93eeca05b 100644 --- a/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.spec.ts +++ b/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.spec.ts @@ -160,6 +160,69 @@ describe("TimestampMaskDirective", () => { expect(inputElement.nativeElement.value).toBe("02-29-__"); }); + + it("should allow time only to be entered", () => { + hostComponent.timestampMaskConfig = { ...timestampMaskConfig, format: "HH:mm:ss" }; + fixture.detectChanges(); + + changeInputValue(inputElement, "101550"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("10:15:50"); + }); + + it("reject invalid time", () => { + hostComponent.timestampMaskConfig = { ...timestampMaskConfig, format: "HH:mm:ss" }; + fixture.detectChanges(); + + changeInputValue(inputElement, "25"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("2_:__:__"); + + changeInputValue(inputElement, "3"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe(""); + + changeInputValue(inputElement, "238"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("23:__:__"); + + changeInputValue(inputElement, "23598"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("23:59:__"); + }); + + it("Should allow partial date to be entered", () => { + hostComponent.timestampMaskConfig = { ...timestampMaskConfig, format: "MM/DD" }; + fixture.detectChanges(); + + changeInputValue(inputElement, "0531"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("05/31"); + }); + + it("Should allow partial date to be entered february", () => { + hostComponent.timestampMaskConfig = { ...timestampMaskConfig, format: "MM/DD" }; + fixture.detectChanges(); + + changeInputValue(inputElement, "023"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("02/__"); + + changeInputValue(inputElement, ""); + fixture.detectChanges(); + + changeInputValue(inputElement, "0229"); + fixture.detectChanges(); + + expect(inputElement.nativeElement.value).toBe("02/29"); + }); }); describe("with ngModel", () => { diff --git a/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.ts b/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.ts index 66452ef799..9beebe8d17 100644 --- a/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.ts +++ b/packages/stark-ui/src/modules/input-mask-directives/directives/timestamp-mask.directive.ts @@ -233,7 +233,12 @@ export class StarkTimestampMaskDirective } public validateTypedDate(dateParsed: DateParsed): boolean { - if (dateParsed.D.isValid && dateParsed.M.isValid) { + if ( + (dateParsed.D.isValid || dateParsed.D.valueS.length === 1) && + dateParsed.M.isValid && + dateParsed.M.fieldLength > 0 && + dateParsed.D.fieldLength > 0 + ) { switch (dateParsed.M.value) { case 1: case 3: @@ -249,10 +254,13 @@ export class StarkTimestampMaskDirective case 11: return dateParsed.D.value >= 1 && dateParsed.D.value <= 30; case 2: - if (dateParsed.Y.isValid) { + if (dateParsed.D.isValid && dateParsed.Y.isValid && dateParsed.Y.fieldLength > 0) { return moment(dateParsed.Y.valueS + "-" + dateParsed.M.valueS + "-" + dateParsed.D.valueS, "YYYY-MM-DD").isValid(); } // february but do not know the year + if (dateParsed.D.valueS.length === 1) { + return dateParsed.D.valueS === "0" || dateParsed.D.valueS === "1" || dateParsed.D.valueS === "2"; + } return dateParsed.D.value >= 1 && dateParsed.D.value <= 29; default: return false; @@ -300,6 +308,10 @@ export class StarkTimestampMaskDirective return { ...defaultMask, + ...{ + formatFn: this.defaultFormatFunction(), + parseFn: this.defaultParseFunction() + }, ...mask }; } @@ -404,7 +416,12 @@ export class StarkTimestampMaskDirective } return (value: string): Date | moment.Moment => { - const retVal = moment(value, format); + let retVal; + if (format.indexOf("D") >= 0 && format.indexOf("M") >= 0 && format.indexOf("Y") === -1) { + retVal = moment(value + "/2000", format + "/YYYY"); + } else { + retVal = moment(value, format); + } if (usingMoment) { return retVal; } @@ -455,7 +472,7 @@ export class StarkTimestampMaskDirective case "Y": blocks[frm] = { mask: IMask.MaskedRange, - from: 1900, + from: frm.length === 2 ? 0 : 1900, to: frm.length === 2 ? 99 : 9999, maxLength: frm.length, eager: true