@alfalab/core-components-intl-phone-input 9.2.0 → 9.2.1
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/{component-b3b0e670.d.ts → component-d11f26be.d.ts} +0 -0
- package/{component-b3b0e670.js → component-d11f26be.js} +7 -14
- package/component.d.ts +1 -1
- package/component.js +16 -24
- package/components/flag-icon/component.js +2 -9
- package/components/flag-icon/flagSprite.js +0 -2
- package/components/flag-icon/index.css +3 -3
- package/components/flag-icon/index.js +1 -3
- package/components/index.js +5 -7
- package/components/select/component.js +15 -21
- package/components/select/index.css +6 -6
- package/components/select/index.js +5 -7
- package/components/select-field/component.js +4 -6
- package/components/select-field/index.css +9 -9
- package/components/select-field/index.d.ts +1 -1
- package/components/select-field/index.js +4 -6
- package/cssm/{component-1eeab8e9.d.ts → component-555bdbef.d.ts} +0 -0
- package/cssm/{component-1eeab8e9.js → component-555bdbef.js} +8 -16
- package/cssm/component.d.ts +1 -1
- package/cssm/component.js +17 -26
- package/cssm/components/flag-icon/component.js +1 -9
- package/cssm/components/flag-icon/flagSprite.js +0 -2
- package/cssm/components/flag-icon/index.js +1 -3
- package/cssm/components/index.js +6 -8
- package/cssm/components/select/component.js +16 -23
- package/cssm/components/select/index.js +5 -7
- package/cssm/components/select-field/component.js +5 -7
- package/cssm/components/select-field/index.d.ts +1 -1
- package/cssm/components/select-field/index.js +4 -6
- package/cssm/index.js +10 -12
- package/cssm/{libphonenumber-js.min-903db150.d.ts → libphonenumber-js.min-e2e76e74.d.ts} +0 -0
- package/cssm/{libphonenumber-js.min-903db150.js → libphonenumber-js.min-e2e76e74.js} +0 -0
- package/cssm/useCaretAvoidCountryCode.js +0 -2
- package/cssm/utils/calculateCaretPos.js +0 -2
- package/cssm/utils/format-phone-with-unclearable-country-code.js +2 -4
- package/cssm/utils/preparePasteData.js +7 -9
- package/esm/{component-1fd0e5df.d.ts → component-f7046474.d.ts} +0 -0
- package/esm/{component-1fd0e5df.js → component-f7046474.js} +3 -3
- package/esm/component.d.ts +1 -1
- package/esm/component.js +15 -15
- package/esm/components/flag-icon/component.js +1 -1
- package/esm/components/flag-icon/index.css +3 -3
- package/esm/components/flag-icon/index.js +1 -1
- package/esm/components/index.js +5 -5
- package/esm/components/select/component.js +6 -6
- package/esm/components/select/index.css +6 -6
- package/esm/components/select/index.js +5 -5
- package/esm/components/select-field/component.js +4 -4
- package/esm/components/select-field/index.css +9 -9
- package/esm/components/select-field/index.d.ts +1 -1
- package/esm/components/select-field/index.js +4 -4
- package/esm/index.css +5 -5
- package/esm/index.js +8 -8
- package/esm/{libphonenumber-js.min-ae2df8d5.d.ts → libphonenumber-js.min-2001ae08.d.ts} +0 -0
- package/esm/{libphonenumber-js.min-ae2df8d5.js → libphonenumber-js.min-2001ae08.js} +0 -0
- package/esm/utils/format-phone-with-unclearable-country-code.js +2 -2
- package/esm/utils/preparePasteData.js +7 -7
- package/index.css +5 -5
- package/index.js +8 -10
- package/{libphonenumber-js.min-0775258e.d.ts → libphonenumber-js.min-ebcb18c3.d.ts} +0 -0
- package/{libphonenumber-js.min-0775258e.js → libphonenumber-js.min-ebcb18c3.js} +0 -0
- package/modern/component.d.ts +1 -1
- package/modern/component.js +5 -5
- package/modern/components/flag-icon/component.js +1 -1
- package/modern/components/flag-icon/index.css +3 -3
- package/modern/components/flag-icon/index.js +1 -1
- package/modern/components/index.js +5 -5
- package/modern/components/select/component.js +6 -6
- package/modern/components/select/index.css +6 -6
- package/modern/components/select/index.js +6 -6
- package/modern/components/select-field/component.js +4 -4
- package/modern/components/select-field/index.css +9 -9
- package/modern/components/select-field/index.js +4 -4
- package/modern/index.css +5 -5
- package/modern/index.js +4 -4
- package/modern/{libphonenumber-js.min-ae2df8d5.d.ts → libphonenumber-js.min-2001ae08.d.ts} +0 -0
- package/modern/{libphonenumber-js.min-ae2df8d5.js → libphonenumber-js.min-2001ae08.js} +0 -0
- package/package.json +3 -3
- package/useCaretAvoidCountryCode.js +0 -2
- package/utils/calculateCaretPos.js +0 -2
- package/utils/format-phone-with-unclearable-country-code.js +2 -4
- package/utils/preparePasteData.js +7 -9
package/esm/component.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign } from './component-
|
|
1
|
+
import { _ as __rest, a as __assign } from './component-f7046474.js';
|
|
2
2
|
import React, { forwardRef, useState, useRef, useEffect } from 'react';
|
|
3
3
|
import cn from 'classnames';
|
|
4
4
|
import { InputAutocomplete } from '@alfalab/core-components-input-autocomplete/esm';
|
|
@@ -9,13 +9,13 @@ import { formatPhoneWithUnclearableCountryCode } from './utils/format-phone-with
|
|
|
9
9
|
import { preparePasteData } from './utils/preparePasteData.js';
|
|
10
10
|
import 'react-merge-refs';
|
|
11
11
|
import '@alfalab/hooks';
|
|
12
|
-
import './components/flag-icon/flagSprite.js';
|
|
13
12
|
import { FlagIcon } from './components/flag-icon/component.js';
|
|
14
|
-
import '@alfalab/core-components-select/esm';
|
|
15
13
|
import { CountriesSelect } from './components/select/component.js';
|
|
16
14
|
import { useCaretAvoidCountryCode } from './useCaretAvoidCountryCode.js';
|
|
15
|
+
import './components/flag-icon/flagSprite.js';
|
|
16
|
+
import '@alfalab/core-components-select/esm';
|
|
17
17
|
|
|
18
|
-
var styles = {"addons":"intl-phone-
|
|
18
|
+
var styles = {"addons":"intl-phone-input__addons_1947q","l":"intl-phone-input__l_1947q","xl":"intl-phone-input__xl_1947q","flagIconWrapper":"intl-phone-input__flagIconWrapper_1947q","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_1947q"};
|
|
19
19
|
require('./index.css')
|
|
20
20
|
|
|
21
21
|
var countriesHash = getCountriesHash();
|
|
@@ -45,16 +45,16 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
45
45
|
return part;
|
|
46
46
|
}
|
|
47
47
|
if (index > 2) {
|
|
48
|
-
return acc
|
|
48
|
+
return "".concat(acc, "-").concat(part);
|
|
49
49
|
}
|
|
50
|
-
return acc
|
|
50
|
+
return "".concat(acc, " ").concat(part);
|
|
51
51
|
}, '');
|
|
52
52
|
}
|
|
53
53
|
return newValue;
|
|
54
54
|
};
|
|
55
55
|
var setCountryByIso2 = function (iso2) {
|
|
56
56
|
var country = countriesHash[iso2];
|
|
57
|
-
var inputValue = "+"
|
|
57
|
+
var inputValue = "+".concat(country.dialCode);
|
|
58
58
|
onChange(inputValue);
|
|
59
59
|
setCountryIso2(country.iso2);
|
|
60
60
|
return country;
|
|
@@ -73,7 +73,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
var targetCountry = countries.find(function (country) {
|
|
76
|
-
if (new RegExp("^\\+"
|
|
76
|
+
if (new RegExp("^\\+".concat(country.dialCode)).test(inputValue)) {
|
|
77
77
|
// Сначала проверяем, если приоритет не указан
|
|
78
78
|
if (country.priority === undefined) {
|
|
79
79
|
return true;
|
|
@@ -115,7 +115,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
115
115
|
var addCountryCode = function (inputValue) {
|
|
116
116
|
if (clearableCountryCode || !countryIso2) {
|
|
117
117
|
return inputValue.length === 1 && inputValue !== '+'
|
|
118
|
-
? "+"
|
|
118
|
+
? "+".concat(inputValue)
|
|
119
119
|
: inputValue;
|
|
120
120
|
}
|
|
121
121
|
var country = countriesHash[countryIso2];
|
|
@@ -129,7 +129,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
129
129
|
var selected = _a.selected;
|
|
130
130
|
if (selected) {
|
|
131
131
|
var country_1 = setCountryByIso2(selected.value);
|
|
132
|
-
var inputValue = "+"
|
|
132
|
+
var inputValue = "+".concat(country_1.dialCode);
|
|
133
133
|
if (inputRef.current) {
|
|
134
134
|
inputRef.current.focus();
|
|
135
135
|
inputRef.current.setSelectionRange(inputValue.length, inputValue.length);
|
|
@@ -145,7 +145,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
145
145
|
onChange(formatPhone(selected.key));
|
|
146
146
|
};
|
|
147
147
|
var country = countryIso2 && countriesHash[countryIso2];
|
|
148
|
-
var countryCodeLength = country ?
|
|
148
|
+
var countryCodeLength = country ? "+".concat(country.dialCode).length : 0;
|
|
149
149
|
var isEmptyValue = clearableCountryCode
|
|
150
150
|
? value === '' || value === '+'
|
|
151
151
|
: value.length <= countryCodeLength;
|
|
@@ -174,7 +174,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
174
174
|
newValue = '+7';
|
|
175
175
|
}
|
|
176
176
|
else if (newValueDecimal.length === 1) {
|
|
177
|
-
newValue = "+7"
|
|
177
|
+
newValue = "+7".concat(newValueDecimal);
|
|
178
178
|
}
|
|
179
179
|
}
|
|
180
180
|
newValue = formatPhone(addCountryCode(newValue));
|
|
@@ -183,7 +183,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
183
183
|
phonePartWithoutMask = phonePartWithoutMask.slice(0, -1);
|
|
184
184
|
}
|
|
185
185
|
if (newValue && newValue[0] !== '+') {
|
|
186
|
-
newValue = "+"
|
|
186
|
+
newValue = "+".concat(newValue);
|
|
187
187
|
}
|
|
188
188
|
setCaretPos(calculateCaretPos(phonePartWithoutMask, newValue));
|
|
189
189
|
setCountryByDialCodeWithLengthCheck(newValue);
|
|
@@ -267,7 +267,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
267
267
|
if (phoneLibUtils.current)
|
|
268
268
|
return;
|
|
269
269
|
import(
|
|
270
|
-
/* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-
|
|
270
|
+
/* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-2001ae08.js')
|
|
271
271
|
.then(function (utils) {
|
|
272
272
|
phoneLibUtils.current = utils.AsYouType;
|
|
273
273
|
if (canBeEmptyCountry) {
|
|
@@ -277,7 +277,7 @@ var IntlPhoneInput = forwardRef(function (_a, ref) {
|
|
|
277
277
|
setCountryByDialCode(value);
|
|
278
278
|
}
|
|
279
279
|
})
|
|
280
|
-
.catch(function (error) { return "An error occurred while loading libphonenumber-js:\n"
|
|
280
|
+
.catch(function (error) { return "An error occurred while loading libphonenumber-js:\n".concat(error); });
|
|
281
281
|
/* eslint-disable-next-line react-hooks/exhaustive-deps */
|
|
282
282
|
}, [value]);
|
|
283
283
|
useEffect(function () {
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import { flagSprite } from './flagSprite.js';
|
|
4
4
|
|
|
5
|
-
var styles = {"flagIcon":"intl-phone-
|
|
5
|
+
var styles = {"flagIcon":"intl-phone-input__flagIcon_1yrjc","flagPlaceholder":"intl-phone-input__flagPlaceholder_1yrjc"};
|
|
6
6
|
require('./index.css')
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: jhuve */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
|
|
4
4
|
}
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
:root {
|
|
17
17
|
--border-radius-xs: 2px;
|
|
18
18
|
}
|
|
19
|
-
.intl-phone-
|
|
19
|
+
.intl-phone-input__flagIcon_1yrjc {
|
|
20
20
|
max-width: 24px;
|
|
21
21
|
max-height: 24px;
|
|
22
22
|
}
|
|
23
|
-
.intl-phone-
|
|
23
|
+
.intl-phone-input__flagPlaceholder_1yrjc {
|
|
24
24
|
width: 24px;
|
|
25
25
|
height: 16px;
|
|
26
26
|
max-height: 16px;
|
package/esm/components/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-
|
|
1
|
+
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../component-f7046474.js';
|
|
2
|
+
export { FlagIcon } from './flag-icon/component.js';
|
|
3
|
+
export { CountriesSelect } from './select/component.js';
|
|
2
4
|
import 'react';
|
|
3
|
-
import 'classnames';
|
|
4
|
-
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
5
5
|
import 'react-merge-refs';
|
|
6
|
+
import 'classnames';
|
|
6
7
|
import '@alfalab/hooks';
|
|
8
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
7
9
|
import './flag-icon/flagSprite.js';
|
|
8
|
-
export { FlagIcon } from './flag-icon/component.js';
|
|
9
10
|
import '@alfalab/core-components-select/esm';
|
|
10
|
-
export { CountriesSelect } from './select/component.js';
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-
|
|
1
|
+
import { a as __assign, E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
|
|
2
2
|
import React, { useMemo, useCallback } from 'react';
|
|
3
|
-
import '
|
|
4
|
-
import '
|
|
3
|
+
import { VirtualOptionsList, Select } from '@alfalab/core-components-select/esm';
|
|
4
|
+
import { FlagIcon } from '../flag-icon/component.js';
|
|
5
5
|
import 'react-merge-refs';
|
|
6
|
+
import 'classnames';
|
|
6
7
|
import '@alfalab/hooks';
|
|
8
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
7
9
|
import '../flag-icon/flagSprite.js';
|
|
8
|
-
import { FlagIcon } from '../flag-icon/component.js';
|
|
9
|
-
import { VirtualOptionsList, Select } from '@alfalab/core-components-select/esm';
|
|
10
10
|
|
|
11
|
-
var styles = {"component":"intl-phone-
|
|
11
|
+
var styles = {"component":"intl-phone-input__component_fjoop","option":"intl-phone-input__option_fjoop","flag":"intl-phone-input__flag_fjoop","countryName":"intl-phone-input__countryName_fjoop","dialCode":"intl-phone-input__dialCode_fjoop"};
|
|
12
12
|
require('./index.css')
|
|
13
13
|
|
|
14
14
|
var CountriesSelect = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: y6xme */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-text-secondary: rgba(11, 31, 53, 0.7);
|
|
4
4
|
}
|
|
@@ -16,23 +16,23 @@
|
|
|
16
16
|
:root {
|
|
17
17
|
--text-secondary-color: var(--color-light-text-secondary);
|
|
18
18
|
}
|
|
19
|
-
.intl-phone-
|
|
19
|
+
.intl-phone-input__component_fjoop {
|
|
20
20
|
position: static;
|
|
21
21
|
display: flex;
|
|
22
22
|
min-width: initial;
|
|
23
23
|
height: 100%;
|
|
24
24
|
}
|
|
25
|
-
.intl-phone-
|
|
25
|
+
.intl-phone-input__option_fjoop {
|
|
26
26
|
display: flex;
|
|
27
27
|
align-items: flex-start;
|
|
28
28
|
}
|
|
29
|
-
.intl-phone-
|
|
29
|
+
.intl-phone-input__flag_fjoop {
|
|
30
30
|
flex-shrink: 0;
|
|
31
31
|
margin-right: var(--gap-xs);
|
|
32
32
|
}
|
|
33
|
-
.intl-phone-
|
|
33
|
+
.intl-phone-input__countryName_fjoop {
|
|
34
34
|
margin-right: var(--gap-xs);
|
|
35
35
|
}
|
|
36
|
-
.intl-phone-
|
|
36
|
+
.intl-phone-input__dialCode_fjoop {
|
|
37
37
|
color: var(--text-secondary-color);
|
|
38
38
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
export { CountriesSelect } from './component.js';
|
|
2
|
+
import '../../component-f7046474.js';
|
|
2
3
|
import 'react';
|
|
3
|
-
import 'classnames';
|
|
4
|
-
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
5
4
|
import 'react-merge-refs';
|
|
5
|
+
import 'classnames';
|
|
6
6
|
import '@alfalab/hooks';
|
|
7
|
-
import '
|
|
7
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
8
8
|
import '../flag-icon/component.js';
|
|
9
|
+
import '../flag-icon/flagSprite.js';
|
|
9
10
|
import '@alfalab/core-components-select/esm';
|
|
10
|
-
export { CountriesSelect } from './component.js';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-
|
|
1
|
+
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
|
|
2
2
|
import 'react';
|
|
3
|
-
import 'classnames';
|
|
4
|
-
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
5
3
|
import 'react-merge-refs';
|
|
4
|
+
import 'classnames';
|
|
6
5
|
import '@alfalab/hooks';
|
|
7
|
-
import '
|
|
6
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
8
7
|
import '../flag-icon/component.js';
|
|
8
|
+
import '../flag-icon/flagSprite.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: xob7f */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-border-link: #007aff;
|
|
4
4
|
--color-light-graphic-secondary: #6d7986;
|
|
@@ -20,13 +20,13 @@
|
|
|
20
20
|
--focus-color: var(--color-light-border-link);
|
|
21
21
|
--disabled-cursor: not-allowed;
|
|
22
22
|
}
|
|
23
|
-
.intl-phone-
|
|
23
|
+
.intl-phone-input__component_10mti {
|
|
24
24
|
height: 100%;
|
|
25
25
|
cursor: pointer;
|
|
26
26
|
outline: none;
|
|
27
27
|
position: relative;
|
|
28
28
|
}
|
|
29
|
-
.intl-phone-
|
|
29
|
+
.intl-phone-input__flagIconContainer_10mti {
|
|
30
30
|
display: flex;
|
|
31
31
|
justify-content: center;
|
|
32
32
|
align-items: center;
|
|
@@ -34,13 +34,13 @@
|
|
|
34
34
|
height: 24px;
|
|
35
35
|
margin-right: var(--gap-2xs);
|
|
36
36
|
}
|
|
37
|
-
.intl-phone-
|
|
37
|
+
.intl-phone-input__emptyCountryIcon_10mti {
|
|
38
38
|
color: var(--color-light-graphic-secondary);
|
|
39
39
|
}
|
|
40
|
-
.intl-phone-
|
|
40
|
+
.intl-phone-input__disabled_10mti {
|
|
41
41
|
cursor: var(--disabled-cursor);
|
|
42
42
|
}
|
|
43
|
-
.intl-phone-
|
|
43
|
+
.intl-phone-input__inner_10mti {
|
|
44
44
|
position: relative;
|
|
45
45
|
display: flex;
|
|
46
46
|
align-items: center;
|
|
@@ -48,11 +48,11 @@
|
|
|
48
48
|
padding-left: var(--gap-s);
|
|
49
49
|
outline: none;
|
|
50
50
|
}
|
|
51
|
-
.intl-phone-
|
|
52
|
-
.intl-phone-
|
|
51
|
+
.intl-phone-input__l_10mti .intl-phone-input__inner_10mti,
|
|
52
|
+
.intl-phone-input__xl_10mti .intl-phone-input__inner_10mti {
|
|
53
53
|
padding-left: var(--gap-m);
|
|
54
54
|
}
|
|
55
|
-
.intl-phone-
|
|
55
|
+
.intl-phone-input__focusVisible_10mti {
|
|
56
56
|
outline: 2px solid var(--focus-color);
|
|
57
57
|
outline-offset: 2px;
|
|
58
58
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from "../../component-
|
|
1
|
+
export * from "../../component-f7046474";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-
|
|
1
|
+
export { E as EMPTY_COUNTRY_SELECT_FIELD, S as SelectField } from '../../component-f7046474.js';
|
|
2
2
|
import 'react';
|
|
3
|
-
import 'classnames';
|
|
4
|
-
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
5
3
|
import 'react-merge-refs';
|
|
4
|
+
import 'classnames';
|
|
6
5
|
import '@alfalab/hooks';
|
|
7
|
-
import '
|
|
6
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
8
7
|
import '../flag-icon/component.js';
|
|
8
|
+
import '../flag-icon/flagSprite.js';
|
package/esm/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: zzvdr */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-secondary: #6d7986;
|
|
4
4
|
}
|
|
@@ -13,13 +13,13 @@
|
|
|
13
13
|
:root {
|
|
14
14
|
--gap-s: 12px;
|
|
15
15
|
}
|
|
16
|
-
.intl-phone-
|
|
16
|
+
.intl-phone-input__addons_1947q {
|
|
17
17
|
padding-left: 0;
|
|
18
18
|
}
|
|
19
|
-
.intl-phone-
|
|
19
|
+
.intl-phone-input__l_1947q .intl-phone-input__addons_1947q, .intl-phone-input__xl_1947q .intl-phone-input__addons_1947q {
|
|
20
20
|
padding-left: 0;
|
|
21
21
|
}
|
|
22
|
-
.intl-phone-
|
|
22
|
+
.intl-phone-input__flagIconWrapper_1947q {
|
|
23
23
|
display: flex;
|
|
24
24
|
justify-content: center;
|
|
25
25
|
align-items: center;
|
|
@@ -27,6 +27,6 @@
|
|
|
27
27
|
height: 24px;
|
|
28
28
|
margin-left: var(--gap-s);
|
|
29
29
|
}
|
|
30
|
-
.intl-phone-
|
|
30
|
+
.intl-phone-input__emptyCountryIcon_1947q {
|
|
31
31
|
color: var(--color-light-graphic-secondary);
|
|
32
32
|
}
|
package/esm/index.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
|
|
1
|
+
export { IntlPhoneInput } from './component.js';
|
|
2
|
+
import './component-f7046474.js';
|
|
2
3
|
import 'react';
|
|
4
|
+
import 'react-merge-refs';
|
|
3
5
|
import 'classnames';
|
|
4
|
-
import '@alfalab/
|
|
6
|
+
import '@alfalab/hooks';
|
|
5
7
|
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
8
|
+
import './components/flag-icon/component.js';
|
|
9
|
+
import './components/flag-icon/flagSprite.js';
|
|
10
|
+
import '@alfalab/core-components-input-autocomplete/esm';
|
|
6
11
|
import '@alfalab/utils';
|
|
7
12
|
import './utils/calculateCaretPos.js';
|
|
8
13
|
import './utils/format-phone-with-unclearable-country-code.js';
|
|
9
14
|
import './utils/preparePasteData.js';
|
|
10
|
-
import 'react-merge-refs';
|
|
11
|
-
import '@alfalab/hooks';
|
|
12
|
-
import './components/flag-icon/flagSprite.js';
|
|
13
|
-
import './components/flag-icon/component.js';
|
|
14
|
-
import '@alfalab/core-components-select/esm';
|
|
15
15
|
import './components/select/component.js';
|
|
16
|
+
import '@alfalab/core-components-select/esm';
|
|
16
17
|
import './useCaretAvoidCountryCode.js';
|
|
17
|
-
export { IntlPhoneInput } from './component.js';
|
|
File without changes
|
|
File without changes
|
|
@@ -4,7 +4,7 @@ var RUSSIAN_NATIONAL_DIAL_CODE = '8';
|
|
|
4
4
|
* Форматирует телефон с неудаляемым кодом страны
|
|
5
5
|
*/
|
|
6
6
|
var formatPhoneWithUnclearableCountryCode = function (phone, country) {
|
|
7
|
-
var countryPrefix = "+"
|
|
7
|
+
var countryPrefix = "+".concat(country.dialCode);
|
|
8
8
|
if (phone.startsWith(countryPrefix)) {
|
|
9
9
|
return phone;
|
|
10
10
|
}
|
|
@@ -14,7 +14,7 @@ var formatPhoneWithUnclearableCountryCode = function (phone, country) {
|
|
|
14
14
|
if (countryPrefix.startsWith(phone) || !phone) {
|
|
15
15
|
return countryPrefix;
|
|
16
16
|
}
|
|
17
|
-
return countryPrefix
|
|
17
|
+
return "".concat(countryPrefix, " ").concat(phone);
|
|
18
18
|
};
|
|
19
19
|
|
|
20
20
|
export { formatPhoneWithUnclearableCountryCode };
|
|
@@ -13,7 +13,7 @@ function preparePasteData(phoneValue, phoneFromBuffer, selectionStart, selection
|
|
|
13
13
|
var resultNumber = '';
|
|
14
14
|
// вставка в поле c "+"
|
|
15
15
|
if (phoneValue === '+') {
|
|
16
|
-
resultNumber = "+"
|
|
16
|
+
resultNumber = "+".concat(cutNumber);
|
|
17
17
|
// вставка в поле, в которое введена часть номера
|
|
18
18
|
}
|
|
19
19
|
else if (phoneValue) {
|
|
@@ -21,16 +21,16 @@ function preparePasteData(phoneValue, phoneFromBuffer, selectionStart, selection
|
|
|
21
21
|
var endText = phoneValue.substring(selectionEnd || 0);
|
|
22
22
|
var isSelectPlus = selectionStart === 0 && selectionEnd !== 0;
|
|
23
23
|
if (selectionStart === 0 && selectionEnd === 0 && !isTextHavePlus) {
|
|
24
|
-
resultNumber =
|
|
24
|
+
resultNumber = "+".concat(cutNumber).concat(phoneValue.substring(1)).replace(/[^+\d]/g, '');
|
|
25
25
|
}
|
|
26
26
|
else if (!isTextHavePlus && !isSelectPlus) {
|
|
27
|
-
resultNumber =
|
|
27
|
+
resultNumber = "".concat(startText).concat(cutNumber).concat(endText).replace(/[^+\d]/g, '');
|
|
28
28
|
}
|
|
29
29
|
else if (isTextHavePlus && isSelectPlus) {
|
|
30
|
-
resultNumber =
|
|
30
|
+
resultNumber = "".concat(cutNumberWithPlus).concat(endText).replace(/[^+\d]/g, '');
|
|
31
31
|
}
|
|
32
32
|
else if (!isTextHavePlus && isSelectPlus) {
|
|
33
|
-
resultNumber =
|
|
33
|
+
resultNumber = "+".concat(cutNumber).concat(endText).replace(/[^+\d]/g, '');
|
|
34
34
|
}
|
|
35
35
|
// вставка в пустое поле
|
|
36
36
|
}
|
|
@@ -41,11 +41,11 @@ function preparePasteData(phoneValue, phoneFromBuffer, selectionStart, selection
|
|
|
41
41
|
// вставка номера начинающегося с "7" или "8" в пустое поле
|
|
42
42
|
}
|
|
43
43
|
else if (isRuNumberInBuffer) {
|
|
44
|
-
resultNumber = "+7"
|
|
44
|
+
resultNumber = "+7".concat(cutNumber.substring(1));
|
|
45
45
|
// вставка номера начинающегося НЕ с "7", "8", "+" в пустое поле
|
|
46
46
|
}
|
|
47
47
|
else {
|
|
48
|
-
resultNumber = "+7"
|
|
48
|
+
resultNumber = "+7".concat(cutNumber);
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
return resultNumber;
|
package/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: zzvdr */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-secondary: #6d7986;
|
|
4
4
|
}
|
|
@@ -13,13 +13,13 @@
|
|
|
13
13
|
:root {
|
|
14
14
|
--gap-s: 12px;
|
|
15
15
|
}
|
|
16
|
-
.intl-phone-
|
|
16
|
+
.intl-phone-input__addons_1947q {
|
|
17
17
|
padding-left: 0;
|
|
18
18
|
}
|
|
19
|
-
.intl-phone-
|
|
19
|
+
.intl-phone-input__l_1947q .intl-phone-input__addons_1947q, .intl-phone-input__xl_1947q .intl-phone-input__addons_1947q {
|
|
20
20
|
padding-left: 0;
|
|
21
21
|
}
|
|
22
|
-
.intl-phone-
|
|
22
|
+
.intl-phone-input__flagIconWrapper_1947q {
|
|
23
23
|
display: flex;
|
|
24
24
|
justify-content: center;
|
|
25
25
|
align-items: center;
|
|
@@ -27,6 +27,6 @@
|
|
|
27
27
|
height: 24px;
|
|
28
28
|
margin-left: var(--gap-s);
|
|
29
29
|
}
|
|
30
|
-
.intl-phone-
|
|
30
|
+
.intl-phone-input__emptyCountryIcon_1947q {
|
|
31
31
|
color: var(--color-light-graphic-secondary);
|
|
32
32
|
}
|
package/index.js
CHANGED
|
@@ -1,24 +1,22 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('./component-b3b0e670.js');
|
|
3
|
+
var component = require('./component.js');
|
|
4
|
+
require('./component-d11f26be.js');
|
|
6
5
|
require('react');
|
|
6
|
+
require('react-merge-refs');
|
|
7
7
|
require('classnames');
|
|
8
|
-
require('@alfalab/
|
|
8
|
+
require('@alfalab/hooks');
|
|
9
9
|
require('@alfalab/icons-glyph/WorldMagnifierMIcon');
|
|
10
|
+
require('./components/flag-icon/component.js');
|
|
11
|
+
require('./components/flag-icon/flagSprite.js');
|
|
12
|
+
require('@alfalab/core-components-input-autocomplete');
|
|
10
13
|
require('@alfalab/utils');
|
|
11
14
|
require('./utils/calculateCaretPos.js');
|
|
12
15
|
require('./utils/format-phone-with-unclearable-country-code.js');
|
|
13
16
|
require('./utils/preparePasteData.js');
|
|
14
|
-
require('react-merge-refs');
|
|
15
|
-
require('@alfalab/hooks');
|
|
16
|
-
require('./components/flag-icon/flagSprite.js');
|
|
17
|
-
require('./components/flag-icon/component.js');
|
|
18
|
-
require('@alfalab/core-components-select');
|
|
19
17
|
require('./components/select/component.js');
|
|
18
|
+
require('@alfalab/core-components-select');
|
|
20
19
|
require('./useCaretAvoidCountryCode.js');
|
|
21
|
-
var component = require('./component.js');
|
|
22
20
|
|
|
23
21
|
|
|
24
22
|
|
|
File without changes
|
|
File without changes
|
package/modern/component.d.ts
CHANGED
|
@@ -63,7 +63,7 @@ declare const IntlPhoneInput: React.ForwardRefExoticComponent<Partial<Omit<Input
|
|
|
63
63
|
/**
|
|
64
64
|
* Обработчик события изменения страны
|
|
65
65
|
*/
|
|
66
|
-
onCountryChange?: ((countryCode?: CountryCode
|
|
66
|
+
onCountryChange?: ((countryCode?: CountryCode) => void) | undefined;
|
|
67
67
|
/**
|
|
68
68
|
* Список стран
|
|
69
69
|
*/
|
package/modern/component.js
CHANGED
|
@@ -8,14 +8,14 @@ import { formatPhoneWithUnclearableCountryCode } from './utils/format-phone-with
|
|
|
8
8
|
import { preparePasteData } from './utils/preparePasteData.js';
|
|
9
9
|
import 'react-merge-refs';
|
|
10
10
|
import '@alfalab/hooks';
|
|
11
|
-
import './components/flag-icon/flagSprite.js';
|
|
12
11
|
import { FlagIcon } from './components/flag-icon/component.js';
|
|
13
|
-
import './components/select-field/component.js';
|
|
14
|
-
import '@alfalab/core-components-select/modern';
|
|
15
12
|
import { CountriesSelect } from './components/select/component.js';
|
|
16
13
|
import { useCaretAvoidCountryCode } from './useCaretAvoidCountryCode.js';
|
|
14
|
+
import './components/flag-icon/flagSprite.js';
|
|
15
|
+
import '@alfalab/core-components-select/modern';
|
|
16
|
+
import './components/select-field/component.js';
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
const styles = {"addons":"intl-phone-input__addons_1947q","l":"intl-phone-input__l_1947q","xl":"intl-phone-input__xl_1947q","flagIconWrapper":"intl-phone-input__flagIconWrapper_1947q","emptyCountryIcon":"intl-phone-input__emptyCountryIcon_1947q"};
|
|
19
19
|
require('./index.css')
|
|
20
20
|
|
|
21
21
|
const countriesHash = getCountriesHash();
|
|
@@ -263,7 +263,7 @@ const IntlPhoneInput = forwardRef(({ disabled = false, readOnly = false, hideCou
|
|
|
263
263
|
if (phoneLibUtils.current)
|
|
264
264
|
return;
|
|
265
265
|
import(
|
|
266
|
-
/* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-
|
|
266
|
+
/* webpackChunkName: "libphonenumber" */ './libphonenumber-js.min-2001ae08.js')
|
|
267
267
|
.then((utils) => {
|
|
268
268
|
phoneLibUtils.current = utils.AsYouType;
|
|
269
269
|
if (canBeEmptyCountry) {
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import { flagSprite } from './flagSprite.js';
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
const styles = {"flagIcon":"intl-phone-input__flagIcon_1yrjc","flagPlaceholder":"intl-phone-input__flagPlaceholder_1yrjc"};
|
|
6
6
|
require('./index.css')
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: jhuve */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
|
|
4
4
|
}
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
:root {
|
|
17
17
|
--border-radius-xs: 2px;
|
|
18
18
|
}
|
|
19
|
-
.intl-phone-
|
|
19
|
+
.intl-phone-input__flagIcon_1yrjc {
|
|
20
20
|
max-width: 24px;
|
|
21
21
|
max-height: 24px;
|
|
22
22
|
}
|
|
23
|
-
.intl-phone-
|
|
23
|
+
.intl-phone-input__flagPlaceholder_1yrjc {
|
|
24
24
|
width: 24px;
|
|
25
25
|
height: 16px;
|
|
26
26
|
max-height: 16px;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
+
export { EMPTY_COUNTRY_SELECT_FIELD, SelectField } from './select-field/component.js';
|
|
2
|
+
export { FlagIcon } from './flag-icon/component.js';
|
|
3
|
+
export { CountriesSelect } from './select/component.js';
|
|
1
4
|
import 'react';
|
|
2
|
-
import 'classnames';
|
|
3
|
-
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
4
5
|
import 'react-merge-refs';
|
|
6
|
+
import 'classnames';
|
|
5
7
|
import '@alfalab/hooks';
|
|
8
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
6
9
|
import './flag-icon/flagSprite.js';
|
|
7
|
-
export { FlagIcon } from './flag-icon/component.js';
|
|
8
|
-
export { EMPTY_COUNTRY_SELECT_FIELD, SelectField } from './select-field/component.js';
|
|
9
10
|
import '@alfalab/core-components-select/modern';
|
|
10
|
-
export { CountriesSelect } from './select/component.js';
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React, { useMemo, useCallback } from 'react';
|
|
2
|
+
import { VirtualOptionsList, Select } from '@alfalab/core-components-select/modern';
|
|
3
|
+
import { FlagIcon } from '../flag-icon/component.js';
|
|
4
|
+
import { EMPTY_COUNTRY_SELECT_FIELD, SelectField } from '../select-field/component.js';
|
|
2
5
|
import 'classnames';
|
|
3
|
-
import '
|
|
6
|
+
import '../flag-icon/flagSprite.js';
|
|
4
7
|
import 'react-merge-refs';
|
|
5
8
|
import '@alfalab/hooks';
|
|
6
|
-
import '
|
|
7
|
-
import { FlagIcon } from '../flag-icon/component.js';
|
|
8
|
-
import { EMPTY_COUNTRY_SELECT_FIELD, SelectField } from '../select-field/component.js';
|
|
9
|
-
import { VirtualOptionsList, Select } from '@alfalab/core-components-select/modern';
|
|
9
|
+
import '@alfalab/icons-glyph/WorldMagnifierMIcon';
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
const styles = {"component":"intl-phone-input__component_fjoop","option":"intl-phone-input__option_fjoop","flag":"intl-phone-input__flag_fjoop","countryName":"intl-phone-input__countryName_fjoop","dialCode":"intl-phone-input__dialCode_fjoop"};
|
|
12
12
|
require('./index.css')
|
|
13
13
|
|
|
14
14
|
/* eslint-disable jsx-a11y/no-static-element-interactions */
|