diff --git a/.changeset/pretty-glasses-invent.md b/.changeset/pretty-glasses-invent.md new file mode 100644 index 000000000..29e4d0248 --- /dev/null +++ b/.changeset/pretty-glasses-invent.md @@ -0,0 +1,5 @@ +--- +'@lion/ui': patch +--- + +[input-datepicker] only disable dates is the validator type is "error" diff --git a/packages/ui/components/input-datepicker/src/LionInputDatepicker.js b/packages/ui/components/input-datepicker/src/LionInputDatepicker.js index ddf1b60ae..8a88b3d70 100644 --- a/packages/ui/components/input-datepicker/src/LionInputDatepicker.js +++ b/packages/ui/components/input-datepicker/src/LionInputDatepicker.js @@ -424,14 +424,14 @@ export class LionInputDatepicker extends ScopedElementsMixin( // we need to extract minDate, maxDate, minMaxDate and disabledDates validators validators.forEach(v => { const vctor = /** @type {typeof import('@lion/ui/form-core.js').Validator} */ (v.constructor); - if (vctor.validatorName === 'MinDate') { + if (vctor.validatorName === 'MinDate' && v.type === 'error') { this.__calendarMinDate = v.param; - } else if (vctor.validatorName === 'MaxDate') { + } else if (vctor.validatorName === 'MaxDate' && v.type === 'error') { this.__calendarMaxDate = v.param; - } else if (vctor.validatorName === 'MinMaxDate') { + } else if (vctor.validatorName === 'MinMaxDate' && v.type === 'error') { this.__calendarMinDate = v.param.min; this.__calendarMaxDate = v.param.max; - } else if (vctor.validatorName === 'IsDateDisabled') { + } else if (vctor.validatorName === 'IsDateDisabled' && v.type === 'error') { this.__calendarDisableDates = v.param; } }); diff --git a/packages/ui/components/input-datepicker/test/lion-input-datepicker.test.js b/packages/ui/components/input-datepicker/test/lion-input-datepicker.test.js index f5be2b4f3..09b43933c 100644 --- a/packages/ui/components/input-datepicker/test/lion-input-datepicker.test.js +++ b/packages/ui/components/input-datepicker/test/lion-input-datepicker.test.js @@ -323,6 +323,29 @@ describe('', () => { expect(elObj.calendarEl.maxDate).to.equal(myMaxDate); }); + it('does not converts MaxDate validator to "maxDate" property if validator type other then "error"', async () => { + const myMaxDate = new Date('2030/06/15'); + const tagName = 'custom-input-datepicker'; + if (!customElements.get(tagName)) { + customElements.define( + tagName, + class CustomInputDatepicker extends LionInputDatepicker { + static get validationTypes() { + return [...super.validationTypes, 'warning']; + } + }, + ); + } + const el = await fixture(html` + + + `); + const elObj = new DatepickerInputObject(el); + await elObj.openCalendar(); + + expect(elObj.calendarEl.maxDate).to.be.undefined; + }); + it('should sync MinDate validator param with Calendar MinDate', async () => { const myMinDateValidator = new MinDate(new Date('2020/02/02')); const el = await fixture(html`