@zeedhi/common 1.118.0 → 1.120.0

package/dist/zd-common.esm.js

@@ -4328,6 +4328,13 @@ FormatterParserProvider.registerParser('ZdDateTime', (value, { dateTimeFormat =
 });
 InputFactory.register('ZdDate', Date$1);
 
+const ERROR_MAP = {
+    invalid_range: 'VALIDATION_INVALID_RANGE',
+    incomplete_range: 'VALIDATION_INVALID_DATE',
+    empty: 'VALIDATION_INVALID_DATE',
+    invalid_date: 'VALIDATION_INVALID_DATE',
+    none: '',
+};
 class DateRange extends TextInput {
     /* istanbul ignore next */
     /**
@@ -4336,6 +4343,10 @@ class DateRange extends TextInput {
       */
     constructor(props) {
         super(props);
+        /**
+          * Restricts which dates can be selected.
+        */
+        this.allowedDates = undefined;
         /**
          * Input auto complete.
          */
@@ -4403,6 +4414,7 @@ class DateRange extends TextInput {
         this.parserFn = FormatterParserProvider.getParser('ZdDateRange');
         this.previousHint = '';
         this.previousPersistentHint = false;
+        this.allowedDates = this.getInitValue('allowedDates', props.allowedDates, this.allowedDates);
         this.appendIcon = this.getInitValue('appendIcon', props.appendIcon, 'calendar');
         this.autocomplete = this.getInitValue('autocomplete', props.autocomplete, this.autocomplete);
         this.dateFormat = this.getInitValue('dateFormat', props.dateFormat, this.dateFormat);
@@ -4442,7 +4454,7 @@ class DateRange extends TextInput {
      * Character that will separate the two dates
      */
     get splitter() {
-        return I18n.translate(this.internalSplitter);
+        return ` ${I18n.translate(this.internalSplitter).trim()} `;
     }
     set splitter(splitter) {
         this.internalSplitter = splitter;
@@ -4505,36 +4517,79 @@ class DateRange extends TextInput {
         return format.replace(/[A-Za-z]/gi, '#');
     }
     setDateValue(displayValue) {
-        const lastValue = this.displayValue;
-        const values = this.splitValues(displayValue);
-        if (this.isValidDateArray(this.displayFormat, values)) {
+        const lastDisplayValue = this.displayValue;
+        const values = this.parser(displayValue);
+        const validation = this.isValidDateArray(values);
+        if (validation.isValid) {
             this.internalDisplayValue = displayValue;
             this.internalValue = this.parser(displayValue);
             this.dateError = false;
-            if (lastValue !== this.displayValue)
+            if (lastDisplayValue !== this.displayValue) {
                 this.change(this.value);
+            }
         }
-        else {
-            if (!displayValue) {
-                this.internalDisplayValue = displayValue;
-                this.internalValue = [];
-                if (lastValue !== this.displayValue)
-                    this.change(this.value);
+        else if (validation.errorType === 'empty') {
+            this.internalDisplayValue = '';
+            this.internalValue = [];
+            if (lastDisplayValue !== this.displayValue) {
+                this.change(this.value);
             }
-            this.dateError = !!displayValue;
         }
-        this.value = this.internalValue; // forces value accessor to be called if necessary
+        else {
+            this.dateError = validation.errorType;
+        }
+        this.value = this.internalValue;
     }
     /**
      * Faz a validação do array de datas
-     * @param format o formato da data
-     * @param values o array de datas
+     * @param values o array de datas formatadas de acordo com o dateFormat
      * @returns true se todos os valores forem validados
      * */
-    isValidDateArray(format, values) {
-        if (!values || values.length < 2)
-            return false;
-        return values.every((value) => this.isValidDate(value, format));
+    isValidDateArray(values) {
+        if (!values || values.length === 0 || values.every((value) => !value)) {
+            return { isValid: false, errorType: 'empty' };
+        }
+        if (values.length === 1 && values[0] !== '') {
+            return { isValid: false, errorType: 'incomplete_range' };
+        }
+        const invalidRange = !this.isAllowedRange(values);
+        if (invalidRange) {
+            return { isValid: false, errorType: 'invalid_range' };
+        }
+        const allDatesValid = values.every((value) => this.isValidDate(value, this.dateFormat));
+        if (!allDatesValid) {
+            return { isValid: false, errorType: 'invalid_date' };
+        }
+        return { isValid: true, errorType: 'none' };
+    }
+    isAllowedDate(value, format) {
+        if (this.allowedDates === undefined)
+            return true;
+        const dateStr = dayjs(value, format).format(this.dateFormat);
+        if (this.allowedDates instanceof Function) {
+            return this.allowedDates(dateStr);
+        }
+        return this.allowedDates.includes(dateStr);
+    }
+    /**
+     * Checks if a range is allowed
+     * @param value range to be checked, must be in dateFormat
+     */
+    isAllowedRange(value) {
+        if (!this.allowedDates)
+            return true;
+        const startDate = dayjs(value[0], this.dateFormat);
+        const endDate = dayjs(value[1], this.dateFormat);
+        let currentDate = startDate;
+        while (currentDate.isBefore(endDate) || currentDate.isSame(endDate)) {
+            const dateToCheck = currentDate.format(this.dateFormat);
+            const isAllowed = this.isAllowedDate(dateToCheck, this.dateFormat);
+            if (!isAllowed) {
+                return false;
+            }
+            currentDate = currentDate.add(1, 'day');
+        }
+        return true;
     }
     splitValues(value) {
         let splitedValue = [];
@@ -4561,6 +4616,9 @@ class DateRange extends TextInput {
         const isValidMax = !maxDate || date.isBefore(maxDate) || date.isSame(maxDate);
         if (!isValidMax)
             return false;
+        if (!this.isAllowedDate(value, format)) {
+            return false;
+        }
         return true;
     }
     isValidFormatDate(value, format, strict = true) {
@@ -4605,7 +4663,10 @@ class DateRange extends TextInput {
         return parsedValue.sort((a, b) => (dayjs(a, this.dateFormat).isAfter(dayjs(b, this.dateFormat)) ? 1 : -1));
     }
     dateValidation() {
-        return !this.dateError || I18n.translate('VALIDATION_INVALID_DATE');
+        if (this.dateError) {
+            return I18n.translate(ERROR_MAP[this.dateError]);
+        }
+        return true;
     }
     click(event, element) {
         const clickEvent = event || new MouseEvent('click');
@@ -4651,7 +4712,7 @@ class DateRange extends TextInput {
       */
     removeDateMask() {
         if (isUndefined(this.getInitialMask()) || !this.value || this.dateError
-            || !this.isValidDateArray(this.dateFormat, this.value)) {
+            || !this.isValidDateArray(this.value).isValid) {
             return;
         }
         this.mask = '';
@@ -12660,9 +12721,6 @@ class SelectMultiple extends Select {
         return this.checkboxAllValue;
     }
     set checkboxAll(value) {
-        if (this.showCheckboxAll) {
-            this.disabled = value;
-        }
         this.checkboxAllValue = value;
     }
     /**
@@ -14912,6 +14970,10 @@ class Tooltip extends ComponentRender {
          * Nudge the content to the top
          */
         this.top = false;
+        /**
+         * Render the label as HTML
+         */
+        this.html = false;
         this.bottom = this.getInitValue('bottom', props.bottom, this.bottom);
         this.color = this.getInitValue('color', props.color, this.color);
         this.disabled = this.getInitValue('disabled', props.disabled, this.disabled);
@@ -14925,6 +14987,7 @@ class Tooltip extends ComponentRender {
         this.openOnHover = this.getInitValue('openOnHover', props.openOnHover, this.openOnHover);
         this.right = this.getInitValue('right', props.right, this.right);
         this.top = this.getInitValue('top', props.top, this.top);
+        this.html = this.getInitValue('html', props.html, this.html);
         this.createAccessors();
     }
 }