@itfin/components 1.2.24 → 1.2.26

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itfin/components",
-  "version": "1.2.24",
+  "version": "1.2.26",
   "author": "Vitalii Savchuk <esvit666@gmail.com>",
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/helpers/formatters.js

@@ -31,6 +31,10 @@ export function parseHours (str, { hoursInDay } = { hoursInDay: 8 }) {
   return seconds;
 }
 
+export function formatDate (date, inputFormat = 'yyyy-MM-dd', toFormat = 'MM/dd/yyyy') {
+  return DateTime.fromFormat(date, inputFormat).toFormat(toFormat);
+}
+
 export function formatRangeDates(begin, end = null) {
   const DATE_FULL_FORMAT = 'dd MMM yyyy';
   const DATE_SHORT_FORMAT = 'dd MMM';
@@ -57,13 +61,19 @@ export function formatRangeDates(begin, end = null) {
 }
 
 export function firstLetters(name) {
-  const [first, second] = (name || '').trim()
+  let [first, second] = (name || '').trim()
     .replace(/[\u0250-\u0400\u04FF-\ue0070-9]/g, '')
     .replace(/ +/g, ' ')
-    .split(' ')
-  ;
+    .split(' ');
+
+  if (first === 'undefined') {
+    first = '';
+  }
+  if (second === 'undefined') {
+    second = '';
+  }
   if (!second) {
-    return first[0];
+    return first[0] || '';
   }
-  return first[0] + second[0];
+  return (first[0] || '') + (second[0] || '');
 }

package/src/helpers/validators.js

@@ -1,5 +1,5 @@
 import { DateTime } from 'luxon';
-import { parseHours } from './formatters';
+import { parseHours, formatDate } from './formatters';
 
 const URL_REGEXP = /^(?:http(s)?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w\-._~:/?#[\]@!$&'()*+,;=]+$/gm;
 const LINK_URL_REGEXP = /(http[s]?:\/\/|www\.)[a-zA-Z0-9.-]+\.[a-zA-Z]{2,5}[.]{0,1}/gi;
@@ -13,6 +13,8 @@ const EMAIL_REGEXP = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~
 const EMAIL_LIST_REGEXP = /^(\w+((-\w+)|(\.\w+))*@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]{2,4}\s*?,?\s*?)+$/g;
 const HEX_REGEXP = /[0-9A-Fa-f]{6}/;
 
+const STANDART_DATE_FORMAT = 'yyyy-MM-dd';
+
 export const MEDIUM_TEXT_LENGTH = 16777215;
 
 function isEmpty(v) {
@@ -23,6 +25,10 @@ export function differentValidation (value, message) {
   return (v, $t) => !v || !(v === value) || (message || $t('components.theValueMustBeDifferent'));
 }
 
+export function mediumTextValidation (message) {
+  return (v, $t) => !v || ((v || '').toString().trim().length <= MEDIUM_TEXT_LENGTH) || (message || $t('components.mediumTextLength'));
+}
+
 export function lengthValidation (length, message) {
   return (v, $t) => !v || ((v || '').toString().trim().length <= length) || (message || $t('components.mustBeLessThanLengthCharacters', {length}));
 }
@@ -115,26 +121,10 @@ export function allowDigitsOnlyValidation (message) {
   return (v, $t) => !v || !!v.match(/^\d+$/) || (message || $t('components.thisFieldMustContainsDigits'));
 }
 
-// export function dateBeforeValidation (dateCompare, message = `The date should be before ${moment(dateCompare).format('MM/DD/YYYY')}`) {
-//   return (v, $t) => !v || moment(v).isBefore(dateCompare, 'd') || (message || $t('components.'));
-// }
-
 export function dateSameOrBeforeValidationLuxon (dateCompare, message) {
   return (v, $t) => !v || DateTime.fromISO(v) <= DateTime.fromISO(dateCompare) || (message || $t('components.thedateShouldBeSameOrBefore', {date: DateTime.fromISO(dateCompare).toFormat('dd-MM-yyyy')}));
 }
 
-// export function dateAfterValidation (dateCompare, message = `The date should be after ${moment(dateCompare).format('MM/DD/YYYY')}`) {
-//   return (v, $t) => !v || moment(v).isAfter(dateCompare, 'd') || (message || $t('components.'));
-// }
-//
-// export function dateSameOrAfterValidation (dateCompare, message = `The date should be after ${moment(dateCompare).format('MM/DD/YYYY')}`) {
-//   return (v, $t) => !v || moment(v).isSameOrAfter(dateCompare, 'd') || (message || $t('components.'));
-// }
-//
-// export function dateSameOrBeforeValidation (dateCompare, message = `The date should be same or before ${moment(dateCompare).format('MM/DD/YYYY')}`) {
-//   return (v, $t) => !v || moment(v).isSameOrBefore(dateCompare, 'd') || (message || $t('components.'));
-// }
-
 export function dateAfterValidationLuxon (dateCompare, message) {
   return (v, $t) => !v || DateTime.fromISO(v) > DateTime.fromISO(dateCompare) || (message || $t('components.thedateShouldBeSameOrAfter', {date: DateTime.fromISO(dateCompare).toFormat('yyyy-MM-dd')}));
 }
@@ -142,3 +132,52 @@ export function dateAfterValidationLuxon (dateCompare, message) {
 export function hoursValidation (message) {
   return (v, $t) => !v || parseHours(v) !== false || (message || $t('components.invalidTimeValueShouldBeInFormat'));
 }
+
+
+export function dateBeforeValidation (dateCompare, message) {
+  return (v, $t) => {
+    if (!v || !dateCompare || typeof dateCompare !== 'string') {
+      return true;
+    }
+    const d1 = DateTime.fromFormat(v, STANDART_DATE_FORMAT).startOf('day');
+    const d2 = DateTime.fromFormat(dateCompare, STANDART_DATE_FORMAT).startOf('day');
+
+    return d1 < d2 || (message || $t('validators.dateBefore', { date: formatDate(dateCompare) }));
+  };
+}
+
+export function dateAfterValidation (dateCompare, message) {
+  return (v, $t) => {
+    if (!v || !dateCompare || typeof dateCompare !== 'string') {
+      return true;
+    }
+    const d1 = DateTime.fromFormat(v, STANDART_DATE_FORMAT).startOf('day');
+    const d2 = DateTime.fromFormat(dateCompare, STANDART_DATE_FORMAT).startOf('day');
+
+    return d1 > d2 || (message || $t('validators.dateAfter', { date: formatDate(dateCompare) }));
+  };
+}
+
+export function dateSameOrAfterValidation (dateCompare, message) {
+  return (v, $t) => {
+    if (!v || !dateCompare || typeof dateCompare !== 'string') {
+      return true;
+    }
+    const d1 = DateTime.fromFormat(v, STANDART_DATE_FORMAT).startOf('day');
+    const d2 = DateTime.fromFormat(dateCompare, STANDART_DATE_FORMAT).startOf('day');
+
+    return d1 >= d2 || (message || $t('validators.dateSameOrAfter', { date: formatDate(dateCompare) }));
+  };
+}
+
+export function dateSameOrBeforeValidation (dateCompare, message) {
+  return (v, $t) => {
+    if (!v || !dateCompare || typeof dateCompare !== 'string') {
+      return true;
+    }
+    const d1 = DateTime.fromFormat(v, STANDART_DATE_FORMAT).startOf('day');
+    const d2 = DateTime.fromFormat(dateCompare, STANDART_DATE_FORMAT).startOf('day');
+
+    return d1 <= d2 || (message || $t('validators.dateSameOrBefore', { date: formatDate(dateCompare) }));
+  };
+}

package/src/helpers/validators.spec.js

@@ -1,4 +1,13 @@
-import {emptyValidation, minValidation, maxValidation} from './validators';
+import {
+  emptyValidation,
+  mediumTextValidation,
+  minValidation,
+  maxValidation,
+  dateBeforeValidation,
+  dateAfterValidation,
+  dateSameOrAfterValidation,
+  dateSameOrBeforeValidation,
+} from './validators';
 
 describe('Validators', () => {
   const $t = (str) => str;
@@ -25,4 +34,49 @@ describe('Validators', () => {
     expect(maxValidation(1)(0, $t)).toEqual(true);
     expect(maxValidation(1)('0', $t)).toEqual(true);
   });
+
+  test('dateBeforeValidation', () => {
+    expect(dateBeforeValidation()(0, $t)).toEqual(true);
+    expect(dateBeforeValidation()(null, $t)).toEqual(true);
+    expect(dateBeforeValidation()(undefined, $t)).toEqual(true);
+    expect(dateBeforeValidation('2020-01-02')('2020-01-01', $t)).toEqual(true);
+    expect(dateBeforeValidation('2020-01-01')('2020-01-02', $t)).toEqual('validators.dateBefore');
+    expect(dateBeforeValidation('2020-01-01')('2020-01-01', $t)).toEqual('validators.dateBefore');
+  });
+
+  test('dateAfterValidation', () => {
+    expect(dateAfterValidation()(0, $t)).toEqual(true);
+    expect(dateAfterValidation()(null, $t)).toEqual(true);
+    expect(dateAfterValidation()(undefined, $t)).toEqual(true);
+    expect(dateAfterValidation('2020-01-02')('2020-01-01', $t)).toEqual('validators.dateAfter');
+    expect(dateAfterValidation('2020-01-01')('2020-01-02', $t)).toEqual(true);
+    expect(dateAfterValidation('2020-01-01')('2020-01-01', $t)).toEqual('validators.dateAfter');
+  });
+
+  test('dateSameOrAfterValidation', () => {
+    expect(dateSameOrAfterValidation()(0, $t)).toEqual(true);
+    expect(dateSameOrAfterValidation()(null, $t)).toEqual(true);
+    expect(dateSameOrAfterValidation()(undefined, $t)).toEqual(true);
+    expect(dateSameOrAfterValidation('2020-01-02')('2020-01-01', $t)).toEqual('validators.dateSameOrAfter');
+    expect(dateSameOrAfterValidation('2020-01-01')('2020-01-02', $t)).toEqual(true);
+    expect(dateSameOrAfterValidation('2020-01-01')('2020-01-01', $t)).toEqual(true);
+  });
+
+  test('dateSameOrBeforeValidation', () => {
+    expect(dateSameOrBeforeValidation()(0, $t)).toEqual(true);
+    expect(dateSameOrBeforeValidation()(null, $t)).toEqual(true);
+    expect(dateSameOrBeforeValidation()(undefined, $t)).toEqual(true);
+    expect(dateSameOrBeforeValidation('2020-01-02')('2020-01-01', $t)).toEqual(true);
+    expect(dateSameOrBeforeValidation('2020-01-01')('2020-01-02', $t)).toEqual('validators.dateSameOrBefore');
+    expect(dateSameOrBeforeValidation('2020-01-01')('2020-01-01', $t)).toEqual(true);
+  });
+
+  test('mediumTextValidation', () => {
+    expect(mediumTextValidation()(0, $t)).toEqual(true);
+    expect(mediumTextValidation()(null, $t)).toEqual(true);
+    expect(mediumTextValidation()(undefined, $t)).toEqual(true);
+    expect(mediumTextValidation()('abc', $t)).toEqual(true);
+    expect(mediumTextValidation()('0'.repeat(16777215), $t)).toEqual(true);
+    expect(mediumTextValidation()('0'.repeat(16777216), $t)).toEqual('components.mediumTextLength');
+  });
 });