@salutejs/plasma-new-hope 0.134.0-canary.1404.10615452870.0 → 0.134.0-canary.1404.10629008038.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/DatePicker/utils/dateHelper.js +0 -2
- package/cjs/components/DatePicker/utils/dateHelper.js.map +1 -1
- package/cjs/utils/datejs.js +1 -0
- package/cjs/utils/datejs.js.map +1 -1
- package/emotion/cjs/components/DatePicker/DatePicker.template-doc.mdx +32 -0
- package/emotion/cjs/components/DatePicker/utils/dateHelper.js +0 -2
- package/emotion/cjs/utils/datejs.js +1 -0
- package/emotion/es/components/DatePicker/DatePicker.template-doc.mdx +32 -0
- package/emotion/es/components/DatePicker/utils/dateHelper.js +0 -2
- package/emotion/es/utils/datejs.js +1 -0
- package/es/components/DatePicker/utils/dateHelper.js +0 -2
- package/es/components/DatePicker/utils/dateHelper.js.map +1 -1
- package/es/utils/datejs.js +1 -0
- package/es/utils/datejs.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/DatePicker/DatePicker.template-doc.mdx +32 -0
- package/styled-components/cjs/components/DatePicker/utils/dateHelper.js +0 -2
- package/styled-components/cjs/utils/datejs.js +1 -0
- package/styled-components/es/components/DatePicker/DatePicker.template-doc.mdx +32 -0
- package/styled-components/es/components/DatePicker/utils/dateHelper.js +0 -2
- package/styled-components/es/utils/datejs.js +1 -0
- package/types/components/DatePicker/utils/dateHelper.d.ts +0 -2
- package/types/components/DatePicker/utils/dateHelper.d.ts.map +1 -1
- package/types/utils/datejs.d.ts +1 -0
- package/types/utils/datejs.d.ts.map +1 -1
|
@@ -3,8 +3,6 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var datejs = require('../../../utils/datejs.js');
|
|
6
|
-
require('dayjs/locale/ru');
|
|
7
|
-
require('dayjs/locale/en');
|
|
8
6
|
|
|
9
7
|
var formatInputValue = function formatInputValue(value, format, lang) {
|
|
10
8
|
if (!value || !lang) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateHelper.js","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"sourcesContent":["import { customDayjs } from '../../../utils/datejs';\
|
|
1
|
+
{"version":3,"file":"dateHelper.js","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"sourcesContent":["import { customDayjs } from '../../../utils/datejs';\n\nexport type Langs = 'ru' | 'en';\n\nexport const formatInputValue = (value?: Date | string, format?: string, lang?: Langs) => {\n if (!value || !lang) {\n return '';\n }\n\n if (format && customDayjs(value, format, true).isValid()) {\n return customDayjs(value, format).locale(lang).format(format);\n }\n\n if (format && String(value).length >= 10 && String(new Date(value)) !== 'Invalid Date') {\n return customDayjs(value).locale(lang).format(format);\n }\n\n return String(value);\n};\n\nexport const formatCalendarValue = (value?: Date | string, format?: string, lang?: Langs) => {\n if (!value || !lang) {\n return undefined;\n }\n\n if (format && customDayjs(value, format, true).isValid()) {\n return customDayjs(value, format, true).locale(lang).toDate();\n }\n\n if (String(new Date(value)) !== 'Invalid Date') {\n return customDayjs(value).locale(lang).toDate();\n }\n\n return undefined;\n};\n\nexport const getDateFromFormat = (value: Date | string, format?: string, lang?: Langs) => {\n if (format && customDayjs(value, format, true).isValid() && lang) {\n return { value: customDayjs(value, format, true).locale(lang).toDate(), isError: false, isSuccess: true };\n }\n\n if (!format && String(new Date(value)) !== 'Invalid Date' && lang) {\n return { value: customDayjs(value).locale(lang).toDate(), isError: false, isSuccess: true };\n }\n\n return { value, isError: true, isSuccess: false };\n};\n\nexport const getDateFormatDelimiter = (format?: string) => {\n if (!format) {\n return '';\n }\n\n const delimiter = format.match(/[^a-zA-Z0-9]/)?.[0];\n\n return delimiter ?? '';\n};\n\nexport const getMaskedDateOnInput = (value?: string, format?: string, delimiter?: string, prevValue?: string) => {\n if (!value) {\n return '';\n }\n\n if (!format || !delimiter) {\n return value;\n }\n\n if (value.length >= format.length) {\n return value.slice(0, format.length);\n }\n\n if (prevValue && value.length < prevValue.length && prevValue?.[value.length] === delimiter) {\n return value.slice(0, -1);\n }\n\n if (format?.[value.length] === delimiter) {\n return value + delimiter;\n }\n\n return value;\n};\n"],"names":["formatInputValue","value","format","lang","customDayjs","isValid","locale","String","length","Date","formatCalendarValue","undefined","toDate","getDateFromFormat","isError","isSuccess","getDateFormatDelimiter","_format$match","delimiter","match","getMaskedDateOnInput","prevValue","slice"],"mappings":"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"}
|
package/cjs/utils/datejs.js
CHANGED
|
@@ -7,6 +7,7 @@ var customParseFormat = require('dayjs/plugin/customParseFormat');
|
|
|
7
7
|
var quarterOfYear = require('dayjs/plugin/quarterOfYear');
|
|
8
8
|
var advancedFormat = require('dayjs/plugin/advancedFormat');
|
|
9
9
|
require('dayjs/locale/ru');
|
|
10
|
+
require('dayjs/locale/en');
|
|
10
11
|
|
|
11
12
|
dayjs.extend(customParseFormat);
|
|
12
13
|
dayjs.extend(quarterOfYear);
|
package/cjs/utils/datejs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"datejs.js","sources":["../../src/utils/datejs.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport quarterOfYear from 'dayjs/plugin/quarterOfYear';\nimport advancedFormat from 'dayjs/plugin/advancedFormat';\n\nimport 'dayjs/locale/ru';\n\ndayjs.extend(customParseFormat);\ndayjs.extend(quarterOfYear);\ndayjs.extend(advancedFormat);\n\nexport const customDayjs = dayjs;\n"],"names":["dayjs","extend","customParseFormat","quarterOfYear","advancedFormat","customDayjs"],"mappings":"
|
|
1
|
+
{"version":3,"file":"datejs.js","sources":["../../src/utils/datejs.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport quarterOfYear from 'dayjs/plugin/quarterOfYear';\nimport advancedFormat from 'dayjs/plugin/advancedFormat';\n\nimport 'dayjs/locale/ru';\nimport 'dayjs/locale/en';\n\ndayjs.extend(customParseFormat);\ndayjs.extend(quarterOfYear);\ndayjs.extend(advancedFormat);\n\nexport const customDayjs = dayjs;\n"],"names":["dayjs","extend","customParseFormat","quarterOfYear","advancedFormat","customDayjs"],"mappings":";;;;;;;;;;;AAQAA,KAAK,CAACC,MAAM,CAACC,iBAAiB,CAAC,CAAA;AAC/BF,KAAK,CAACC,MAAM,CAACE,aAAa,CAAC,CAAA;AAC3BH,KAAK,CAACC,MAAM,CAACG,cAAc,CAAC,CAAA;AAErB,IAAMC,WAAW,GAAGL;;;;"}
|
|
@@ -70,6 +70,38 @@ export function App() {
|
|
|
70
70
|
}
|
|
71
71
|
```
|
|
72
72
|
|
|
73
|
+
### Язык даты
|
|
74
|
+
Язык даты задается с помощью свойства `lang`.
|
|
75
|
+
|
|
76
|
+
| Обозначение | Отображение | Описание |
|
|
77
|
+
|-------------|-------------|---------------------|
|
|
78
|
+
| ru | June | Английский Язык |
|
|
79
|
+
| en | июнь | Русский язык |
|
|
80
|
+
|
|
81
|
+
По умолчанию используется `ru`
|
|
82
|
+
|
|
83
|
+
```tsx live
|
|
84
|
+
import React from 'react';
|
|
85
|
+
import { DatePicker } from '@salutejs/plasma-b2c';
|
|
86
|
+
import { IconDone } from '@salutejs/plasma-icons';
|
|
87
|
+
|
|
88
|
+
export function App() {
|
|
89
|
+
return (
|
|
90
|
+
<div style={{ height: "450px" }}>
|
|
91
|
+
<DatePicker
|
|
92
|
+
label="Лейбл"
|
|
93
|
+
leftHelper="Подсказка к полю"
|
|
94
|
+
placeholder="Введите дату"
|
|
95
|
+
format="DD MMMM YYYY"
|
|
96
|
+
lang="en"
|
|
97
|
+
maskWithFormat
|
|
98
|
+
contentRight={<IconDone size="s" />}
|
|
99
|
+
/>
|
|
100
|
+
</div>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
```
|
|
104
|
+
|
|
73
105
|
### Валидация и индикация успешного ввода даты.
|
|
74
106
|
За индикацию ошибки или успешного ввода отвечают `valueError`, `valueSuccess`.
|
|
75
107
|
В данном примере валидация происходит при нажатии клавиши `Enter` после ввода значений:
|
|
@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.getMaskedDateOnInput = exports.getDateFromFormat = exports.getDateFormatDelimiter = exports.formatInputValue = exports.formatCalendarValue = void 0;
|
|
7
7
|
var _datejs = /*#__PURE__*/require("../../../utils/datejs");
|
|
8
|
-
require("dayjs/locale/ru");
|
|
9
|
-
require("dayjs/locale/en");
|
|
10
8
|
var formatInputValue = exports.formatInputValue = function formatInputValue(value, format, lang) {
|
|
11
9
|
if (!value || !lang) {
|
|
12
10
|
return '';
|
|
@@ -9,6 +9,7 @@ var _customParseFormat = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/requi
|
|
|
9
9
|
var _quarterOfYear = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("dayjs/plugin/quarterOfYear"));
|
|
10
10
|
var _advancedFormat = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("dayjs/plugin/advancedFormat"));
|
|
11
11
|
require("dayjs/locale/ru");
|
|
12
|
+
require("dayjs/locale/en");
|
|
12
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
14
|
_dayjs["default"].extend(_customParseFormat["default"]);
|
|
14
15
|
_dayjs["default"].extend(_quarterOfYear["default"]);
|
|
@@ -70,6 +70,38 @@ export function App() {
|
|
|
70
70
|
}
|
|
71
71
|
```
|
|
72
72
|
|
|
73
|
+
### Язык даты
|
|
74
|
+
Язык даты задается с помощью свойства `lang`.
|
|
75
|
+
|
|
76
|
+
| Обозначение | Отображение | Описание |
|
|
77
|
+
|-------------|-------------|---------------------|
|
|
78
|
+
| ru | June | Английский Язык |
|
|
79
|
+
| en | июнь | Русский язык |
|
|
80
|
+
|
|
81
|
+
По умолчанию используется `ru`
|
|
82
|
+
|
|
83
|
+
```tsx live
|
|
84
|
+
import React from 'react';
|
|
85
|
+
import { DatePicker } from '@salutejs/plasma-b2c';
|
|
86
|
+
import { IconDone } from '@salutejs/plasma-icons';
|
|
87
|
+
|
|
88
|
+
export function App() {
|
|
89
|
+
return (
|
|
90
|
+
<div style={{ height: "450px" }}>
|
|
91
|
+
<DatePicker
|
|
92
|
+
label="Лейбл"
|
|
93
|
+
leftHelper="Подсказка к полю"
|
|
94
|
+
placeholder="Введите дату"
|
|
95
|
+
format="DD MMMM YYYY"
|
|
96
|
+
lang="en"
|
|
97
|
+
maskWithFormat
|
|
98
|
+
contentRight={<IconDone size="s" />}
|
|
99
|
+
/>
|
|
100
|
+
</div>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
```
|
|
104
|
+
|
|
73
105
|
### Валидация и индикация успешного ввода даты.
|
|
74
106
|
За индикацию ошибки или успешного ввода отвечают `valueError`, `valueSuccess`.
|
|
75
107
|
В данном примере валидация происходит при нажатии клавиши `Enter` после ввода значений:
|
|
@@ -3,6 +3,7 @@ import customParseFormat from 'dayjs/plugin/customParseFormat';
|
|
|
3
3
|
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
|
|
4
4
|
import advancedFormat from 'dayjs/plugin/advancedFormat';
|
|
5
5
|
import 'dayjs/locale/ru';
|
|
6
|
+
import 'dayjs/locale/en';
|
|
6
7
|
dayjs.extend(customParseFormat);
|
|
7
8
|
dayjs.extend(quarterOfYear);
|
|
8
9
|
dayjs.extend(advancedFormat);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateHelper.js","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"sourcesContent":["import { customDayjs } from '../../../utils/datejs';\
|
|
1
|
+
{"version":3,"file":"dateHelper.js","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"sourcesContent":["import { customDayjs } from '../../../utils/datejs';\n\nexport type Langs = 'ru' | 'en';\n\nexport const formatInputValue = (value?: Date | string, format?: string, lang?: Langs) => {\n if (!value || !lang) {\n return '';\n }\n\n if (format && customDayjs(value, format, true).isValid()) {\n return customDayjs(value, format).locale(lang).format(format);\n }\n\n if (format && String(value).length >= 10 && String(new Date(value)) !== 'Invalid Date') {\n return customDayjs(value).locale(lang).format(format);\n }\n\n return String(value);\n};\n\nexport const formatCalendarValue = (value?: Date | string, format?: string, lang?: Langs) => {\n if (!value || !lang) {\n return undefined;\n }\n\n if (format && customDayjs(value, format, true).isValid()) {\n return customDayjs(value, format, true).locale(lang).toDate();\n }\n\n if (String(new Date(value)) !== 'Invalid Date') {\n return customDayjs(value).locale(lang).toDate();\n }\n\n return undefined;\n};\n\nexport const getDateFromFormat = (value: Date | string, format?: string, lang?: Langs) => {\n if (format && customDayjs(value, format, true).isValid() && lang) {\n return { value: customDayjs(value, format, true).locale(lang).toDate(), isError: false, isSuccess: true };\n }\n\n if (!format && String(new Date(value)) !== 'Invalid Date' && lang) {\n return { value: customDayjs(value).locale(lang).toDate(), isError: false, isSuccess: true };\n }\n\n return { value, isError: true, isSuccess: false };\n};\n\nexport const getDateFormatDelimiter = (format?: string) => {\n if (!format) {\n return '';\n }\n\n const delimiter = format.match(/[^a-zA-Z0-9]/)?.[0];\n\n return delimiter ?? '';\n};\n\nexport const getMaskedDateOnInput = (value?: string, format?: string, delimiter?: string, prevValue?: string) => {\n if (!value) {\n return '';\n }\n\n if (!format || !delimiter) {\n return value;\n }\n\n if (value.length >= format.length) {\n return value.slice(0, format.length);\n }\n\n if (prevValue && value.length < prevValue.length && prevValue?.[value.length] === delimiter) {\n return value.slice(0, -1);\n }\n\n if (format?.[value.length] === delimiter) {\n return value + delimiter;\n }\n\n return value;\n};\n"],"names":["formatInputValue","value","format","lang","customDayjs","isValid","locale","String","length","Date","formatCalendarValue","undefined","toDate","getDateFromFormat","isError","isSuccess","getDateFormatDelimiter","_format$match","delimiter","match","getMaskedDateOnInput","prevValue","slice"],"mappings":"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"}
|
package/es/utils/datejs.js
CHANGED
|
@@ -3,6 +3,7 @@ import customParseFormat from 'dayjs/plugin/customParseFormat';
|
|
|
3
3
|
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
|
|
4
4
|
import advancedFormat from 'dayjs/plugin/advancedFormat';
|
|
5
5
|
import 'dayjs/locale/ru';
|
|
6
|
+
import 'dayjs/locale/en';
|
|
6
7
|
|
|
7
8
|
dayjs.extend(customParseFormat);
|
|
8
9
|
dayjs.extend(quarterOfYear);
|
package/es/utils/datejs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"datejs.js","sources":["../../src/utils/datejs.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport quarterOfYear from 'dayjs/plugin/quarterOfYear';\nimport advancedFormat from 'dayjs/plugin/advancedFormat';\n\nimport 'dayjs/locale/ru';\n\ndayjs.extend(customParseFormat);\ndayjs.extend(quarterOfYear);\ndayjs.extend(advancedFormat);\n\nexport const customDayjs = dayjs;\n"],"names":["dayjs","extend","customParseFormat","quarterOfYear","advancedFormat","customDayjs"],"mappings":"
|
|
1
|
+
{"version":3,"file":"datejs.js","sources":["../../src/utils/datejs.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport quarterOfYear from 'dayjs/plugin/quarterOfYear';\nimport advancedFormat from 'dayjs/plugin/advancedFormat';\n\nimport 'dayjs/locale/ru';\nimport 'dayjs/locale/en';\n\ndayjs.extend(customParseFormat);\ndayjs.extend(quarterOfYear);\ndayjs.extend(advancedFormat);\n\nexport const customDayjs = dayjs;\n"],"names":["dayjs","extend","customParseFormat","quarterOfYear","advancedFormat","customDayjs"],"mappings":";;;;;;;AAQAA,KAAK,CAACC,MAAM,CAACC,iBAAiB,CAAC,CAAA;AAC/BF,KAAK,CAACC,MAAM,CAACE,aAAa,CAAC,CAAA;AAC3BH,KAAK,CAACC,MAAM,CAACG,cAAc,CAAC,CAAA;AAErB,IAAMC,WAAW,GAAGL;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
|
3
|
-
"version": "0.134.0-canary.1404.
|
|
3
|
+
"version": "0.134.0-canary.1404.10629008038.0",
|
|
4
4
|
"description": "Salute Design System blueprint",
|
|
5
5
|
"main": "cjs/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -118,5 +118,5 @@
|
|
|
118
118
|
"react-popper": "2.3.0",
|
|
119
119
|
"storeon": "3.1.5"
|
|
120
120
|
},
|
|
121
|
-
"gitHead": "
|
|
121
|
+
"gitHead": "ea9ce75b903c62d1bceaa3510450fa30f0e7e833"
|
|
122
122
|
}
|
|
@@ -70,6 +70,38 @@ export function App() {
|
|
|
70
70
|
}
|
|
71
71
|
```
|
|
72
72
|
|
|
73
|
+
### Язык даты
|
|
74
|
+
Язык даты задается с помощью свойства `lang`.
|
|
75
|
+
|
|
76
|
+
| Обозначение | Отображение | Описание |
|
|
77
|
+
|-------------|-------------|---------------------|
|
|
78
|
+
| ru | June | Английский Язык |
|
|
79
|
+
| en | июнь | Русский язык |
|
|
80
|
+
|
|
81
|
+
По умолчанию используется `ru`
|
|
82
|
+
|
|
83
|
+
```tsx live
|
|
84
|
+
import React from 'react';
|
|
85
|
+
import { DatePicker } from '@salutejs/plasma-b2c';
|
|
86
|
+
import { IconDone } from '@salutejs/plasma-icons';
|
|
87
|
+
|
|
88
|
+
export function App() {
|
|
89
|
+
return (
|
|
90
|
+
<div style={{ height: "450px" }}>
|
|
91
|
+
<DatePicker
|
|
92
|
+
label="Лейбл"
|
|
93
|
+
leftHelper="Подсказка к полю"
|
|
94
|
+
placeholder="Введите дату"
|
|
95
|
+
format="DD MMMM YYYY"
|
|
96
|
+
lang="en"
|
|
97
|
+
maskWithFormat
|
|
98
|
+
contentRight={<IconDone size="s" />}
|
|
99
|
+
/>
|
|
100
|
+
</div>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
```
|
|
104
|
+
|
|
73
105
|
### Валидация и индикация успешного ввода даты.
|
|
74
106
|
За индикацию ошибки или успешного ввода отвечают `valueError`, `valueSuccess`.
|
|
75
107
|
В данном примере валидация происходит при нажатии клавиши `Enter` после ввода значений:
|
|
@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.getMaskedDateOnInput = exports.getDateFromFormat = exports.getDateFormatDelimiter = exports.formatInputValue = exports.formatCalendarValue = void 0;
|
|
7
7
|
var _datejs = /*#__PURE__*/require("../../../utils/datejs");
|
|
8
|
-
require("dayjs/locale/ru");
|
|
9
|
-
require("dayjs/locale/en");
|
|
10
8
|
var formatInputValue = exports.formatInputValue = function formatInputValue(value, format, lang) {
|
|
11
9
|
if (!value || !lang) {
|
|
12
10
|
return '';
|
|
@@ -9,6 +9,7 @@ var _customParseFormat = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/requi
|
|
|
9
9
|
var _quarterOfYear = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("dayjs/plugin/quarterOfYear"));
|
|
10
10
|
var _advancedFormat = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("dayjs/plugin/advancedFormat"));
|
|
11
11
|
require("dayjs/locale/ru");
|
|
12
|
+
require("dayjs/locale/en");
|
|
12
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
14
|
_dayjs["default"].extend(_customParseFormat["default"]);
|
|
14
15
|
_dayjs["default"].extend(_quarterOfYear["default"]);
|
|
@@ -70,6 +70,38 @@ export function App() {
|
|
|
70
70
|
}
|
|
71
71
|
```
|
|
72
72
|
|
|
73
|
+
### Язык даты
|
|
74
|
+
Язык даты задается с помощью свойства `lang`.
|
|
75
|
+
|
|
76
|
+
| Обозначение | Отображение | Описание |
|
|
77
|
+
|-------------|-------------|---------------------|
|
|
78
|
+
| ru | June | Английский Язык |
|
|
79
|
+
| en | июнь | Русский язык |
|
|
80
|
+
|
|
81
|
+
По умолчанию используется `ru`
|
|
82
|
+
|
|
83
|
+
```tsx live
|
|
84
|
+
import React from 'react';
|
|
85
|
+
import { DatePicker } from '@salutejs/plasma-b2c';
|
|
86
|
+
import { IconDone } from '@salutejs/plasma-icons';
|
|
87
|
+
|
|
88
|
+
export function App() {
|
|
89
|
+
return (
|
|
90
|
+
<div style={{ height: "450px" }}>
|
|
91
|
+
<DatePicker
|
|
92
|
+
label="Лейбл"
|
|
93
|
+
leftHelper="Подсказка к полю"
|
|
94
|
+
placeholder="Введите дату"
|
|
95
|
+
format="DD MMMM YYYY"
|
|
96
|
+
lang="en"
|
|
97
|
+
maskWithFormat
|
|
98
|
+
contentRight={<IconDone size="s" />}
|
|
99
|
+
/>
|
|
100
|
+
</div>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
```
|
|
104
|
+
|
|
73
105
|
### Валидация и индикация успешного ввода даты.
|
|
74
106
|
За индикацию ошибки или успешного ввода отвечают `valueError`, `valueSuccess`.
|
|
75
107
|
В данном примере валидация происходит при нажатии клавиши `Enter` после ввода значений:
|
|
@@ -3,6 +3,7 @@ import customParseFormat from 'dayjs/plugin/customParseFormat';
|
|
|
3
3
|
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
|
|
4
4
|
import advancedFormat from 'dayjs/plugin/advancedFormat';
|
|
5
5
|
import 'dayjs/locale/ru';
|
|
6
|
+
import 'dayjs/locale/en';
|
|
6
7
|
dayjs.extend(customParseFormat);
|
|
7
8
|
dayjs.extend(quarterOfYear);
|
|
8
9
|
dayjs.extend(advancedFormat);
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import 'dayjs/locale/ru';
|
|
2
|
-
import 'dayjs/locale/en';
|
|
3
1
|
export declare type Langs = 'ru' | 'en';
|
|
4
2
|
export declare const formatInputValue: (value?: string | Date | undefined, format?: string | undefined, lang?: Langs | undefined) => string;
|
|
5
3
|
export declare const formatCalendarValue: (value?: string | Date | undefined, format?: string | undefined, lang?: Langs | undefined) => Date | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dateHelper.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"dateHelper.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/utils/dateHelper.ts"],"names":[],"mappings":"AAEA,oBAAY,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhC,eAAO,MAAM,gBAAgB,sGAc5B,CAAC;AAEF,eAAO,MAAM,mBAAmB,gHAc/B,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,IAAI,GAAG,MAAM;;;;CAUrD,CAAC;AAEF,eAAO,MAAM,sBAAsB,yCAQlC,CAAC;AAEF,eAAO,MAAM,oBAAoB,qIAsBhC,CAAC"}
|
package/types/utils/datejs.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"datejs.d.ts","sourceRoot":"","sources":["../../src/utils/datejs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,iBAAiB,CAAC;AAMzB,eAAO,MAAM,WAAW,cAAQ,CAAC"}
|
|
1
|
+
{"version":3,"file":"datejs.d.ts","sourceRoot":"","sources":["../../src/utils/datejs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,iBAAiB,CAAC;AAMzB,eAAO,MAAM,WAAW,cAAQ,CAAC"}
|