@mvf/external-components 3.31.1-dev.4 → 3.31.1-dev.6
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/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.js +28 -7
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.test.js +147 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.test.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/{ErrorDisplay.d.ts → __helpers__/components/display/ErrorDisplay.d.ts} +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/display/ErrorDisplay.js +17 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/display/ErrorDisplay.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.js → __helpers__/components/forms/PhoneInput.js} +2 -5
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/forms/PhoneInput.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.test.js → __helpers__/components/forms/PhoneInput.test.js} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/forms/PhoneInput.test.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.d.ts → __helpers__/components/ui/CountryDropdown.d.ts} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.js → __helpers__/components/ui/CountryDropdown.js} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryDropdown.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.test.js → __helpers__/components/ui/CountryDropdown.test.js} +2 -2
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryDropdown.test.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.d.ts → __helpers__/components/ui/CountryModal.d.ts} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.js → __helpers__/components/ui/CountryModal.js} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryModal.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.test.js → __helpers__/components/ui/CountryModal.test.js} +18 -18
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryModal.test.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountrySelector.d.ts → __helpers__/components/ui/CountrySelector.d.ts} +2 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/{CountrySelector.js → __helpers__/components/ui/CountrySelector.js} +8 -5
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountrySelector.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/{FlagIcon.d.ts → __helpers__/components/ui/FlagIcon.d.ts} +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/FlagIcon.js.map +1 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.d.ts +2 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js +8 -6
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.d.ts +7 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.js +73 -25
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.d.ts +5 -2
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.js +28 -5
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.d.ts +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.js +14 -4
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/defaultProps.js +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/defaultProps.js.map +1 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/index.d.ts +5 -5
- package/Components/Molecules/PhoneNumberTextFieldCustom/index.js +5 -5
- package/Components/Molecules/PhoneNumberTextFieldCustom/index.js.map +1 -1
- package/package.json +1 -2
- package/Components/Molecules/PhoneNumberTextField/CountryDropdown.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextField/CountryDropdown.js +0 -146
- package/Components/Molecules/PhoneNumberTextField/CountryDropdown.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/CountryDropdown.test.js +0 -49
- package/Components/Molecules/PhoneNumberTextField/CountryDropdown.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/CountryModal.d.ts +0 -11
- package/Components/Molecules/PhoneNumberTextField/CountryModal.js +0 -180
- package/Components/Molecules/PhoneNumberTextField/CountryModal.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/CountryModal.test.js +0 -54
- package/Components/Molecules/PhoneNumberTextField/CountryModal.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.d.ts +0 -1
- package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.js +0 -215
- package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/countryData.d.ts +0 -13
- package/Components/Molecules/PhoneNumberTextField/countryData.js +0 -743
- package/Components/Molecules/PhoneNumberTextField/countryData.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.d.ts +0 -50
- package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.js +0 -147
- package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.js +0 -66
- package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextField/phoneValidation.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextField/phoneValidation.js +0 -71
- package/Components/Molecules/PhoneNumberTextField/phoneValidation.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.test.d.ts +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.test.d.ts +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/CountrySelector.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/ErrorDisplay.js +0 -26
- package/Components/Molecules/PhoneNumberTextFieldCustom/ErrorDisplay.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/FlagIcon.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneInput.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneInput.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.d.ts +0 -37
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.js +0 -154
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.d.ts +0 -17
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.js +0 -29
- package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.js +0 -70
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.d.ts +0 -20
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.js +0 -60
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.d.ts +0 -18
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.js +0 -101
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.d.ts +0 -13
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.js +0 -513
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.d.ts +0 -0
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.js +0 -2
- package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.js +0 -507
- package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.d.ts +0 -8
- package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.js +0 -139
- package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.d.ts +0 -15
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.js +0 -120
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.d.ts +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.js +0 -157
- package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.d.ts +0 -12
- package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.js +0 -34
- package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.js.map +0 -1
- package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.d.ts +0 -31
- package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.js +0 -130
- package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.js.map +0 -1
- /package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.d.ts → __helpers__/components/forms/PhoneInput.d.ts} +0 -0
- /package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.test.d.ts → __helpers__/components/forms/PhoneInput.test.d.ts} +0 -0
- /package/Components/Molecules/{PhoneNumberTextField → PhoneNumberTextFieldCustom/__helpers__/components/ui}/CountryDropdown.test.d.ts +0 -0
- /package/Components/Molecules/{PhoneNumberTextField → PhoneNumberTextFieldCustom/__helpers__/components/ui}/CountryModal.test.d.ts +0 -0
- /package/Components/Molecules/PhoneNumberTextFieldCustom/{FlagIcon.js → __helpers__/components/ui/FlagIcon.js} +0 -0
@@ -53,9 +53,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
53
53
|
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
54
54
|
var react_1 = require("@testing-library/react");
|
55
55
|
var user_event_1 = __importDefault(require("@testing-library/user-event"));
|
56
|
-
var
|
56
|
+
var React_1 = require("../../../../../../Helpers/React");
|
57
57
|
var CountryModal_1 = __importDefault(require("./CountryModal"));
|
58
|
-
var countryData_1 = require("
|
58
|
+
var countryData_1 = require("../../utils/countryData");
|
59
59
|
// Mock the useTheme hook to provide the required theme structure
|
60
60
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
|
61
61
|
jest.mock('@emotion/react', function () { return (__assign(__assign({}, jest.requireActual('@emotion/react')), { useTheme: function () { return ({
|
@@ -87,12 +87,12 @@ describe('CountryModal', function () {
|
|
87
87
|
});
|
88
88
|
describe('Modal Visibility', function () {
|
89
89
|
it('renders without crashing and does not show modal when closed', function () {
|
90
|
-
(0,
|
90
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps)));
|
91
91
|
// Modal should not be visible when open is false
|
92
92
|
expect(react_1.screen.queryByText('Select Country')).not.toBeInTheDocument();
|
93
93
|
});
|
94
94
|
it('renders modal content when open is true', function () {
|
95
|
-
(0,
|
95
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true })));
|
96
96
|
expect(react_1.screen.getByText('Select Country')).toBeInTheDocument();
|
97
97
|
// Check for modal container instead of dialog role
|
98
98
|
expect(react_1.screen.getByText('Select Country').closest('[role="presentation"]')).toBeInTheDocument();
|
@@ -102,7 +102,7 @@ describe('CountryModal', function () {
|
|
102
102
|
return __generator(this, function (_a) {
|
103
103
|
switch (_a.label) {
|
104
104
|
case 0:
|
105
|
-
(0,
|
105
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true })));
|
106
106
|
closeButton = react_1.screen.getByRole('button', { name: /close/i });
|
107
107
|
expect(closeButton).toBeInTheDocument();
|
108
108
|
react_1.fireEvent.click(closeButton);
|
@@ -120,15 +120,15 @@ describe('CountryModal', function () {
|
|
120
120
|
});
|
121
121
|
describe('Country Search', function () {
|
122
122
|
it('does not render search input when enableCountrySearch is false', function () {
|
123
|
-
(0,
|
123
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: false })));
|
124
124
|
expect(react_1.screen.queryByPlaceholderText('Search countries...')).not.toBeInTheDocument();
|
125
125
|
});
|
126
126
|
it('renders search input when enableCountrySearch is true', function () {
|
127
|
-
(0,
|
127
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
128
128
|
expect(react_1.screen.getByPlaceholderText('Search countries...')).toBeInTheDocument();
|
129
129
|
});
|
130
130
|
it('filters countries based on search term', function () {
|
131
|
-
(0,
|
131
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
132
132
|
var searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
133
133
|
// Search for a specific country (assuming United States exists)
|
134
134
|
user_event_1.default.type(searchInput, 'United States');
|
@@ -139,14 +139,14 @@ describe('CountryModal', function () {
|
|
139
139
|
expect(countryItems.length).toBeLessThan(mockCountries.length);
|
140
140
|
});
|
141
141
|
it('shows "No countries found" when search yields no results', function () {
|
142
|
-
(0,
|
142
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
143
143
|
var searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
144
144
|
// Search for something that doesn't exist
|
145
145
|
user_event_1.default.type(searchInput, 'NonexistentCountry');
|
146
146
|
expect(react_1.screen.getByText('No countries found')).toBeInTheDocument();
|
147
147
|
});
|
148
148
|
it('filters countries by dial code', function () {
|
149
|
-
(0,
|
149
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
150
150
|
var searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
151
151
|
// Search for +1 (should find US, Canada, etc.)
|
152
152
|
user_event_1.default.type(searchInput, '+1');
|
@@ -158,7 +158,7 @@ describe('CountryModal', function () {
|
|
158
158
|
});
|
159
159
|
describe('Country List and Selection', function () {
|
160
160
|
it('displays country list when open', function () {
|
161
|
-
(0,
|
161
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true })));
|
162
162
|
// Should show at least the first few countries
|
163
163
|
expect(react_1.screen.getByText(mockCountries[0].name)).toBeInTheDocument();
|
164
164
|
expect(react_1.screen.getByText(mockCountries[1].name)).toBeInTheDocument();
|
@@ -170,7 +170,7 @@ describe('CountryModal', function () {
|
|
170
170
|
return __generator(this, function (_a) {
|
171
171
|
switch (_a.label) {
|
172
172
|
case 0:
|
173
|
-
(0,
|
173
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true })));
|
174
174
|
countryToSelect = mockCountries.find(function (c) { return c.name !== mockCountry.name; });
|
175
175
|
expect(countryToSelect).toBeDefined();
|
176
176
|
countryOption = react_1.screen.getByRole('option', {
|
@@ -190,7 +190,7 @@ describe('CountryModal', function () {
|
|
190
190
|
});
|
191
191
|
}); });
|
192
192
|
it('displays country flags and dial codes', function () {
|
193
|
-
(0,
|
193
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true })));
|
194
194
|
// Check that dial codes are displayed (use getAllByText since some dial codes might be duplicated)
|
195
195
|
var firstDialCode = react_1.screen.getAllByText(mockCountries[0].dialCode);
|
196
196
|
var secondDialCode = react_1.screen.getAllByText(mockCountries[1].dialCode);
|
@@ -204,7 +204,7 @@ describe('CountryModal', function () {
|
|
204
204
|
return __generator(this, function (_a) {
|
205
205
|
switch (_a.label) {
|
206
206
|
case 0:
|
207
|
-
(0,
|
207
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
208
208
|
searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
209
209
|
react_1.fireEvent.keyDown(searchInput, { key: 'Escape' });
|
210
210
|
return [4 /*yield*/, (0, react_1.waitFor)(function () {
|
@@ -217,7 +217,7 @@ describe('CountryModal', function () {
|
|
217
217
|
});
|
218
218
|
}); });
|
219
219
|
it('navigates countries with arrow keys when search is enabled', function () {
|
220
|
-
(0,
|
220
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
221
221
|
var searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
222
222
|
// Simulate arrow down navigation
|
223
223
|
react_1.fireEvent.keyDown(searchInput, { key: 'ArrowDown' });
|
@@ -233,7 +233,7 @@ describe('CountryModal', function () {
|
|
233
233
|
return __generator(this, function (_a) {
|
234
234
|
switch (_a.label) {
|
235
235
|
case 0:
|
236
|
-
(0,
|
236
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
237
237
|
searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
238
238
|
// Navigate to first country and select it
|
239
239
|
react_1.fireEvent.keyDown(searchInput, { key: 'ArrowDown' });
|
@@ -251,7 +251,7 @@ describe('CountryModal', function () {
|
|
251
251
|
});
|
252
252
|
describe('Accessibility', function () {
|
253
253
|
it('has proper ARIA labels and roles', function () {
|
254
|
-
(0,
|
254
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
255
255
|
// Modal should have proper ARIA attributes on the presentation container
|
256
256
|
var modal = react_1.screen.getByRole('presentation');
|
257
257
|
expect(modal).toHaveAttribute('aria-labelledby', 'country-selection-modal');
|
@@ -267,7 +267,7 @@ describe('CountryModal', function () {
|
|
267
267
|
it('renders search input and can be focused when modal opens with search enabled', function () { return __awaiter(void 0, void 0, void 0, function () {
|
268
268
|
var searchInput;
|
269
269
|
return __generator(this, function (_a) {
|
270
|
-
(0,
|
270
|
+
(0, React_1.renderWithProviders)((0, jsx_runtime_1.jsx)(CountryModal_1.default, __assign({}, defaultProps, { open: true, enableCountrySearch: true })));
|
271
271
|
searchInput = react_1.screen.getByPlaceholderText('Search countries...');
|
272
272
|
expect(searchInput).toBeInTheDocument();
|
273
273
|
// Focus the input manually to verify it's focusable
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"CountryModal.test.js","sourceRoot":"","sources":["../../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryModal.test.tsx"],"names":[],"mappings":"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"}
|
@@ -1,8 +1,9 @@
|
|
1
|
-
import { CountryData } from '
|
1
|
+
import { CountryData } from '../../utils/countryData';
|
2
2
|
export interface CountrySelectorProps {
|
3
3
|
selectedCountry: CountryData;
|
4
4
|
enableCountryChange?: boolean;
|
5
5
|
isCountryMenuOpen?: boolean;
|
6
|
+
disabled?: boolean;
|
6
7
|
onClick?: () => void;
|
7
8
|
onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
|
8
9
|
}
|
@@ -9,17 +9,20 @@ var ExpandMore_1 = __importDefault(require("@mui/icons-material/ExpandMore"));
|
|
9
9
|
var react_1 = require("react");
|
10
10
|
var FlagIcon_1 = __importDefault(require("./FlagIcon"));
|
11
11
|
var CountrySelector = (0, react_1.forwardRef)(function (_a, ref) {
|
12
|
-
var selectedCountry = _a.selectedCountry, _b = _a.enableCountryChange, enableCountryChange = _b === void 0 ? false : _b, _c = _a.isCountryMenuOpen, isCountryMenuOpen = _c === void 0 ? false : _c, onClick = _a.onClick, onKeyDown = _a.onKeyDown;
|
13
|
-
|
12
|
+
var selectedCountry = _a.selectedCountry, _b = _a.enableCountryChange, enableCountryChange = _b === void 0 ? false : _b, _c = _a.isCountryMenuOpen, isCountryMenuOpen = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, onClick = _a.onClick, onKeyDown = _a.onKeyDown;
|
13
|
+
// If disabled, we should not allow country changes
|
14
|
+
var isInteractive = enableCountryChange && !disabled;
|
15
|
+
return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, className: "country-selector", onClick: isInteractive ? onClick : undefined, style: {
|
14
16
|
display: 'flex',
|
15
17
|
alignItems: 'center',
|
16
18
|
padding: '8px 12px',
|
17
|
-
cursor:
|
19
|
+
cursor: isInteractive ? 'pointer' : 'default',
|
18
20
|
minWidth: '80px',
|
19
21
|
justifyContent: 'center',
|
20
|
-
|
22
|
+
opacity: disabled ? 0.6 : 1,
|
23
|
+
}, role: isInteractive ? 'button' : undefined, tabIndex: isInteractive ? 0 : undefined, "aria-label": isInteractive
|
21
24
|
? "Select country, currently ".concat(selectedCountry.name)
|
22
|
-
: "Country: ".concat(selectedCountry.name), "aria-haspopup":
|
25
|
+
: "Country: ".concat(selectedCountry.name), "aria-haspopup": isInteractive ? 'listbox' : undefined, "aria-expanded": isInteractive ? isCountryMenuOpen : undefined, "aria-controls": isInteractive ? 'country-selector-listbox' : undefined, onKeyDown: isInteractive ? onKeyDown : undefined, children: [(0, jsx_runtime_1.jsx)(FlagIcon_1.default, { countryCode: selectedCountry.code, style: { marginRight: '8px' } }), isInteractive && ((0, jsx_runtime_1.jsx)(ExpandMore_1.default, { style: {
|
23
26
|
fontSize: '16px',
|
24
27
|
color: 'rgba(0, 0, 0, 1)',
|
25
28
|
marginLeft: '4px',
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"CountrySelector.js","sourceRoot":"","sources":["../../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountrySelector.tsx"],"names":[],"mappings":";;;;;;AAAA,sCAAsC;AACtC,8EAAwD;AACxD,+BAAmC;AAEnC,wDAAkC;AAWlC,IAAM,eAAe,GAAG,IAAA,kBAAU,EAChC,UACE,EAOC,EACD,GAAG;QAPD,eAAe,qBAAA,EACf,2BAA2B,EAA3B,mBAAmB,mBAAG,KAAK,KAAA,EAC3B,yBAAyB,EAAzB,iBAAiB,mBAAG,KAAK,KAAA,EACzB,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,OAAO,aAAA,EACP,SAAS,eAAA;IAIX,mDAAmD;IACnD,IAAM,aAAa,GAAG,mBAAmB,IAAI,CAAC,QAAQ,CAAC;IAEvD,OAAO,CACL,iCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,kBAAkB,EAC5B,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAC5C,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,OAAO,EAAE,UAAU;YACnB,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YAC7C,QAAQ,EAAE,MAAM;YAChB,cAAc,EAAE,QAAQ;YACxB,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;SAC5B,EACD,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1C,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,gBAErC,aAAa;YACX,CAAC,CAAC,oCAA6B,eAAe,CAAC,IAAI,CAAE;YACrD,CAAC,CAAC,mBAAY,eAAe,CAAC,IAAI,CAAE,mBAEzB,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,mBACrC,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,mBAC7C,aAAa,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,SAAS,EACrE,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,aAEhD,uBAAC,kBAAQ,IACP,WAAW,EAAE,eAAe,CAAC,IAAI,EACjC,KAAK,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,GAC7B,EACD,aAAa,IAAI,CAChB,uBAAC,oBAAU,IACT,KAAK,EAAE;oBACL,QAAQ,EAAE,MAAM;oBAChB,KAAK,EAAE,kBAAkB;oBACzB,UAAU,EAAE,KAAK;oBACjB,SAAS,EAAE,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc;oBAChE,UAAU,EAAE,4BAA4B;iBACzC,GACD,CACH,IACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAEhD,kBAAe,eAAe,CAAC"}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
2
2
|
import React from 'react';
|
3
|
-
import { CountryCode } from '
|
3
|
+
import { CountryCode } from '../../utils/countryData';
|
4
4
|
interface FlagIconProps {
|
5
5
|
countryCode: CountryCode;
|
6
6
|
style?: React.CSSProperties;
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/FlagIcon.js.map
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"FlagIcon.js","sourceRoot":"","sources":["../../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/FlagIcon.tsx"],"names":[],"mappings":"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"}
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
1
|
export interface UseCountrySelectorOptions {
|
2
2
|
enableCountryChange?: boolean;
|
3
|
+
disabled?: boolean;
|
3
4
|
}
|
4
5
|
export interface UseCountrySelectorReturn {
|
5
6
|
isCountryMenuOpen: boolean;
|
@@ -8,4 +9,4 @@ export interface UseCountrySelectorReturn {
|
|
8
9
|
handleCountrySelectClick: () => void;
|
9
10
|
handleKeyDown: (e: React.KeyboardEvent) => void;
|
10
11
|
}
|
11
|
-
export declare const useCountrySelector: ({ enableCountryChange, }?: UseCountrySelectorOptions) => UseCountrySelectorReturn;
|
12
|
+
export declare const useCountrySelector: ({ enableCountryChange, disabled, }?: UseCountrySelectorOptions) => UseCountrySelectorReturn;
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js
CHANGED
@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useCountrySelector = void 0;
|
4
4
|
var react_1 = require("react");
|
5
5
|
var useCountrySelector = function (_a) {
|
6
|
-
var _b = _a === void 0 ? {} : _a, _c = _b.enableCountryChange, enableCountryChange = _c === void 0 ? true : _c;
|
7
|
-
var
|
6
|
+
var _b = _a === void 0 ? {} : _a, _c = _b.enableCountryChange, enableCountryChange = _c === void 0 ? true : _c, _d = _b.disabled, disabled = _d === void 0 ? false : _d;
|
7
|
+
var _e = (0, react_1.useState)(false), isCountryMenuOpen = _e[0], setIsCountryMenuOpen = _e[1];
|
8
8
|
var openCountryMenu = (0, react_1.useCallback)(function () {
|
9
|
-
if (enableCountryChange) {
|
9
|
+
if (enableCountryChange && !disabled) {
|
10
10
|
setIsCountryMenuOpen(true);
|
11
11
|
}
|
12
|
-
}, [enableCountryChange]);
|
12
|
+
}, [enableCountryChange, disabled]);
|
13
13
|
var closeCountryMenu = (0, react_1.useCallback)(function () {
|
14
14
|
setIsCountryMenuOpen(false);
|
15
15
|
}, []);
|
@@ -17,11 +17,13 @@ var useCountrySelector = function (_a) {
|
|
17
17
|
openCountryMenu();
|
18
18
|
}, [openCountryMenu]);
|
19
19
|
var handleKeyDown = (0, react_1.useCallback)(function (e) {
|
20
|
-
if (enableCountryChange &&
|
20
|
+
if (enableCountryChange &&
|
21
|
+
!disabled &&
|
22
|
+
(e.key === 'Enter' || e.key === ' ')) {
|
21
23
|
e.preventDefault();
|
22
24
|
openCountryMenu();
|
23
25
|
}
|
24
|
-
}, [enableCountryChange, openCountryMenu]);
|
26
|
+
}, [enableCountryChange, disabled, openCountryMenu]);
|
25
27
|
return {
|
26
28
|
isCountryMenuOpen: isCountryMenuOpen,
|
27
29
|
openCountryMenu: openCountryMenu,
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useCountrySelector.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.ts"],"names":[],"mappings":";;;AAAA,+BAA8C;
|
1
|
+
{"version":3,"file":"useCountrySelector.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.ts"],"names":[],"mappings":";;;AAAA,+BAA8C;AAevC,IAAM,kBAAkB,GAAG,UAAC,EAGF;QAHE,qBAGJ,EAAE,KAAA,EAF/B,2BAA0B,EAA1B,mBAAmB,mBAAG,IAAI,KAAA,EAC1B,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA;IAEV,IAAA,KAA4C,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAA1D,iBAAiB,QAAA,EAAE,oBAAoB,QAAmB,CAAC;IAElE,IAAM,eAAe,GAAG,IAAA,mBAAW,EAAC;QAClC,IAAI,mBAAmB,IAAI,CAAC,QAAQ,EAAE,CAAC;YACrC,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC,EAAE,CAAC,mBAAmB,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEpC,IAAM,gBAAgB,GAAG,IAAA,mBAAW,EAAC;QACnC,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAM,wBAAwB,GAAG,IAAA,mBAAW,EAAC;QAC3C,eAAe,EAAE,CAAC;IACpB,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,IAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,UAAC,CAAsB;QACrB,IACE,mBAAmB;YACnB,CAAC,QAAQ;YACT,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EACpC,CAAC;YACD,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,eAAe,EAAE,CAAC;QACpB,CAAC;IACH,CAAC,EACD,CAAC,mBAAmB,EAAE,QAAQ,EAAE,eAAe,CAAC,CACjD,CAAC;IAEF,OAAO;QACL,iBAAiB,mBAAA;QACjB,eAAe,iBAAA;QACf,gBAAgB,kBAAA;QAChB,wBAAwB,0BAAA;QACxB,aAAa,eAAA;KACd,CAAC;AACJ,CAAC,CAAC;AAzCW,QAAA,kBAAkB,sBAyC7B"}
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.d.ts
CHANGED
@@ -3,6 +3,7 @@ import { PhoneValidationResult } from '../utils/phoneValidation';
|
|
3
3
|
export interface UsePhoneNumberOptions {
|
4
4
|
initialCountry?: string;
|
5
5
|
initialValue?: string;
|
6
|
+
enableCountryChange?: boolean;
|
6
7
|
onPhoneNumberChange?: (params: {
|
7
8
|
phoneNumber: string;
|
8
9
|
e164Number: string;
|
@@ -24,9 +25,14 @@ export interface UsePhoneNumberReturn {
|
|
24
25
|
countries: CountryData[];
|
25
26
|
setPhoneNumber: (value: string) => void;
|
26
27
|
setSelectedCountry: (country: CountryData) => void;
|
28
|
+
autoDetectedCountryChange: {
|
29
|
+
newCountry: CountryData;
|
30
|
+
previousCountry: CountryData;
|
31
|
+
} | null;
|
32
|
+
clearAutoDetectedCountryChange: () => void;
|
27
33
|
isValid: boolean;
|
28
34
|
errorMessage?: string;
|
29
35
|
formattedE164: string;
|
30
36
|
phoneNumberType?: string;
|
31
37
|
}
|
32
|
-
export declare const usePhoneNumber: ({ initialCountry, initialValue, }?: Omit<UsePhoneNumberOptions, "onPhoneNumberChange" | "onCountryChange" | "onValidationChange">) => UsePhoneNumberReturn;
|
38
|
+
export declare const usePhoneNumber: ({ initialCountry, initialValue, enableCountryChange, }?: Omit<UsePhoneNumberOptions, "onPhoneNumberChange" | "onCountryChange" | "onValidationChange">) => UsePhoneNumberReturn;
|
@@ -2,24 +2,26 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
exports.usePhoneNumber = void 0;
|
4
4
|
var react_1 = require("react");
|
5
|
+
var google_libphonenumber_1 = require("google-libphonenumber");
|
5
6
|
var countryData_1 = require("../utils/countryData");
|
6
7
|
var phoneValidation_1 = require("../utils/phoneValidation");
|
7
8
|
var usePhoneNumber = function (_a) {
|
8
9
|
var _b, _c;
|
9
|
-
var _d = _a === void 0 ? {} : _a, initialCountry = _d.initialCountry, _e = _d.initialValue, initialValue = _e === void 0 ? '' : _e;
|
10
|
+
var _d = _a === void 0 ? {} : _a, initialCountry = _d.initialCountry, _e = _d.initialValue, initialValue = _e === void 0 ? '' : _e, _f = _d.enableCountryChange, enableCountryChange = _f === void 0 ? true : _f;
|
10
11
|
// Memoize countries data to prevent unnecessary recalculations
|
11
12
|
var countries = (0, react_1.useMemo)(function () { return (0, countryData_1.getCountryData)(); }, []);
|
12
13
|
// Initialize selected country
|
13
|
-
var
|
14
|
+
var _g = (0, react_1.useState)(function () {
|
14
15
|
if (initialCountry) {
|
15
16
|
var initialCountryData = countries.find(function (c) { return c.code === initialCountry; });
|
16
17
|
if (initialCountryData)
|
17
18
|
return initialCountryData;
|
18
19
|
}
|
19
20
|
return countries[0]; // Fallback to first country
|
20
|
-
}), selectedCountry =
|
21
|
-
var
|
22
|
-
var
|
21
|
+
}), selectedCountry = _g[0], setSelectedCountryState = _g[1];
|
22
|
+
var _h = (0, react_1.useState)(''), phoneNumber = _h[0], setPhoneNumberState = _h[1];
|
23
|
+
var _j = (0, react_1.useState)(null), validationResult = _j[0], setValidationResult = _j[1];
|
24
|
+
var _k = (0, react_1.useState)(null), autoDetectedCountryChange = _k[0], setAutoDetectedCountryChange = _k[1];
|
23
25
|
var previousValueRef = (0, react_1.useRef)('');
|
24
26
|
// Process phone number with country-specific formatting and validation
|
25
27
|
var processPhoneNumber = (0, react_1.useCallback)(function (phoneValue, countryCode, useNationalFormat) {
|
@@ -28,7 +30,7 @@ var usePhoneNumber = function (_a) {
|
|
28
30
|
if (useNationalFormat && validation.nationalFormatted) {
|
29
31
|
return { formattedNumber: validation.nationalFormatted, validation: validation };
|
30
32
|
}
|
31
|
-
var formattedNumber = (0, phoneValidation_1.formatAsYouType)(phoneValue, countryCode);
|
33
|
+
var formattedNumber = (0, phoneValidation_1.formatAsYouType)(phoneValue, countryCode, true);
|
32
34
|
return { formattedNumber: formattedNumber, validation: validation };
|
33
35
|
}, []);
|
34
36
|
// Update country if different from current
|
@@ -51,11 +53,17 @@ var usePhoneNumber = function (_a) {
|
|
51
53
|
}
|
52
54
|
// Try to extract country code from the input value
|
53
55
|
var detectedCountryCode = (0, phoneValidation_1.extractCountryCodeFromNumber)(initialValue, selectedCountry.code);
|
54
|
-
if (detectedCountryCode) {
|
55
|
-
// Update country if different
|
56
|
+
if (detectedCountryCode && enableCountryChange) {
|
57
|
+
// Update country if different and country change is enabled
|
56
58
|
var newCountry = updateCountryIfDifferent(detectedCountryCode);
|
57
59
|
if (newCountry) {
|
60
|
+
var previousCountry = selectedCountry;
|
58
61
|
setSelectedCountryState(newCountry);
|
62
|
+
// Trigger auto-detected country change notification
|
63
|
+
setAutoDetectedCountryChange({
|
64
|
+
newCountry: newCountry,
|
65
|
+
previousCountry: previousCountry,
|
66
|
+
});
|
59
67
|
}
|
60
68
|
// Process with detected country
|
61
69
|
var _a = processPhoneNumber(initialValue, detectedCountryCode, true), formattedNumber = _a.formattedNumber, validation = _a.validation;
|
@@ -71,46 +79,83 @@ var usePhoneNumber = function (_a) {
|
|
71
79
|
}, [
|
72
80
|
initialValue,
|
73
81
|
selectedCountry.code,
|
82
|
+
enableCountryChange,
|
74
83
|
processPhoneNumber,
|
75
84
|
updateCountryIfDifferent,
|
76
85
|
]);
|
77
86
|
// Handle phone number changes
|
78
87
|
var setPhoneNumber = (0, react_1.useCallback)(function (newPhoneNumber) {
|
79
|
-
// Format as you type
|
80
|
-
var formattedNumber = (0, phoneValidation_1.formatAsYouType)(newPhoneNumber, selectedCountry.code);
|
88
|
+
// Format as you type using the selected country
|
89
|
+
var formattedNumber = (0, phoneValidation_1.formatAsYouType)(newPhoneNumber, selectedCountry.code, enableCountryChange);
|
81
90
|
setPhoneNumberState(formattedNumber);
|
82
|
-
// Validate
|
83
|
-
var validation
|
84
|
-
if (
|
85
|
-
|
91
|
+
// Validate based on enableCountryChange setting
|
92
|
+
var validation;
|
93
|
+
if (enableCountryChange) {
|
94
|
+
// Auto-detection enabled: validate with auto-detection first, then fallback to selected country
|
95
|
+
validation = (0, phoneValidation_1.validatePhoneNumber)(formattedNumber);
|
96
|
+
if (!validation.countryCode || !validation.isValid) {
|
97
|
+
validation = (0, phoneValidation_1.validatePhoneNumber)(formattedNumber, selectedCountry.code);
|
98
|
+
}
|
99
|
+
// Auto-update country if detected and different from current
|
100
|
+
if (validation.countryCode &&
|
101
|
+
validation.countryCode !== selectedCountry.code) {
|
102
|
+
var detectedCountry = countries.find(function (c) { return c.code === validation.countryCode; });
|
103
|
+
if (detectedCountry) {
|
104
|
+
var previousCountry = selectedCountry;
|
105
|
+
setSelectedCountryState(detectedCountry);
|
106
|
+
// Trigger auto-detected country change notification
|
107
|
+
setAutoDetectedCountryChange({
|
108
|
+
newCountry: detectedCountry,
|
109
|
+
previousCountry: previousCountry,
|
110
|
+
});
|
111
|
+
}
|
112
|
+
}
|
86
113
|
}
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
var
|
92
|
-
|
93
|
-
|
114
|
+
else {
|
115
|
+
// Auto-detection disabled: only validate against the selected country
|
116
|
+
// If input starts with +, treat it as invalid for the selected country
|
117
|
+
// unless it matches the selected country's international prefix
|
118
|
+
var phoneUtil = google_libphonenumber_1.PhoneNumberUtil.getInstance();
|
119
|
+
var countryCallingCode = phoneUtil.getCountryCodeForRegion(selectedCountry.code);
|
120
|
+
var expectedPrefix = "+".concat(countryCallingCode);
|
121
|
+
if (formattedNumber.startsWith('+') &&
|
122
|
+
!formattedNumber.startsWith(expectedPrefix)) {
|
123
|
+
// International number that doesn't match the selected country
|
124
|
+
validation = {
|
125
|
+
isValid: false,
|
126
|
+
formattedNumber: formattedNumber,
|
127
|
+
countryCode: selectedCountry.code,
|
128
|
+
nationalNumber: formattedNumber,
|
129
|
+
nationalFormatted: formattedNumber,
|
130
|
+
errorMessage: 'Please enter a valid phone number for the selected country',
|
131
|
+
};
|
132
|
+
}
|
133
|
+
else {
|
134
|
+
// National number or correct international prefix - validate against selected country
|
135
|
+
validation = (0, phoneValidation_1.validatePhoneNumber)(formattedNumber, selectedCountry.code);
|
94
136
|
}
|
95
137
|
}
|
96
|
-
|
138
|
+
setValidationResult(validation);
|
139
|
+
}, [selectedCountry, countries, enableCountryChange]);
|
97
140
|
// Handle country changes
|
98
141
|
var setSelectedCountry = (0, react_1.useCallback)(function (country) {
|
99
142
|
setSelectedCountryState(country);
|
100
143
|
// Reformat existing phone number with new country's rules
|
101
144
|
if (phoneNumber) {
|
102
|
-
var reformattedNumber = (0, phoneValidation_1.formatAsYouType)(phoneNumber, country.code);
|
145
|
+
var reformattedNumber = (0, phoneValidation_1.formatAsYouType)(phoneNumber, country.code, true); // Allow international formatting when manually changing country
|
103
146
|
setPhoneNumberState(reformattedNumber);
|
104
147
|
// Re-validate with new country
|
105
148
|
var validation = (0, phoneValidation_1.validatePhoneNumber)(reformattedNumber, country.code);
|
106
149
|
setValidationResult(validation);
|
107
|
-
// Note: callbacks will be triggered by the main component useEffect
|
108
150
|
}
|
109
151
|
else {
|
110
152
|
setValidationResult(null);
|
111
153
|
}
|
112
|
-
// Note: callbacks will be triggered by the main component useEffect
|
113
154
|
}, [selectedCountry, phoneNumber]);
|
155
|
+
// Clear auto-detected country change
|
156
|
+
var clearAutoDetectedCountryChange = (0, react_1.useCallback)(function () {
|
157
|
+
setAutoDetectedCountryChange(null);
|
158
|
+
}, []);
|
114
159
|
return {
|
115
160
|
// State
|
116
161
|
phoneNumber: phoneNumber,
|
@@ -120,6 +165,9 @@ var usePhoneNumber = function (_a) {
|
|
120
165
|
// Actions
|
121
166
|
setPhoneNumber: setPhoneNumber,
|
122
167
|
setSelectedCountry: setSelectedCountry,
|
168
|
+
// Auto-detection
|
169
|
+
autoDetectedCountryChange: autoDetectedCountryChange,
|
170
|
+
clearAutoDetectedCountryChange: clearAutoDetectedCountryChange,
|
123
171
|
// Computed
|
124
172
|
isValid: (_b = validationResult === null || validationResult === void 0 ? void 0 : validationResult.isValid) !== null && _b !== void 0 ? _b : false,
|
125
173
|
errorMessage: validationResult === null || validationResult === void 0 ? void 0 : validationResult.errorMessage,
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"usePhoneNumber.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.ts"],"names":[],"mappings":";;;AAAA,+BAA0E;AAC1E,oDAAgF;AAChF,4DAKkC;
|
1
|
+
{"version":3,"file":"usePhoneNumber.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.ts"],"names":[],"mappings":"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"}
|
@@ -1,11 +1,14 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
type StoryType = React.FunctionComponent<{
|
3
3
|
disabled: boolean;
|
4
|
-
errorMessage
|
4
|
+
errorMessage?: string;
|
5
5
|
isAnswered: boolean;
|
6
6
|
label: string;
|
7
|
-
placeholder
|
7
|
+
placeholder?: string;
|
8
8
|
type: 'tel' | 'text';
|
9
|
+
value: string;
|
10
|
+
initialCountry?: string;
|
11
|
+
experimentName: string;
|
9
12
|
parentContainerMaxWidth: number;
|
10
13
|
isSafari: boolean;
|
11
14
|
isAutoFilledActive: boolean;
|
@@ -6,13 +6,36 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
7
7
|
var addon_actions_1 = require("@storybook/addon-actions");
|
8
8
|
var PhoneNumberTextField_1 = __importDefault(require("../../PhoneNumberTextField"));
|
9
|
-
var
|
10
|
-
var
|
11
|
-
(0, addon_actions_1.action)('
|
9
|
+
var handlePhoneNumberChange = function (_a) {
|
10
|
+
var id = _a.id, phoneNumber = _a.phoneNumber, e164Number = _a.e164Number;
|
11
|
+
(0, addon_actions_1.action)('Phone Number Change')({ id: id, phoneNumber: phoneNumber, e164Number: e164Number });
|
12
|
+
};
|
13
|
+
var handleCountryChange = function (_a) {
|
14
|
+
var id = _a.id, selectedCountry = _a.selectedCountry, previousCountry = _a.previousCountry;
|
15
|
+
(0, addon_actions_1.action)('Country Change')({
|
16
|
+
id: id,
|
17
|
+
selectedCountry: selectedCountry.name,
|
18
|
+
previousCountry: previousCountry.name,
|
19
|
+
selectedCountryCode: selectedCountry.code,
|
20
|
+
previousCountryCode: previousCountry.code,
|
21
|
+
});
|
22
|
+
};
|
23
|
+
var handleValidationChange = function (_a) {
|
24
|
+
var id = _a.id, isValid = _a.isValid, validationResult = _a.validationResult, phoneNumber = _a.phoneNumber;
|
25
|
+
(0, addon_actions_1.action)('Validation Change')({
|
26
|
+
id: id,
|
27
|
+
isValid: isValid,
|
28
|
+
phoneNumber: phoneNumber,
|
29
|
+
errorMessage: (validationResult === null || validationResult === void 0 ? void 0 : validationResult.errorMessage) || 'No error message',
|
30
|
+
});
|
31
|
+
};
|
32
|
+
var handleFormattedValueChange = function (_a) {
|
33
|
+
var id = _a.id, formattedValue = _a.formattedValue, e164Value = _a.e164Value;
|
34
|
+
(0, addon_actions_1.action)('Formatted Value Change')({ id: id, formattedValue: formattedValue, e164Value: e164Value });
|
12
35
|
};
|
13
36
|
var PhoneNumberTextFieldStory = function (_a) {
|
14
|
-
var disabled = _a.disabled, errorMessage = _a.errorMessage, type = _a.type, isAnswered = _a.isAnswered, label = _a.label, placeholder = _a.placeholder, parentContainerMaxWidth = _a.parentContainerMaxWidth, isSafari = _a.isSafari, isAutoFilledActive = _a.isAutoFilledActive, enableCountryChange = _a.enableCountryChange, enableCountrySearch = _a.enableCountrySearch, useModalForCountrySelection = _a.useModalForCountrySelection, strictMode = _a.strictMode;
|
15
|
-
return ((0, jsx_runtime_1.jsx)("div", { style: { maxWidth: parentContainerMaxWidth }, children: (0, jsx_runtime_1.jsx)(PhoneNumberTextField_1.default, { disabled: disabled, errorMessage: errorMessage,
|
37
|
+
var disabled = _a.disabled, errorMessage = _a.errorMessage, type = _a.type, isAnswered = _a.isAnswered, label = _a.label, placeholder = _a.placeholder, value = _a.value, initialCountry = _a.initialCountry, experimentName = _a.experimentName, parentContainerMaxWidth = _a.parentContainerMaxWidth, isSafari = _a.isSafari, isAutoFilledActive = _a.isAutoFilledActive, enableCountryChange = _a.enableCountryChange, enableCountrySearch = _a.enableCountrySearch, useModalForCountrySelection = _a.useModalForCountrySelection, strictMode = _a.strictMode;
|
38
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { maxWidth: parentContainerMaxWidth }, children: (0, jsx_runtime_1.jsx)(PhoneNumberTextField_1.default, { disabled: disabled, errorMessage: errorMessage, onPhoneNumberChange: handlePhoneNumberChange, onCountryChange: handleCountryChange, onValidationChange: handleValidationChange, onFormattedValueChange: handleFormattedValueChange, type: type, id: "id", isAnswered: isAnswered, label: label, placeholder: placeholder, value: value, initialCountry: initialCountry, experimentName: experimentName, isSafari: isSafari, isAutoFilledActive: isAutoFilledActive, enableCountryChange: enableCountryChange, enableCountrySearch: enableCountrySearch, useModalForCountrySelection: useModalForCountrySelection, strictMode: strictMode, onBlur: function () { return (0, addon_actions_1.action)('Blur')(); }, onClick: function () { return (0, addon_actions_1.action)('Click')(); } }) }));
|
16
39
|
};
|
17
40
|
exports.default = PhoneNumberTextFieldStory;
|
18
41
|
//# sourceMappingURL=PhoneNumberTextFieldStory.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"PhoneNumberTextFieldStory.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.tsx"],"names":[],"mappings":";;;;;;AAAA,0DAAkD;
|
1
|
+
{"version":3,"file":"PhoneNumberTextFieldStory.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.tsx"],"names":[],"mappings":"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"}
|
package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.d.ts
CHANGED
@@ -10,6 +10,6 @@ export interface PhoneValidationResult {
|
|
10
10
|
errorMessage?: string;
|
11
11
|
}
|
12
12
|
export declare const validatePhoneNumber: (phoneNumber: string, countryCode?: CountryCode) => PhoneValidationResult;
|
13
|
-
export declare const formatAsYouType: (phoneNumber: string, countryCode: CountryCode) => string;
|
13
|
+
export declare const formatAsYouType: (phoneNumber: string, countryCode: CountryCode, allowInternationalFormatting?: boolean) => string;
|
14
14
|
export declare const getExampleForCountry: (countryCode: CountryCode) => string;
|
15
15
|
export declare const extractCountryCodeFromNumber: (phoneNumber: string, defaultCountry?: CountryCode) => CountryCode | undefined;
|