@alfalab/core-components-date-input 1.2.13 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +78 -0
- package/dist/Component.d.ts +16 -18
- package/dist/Component.js +68 -29
- package/dist/cssm/Component.d.ts +16 -18
- package/dist/cssm/Component.js +67 -28
- package/dist/cssm/index.js +7 -7
- package/dist/cssm/utils/format.d.ts +3 -1
- package/dist/cssm/utils/format.js +27 -3
- package/dist/cssm/utils/index.d.ts +0 -1
- package/dist/cssm/utils/index.js +5 -6
- package/dist/cssm/utils/native-supports.d.ts +1 -3
- package/dist/cssm/utils/native-supports.js +0 -4
- package/dist/esm/Component.d.ts +16 -18
- package/dist/esm/Component.js +70 -32
- package/dist/esm/index.css +4 -4
- package/dist/esm/index.js +7 -5
- package/dist/esm/utils/format.d.ts +3 -1
- package/dist/esm/utils/format.js +19 -3
- package/dist/esm/utils/index.d.ts +0 -1
- package/dist/esm/utils/index.js +5 -4
- package/dist/esm/utils/native-supports.d.ts +1 -3
- package/dist/esm/utils/native-supports.js +1 -3
- package/dist/index.css +4 -4
- package/dist/index.js +7 -7
- package/dist/modern/Component.d.ts +16 -18
- package/dist/modern/Component.js +70 -30
- package/dist/modern/index.css +4 -4
- package/dist/modern/index.js +7 -5
- package/dist/modern/utils/format.d.ts +3 -1
- package/dist/modern/utils/format.js +15 -3
- package/dist/modern/utils/index.d.ts +0 -1
- package/dist/modern/utils/index.js +5 -4
- package/dist/modern/utils/native-supports.d.ts +1 -3
- package/dist/modern/utils/native-supports.js +1 -3
- package/dist/utils/format.d.ts +3 -1
- package/dist/utils/format.js +27 -3
- package/dist/utils/index.d.ts +0 -1
- package/dist/utils/index.js +5 -6
- package/dist/utils/native-supports.d.ts +1 -3
- package/dist/utils/native-supports.js +0 -4
- package/package.json +5 -4
- package/dist/cssm/utils/date-correction-pipe.d.ts +0 -9
- package/dist/cssm/utils/date-correction-pipe.js +0 -59
- package/dist/esm/utils/date-correction-pipe.d.ts +0 -9
- package/dist/esm/utils/date-correction-pipe.js +0 -54
- package/dist/modern/utils/date-correction-pipe.d.ts +0 -9
- package/dist/modern/utils/date-correction-pipe.js +0 -52
- package/dist/utils/date-correction-pipe.d.ts +0 -9
- package/dist/utils/date-correction-pipe.js +0 -59
package/dist/modern/Component.js
CHANGED
|
@@ -1,41 +1,81 @@
|
|
|
1
|
-
import React, {
|
|
2
|
-
import {
|
|
3
|
-
import '
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
1
|
+
import React, { forwardRef, useRef, useState, useCallback, useEffect } from 'react';
|
|
2
|
+
import { Input } from '@alfalab/core-components-input/dist/modern';
|
|
3
|
+
import mergeRefs from 'react-merge-refs';
|
|
4
|
+
import 'date-fns/parse';
|
|
5
|
+
import 'date-fns/format';
|
|
6
|
+
import 'date-fns/isValid';
|
|
7
|
+
import { isValid, DATE_MASK, format, parseDateString, isCompleteDateInput, NATIVE_DATE_FORMAT, formatDate } from './utils/format.js';
|
|
8
|
+
import { isInputDateSupported } from './utils/native-supports.js';
|
|
7
9
|
|
|
8
|
-
var styles = {"nativeInput":"date-
|
|
10
|
+
var styles = {"nativeInput":"date-input__nativeInput_13rpk"};
|
|
9
11
|
require('./index.css')
|
|
10
12
|
|
|
11
|
-
const DateInput =
|
|
12
|
-
const
|
|
13
|
-
const shouldRenderNative =
|
|
14
|
-
const [
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
if (uncontrolled) {
|
|
22
|
-
setStateValue(newValue);
|
|
13
|
+
const DateInput = forwardRef(({ mobileMode = 'input', defaultValue = '', rightAddons, error, value: propValue, onBlur, onChange, onComplete, ...restProps }, ref) => {
|
|
14
|
+
const inputRef = useRef(null);
|
|
15
|
+
const [shouldRenderNative, setShouldRenderNative] = useState(false);
|
|
16
|
+
const [value, setValue] = useState(propValue || defaultValue);
|
|
17
|
+
const [stateError, setStateError] = useState(!isValid(propValue));
|
|
18
|
+
const handleValueValidity = useCallback((inputValue) => {
|
|
19
|
+
// Валидируем незаполненное значение только если инпут не в фокусе (блюр, либо установка значения снаружи)
|
|
20
|
+
const validateIncomplete = inputRef.current && document.activeElement !== inputRef.current;
|
|
21
|
+
if (!inputValue || validateIncomplete || inputValue.length >= DATE_MASK.length) {
|
|
22
|
+
setStateError(!isValid(inputValue));
|
|
23
23
|
}
|
|
24
|
-
|
|
25
|
-
onChange(event, { date: newDate, value: newValue });
|
|
26
|
-
}
|
|
27
|
-
}, [onChange, uncontrolled]);
|
|
24
|
+
}, []);
|
|
28
25
|
const handleChange = useCallback((event) => {
|
|
29
|
-
const newValue = event.target
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
26
|
+
const { value: newValue } = event.target;
|
|
27
|
+
// Позволяем вводить только цифры и точки
|
|
28
|
+
if (/[^\d.]/.test(newValue)) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
const dots = newValue.match(/\./g);
|
|
32
|
+
// Не даем вводить больше, чем 2 точки
|
|
33
|
+
if (dots && dots.length > 2) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
// Форматируем введенное значение (добавляем точки)
|
|
37
|
+
const formattedValue = format(newValue);
|
|
38
|
+
const date = parseDateString(formattedValue);
|
|
39
|
+
setValue(formattedValue);
|
|
40
|
+
if (onChange)
|
|
41
|
+
onChange(event, { date, value: formattedValue });
|
|
42
|
+
if (isCompleteDateInput(formattedValue)) {
|
|
43
|
+
const valid = formattedValue.length > 0 && isValid(formattedValue);
|
|
44
|
+
if (!valid)
|
|
45
|
+
return;
|
|
46
|
+
if (onComplete)
|
|
47
|
+
onComplete(event, { date, value: formattedValue });
|
|
48
|
+
}
|
|
49
|
+
}, [onChange, onComplete]);
|
|
33
50
|
const handleNativeInputChange = useCallback((event) => {
|
|
34
51
|
const newDate = parseDateString(event.target.value, NATIVE_DATE_FORMAT);
|
|
35
52
|
const newValue = event.target.value === '' ? '' : formatDate(newDate);
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
53
|
+
setValue(newValue);
|
|
54
|
+
if (onComplete)
|
|
55
|
+
onComplete(event, { date: newDate, value: newValue });
|
|
56
|
+
if (onChange)
|
|
57
|
+
onChange(event, { date: newDate, value: newValue });
|
|
58
|
+
}, [onComplete, onChange]);
|
|
59
|
+
const handleBlur = useCallback((event) => {
|
|
60
|
+
handleValueValidity(value);
|
|
61
|
+
if (onBlur)
|
|
62
|
+
onBlur(event);
|
|
63
|
+
}, [handleValueValidity, onBlur, value]);
|
|
64
|
+
useEffect(() => {
|
|
65
|
+
if (mobileMode === 'native' && isInputDateSupported()) {
|
|
66
|
+
setShouldRenderNative(true);
|
|
67
|
+
}
|
|
68
|
+
}, [mobileMode]);
|
|
69
|
+
useEffect(() => {
|
|
70
|
+
if (typeof propValue !== 'undefined') {
|
|
71
|
+
setValue(propValue);
|
|
72
|
+
}
|
|
73
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
74
|
+
}, [propValue]);
|
|
75
|
+
useEffect(() => {
|
|
76
|
+
handleValueValidity(value);
|
|
77
|
+
}, [handleValueValidity, value]);
|
|
78
|
+
return (React.createElement(Input, Object.assign({}, restProps, { ref: mergeRefs([ref, inputRef]), value: value, inputMode: 'decimal', pattern: '[0-9\\.]*', onChange: handleChange, onBlur: handleBlur, placeholder: '\u0414\u0414.\u041C\u041C.\u0413\u0413\u0413\u0413', error: error || stateError, rightAddons: React.createElement(React.Fragment, null,
|
|
39
79
|
rightAddons,
|
|
40
80
|
shouldRenderNative && (React.createElement("input", { type: 'date', ref: ref, defaultValue: defaultValue, onChange: handleNativeInputChange, className: styles.nativeInput }))) })));
|
|
41
81
|
});
|
package/dist/modern/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: mpplo */
|
|
2
2
|
:root {
|
|
3
3
|
|
|
4
4
|
/* Hard */
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
/* Hard up */
|
|
9
9
|
}
|
|
10
|
-
.date-
|
|
10
|
+
.date-input__nativeInput_13rpk {
|
|
11
11
|
opacity: 0;
|
|
12
12
|
position: absolute;
|
|
13
13
|
top: 0;
|
|
@@ -18,9 +18,9 @@
|
|
|
18
18
|
appearance: none;
|
|
19
19
|
z-index: 1
|
|
20
20
|
}
|
|
21
|
-
.date-
|
|
21
|
+
.date-input__nativeInput_13rpk::-webkit-calendar-picker-indicator {
|
|
22
22
|
display: none;
|
|
23
23
|
}
|
|
24
|
-
.date-
|
|
24
|
+
.date-input__nativeInput_13rpk::-webkit-inner-spin-button {
|
|
25
25
|
display: none;
|
|
26
26
|
}
|
package/dist/modern/index.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
-
import '@alfalab/core-components-
|
|
3
|
-
import '
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
import '@alfalab/core-components-input/dist/modern';
|
|
3
|
+
import 'react-merge-refs';
|
|
4
|
+
import 'date-fns/parse';
|
|
5
|
+
import 'date-fns/format';
|
|
6
|
+
import 'date-fns/isValid';
|
|
7
|
+
export { DATE_FORMAT, DATE_MASK, NATIVE_DATE_FORMAT, format, formatDate, isCompleteDateInput, isValid, parseDateString } from './utils/format.js';
|
|
8
|
+
export { isInputDateSupported } from './utils/native-supports.js';
|
|
7
9
|
export { DateInput } from './Component.js';
|
|
@@ -4,4 +4,6 @@ declare const DATE_MASK: (string | RegExp)[];
|
|
|
4
4
|
declare const isCompleteDateInput: (input: string) => boolean;
|
|
5
5
|
declare const formatDate: (date: number | Date, dateFormat?: string) => string;
|
|
6
6
|
declare const parseDateString: (value: string, dateFormat?: string) => Date;
|
|
7
|
-
|
|
7
|
+
declare const isValid: (inputValue?: string | undefined) => boolean;
|
|
8
|
+
declare const format: (value: string) => string;
|
|
9
|
+
export { DATE_FORMAT, NATIVE_DATE_FORMAT, DATE_MASK, isCompleteDateInput, formatDate, parseDateString, isValid, format };
|
|
@@ -1,10 +1,22 @@
|
|
|
1
|
-
import
|
|
1
|
+
import parse from 'date-fns/parse';
|
|
2
|
+
import dateFnsFormat from 'date-fns/format';
|
|
3
|
+
import dateFnsIsValid from 'date-fns/isValid';
|
|
2
4
|
|
|
3
5
|
const DATE_FORMAT = 'dd.MM.yyyy';
|
|
4
6
|
const NATIVE_DATE_FORMAT = 'yyyy-MM-dd';
|
|
5
7
|
const DATE_MASK = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];
|
|
6
8
|
const isCompleteDateInput = (input) => input.length === DATE_MASK.length;
|
|
7
|
-
const formatDate = (date, dateFormat = DATE_FORMAT) =>
|
|
9
|
+
const formatDate = (date, dateFormat = DATE_FORMAT) => dateFnsFormat(date, dateFormat);
|
|
8
10
|
const parseDateString = (value, dateFormat = DATE_FORMAT) => parse(value, dateFormat, new Date());
|
|
11
|
+
const isValid = (inputValue) => !inputValue || (isCompleteDateInput(inputValue) && dateFnsIsValid(parseDateString(inputValue)));
|
|
12
|
+
const format = (value) => value
|
|
13
|
+
.replace(/^(\d\d)(\d)$/, '$1.$2') // 121 => 12.1
|
|
14
|
+
.replace(/^(\d\d)\.(\d\d)(\d)$/, '$1.$2.$3') // 12.122 => 12.12.2
|
|
15
|
+
.replace(/^(\d\d)\d\.(.*)/, '$1.$2') // 123.12.2005 => 12.12.2005
|
|
16
|
+
.replace(/^(\d\d\.\d\d)\d\.(.*)/, '$1.$2') // 12.123.2005 => 12.12.2005
|
|
17
|
+
.replace(/^(\d\d\.\d\d\.\d\d\d\d).*/, '$1') // 12.12.20056 => 12.12.2005
|
|
18
|
+
.replace(/\.$/, '') // 12. => 12
|
|
19
|
+
.replace(/^(\d\d\.\d\d)(\d\d\d\d)/, '$1.$2') // 12.122005 => 12.12.2005
|
|
20
|
+
.replace(/^(\d\d)(\d\d\.\d\d\d\d)/, '$1.$2'); // 1212.2005 => 12.12.2005
|
|
9
21
|
|
|
10
|
-
export { DATE_FORMAT, DATE_MASK, NATIVE_DATE_FORMAT, formatDate, isCompleteDateInput, parseDateString };
|
|
22
|
+
export { DATE_FORMAT, DATE_MASK, NATIVE_DATE_FORMAT, format, formatDate, isCompleteDateInput, isValid, parseDateString };
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import 'date-fns';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
export {
|
|
1
|
+
import 'date-fns/parse';
|
|
2
|
+
import 'date-fns/format';
|
|
3
|
+
import 'date-fns/isValid';
|
|
4
|
+
export { DATE_FORMAT, DATE_MASK, NATIVE_DATE_FORMAT, format, formatDate, isCompleteDateInput, isValid, parseDateString } from './format.js';
|
|
5
|
+
export { isInputDateSupported } from './native-supports.js';
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
declare const IS_BROWSER: boolean;
|
|
2
|
-
declare const SUPPORTS_INPUT_TYPE_DATE: boolean;
|
|
3
1
|
/**
|
|
4
2
|
* Возвращает `true`, если поддерживается `input[type="date"]`
|
|
5
3
|
*/
|
|
6
4
|
declare function isInputDateSupported(): boolean;
|
|
7
|
-
export {
|
|
5
|
+
export { isInputDateSupported };
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
const IS_BROWSER = typeof window !== 'undefined';
|
|
2
|
-
const SUPPORTS_INPUT_TYPE_DATE = IS_BROWSER && isInputDateSupported();
|
|
3
1
|
/**
|
|
4
2
|
* Возвращает `true`, если поддерживается `input[type="date"]`
|
|
5
3
|
*/
|
|
@@ -11,4 +9,4 @@ function isInputDateSupported() {
|
|
|
11
9
|
return input.value !== value;
|
|
12
10
|
}
|
|
13
11
|
|
|
14
|
-
export {
|
|
12
|
+
export { isInputDateSupported };
|
package/dist/utils/format.d.ts
CHANGED
|
@@ -4,4 +4,6 @@ declare const DATE_MASK: (string | RegExp)[];
|
|
|
4
4
|
declare const isCompleteDateInput: (input: string) => boolean;
|
|
5
5
|
declare const formatDate: (date: number | Date, dateFormat?: string) => string;
|
|
6
6
|
declare const parseDateString: (value: string, dateFormat?: string) => Date;
|
|
7
|
-
|
|
7
|
+
declare const isValid: (inputValue?: string | undefined) => boolean;
|
|
8
|
+
declare const format: (value: string) => string;
|
|
9
|
+
export { DATE_FORMAT, NATIVE_DATE_FORMAT, DATE_MASK, isCompleteDateInput, formatDate, parseDateString, isValid, format };
|
package/dist/utils/format.js
CHANGED
|
@@ -2,7 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var parse = require('date-fns/parse');
|
|
6
|
+
var dateFnsFormat = require('date-fns/format');
|
|
7
|
+
var dateFnsIsValid = require('date-fns/isValid');
|
|
8
|
+
|
|
9
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
|
+
|
|
11
|
+
var parse__default = /*#__PURE__*/_interopDefaultLegacy(parse);
|
|
12
|
+
var dateFnsFormat__default = /*#__PURE__*/_interopDefaultLegacy(dateFnsFormat);
|
|
13
|
+
var dateFnsIsValid__default = /*#__PURE__*/_interopDefaultLegacy(dateFnsIsValid);
|
|
6
14
|
|
|
7
15
|
var DATE_FORMAT = 'dd.MM.yyyy';
|
|
8
16
|
var NATIVE_DATE_FORMAT = 'yyyy-MM-dd';
|
|
@@ -10,16 +18,32 @@ var DATE_MASK = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];
|
|
|
10
18
|
var isCompleteDateInput = function (input) { return input.length === DATE_MASK.length; };
|
|
11
19
|
var formatDate = function (date, dateFormat) {
|
|
12
20
|
if (dateFormat === void 0) { dateFormat = DATE_FORMAT; }
|
|
13
|
-
return
|
|
21
|
+
return dateFnsFormat__default['default'](date, dateFormat);
|
|
14
22
|
};
|
|
15
23
|
var parseDateString = function (value, dateFormat) {
|
|
16
24
|
if (dateFormat === void 0) { dateFormat = DATE_FORMAT; }
|
|
17
|
-
return
|
|
25
|
+
return parse__default['default'](value, dateFormat, new Date());
|
|
26
|
+
};
|
|
27
|
+
var isValid = function (inputValue) {
|
|
28
|
+
return !inputValue || (isCompleteDateInput(inputValue) && dateFnsIsValid__default['default'](parseDateString(inputValue)));
|
|
18
29
|
};
|
|
30
|
+
var format = function (value) {
|
|
31
|
+
return value
|
|
32
|
+
.replace(/^(\d\d)(\d)$/, '$1.$2') // 121 => 12.1
|
|
33
|
+
.replace(/^(\d\d)\.(\d\d)(\d)$/, '$1.$2.$3') // 12.122 => 12.12.2
|
|
34
|
+
.replace(/^(\d\d)\d\.(.*)/, '$1.$2') // 123.12.2005 => 12.12.2005
|
|
35
|
+
.replace(/^(\d\d\.\d\d)\d\.(.*)/, '$1.$2') // 12.123.2005 => 12.12.2005
|
|
36
|
+
.replace(/^(\d\d\.\d\d\.\d\d\d\d).*/, '$1') // 12.12.20056 => 12.12.2005
|
|
37
|
+
.replace(/\.$/, '') // 12. => 12
|
|
38
|
+
.replace(/^(\d\d\.\d\d)(\d\d\d\d)/, '$1.$2') // 12.122005 => 12.12.2005
|
|
39
|
+
.replace(/^(\d\d)(\d\d\.\d\d\d\d)/, '$1.$2');
|
|
40
|
+
}; // 1212.2005 => 12.12.2005
|
|
19
41
|
|
|
20
42
|
exports.DATE_FORMAT = DATE_FORMAT;
|
|
21
43
|
exports.DATE_MASK = DATE_MASK;
|
|
22
44
|
exports.NATIVE_DATE_FORMAT = NATIVE_DATE_FORMAT;
|
|
45
|
+
exports.format = format;
|
|
23
46
|
exports.formatDate = formatDate;
|
|
24
47
|
exports.isCompleteDateInput = isCompleteDateInput;
|
|
48
|
+
exports.isValid = isValid;
|
|
25
49
|
exports.parseDateString = parseDateString;
|
package/dist/utils/index.d.ts
CHANGED
package/dist/utils/index.js
CHANGED
|
@@ -2,9 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
require('date-fns');
|
|
5
|
+
require('date-fns/parse');
|
|
6
|
+
require('date-fns/format');
|
|
7
|
+
require('date-fns/isValid');
|
|
6
8
|
var utils_format = require('./format.js');
|
|
7
|
-
var utils_dateCorrectionPipe = require('./date-correction-pipe.js');
|
|
8
9
|
var utils_nativeSupports = require('./native-supports.js');
|
|
9
10
|
|
|
10
11
|
|
|
@@ -12,11 +13,9 @@ var utils_nativeSupports = require('./native-supports.js');
|
|
|
12
13
|
exports.DATE_FORMAT = utils_format.DATE_FORMAT;
|
|
13
14
|
exports.DATE_MASK = utils_format.DATE_MASK;
|
|
14
15
|
exports.NATIVE_DATE_FORMAT = utils_format.NATIVE_DATE_FORMAT;
|
|
16
|
+
exports.format = utils_format.format;
|
|
15
17
|
exports.formatDate = utils_format.formatDate;
|
|
16
18
|
exports.isCompleteDateInput = utils_format.isCompleteDateInput;
|
|
19
|
+
exports.isValid = utils_format.isValid;
|
|
17
20
|
exports.parseDateString = utils_format.parseDateString;
|
|
18
|
-
exports.createAutoCorrectedDatePipe = utils_dateCorrectionPipe.createAutoCorrectedDatePipe;
|
|
19
|
-
exports.mask = utils_dateCorrectionPipe.mask;
|
|
20
|
-
exports.IS_BROWSER = utils_nativeSupports.IS_BROWSER;
|
|
21
|
-
exports.SUPPORTS_INPUT_TYPE_DATE = utils_nativeSupports.SUPPORTS_INPUT_TYPE_DATE;
|
|
22
21
|
exports.isInputDateSupported = utils_nativeSupports.isInputDateSupported;
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
declare const IS_BROWSER: boolean;
|
|
2
|
-
declare const SUPPORTS_INPUT_TYPE_DATE: boolean;
|
|
3
1
|
/**
|
|
4
2
|
* Возвращает `true`, если поддерживается `input[type="date"]`
|
|
5
3
|
*/
|
|
6
4
|
declare function isInputDateSupported(): boolean;
|
|
7
|
-
export {
|
|
5
|
+
export { isInputDateSupported };
|
|
@@ -2,8 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var IS_BROWSER = typeof window !== 'undefined';
|
|
6
|
-
var SUPPORTS_INPUT_TYPE_DATE = IS_BROWSER && isInputDateSupported();
|
|
7
5
|
/**
|
|
8
6
|
* Возвращает `true`, если поддерживается `input[type="date"]`
|
|
9
7
|
*/
|
|
@@ -15,6 +13,4 @@ function isInputDateSupported() {
|
|
|
15
13
|
return input.value !== value;
|
|
16
14
|
}
|
|
17
15
|
|
|
18
|
-
exports.IS_BROWSER = IS_BROWSER;
|
|
19
|
-
exports.SUPPORTS_INPUT_TYPE_DATE = SUPPORTS_INPUT_TYPE_DATE;
|
|
20
16
|
exports.isInputDateSupported = isInputDateSupported;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alfalab/core-components-date-input",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -19,8 +19,9 @@
|
|
|
19
19
|
"react": "^16.9.0 || ^17.0.1"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@alfalab/core-components-
|
|
23
|
-
"date-fns": "^2.16.1"
|
|
22
|
+
"@alfalab/core-components-input": "^8.1.0",
|
|
23
|
+
"date-fns": "^2.16.1",
|
|
24
|
+
"react-merge-refs": "^1.1.0"
|
|
24
25
|
},
|
|
25
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "5c900d923b3052a3a677c99b7c927e6213e890b6"
|
|
26
27
|
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
declare const mask: (string | RegExp)[];
|
|
2
|
-
declare function createAutoCorrectedDatePipe({ minYear, maxYear }?: {
|
|
3
|
-
minYear?: number | undefined;
|
|
4
|
-
maxYear?: number | undefined;
|
|
5
|
-
}, dateFormat?: string): (conformedValue: string) => false | {
|
|
6
|
-
value: string;
|
|
7
|
-
indexesOfPipedChars: number[];
|
|
8
|
-
};
|
|
9
|
-
export { mask, createAutoCorrectedDatePipe };
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var maxValueMonth = [31, 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
|
|
6
|
-
var formatOrder = ['yyyy', 'yy', 'mm', 'dd', 'HH', 'MM', 'SS'];
|
|
7
|
-
var mask = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];
|
|
8
|
-
function createAutoCorrectedDatePipe(_a, dateFormat) {
|
|
9
|
-
var _b = _a === void 0 ? {} : _a, _c = _b.minYear, minYear = _c === void 0 ? 1800 : _c, _d = _b.maxYear, maxYear = _d === void 0 ? 2100 : _d;
|
|
10
|
-
if (dateFormat === void 0) { dateFormat = 'dd mm yyyy'; }
|
|
11
|
-
var dateFormatArray = dateFormat
|
|
12
|
-
.split(/[^dmyHMS]+/)
|
|
13
|
-
.sort(function (a, b) { return formatOrder.indexOf(a) - formatOrder.indexOf(b); });
|
|
14
|
-
return function (conformedValue) {
|
|
15
|
-
var indexesOfPipedChars = [];
|
|
16
|
-
var maxValue = { dd: 31, mm: 12, yy: 99, yyyy: maxYear, HH: 23, MM: 59, SS: 59 };
|
|
17
|
-
var minValue = { dd: 1, mm: 1, yy: 0, yyyy: minYear, HH: 0, MM: 0, SS: 0 };
|
|
18
|
-
var conformedValueArr = conformedValue.split('');
|
|
19
|
-
// Check first digit
|
|
20
|
-
dateFormatArray.forEach(function (format) {
|
|
21
|
-
var position = dateFormat.indexOf(format);
|
|
22
|
-
var maxFirstDigit = parseInt(maxValue[format].toString().substr(0, 1), 10);
|
|
23
|
-
if (parseInt(conformedValueArr[position], 10) > maxFirstDigit) {
|
|
24
|
-
conformedValueArr[position + 1] = conformedValueArr[position];
|
|
25
|
-
conformedValueArr[position] = '0';
|
|
26
|
-
indexesOfPipedChars.push(position);
|
|
27
|
-
}
|
|
28
|
-
});
|
|
29
|
-
// Check for invalid date
|
|
30
|
-
var month = 0;
|
|
31
|
-
var isInvalid = dateFormatArray.some(function (format) {
|
|
32
|
-
var position = dateFormat.indexOf(format);
|
|
33
|
-
var length = format.length;
|
|
34
|
-
var textValue = conformedValue.substr(position, length).replace(/\D/g, '');
|
|
35
|
-
var value = parseInt(textValue, 10);
|
|
36
|
-
if (format === 'mm') {
|
|
37
|
-
month = value || 0;
|
|
38
|
-
}
|
|
39
|
-
var maxValueForFormat = format === 'dd' ? maxValueMonth[month] : maxValue[format];
|
|
40
|
-
if (format === 'yyyy' && (minYear !== 1 || maxYear !== 9999)) {
|
|
41
|
-
var scopedMaxValue = parseInt(maxValue[format].toString().substring(0, textValue.length), 10);
|
|
42
|
-
var scopedMinValue = parseInt(minValue[format].toString().substring(0, textValue.length), 10);
|
|
43
|
-
return value < scopedMinValue || value > scopedMaxValue;
|
|
44
|
-
}
|
|
45
|
-
return (value > maxValueForFormat ||
|
|
46
|
-
(textValue.length === length && value < minValue[format]));
|
|
47
|
-
});
|
|
48
|
-
if (isInvalid) {
|
|
49
|
-
return false;
|
|
50
|
-
}
|
|
51
|
-
return {
|
|
52
|
-
value: conformedValueArr.join(''),
|
|
53
|
-
indexesOfPipedChars: indexesOfPipedChars,
|
|
54
|
-
};
|
|
55
|
-
};
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
exports.createAutoCorrectedDatePipe = createAutoCorrectedDatePipe;
|
|
59
|
-
exports.mask = mask;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
declare const mask: (string | RegExp)[];
|
|
2
|
-
declare function createAutoCorrectedDatePipe({ minYear, maxYear }?: {
|
|
3
|
-
minYear?: number | undefined;
|
|
4
|
-
maxYear?: number | undefined;
|
|
5
|
-
}, dateFormat?: string): (conformedValue: string) => false | {
|
|
6
|
-
value: string;
|
|
7
|
-
indexesOfPipedChars: number[];
|
|
8
|
-
};
|
|
9
|
-
export { mask, createAutoCorrectedDatePipe };
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
var maxValueMonth = [31, 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
|
|
2
|
-
var formatOrder = ['yyyy', 'yy', 'mm', 'dd', 'HH', 'MM', 'SS'];
|
|
3
|
-
var mask = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];
|
|
4
|
-
function createAutoCorrectedDatePipe(_a, dateFormat) {
|
|
5
|
-
var _b = _a === void 0 ? {} : _a, _c = _b.minYear, minYear = _c === void 0 ? 1800 : _c, _d = _b.maxYear, maxYear = _d === void 0 ? 2100 : _d;
|
|
6
|
-
if (dateFormat === void 0) { dateFormat = 'dd mm yyyy'; }
|
|
7
|
-
var dateFormatArray = dateFormat
|
|
8
|
-
.split(/[^dmyHMS]+/)
|
|
9
|
-
.sort(function (a, b) { return formatOrder.indexOf(a) - formatOrder.indexOf(b); });
|
|
10
|
-
return function (conformedValue) {
|
|
11
|
-
var indexesOfPipedChars = [];
|
|
12
|
-
var maxValue = { dd: 31, mm: 12, yy: 99, yyyy: maxYear, HH: 23, MM: 59, SS: 59 };
|
|
13
|
-
var minValue = { dd: 1, mm: 1, yy: 0, yyyy: minYear, HH: 0, MM: 0, SS: 0 };
|
|
14
|
-
var conformedValueArr = conformedValue.split('');
|
|
15
|
-
// Check first digit
|
|
16
|
-
dateFormatArray.forEach(function (format) {
|
|
17
|
-
var position = dateFormat.indexOf(format);
|
|
18
|
-
var maxFirstDigit = parseInt(maxValue[format].toString().substr(0, 1), 10);
|
|
19
|
-
if (parseInt(conformedValueArr[position], 10) > maxFirstDigit) {
|
|
20
|
-
conformedValueArr[position + 1] = conformedValueArr[position];
|
|
21
|
-
conformedValueArr[position] = '0';
|
|
22
|
-
indexesOfPipedChars.push(position);
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
// Check for invalid date
|
|
26
|
-
var month = 0;
|
|
27
|
-
var isInvalid = dateFormatArray.some(function (format) {
|
|
28
|
-
var position = dateFormat.indexOf(format);
|
|
29
|
-
var length = format.length;
|
|
30
|
-
var textValue = conformedValue.substr(position, length).replace(/\D/g, '');
|
|
31
|
-
var value = parseInt(textValue, 10);
|
|
32
|
-
if (format === 'mm') {
|
|
33
|
-
month = value || 0;
|
|
34
|
-
}
|
|
35
|
-
var maxValueForFormat = format === 'dd' ? maxValueMonth[month] : maxValue[format];
|
|
36
|
-
if (format === 'yyyy' && (minYear !== 1 || maxYear !== 9999)) {
|
|
37
|
-
var scopedMaxValue = parseInt(maxValue[format].toString().substring(0, textValue.length), 10);
|
|
38
|
-
var scopedMinValue = parseInt(minValue[format].toString().substring(0, textValue.length), 10);
|
|
39
|
-
return value < scopedMinValue || value > scopedMaxValue;
|
|
40
|
-
}
|
|
41
|
-
return (value > maxValueForFormat ||
|
|
42
|
-
(textValue.length === length && value < minValue[format]));
|
|
43
|
-
});
|
|
44
|
-
if (isInvalid) {
|
|
45
|
-
return false;
|
|
46
|
-
}
|
|
47
|
-
return {
|
|
48
|
-
value: conformedValueArr.join(''),
|
|
49
|
-
indexesOfPipedChars: indexesOfPipedChars,
|
|
50
|
-
};
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
export { createAutoCorrectedDatePipe, mask };
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
declare const mask: (string | RegExp)[];
|
|
2
|
-
declare function createAutoCorrectedDatePipe({ minYear, maxYear }?: {
|
|
3
|
-
minYear?: number | undefined;
|
|
4
|
-
maxYear?: number | undefined;
|
|
5
|
-
}, dateFormat?: string): (conformedValue: string) => false | {
|
|
6
|
-
value: string;
|
|
7
|
-
indexesOfPipedChars: number[];
|
|
8
|
-
};
|
|
9
|
-
export { mask, createAutoCorrectedDatePipe };
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
const maxValueMonth = [31, 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
|
|
2
|
-
const formatOrder = ['yyyy', 'yy', 'mm', 'dd', 'HH', 'MM', 'SS'];
|
|
3
|
-
const mask = [/\d/, /\d/, '.', /\d/, /\d/, '.', /\d/, /\d/, /\d/, /\d/];
|
|
4
|
-
function createAutoCorrectedDatePipe({ minYear = 1800, maxYear = 2100 } = {}, dateFormat = 'dd mm yyyy') {
|
|
5
|
-
const dateFormatArray = dateFormat
|
|
6
|
-
.split(/[^dmyHMS]+/)
|
|
7
|
-
.sort((a, b) => formatOrder.indexOf(a) - formatOrder.indexOf(b));
|
|
8
|
-
return (conformedValue) => {
|
|
9
|
-
const indexesOfPipedChars = [];
|
|
10
|
-
const maxValue = { dd: 31, mm: 12, yy: 99, yyyy: maxYear, HH: 23, MM: 59, SS: 59 };
|
|
11
|
-
const minValue = { dd: 1, mm: 1, yy: 0, yyyy: minYear, HH: 0, MM: 0, SS: 0 };
|
|
12
|
-
const conformedValueArr = conformedValue.split('');
|
|
13
|
-
// Check first digit
|
|
14
|
-
dateFormatArray.forEach(format => {
|
|
15
|
-
const position = dateFormat.indexOf(format);
|
|
16
|
-
const maxFirstDigit = parseInt(maxValue[format].toString().substr(0, 1), 10);
|
|
17
|
-
if (parseInt(conformedValueArr[position], 10) > maxFirstDigit) {
|
|
18
|
-
conformedValueArr[position + 1] = conformedValueArr[position];
|
|
19
|
-
conformedValueArr[position] = '0';
|
|
20
|
-
indexesOfPipedChars.push(position);
|
|
21
|
-
}
|
|
22
|
-
});
|
|
23
|
-
// Check for invalid date
|
|
24
|
-
let month = 0;
|
|
25
|
-
const isInvalid = dateFormatArray.some(format => {
|
|
26
|
-
const position = dateFormat.indexOf(format);
|
|
27
|
-
const { length } = format;
|
|
28
|
-
const textValue = conformedValue.substr(position, length).replace(/\D/g, '');
|
|
29
|
-
const value = parseInt(textValue, 10);
|
|
30
|
-
if (format === 'mm') {
|
|
31
|
-
month = value || 0;
|
|
32
|
-
}
|
|
33
|
-
const maxValueForFormat = format === 'dd' ? maxValueMonth[month] : maxValue[format];
|
|
34
|
-
if (format === 'yyyy' && (minYear !== 1 || maxYear !== 9999)) {
|
|
35
|
-
const scopedMaxValue = parseInt(maxValue[format].toString().substring(0, textValue.length), 10);
|
|
36
|
-
const scopedMinValue = parseInt(minValue[format].toString().substring(0, textValue.length), 10);
|
|
37
|
-
return value < scopedMinValue || value > scopedMaxValue;
|
|
38
|
-
}
|
|
39
|
-
return (value > maxValueForFormat ||
|
|
40
|
-
(textValue.length === length && value < minValue[format]));
|
|
41
|
-
});
|
|
42
|
-
if (isInvalid) {
|
|
43
|
-
return false;
|
|
44
|
-
}
|
|
45
|
-
return {
|
|
46
|
-
value: conformedValueArr.join(''),
|
|
47
|
-
indexesOfPipedChars,
|
|
48
|
-
};
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
export { createAutoCorrectedDatePipe, mask };
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
declare const mask: (string | RegExp)[];
|
|
2
|
-
declare function createAutoCorrectedDatePipe({ minYear, maxYear }?: {
|
|
3
|
-
minYear?: number | undefined;
|
|
4
|
-
maxYear?: number | undefined;
|
|
5
|
-
}, dateFormat?: string): (conformedValue: string) => false | {
|
|
6
|
-
value: string;
|
|
7
|
-
indexesOfPipedChars: number[];
|
|
8
|
-
};
|
|
9
|
-
export { mask, createAutoCorrectedDatePipe };
|