fix(input-datepicker): only disable dates if validator is of type error

ing-bank · Sep 12, 2023 · aea5262 · aea5262
1 parent d597c07
commit aea5262
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 4 deletions.
diff --git a/.changeset/pretty-glasses-invent.md 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
@@ -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
@@ -323,6 +323,29 @@ describe('<lion-input-datepicker>', () => {
         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`
+          <custom-input-datepicker .validators=${[new MaxDate(myMaxDate, { type: 'warning' })]}>
+          </custom-input-datepicker>
+        `);
+        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`