@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.
Files changed (125) hide show
  1. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.js +28 -7
  2. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.js.map +1 -1
  3. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.test.js +147 -1
  4. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextField.test.js.map +1 -1
  5. package/Components/Molecules/PhoneNumberTextFieldCustom/{ErrorDisplay.d.ts → __helpers__/components/display/ErrorDisplay.d.ts} +0 -1
  6. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/display/ErrorDisplay.js +17 -0
  7. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/display/ErrorDisplay.js.map +1 -0
  8. package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.js → __helpers__/components/forms/PhoneInput.js} +2 -5
  9. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/forms/PhoneInput.js.map +1 -0
  10. package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.test.js → __helpers__/components/forms/PhoneInput.test.js} +1 -1
  11. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/forms/PhoneInput.test.js.map +1 -0
  12. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.d.ts → __helpers__/components/ui/CountryDropdown.d.ts} +1 -1
  13. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.js → __helpers__/components/ui/CountryDropdown.js} +1 -1
  14. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryDropdown.js.map +1 -0
  15. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryDropdown.test.js → __helpers__/components/ui/CountryDropdown.test.js} +2 -2
  16. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryDropdown.test.js.map +1 -0
  17. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.d.ts → __helpers__/components/ui/CountryModal.d.ts} +1 -1
  18. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.js → __helpers__/components/ui/CountryModal.js} +1 -1
  19. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryModal.js.map +1 -0
  20. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountryModal.test.js → __helpers__/components/ui/CountryModal.test.js} +18 -18
  21. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountryModal.test.js.map +1 -0
  22. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountrySelector.d.ts → __helpers__/components/ui/CountrySelector.d.ts} +2 -1
  23. package/Components/Molecules/PhoneNumberTextFieldCustom/{CountrySelector.js → __helpers__/components/ui/CountrySelector.js} +8 -5
  24. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/CountrySelector.js.map +1 -0
  25. package/Components/Molecules/PhoneNumberTextFieldCustom/{FlagIcon.d.ts → __helpers__/components/ui/FlagIcon.d.ts} +1 -1
  26. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/components/ui/FlagIcon.js.map +1 -0
  27. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.d.ts +2 -1
  28. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js +8 -6
  29. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useCountrySelector.js.map +1 -1
  30. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.d.ts +7 -1
  31. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.js +73 -25
  32. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/usePhoneNumber.js.map +1 -1
  33. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.d.ts +5 -2
  34. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.js +28 -5
  35. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/PhoneNumberTextFieldStory.js.map +1 -1
  36. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.d.ts +1 -1
  37. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.js +14 -4
  38. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/phoneValidation.js.map +1 -1
  39. package/Components/Molecules/PhoneNumberTextFieldCustom/defaultProps.js +1 -1
  40. package/Components/Molecules/PhoneNumberTextFieldCustom/defaultProps.js.map +1 -1
  41. package/Components/Molecules/PhoneNumberTextFieldCustom/index.d.ts +5 -5
  42. package/Components/Molecules/PhoneNumberTextFieldCustom/index.js +5 -5
  43. package/Components/Molecules/PhoneNumberTextFieldCustom/index.js.map +1 -1
  44. package/package.json +1 -2
  45. package/Components/Molecules/PhoneNumberTextField/CountryDropdown.d.ts +0 -12
  46. package/Components/Molecules/PhoneNumberTextField/CountryDropdown.js +0 -146
  47. package/Components/Molecules/PhoneNumberTextField/CountryDropdown.js.map +0 -1
  48. package/Components/Molecules/PhoneNumberTextField/CountryDropdown.test.js +0 -49
  49. package/Components/Molecules/PhoneNumberTextField/CountryDropdown.test.js.map +0 -1
  50. package/Components/Molecules/PhoneNumberTextField/CountryModal.d.ts +0 -11
  51. package/Components/Molecules/PhoneNumberTextField/CountryModal.js +0 -180
  52. package/Components/Molecules/PhoneNumberTextField/CountryModal.js.map +0 -1
  53. package/Components/Molecules/PhoneNumberTextField/CountryModal.test.js +0 -54
  54. package/Components/Molecules/PhoneNumberTextField/CountryModal.test.js.map +0 -1
  55. package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.d.ts +0 -1
  56. package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.js +0 -215
  57. package/Components/Molecules/PhoneNumberTextField/__tests__/PhoneNumberTextField.test.js.map +0 -1
  58. package/Components/Molecules/PhoneNumberTextField/countryData.d.ts +0 -13
  59. package/Components/Molecules/PhoneNumberTextField/countryData.js +0 -743
  60. package/Components/Molecules/PhoneNumberTextField/countryData.js.map +0 -1
  61. package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.d.ts +0 -50
  62. package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.js +0 -147
  63. package/Components/Molecules/PhoneNumberTextField/makePhoneInputStyles.js.map +0 -1
  64. package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.d.ts +0 -12
  65. package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.js +0 -66
  66. package/Components/Molecules/PhoneNumberTextField/phoneNumberValidation.js.map +0 -1
  67. package/Components/Molecules/PhoneNumberTextField/phoneValidation.d.ts +0 -12
  68. package/Components/Molecules/PhoneNumberTextField/phoneValidation.js +0 -71
  69. package/Components/Molecules/PhoneNumberTextField/phoneValidation.js.map +0 -1
  70. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.js.map +0 -1
  71. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.test.d.ts +0 -1
  72. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryDropdown.test.js.map +0 -1
  73. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.js.map +0 -1
  74. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.test.d.ts +0 -1
  75. package/Components/Molecules/PhoneNumberTextFieldCustom/CountryModal.test.js.map +0 -1
  76. package/Components/Molecules/PhoneNumberTextFieldCustom/CountrySelector.js.map +0 -1
  77. package/Components/Molecules/PhoneNumberTextFieldCustom/ErrorDisplay.js +0 -26
  78. package/Components/Molecules/PhoneNumberTextFieldCustom/ErrorDisplay.js.map +0 -1
  79. package/Components/Molecules/PhoneNumberTextFieldCustom/FlagIcon.js.map +0 -1
  80. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneInput.js.map +0 -1
  81. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneInput.test.js.map +0 -1
  82. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.d.ts +0 -37
  83. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.js +0 -154
  84. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.js.map +0 -1
  85. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.d.ts +0 -17
  86. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.js +0 -29
  87. package/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.js.map +0 -1
  88. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.d.ts +0 -12
  89. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.js +0 -70
  90. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.js.map +0 -1
  91. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.d.ts +0 -20
  92. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.js +0 -60
  93. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.js.map +0 -1
  94. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.d.ts +0 -18
  95. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.js +0 -101
  96. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.js.map +0 -1
  97. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.d.ts +0 -13
  98. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.js +0 -513
  99. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataFull.js.map +0 -1
  100. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.d.ts +0 -0
  101. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.js +0 -2
  102. package/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/utils/countryDataOptimized.js.map +0 -1
  103. package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.d.ts +0 -12
  104. package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.js +0 -507
  105. package/Components/Molecules/PhoneNumberTextFieldCustom/countryData.js.map +0 -1
  106. package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.d.ts +0 -8
  107. package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.js +0 -139
  108. package/Components/Molecules/PhoneNumberTextFieldCustom/makeFormControlPhoneNumberStyling.js.map +0 -1
  109. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.d.ts +0 -15
  110. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.js +0 -120
  111. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.js.map +0 -1
  112. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.d.ts +0 -1
  113. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.js +0 -157
  114. package/Components/Molecules/PhoneNumberTextFieldCustom/phoneValidation.test.js.map +0 -1
  115. package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.d.ts +0 -12
  116. package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.js +0 -34
  117. package/Components/Molecules/PhoneNumberTextFieldCustom/useCountrySelector.js.map +0 -1
  118. package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.d.ts +0 -31
  119. package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.js +0 -130
  120. package/Components/Molecules/PhoneNumberTextFieldCustom/usePhoneNumber.js.map +0 -1
  121. /package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.d.ts → __helpers__/components/forms/PhoneInput.d.ts} +0 -0
  122. /package/Components/Molecules/PhoneNumberTextFieldCustom/{PhoneInput.test.d.ts → __helpers__/components/forms/PhoneInput.test.d.ts} +0 -0
  123. /package/Components/Molecules/{PhoneNumberTextField → PhoneNumberTextFieldCustom/__helpers__/components/ui}/CountryDropdown.test.d.ts +0 -0
  124. /package/Components/Molecules/{PhoneNumberTextField → PhoneNumberTextFieldCustom/__helpers__/components/ui}/CountryModal.test.d.ts +0 -0
  125. /package/Components/Molecules/PhoneNumberTextFieldCustom/{FlagIcon.js → __helpers__/components/ui/FlagIcon.js} +0 -0
@@ -1,154 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- var __rest = (this && this.__rest) || function (s, e) {
14
- var t = {};
15
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
- t[p] = s[p];
17
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
- t[p[i]] = s[p[i]];
21
- }
22
- return t;
23
- };
24
- var __importDefault = (this && this.__importDefault) || function (mod) {
25
- return (mod && mod.__esModule) ? mod : { "default": mod };
26
- };
27
- Object.defineProperty(exports, "__esModule", { value: true });
28
- var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
29
- /** @jsxImportSource @emotion/react */
30
- var FormControl_1 = __importDefault(require("@mui/material/FormControl"));
31
- var FormHelperText_1 = __importDefault(require("@mui/material/FormHelperText"));
32
- var ExpandMore_1 = __importDefault(require("@mui/icons-material/ExpandMore"));
33
- var react_1 = require("react");
34
- var Input_1 = __importDefault(require("../../../Components/Atoms/Input"));
35
- var InputLabel_1 = __importDefault(require("../../../Components/Atoms/InputLabel"));
36
- var makeFormControlPhoneNumberStyling_1 = __importDefault(require("./makeFormControlPhoneNumberStyling"));
37
- var makeFormControlStyles_1 = __importDefault(require("../../../Components/Atoms/FormControl/makeFormControlStyles"));
38
- var CountryDropdown_1 = __importDefault(require("./CountryDropdown"));
39
- var CountryModal_1 = __importDefault(require("./CountryModal"));
40
- var FlagIcon_1 = __importDefault(require("./FlagIcon"));
41
- var usePhoneNumber_1 = require("./usePhoneNumber");
42
- var useCountrySelector_1 = require("./useCountrySelector");
43
- var defaultProps = {
44
- disabled: false,
45
- isAnswered: false,
46
- isSafari: false,
47
- isAutoFilledActive: false,
48
- enableCountryChange: true,
49
- enableCountrySearch: false,
50
- useModalForCountrySelection: false,
51
- label: '',
52
- value: '',
53
- onBlur: function () { },
54
- onClick: function () { },
55
- };
56
- var PhoneNumberTextFieldRefactored = function (_a) {
57
- var
58
- // Core props
59
- id = _a.id, _b = _a.value, value = _b === void 0 ? '' : _b, label = _a.label, errorMessage = _a.errorMessage, disabled = _a.disabled, placeholder = _a.placeholder,
60
- // Country settings
61
- initialCountry = _a.initialCountry, enableCountryChange = _a.enableCountryChange, enableCountrySearch = _a.enableCountrySearch, useModalForCountrySelection = _a.useModalForCountrySelection,
62
- // UI state
63
- isAnswered = _a.isAnswered, isSafari = _a.isSafari, isAutoFilledActive = _a.isAutoFilledActive, experimentName = _a.experimentName,
64
- // Callbacks
65
- onPhoneNumberChange = _a.onPhoneNumberChange, onCountryChange = _a.onCountryChange, onChange = _a.onChange, // Legacy support
66
- // Event handlers
67
- onBlur = _a.onBlur, onClick = _a.onClick, props = __rest(_a, ["id", "value", "label", "errorMessage", "disabled", "placeholder", "initialCountry", "enableCountryChange", "enableCountrySearch", "useModalForCountrySelection", "isAnswered", "isSafari", "isAutoFilledActive", "experimentName", "onPhoneNumberChange", "onCountryChange", "onChange", "onBlur", "onClick"]);
68
- var countrySelectorRef = (0, react_1.useRef)(null);
69
- var inputRef = (0, react_1.useRef)(null);
70
- // Custom hooks for clean separation of concerns
71
- var phoneNumber = (0, usePhoneNumber_1.usePhoneNumber)({
72
- initialCountry: initialCountry,
73
- initialValue: value,
74
- });
75
- var countrySelector = (0, useCountrySelector_1.useCountrySelector)({
76
- enableCountryChange: enableCountryChange,
77
- });
78
- // Handle phone number change events
79
- (0, react_1.useEffect)(function () {
80
- if (phoneNumber.phoneNumber || phoneNumber.validationResult) {
81
- var event_1 = {
82
- id: id,
83
- phoneNumber: phoneNumber.phoneNumber,
84
- e164Number: phoneNumber.formattedE164,
85
- isValid: phoneNumber.isValid,
86
- selectedCountry: phoneNumber.selectedCountry,
87
- validationResult: phoneNumber.validationResult,
88
- };
89
- onPhoneNumberChange === null || onPhoneNumberChange === void 0 ? void 0 : onPhoneNumberChange(event_1);
90
- onChange === null || onChange === void 0 ? void 0 : onChange(event_1); // Legacy support
91
- }
92
- }, [
93
- id,
94
- phoneNumber.phoneNumber,
95
- phoneNumber.formattedE164,
96
- phoneNumber.isValid,
97
- phoneNumber.selectedCountry,
98
- phoneNumber.validationResult,
99
- onPhoneNumberChange,
100
- onChange,
101
- ]);
102
- // Handle input changes
103
- var handlePhoneChange = (0, react_1.useCallback)(function (params) {
104
- phoneNumber.setPhoneNumber(params.value);
105
- }, [phoneNumber]);
106
- // Handle country changes
107
- var handleCountryChange = (0, react_1.useCallback)(function (country) {
108
- var previousCountry = phoneNumber.selectedCountry;
109
- phoneNumber.setSelectedCountry(country);
110
- // Call country change callback
111
- var event = {
112
- id: id,
113
- selectedCountry: country,
114
- previousCountry: previousCountry,
115
- };
116
- onCountryChange === null || onCountryChange === void 0 ? void 0 : onCountryChange(event);
117
- }, [phoneNumber, id, onCountryChange]);
118
- // Determine error state
119
- var shouldShowError = errorMessage ||
120
- (phoneNumber.validationResult && !phoneNumber.validationResult.isValid && phoneNumber.phoneNumber.length > 0);
121
- var finalErrorMessage = errorMessage || phoneNumber.errorMessage;
122
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(FormControl_1.default, __assign({ variant: "standard", error: !!shouldShowError, fullWidth: true, css: [
123
- (0, makeFormControlPhoneNumberStyling_1.default)({
124
- isAnswered: isAnswered !== null && isAnswered !== void 0 ? isAnswered : false,
125
- isAutoFilledActive: isAutoFilledActive !== null && isAutoFilledActive !== void 0 ? isAutoFilledActive : false,
126
- isSafari: isSafari !== null && isSafari !== void 0 ? isSafari : false,
127
- hasError: !!shouldShowError,
128
- }),
129
- (0, makeFormControlStyles_1.default)({
130
- isAutoFilledActive: isAutoFilledActive !== null && isAutoFilledActive !== void 0 ? isAutoFilledActive : false,
131
- isSafari: isSafari !== null && isSafari !== void 0 ? isSafari : false
132
- }),
133
- ], sx: { position: 'relative' } }, { children: [label && ((0, jsx_runtime_1.jsx)(InputLabel_1.default, __assign({ isAnswered: isAnswered !== null && isAnswered !== void 0 ? isAnswered : false, htmlFor: id, shrink: true, experimentName: experimentName }, { children: label }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "phone-input-container" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ ref: countrySelectorRef, className: "country-selector", onClick: enableCountryChange ? countrySelector.handleCountrySelectClick : undefined, style: {
134
- display: 'flex',
135
- alignItems: 'center',
136
- padding: '8px 12px',
137
- cursor: enableCountryChange ? 'pointer' : 'default',
138
- minWidth: '80px',
139
- justifyContent: 'center',
140
- }, role: enableCountryChange ? 'button' : undefined, tabIndex: enableCountryChange ? 0 : undefined, "aria-label": enableCountryChange
141
- ? "Select country, currently ".concat(phoneNumber.selectedCountry.name)
142
- : "Country: ".concat(phoneNumber.selectedCountry.name), onKeyDown: countrySelector.handleKeyDown }, { children: [(0, jsx_runtime_1.jsx)(FlagIcon_1.default, { countryCode: phoneNumber.selectedCountry.code, style: { marginRight: '8px' } }), enableCountryChange && ((0, jsx_runtime_1.jsx)(ExpandMore_1.default, { style: {
143
- fontSize: '16px',
144
- color: 'rgba(0, 0, 0, 1)',
145
- marginLeft: '4px',
146
- transform: countrySelector.isCountryMenuOpen
147
- ? 'rotate(180deg)'
148
- : 'rotate(0deg)',
149
- transition: 'transform 0.1s ease-in-out',
150
- } }))] })), (0, jsx_runtime_1.jsx)(Input_1.default, __assign({ error: !!shouldShowError, id: id, onChange: handlePhoneChange, isAnswered: isAnswered !== null && isAnswered !== void 0 ? isAnswered : false, value: phoneNumber.phoneNumber, isSafari: isSafari !== null && isSafari !== void 0 ? isSafari : false, isAutoFilledActive: isAutoFilledActive !== null && isAutoFilledActive !== void 0 ? isAutoFilledActive : false, experimentName: experimentName, type: "tel", placeholder: placeholder || phoneNumber.selectedCountry.example, inputRef: inputRef, disabled: disabled, onBlur: onBlur, onClick: onClick }, props))] })), finalErrorMessage && ((0, jsx_runtime_1.jsx)(FormHelperText_1.default, { children: finalErrorMessage }))] })), enableCountryChange && useModalForCountrySelection ? ((0, jsx_runtime_1.jsx)(CountryModal_1.default, { selectedCountry: phoneNumber.selectedCountry, onCountryChange: handleCountryChange, enableCountrySearch: enableCountrySearch, open: countrySelector.isCountryMenuOpen, onClose: countrySelector.closeCountryMenu })) : ((0, jsx_runtime_1.jsx)(CountryDropdown_1.default, { selectedCountry: phoneNumber.selectedCountry, onCountryChange: handleCountryChange, enableCountrySearch: enableCountrySearch, anchorEl: countrySelectorRef.current, open: countrySelector.isCountryMenuOpen, onClose: countrySelector.closeCountryMenu }))] }));
151
- };
152
- PhoneNumberTextFieldRefactored.defaultProps = defaultProps;
153
- exports.default = PhoneNumberTextFieldRefactored;
154
- //# sourceMappingURL=PhoneNumberTextFieldRefactored.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PhoneNumberTextFieldRefactored.js","sourceRoot":"","sources":["../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldRefactored.tsx"],"names":[],"mappings":"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"}
@@ -1,17 +0,0 @@
1
- import * as React from 'react';
2
- type StoryType = React.FunctionComponent<{
3
- disabled: boolean;
4
- errorMessage: string;
5
- isAnswered: boolean;
6
- label: string;
7
- placeholder: string;
8
- type: 'tel' | 'text';
9
- parentContainerMaxWidth: number;
10
- isSafari: boolean;
11
- isAutoFilledActive: boolean;
12
- enableCountryChange: boolean;
13
- enableCountrySearch: boolean;
14
- useModalForCountrySelection: boolean;
15
- }>;
16
- declare const PhoneNumberTextFieldStory: StoryType;
17
- export default PhoneNumberTextFieldStory;
@@ -1,29 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- var __importDefault = (this && this.__importDefault) || function (mod) {
14
- return (mod && mod.__esModule) ? mod : { "default": mod };
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
18
- var addon_actions_1 = require("@storybook/addon-actions");
19
- var PhoneNumberTextField_1 = __importDefault(require("./PhoneNumberTextField"));
20
- var handleChange = function (_a) {
21
- var id = _a.id, value = _a.value;
22
- (0, addon_actions_1.action)('Input Change')({ phone: value });
23
- };
24
- var PhoneNumberTextFieldStory = function (_a) {
25
- 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;
26
- return ((0, jsx_runtime_1.jsx)("div", __assign({ style: { maxWidth: parentContainerMaxWidth } }, { children: (0, jsx_runtime_1.jsx)(PhoneNumberTextField_1.default, { disabled: disabled, errorMessage: errorMessage, onChange: handleChange, type: type, id: "id", isAnswered: isAnswered, label: label, placeholder: placeholder, isSafari: isSafari, isAutoFilledActive: isAutoFilledActive, experimentName: "default", enableCountryChange: enableCountryChange, enableCountrySearch: enableCountrySearch, useModalForCountrySelection: useModalForCountrySelection }) })));
27
- };
28
- exports.default = PhoneNumberTextFieldStory;
29
- //# sourceMappingURL=PhoneNumberTextFieldStory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PhoneNumberTextFieldStory.js","sourceRoot":"","sources":["../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/PhoneNumberTextFieldStory.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,0DAAkD;AAGlD,gFAA0D;AAiB1D,IAAM,YAAY,GAAG,UAAC,EAAkD;QAAhD,EAAE,QAAA,EAAE,KAAK,WAAA;IAC/B,IAAA,sBAAM,EAAC,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF,IAAM,yBAAyB,GAAc,UAAC,EAa7C;QAZC,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,IAAI,UAAA,EACJ,UAAU,gBAAA,EACV,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,uBAAuB,6BAAA,EACvB,QAAQ,cAAA,EACR,kBAAkB,wBAAA,EAClB,mBAAmB,yBAAA,EACnB,mBAAmB,yBAAA,EACnB,2BAA2B,iCAAA;IAE3B,OAAO,CACL,yCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,uBAAuB,EAAE,gBAC/C,uBAAC,8BAAoB,IACnB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,IAAI,EACP,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,kBAAkB,EACtC,cAAc,EAAC,SAAS,EACxB,mBAAmB,EAAE,mBAAmB,EACxC,mBAAmB,EAAE,mBAAmB,EACxC,2BAA2B,EAAE,2BAA2B,GACxD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,yBAAyB,CAAC"}
@@ -1,12 +0,0 @@
1
- import { PhoneValidationResult } from '../utils/phoneValidation';
2
- export interface DebouncedValidationOptions {
3
- validationFunction: () => PhoneValidationResult | null;
4
- delay?: number;
5
- immediate?: boolean;
6
- }
7
- export interface DebouncedValidationReturn {
8
- debouncedResult: PhoneValidationResult | null;
9
- isValidating: boolean;
10
- validateNow: () => void;
11
- }
12
- export declare const useDebouncedValidation: ({ validationFunction, delay, immediate, }: DebouncedValidationOptions) => DebouncedValidationReturn;
@@ -1,70 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useDebouncedValidation = void 0;
4
- var react_1 = require("react");
5
- var useDebouncedValidation = function (_a) {
6
- var validationFunction = _a.validationFunction, _b = _a.delay, delay = _b === void 0 ? 300 : _b, _c = _a.immediate, immediate = _c === void 0 ? false : _c;
7
- var _d = (0, react_1.useState)(null), debouncedResult = _d[0], setDebouncedResult = _d[1];
8
- var _e = (0, react_1.useState)(false), isValidating = _e[0], setIsValidating = _e[1];
9
- var timeoutRef = (0, react_1.useRef)(null);
10
- var isFirstCall = (0, react_1.useRef)(true);
11
- var validationFunctionRef = (0, react_1.useRef)(validationFunction);
12
- // Update the ref when validationFunction changes instead of recreating callbacks
13
- (0, react_1.useEffect)(function () {
14
- validationFunctionRef.current = validationFunction;
15
- }, [validationFunction]);
16
- var validateNow = (0, react_1.useCallback)(function () {
17
- if (timeoutRef.current) {
18
- clearTimeout(timeoutRef.current);
19
- timeoutRef.current = null;
20
- }
21
- setIsValidating(false);
22
- var result = validationFunctionRef.current();
23
- setDebouncedResult(result);
24
- }, []); // No dependencies since we use ref
25
- var debouncedValidate = (0, react_1.useCallback)(function () {
26
- if (timeoutRef.current) {
27
- clearTimeout(timeoutRef.current);
28
- }
29
- // If it's the first call and immediate validation is enabled, validate right away
30
- if (isFirstCall.current && immediate) {
31
- isFirstCall.current = false;
32
- validateNow();
33
- return;
34
- }
35
- isFirstCall.current = false;
36
- setIsValidating(true);
37
- timeoutRef.current = setTimeout(function () {
38
- validateNow();
39
- }, delay);
40
- }, [delay, immediate, validateNow]);
41
- // Only trigger validation when the validation function actually changes
42
- // Use a ref to track the previous function to avoid infinite loops
43
- var prevValidationFunctionRef = (0, react_1.useRef)(validationFunction);
44
- (0, react_1.useEffect)(function () {
45
- // Only re-validate if the function reference actually changed
46
- if (prevValidationFunctionRef.current !== validationFunction) {
47
- prevValidationFunctionRef.current = validationFunction;
48
- debouncedValidate();
49
- }
50
- return function () {
51
- if (timeoutRef.current) {
52
- clearTimeout(timeoutRef.current);
53
- }
54
- };
55
- }, [validationFunction, debouncedValidate]);
56
- (0, react_1.useEffect)(function () {
57
- return function () {
58
- if (timeoutRef.current) {
59
- clearTimeout(timeoutRef.current);
60
- }
61
- };
62
- }, []);
63
- return {
64
- debouncedResult: debouncedResult,
65
- isValidating: isValidating,
66
- validateNow: validateNow,
67
- };
68
- };
69
- exports.useDebouncedValidation = useDebouncedValidation;
70
- //# sourceMappingURL=useDebouncedValidation.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useDebouncedValidation.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/hooks/useDebouncedValidation.ts"],"names":[],"mappings":";;;AAAA,+BAAiE;AAe1D,IAAM,sBAAsB,GAAG,UAAC,EAIV;QAH3B,kBAAkB,wBAAA,EAClB,aAAW,EAAX,KAAK,mBAAG,GAAG,KAAA,EACX,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA;IAEX,IAAA,KACJ,IAAA,gBAAQ,EAA+B,IAAI,CAAC,EADvC,eAAe,QAAA,EAAE,kBAAkB,QACI,CAAC;IACzC,IAAA,KAAkC,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAAhD,YAAY,QAAA,EAAE,eAAe,QAAmB,CAAC;IACxD,IAAM,UAAU,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IACvD,IAAM,WAAW,GAAG,IAAA,cAAM,EAAC,IAAI,CAAC,CAAC;IACjC,IAAM,qBAAqB,GAAG,IAAA,cAAM,EAAC,kBAAkB,CAAC,CAAC;IAEzD,iFAAiF;IACjF,IAAA,iBAAS,EAAC;QACR,qBAAqB,CAAC,OAAO,GAAG,kBAAkB,CAAC;IACrD,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,IAAM,WAAW,GAAG,IAAA,mBAAW,EAAC;QAC9B,IAAI,UAAU,CAAC,OAAO,EAAE;YACtB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YACjC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;SAC3B;QAED,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,IAAM,MAAM,GAAG,qBAAqB,CAAC,OAAO,EAAE,CAAC;QAC/C,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,mCAAmC;IAE3C,IAAM,iBAAiB,GAAG,IAAA,mBAAW,EAAC;QACpC,IAAI,UAAU,CAAC,OAAO,EAAE;YACtB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;SAClC;QAED,kFAAkF;QAClF,IAAI,WAAW,CAAC,OAAO,IAAI,SAAS,EAAE;YACpC,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;YAC5B,WAAW,EAAE,CAAC;YACd,OAAO;SACR;QAED,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;QAC5B,eAAe,CAAC,IAAI,CAAC,CAAC;QAEtB,UAAU,CAAC,OAAO,GAAG,UAAU,CAAC;YAC9B,WAAW,EAAE,CAAC;QAChB,CAAC,EAAE,KAAK,CAAC,CAAC;IACZ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC;IAEpC,wEAAwE;IACxE,mEAAmE;IACnE,IAAM,yBAAyB,GAAG,IAAA,cAAM,EAAC,kBAAkB,CAAC,CAAC;IAC7D,IAAA,iBAAS,EAAC;QACR,8DAA8D;QAC9D,IAAI,yBAAyB,CAAC,OAAO,KAAK,kBAAkB,EAAE;YAC5D,yBAAyB,CAAC,OAAO,GAAG,kBAAkB,CAAC;YACvD,iBAAiB,EAAE,CAAC;SACrB;QAED,OAAO;YACL,IAAI,UAAU,CAAC,OAAO,EAAE;gBACtB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;aAClC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,kBAAkB,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAE5C,IAAA,iBAAS,EAAC;QACR,OAAO;YACL,IAAI,UAAU,CAAC,OAAO,EAAE;gBACtB,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;aAClC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,eAAe,iBAAA;QACf,YAAY,cAAA;QACZ,WAAW,aAAA;KACZ,CAAC;AACJ,CAAC,CAAC;AA9EW,QAAA,sBAAsB,0BA8EjC"}
@@ -1,20 +0,0 @@
1
- import * as React from 'react';
2
- type DebouncedValidationStoryType = React.FunctionComponent<{
3
- disabled: boolean;
4
- errorMessage?: string;
5
- isAnswered: boolean;
6
- label: string;
7
- placeholder?: string;
8
- type: 'tel' | 'text';
9
- parentContainerMaxWidth: number;
10
- isSafari: boolean;
11
- isAutoFilledActive: boolean;
12
- enableCountryChange: boolean;
13
- enableCountrySearch: boolean;
14
- useModalForCountrySelection: boolean;
15
- enableDebouncedValidation: boolean;
16
- validationDelay: number;
17
- strictMode?: boolean;
18
- }>;
19
- declare const DebouncedValidationStory: DebouncedValidationStoryType;
20
- export default DebouncedValidationStory;
@@ -1,60 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- var __importDefault = (this && this.__importDefault) || function (mod) {
14
- return (mod && mod.__esModule) ? mod : { "default": mod };
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
18
- var addon_actions_1 = require("@storybook/addon-actions");
19
- var react_1 = require("react");
20
- var PhoneNumberTextField_1 = __importDefault(require("../../PhoneNumberTextField"));
21
- var DebouncedValidationStory = function (_a) {
22
- 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, enableDebouncedValidation = _a.enableDebouncedValidation, validationDelay = _a.validationDelay, strictMode = _a.strictMode;
23
- var _b = (0, react_1.useState)(''), phoneValue = _b[0], setPhoneValue = _b[1];
24
- var _c = (0, react_1.useState)({
25
- isValid: false,
26
- }), validationInfo = _c[0], setValidationInfo = _c[1];
27
- var handlePhoneNumberChange = function (params) {
28
- (0, addon_actions_1.action)('Phone Number Change')(params);
29
- setPhoneValue(params.phoneNumber);
30
- };
31
- var handleValidationChange = function (params) {
32
- (0, addon_actions_1.action)('Validation Change')(params);
33
- setValidationInfo({
34
- isValid: params.isValid,
35
- errorMessage: params.validationResult.errorMessage,
36
- isValidating: false,
37
- });
38
- };
39
- var handleFormattedValueChange = function (params) {
40
- (0, addon_actions_1.action)('Formatted Value Change')(params);
41
- };
42
- var handleCountryChange = function (params) {
43
- (0, addon_actions_1.action)('Country Change')(params);
44
- };
45
- return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: { maxWidth: parentContainerMaxWidth, padding: '20px' } }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ style: {
46
- backgroundColor: '#f5f5f5',
47
- padding: '16px',
48
- borderRadius: '8px',
49
- marginBottom: '20px',
50
- fontFamily: 'monospace',
51
- } }, { children: [(0, jsx_runtime_1.jsx)("h3", __assign({ style: { margin: '0 0 12px 0', color: '#333' } }, { children: "Debounced Validation Demo" })), (0, jsx_runtime_1.jsxs)("div", __assign({ style: { fontSize: '14px', lineHeight: '1.5' } }, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Debounced Validation:" }), ' ', enableDebouncedValidation ? 'Enabled' : 'Disabled'] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Validation Delay:" }), " ", validationDelay, "ms"] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Current Value:" }), " \"", phoneValue, "\""] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Is Valid:" }), ' ', (0, jsx_runtime_1.jsx)("span", __assign({ style: { color: validationInfo.isValid ? 'green' : 'red' } }, { children: validationInfo.isValid ? 'Yes' : 'No' }))] }), validationInfo.errorMessage && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Error:" }), ' ', (0, jsx_runtime_1.jsx)("span", __assign({ style: { color: 'red' } }, { children: validationInfo.errorMessage }))] })), validationInfo.isValidating && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Status:" }), ' ', (0, jsx_runtime_1.jsx)("span", __assign({ style: { color: 'orange' } }, { children: "Validating..." }))] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ style: {
52
- backgroundColor: '#e3f2fd',
53
- padding: '16px',
54
- borderRadius: '8px',
55
- marginBottom: '20px',
56
- fontSize: '14px',
57
- } }, { children: [(0, jsx_runtime_1.jsx)("h4", __assign({ style: { margin: '0 0 8px 0', color: '#1976d2' } }, { children: "How to Test Debounced Validation:" })), (0, jsx_runtime_1.jsxs)("ol", __assign({ style: { margin: 0, paddingLeft: '20px' } }, { children: [(0, jsx_runtime_1.jsx)("li", { children: "Type quickly in the phone field - notice validation is delayed" }), (0, jsx_runtime_1.jsx)("li", { children: "When debounced validation is enabled, you'll see \"Validating...\" during the delay" }), (0, jsx_runtime_1.jsx)("li", { children: "Try typing: \"+1555555\" then pause to see validation kick in" }), (0, jsx_runtime_1.jsx)("li", { children: "Compare behavior with debounced validation enabled vs disabled" }), (0, jsx_runtime_1.jsx)("li", { children: "Check the Actions panel to see when callbacks are fired" })] }))] })), (0, jsx_runtime_1.jsx)(PhoneNumberTextField_1.default, { disabled: disabled, errorMessage: errorMessage, onPhoneNumberChange: handlePhoneNumberChange, onValidationChange: handleValidationChange, onFormattedValueChange: handleFormattedValueChange, onCountryChange: handleCountryChange, type: type, id: "debounced-phone-input", isAnswered: isAnswered, label: label, placeholder: placeholder, value: phoneValue, isSafari: isSafari, isAutoFilledActive: isAutoFilledActive, experimentName: "debounced-validation-story", enableCountryChange: enableCountryChange, enableCountrySearch: enableCountrySearch, useModalForCountrySelection: useModalForCountrySelection, enableDebouncedValidation: enableDebouncedValidation, validationDelay: validationDelay, strictMode: strictMode })] })));
58
- };
59
- exports.default = DebouncedValidationStory;
60
- //# sourceMappingURL=DebouncedValidationStory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DebouncedValidationStory.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/DebouncedValidationStory.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,0DAAkD;AAElD,+BAAiC;AACjC,oFAA8D;AA0B9D,IAAM,wBAAwB,GAAiC,UAAC,EAgB/D;QAfC,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,IAAI,UAAA,EACJ,UAAU,gBAAA,EACV,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,uBAAuB,6BAAA,EACvB,QAAQ,cAAA,EACR,kBAAkB,wBAAA,EAClB,mBAAmB,yBAAA,EACnB,mBAAmB,yBAAA,EACnB,2BAA2B,iCAAA,EAC3B,yBAAyB,+BAAA,EACzB,eAAe,qBAAA,EACf,UAAU,gBAAA;IAEJ,IAAA,KAA8B,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAAzC,UAAU,QAAA,EAAE,aAAa,QAAgB,CAAC;IAC3C,IAAA,KAAsC,IAAA,gBAAQ,EAIjD;QACD,OAAO,EAAE,KAAK;KACf,CAAC,EANK,cAAc,QAAA,EAAE,iBAAiB,QAMtC,CAAC;IAEH,IAAM,uBAAuB,GAAG,UAAC,MAAgC;QAC/D,IAAA,sBAAM,EAAC,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;QACtC,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IACpC,CAAC,CAAC;IAEF,IAAM,sBAAsB,GAAG,UAAC,MAA+B;QAC7D,IAAA,sBAAM,EAAC,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC;QACpC,iBAAiB,CAAC;YAChB,OAAO,EAAE,MAAM,CAAC,OAAO;YACvB,YAAY,EAAE,MAAM,CAAC,gBAAgB,CAAC,YAAY;YAClD,YAAY,EAAE,KAAK;SACpB,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,IAAM,0BAA0B,GAAG,UAAC,MAAmC;QACrE,IAAA,sBAAM,EAAC,wBAAwB,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG,UAAC,MAA4B;QACvD,IAAA,sBAAM,EAAC,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,0CAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,uBAAuB,EAAE,OAAO,EAAE,MAAM,EAAE,iBAEhE,0CACE,KAAK,EAAE;oBACL,eAAe,EAAE,SAAS;oBAC1B,OAAO,EAAE,MAAM;oBACf,YAAY,EAAE,KAAK;oBACnB,YAAY,EAAE,MAAM;oBACpB,UAAU,EAAE,WAAW;iBACxB,iBAED,wCAAI,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,+CAE7C,EACL,0CAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,iBACjD,4CACE,uEAAsC,EAAC,GAAG,EACzC,yBAAyB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,IAC/C,EACN,4CACE,mEAAkC,OAAE,eAAe,UAC/C,EACN,4CACE,gEAA+B,SAAG,UAAU,UACxC,EACN,4CACE,2DAA0B,EAAC,GAAG,EAC9B,0CAAM,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,gBAC7D,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IACjC,IACH,EACL,cAAc,CAAC,YAAY,IAAI,CAC9B,4CACE,wDAAuB,EAAC,GAAG,EAC3B,0CAAM,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,gBAC1B,cAAc,CAAC,YAAY,IACvB,IACH,CACP,EACA,cAAc,CAAC,YAAY,IAAI,CAC9B,4CACE,yDAAwB,EAAC,GAAG,EAC5B,0CAAM,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,mCAAsB,IAClD,CACP,KACG,KACF,EAGN,0CACE,KAAK,EAAE;oBACL,eAAe,EAAE,SAAS;oBAC1B,OAAO,EAAE,MAAM;oBACf,YAAY,EAAE,KAAK;oBACnB,YAAY,EAAE,MAAM;oBACpB,QAAQ,EAAE,MAAM;iBACjB,iBAED,wCAAI,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,uDAE/C,EACL,yCAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,iBAC3C,4GAEK,EACL,iIAGK,EACL,2GAAoE,EACpE,4GAEK,EACL,qGAAgE,KAC7D,KACD,EAGN,uBAAC,8BAAoB,IACnB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,mBAAmB,EAAE,uBAAuB,EAC5C,kBAAkB,EAAE,sBAAsB,EAC1C,sBAAsB,EAAE,0BAA0B,EAClD,eAAe,EAAE,mBAAmB,EACpC,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,uBAAuB,EAC1B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,kBAAkB,EACtC,cAAc,EAAC,4BAA4B,EAC3C,mBAAmB,EAAE,mBAAmB,EACxC,mBAAmB,EAAE,mBAAmB,EACxC,2BAA2B,EAAE,2BAA2B,EACxD,yBAAyB,EAAE,yBAAyB,EACpD,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,GACtB,KACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,wBAAwB,CAAC"}
@@ -1,18 +0,0 @@
1
- import * as React from 'react';
2
- type StrictModeStoryType = React.FunctionComponent<{
3
- disabled: boolean;
4
- errorMessage?: string;
5
- isAnswered: boolean;
6
- label: string;
7
- placeholder?: string;
8
- type: 'tel' | 'text';
9
- parentContainerMaxWidth: number;
10
- isSafari: boolean;
11
- isAutoFilledActive: boolean;
12
- enableCountryChange: boolean;
13
- enableCountrySearch: boolean;
14
- useModalForCountrySelection: boolean;
15
- strictMode: boolean;
16
- }>;
17
- declare const StrictModeStory: StrictModeStoryType;
18
- export default StrictModeStory;
@@ -1,101 +0,0 @@
1
- "use strict";
2
- var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
3
- if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
4
- if (ar || !(i in from)) {
5
- if (!ar) ar = Array.prototype.slice.call(from, 0, i);
6
- ar[i] = from[i];
7
- }
8
- }
9
- return to.concat(ar || Array.prototype.slice.call(from));
10
- };
11
- var __importDefault = (this && this.__importDefault) || function (mod) {
12
- return (mod && mod.__esModule) ? mod : { "default": mod };
13
- };
14
- Object.defineProperty(exports, "__esModule", { value: true });
15
- var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
16
- var addon_actions_1 = require("@storybook/addon-actions");
17
- var react_1 = require("react");
18
- var PhoneNumberTextField_1 = __importDefault(require("../../PhoneNumberTextField"));
19
- var StrictModeStory = function (_a) {
20
- 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;
21
- var _b = (0, react_1.useState)(''), phoneValue = _b[0], setPhoneValue = _b[1];
22
- var _c = (0, react_1.useState)({
23
- isValid: false,
24
- }), validationInfo = _c[0], setValidationInfo = _c[1];
25
- var _d = (0, react_1.useState)([]), inputHistory = _d[0], setInputHistory = _d[1];
26
- var handlePhoneNumberChange = function (params) {
27
- (0, addon_actions_1.action)('Phone Number Change')(params);
28
- setPhoneValue(params.phoneNumber);
29
- // Track input history for demonstration
30
- setInputHistory(function (prev) { return __spreadArray(__spreadArray([], prev.slice(-4), true), [params.phoneNumber], false); });
31
- };
32
- var handleValidationChange = function (params) {
33
- (0, addon_actions_1.action)('Validation Change')(params);
34
- setValidationInfo({
35
- isValid: params.isValid,
36
- errorMessage: params.validationResult.errorMessage,
37
- isValidating: false,
38
- });
39
- };
40
- var handleFormattedValueChange = function (params) {
41
- (0, addon_actions_1.action)('Formatted Value Change')(params);
42
- };
43
- var handleCountryChange = function (params) {
44
- (0, addon_actions_1.action)('Country Change')(params);
45
- };
46
- var getStrictModeDescription = function () {
47
- if (strictMode) {
48
- return {
49
- title: 'Strict Mode: ENABLED',
50
- color: '#2e7d32',
51
- description: 'Only numeric characters and + at the beginning are allowed. Invalid characters are automatically filtered out.',
52
- examples: [
53
- 'Input: "abc123def" → Output: "123"',
54
- 'Input: "++123++456" → Output: "+123456"',
55
- 'Input: "123-456-7890" → Output: "1234567890"',
56
- 'Input: "123@456#789" → Output: "123456789"',
57
- ],
58
- };
59
- }
60
- else {
61
- return {
62
- title: 'Strict Mode: DISABLED',
63
- color: '#d32f2f',
64
- description: 'All characters are allowed. No input filtering is applied.',
65
- examples: [
66
- 'Input: "abc123def" → Output: "abc123def"',
67
- 'Input: "++123++456" → Output: "++123++456"',
68
- 'Input: "123-456-7890" → Output: "123-456-7890"',
69
- 'Input: "123@456#789" → Output: "123@456#789"',
70
- ],
71
- };
72
- }
73
- };
74
- var strictModeInfo = getStrictModeDescription();
75
- return ((0, jsx_runtime_1.jsxs)("div", { style: { maxWidth: parentContainerMaxWidth, padding: '20px' }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
76
- backgroundColor: '#f5f5f5',
77
- padding: '16px',
78
- borderRadius: '8px',
79
- marginBottom: '20px',
80
- fontFamily: 'monospace',
81
- borderLeft: "4px solid ".concat(strictModeInfo.color),
82
- }, children: [(0, jsx_runtime_1.jsx)("h3", { style: { margin: '0 0 12px 0', color: strictModeInfo.color }, children: strictModeInfo.title }), (0, jsx_runtime_1.jsx)("div", { style: { fontSize: '14px', lineHeight: '1.5', marginBottom: '12px' }, children: strictModeInfo.description }), (0, jsx_runtime_1.jsxs)("div", { style: { fontSize: '13px', color: '#666' }, children: [(0, jsx_runtime_1.jsx)("strong", { children: "Examples:" }), (0, jsx_runtime_1.jsx)("ul", { style: { margin: '8px 0 0 0', paddingLeft: '20px' }, children: strictModeInfo.examples.map(function (example, index) { return ((0, jsx_runtime_1.jsx)("li", { children: example }, index)); }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
83
- backgroundColor: '#e8f5e8',
84
- padding: '16px',
85
- borderRadius: '8px',
86
- marginBottom: '20px',
87
- fontFamily: 'monospace',
88
- }, children: [(0, jsx_runtime_1.jsx)("h4", { style: { margin: '0 0 12px 0', color: '#2e7d32' }, children: "Current State" }), (0, jsx_runtime_1.jsxs)("div", { style: { fontSize: '14px', lineHeight: '1.5' }, children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Current Value:" }), " \"", phoneValue, "\""] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Is Valid:" }), ' ', (0, jsx_runtime_1.jsx)("span", { style: { color: validationInfo.isValid ? 'green' : 'red' }, children: validationInfo.isValid ? 'Yes' : 'No' })] }), validationInfo.errorMessage && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Error:" }), ' ', (0, jsx_runtime_1.jsx)("span", { style: { color: 'red' }, children: validationInfo.errorMessage })] })), inputHistory.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Input History:" }), ' ', (0, jsx_runtime_1.jsx)("span", { style: { color: '#666', fontSize: '12px' }, children: inputHistory
89
- .map(function (val, i) {
90
- return "\"".concat(val, "\"").concat(i < inputHistory.length - 1 ? ' → ' : '');
91
- })
92
- .join('') })] }))] })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
93
- backgroundColor: '#e3f2fd',
94
- padding: '16px',
95
- borderRadius: '8px',
96
- marginBottom: '20px',
97
- fontSize: '14px',
98
- }, children: [(0, jsx_runtime_1.jsx)("h4", { style: { margin: '0 0 8px 0', color: '#1976d2' }, children: "How to Test Strict Mode:" }), (0, jsx_runtime_1.jsxs)("ol", { style: { margin: 0, paddingLeft: '20px' }, children: [(0, jsx_runtime_1.jsxs)("li", { children: ["Try typing non-numeric characters: ", (0, jsx_runtime_1.jsx)("code", { children: "abc123def" })] }), (0, jsx_runtime_1.jsxs)("li", { children: ["Try multiple plus signs: ", (0, jsx_runtime_1.jsx)("code", { children: "++123++456" })] }), (0, jsx_runtime_1.jsxs)("li", { children: ["Try special characters: ", (0, jsx_runtime_1.jsx)("code", { children: "123-456-7890" })] }), (0, jsx_runtime_1.jsxs)("li", { children: ["Try mixed content: ", (0, jsx_runtime_1.jsx)("code", { children: "123@456#789" })] }), (0, jsx_runtime_1.jsx)("li", { children: "Watch how the input is filtered in real-time" }), (0, jsx_runtime_1.jsx)("li", { children: "Check the Actions panel to see when callbacks are fired" })] })] }), (0, jsx_runtime_1.jsx)(PhoneNumberTextField_1.default, { disabled: disabled, errorMessage: errorMessage, onPhoneNumberChange: handlePhoneNumberChange, onValidationChange: handleValidationChange, onFormattedValueChange: handleFormattedValueChange, onCountryChange: handleCountryChange, type: type, id: "strict-mode-phone-input", isAnswered: isAnswered, label: label, placeholder: placeholder, value: phoneValue, isSafari: isSafari, isAutoFilledActive: isAutoFilledActive, experimentName: "strict-mode-story", enableCountryChange: enableCountryChange, enableCountrySearch: enableCountrySearch, useModalForCountrySelection: useModalForCountrySelection, strictMode: strictMode })] }));
99
- };
100
- exports.default = StrictModeStory;
101
- //# sourceMappingURL=StrictModeStory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"StrictModeStory.js","sourceRoot":"","sources":["../../../../../../src/Components/Molecules/PhoneNumberTextFieldCustom/__helpers__/stories/StrictModeStory.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,0DAAkD;AAElD,+BAAiC;AACjC,oFAA8D;AAwB9D,IAAM,eAAe,GAAwB,UAAC,EAc7C;QAbC,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,IAAI,UAAA,EACJ,UAAU,gBAAA,EACV,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,uBAAuB,6BAAA,EACvB,QAAQ,cAAA,EACR,kBAAkB,wBAAA,EAClB,mBAAmB,yBAAA,EACnB,mBAAmB,yBAAA,EACnB,2BAA2B,iCAAA,EAC3B,UAAU,gBAAA;IAEJ,IAAA,KAA8B,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAAzC,UAAU,QAAA,EAAE,aAAa,QAAgB,CAAC;IAC3C,IAAA,KAAsC,IAAA,gBAAQ,EAIjD;QACD,OAAO,EAAE,KAAK;KACf,CAAC,EANK,cAAc,QAAA,EAAE,iBAAiB,QAMtC,CAAC;IACG,IAAA,KAAkC,IAAA,gBAAQ,EAAW,EAAE,CAAC,EAAvD,YAAY,QAAA,EAAE,eAAe,QAA0B,CAAC;IAE/D,IAAM,uBAAuB,GAAG,UAAC,MAAgC;QAC/D,IAAA,sBAAM,EAAC,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;QACtC,aAAa,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QAElC,wCAAwC;QACxC,eAAe,CAAC,UAAC,IAAI,IAAK,uCAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,UAAE,MAAM,CAAC,WAAW,WAAtC,CAAuC,CAAC,CAAC;IACrE,CAAC,CAAC;IAEF,IAAM,sBAAsB,GAAG,UAAC,MAA+B;QAC7D,IAAA,sBAAM,EAAC,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC;QACpC,iBAAiB,CAAC;YAChB,OAAO,EAAE,MAAM,CAAC,OAAO;YACvB,YAAY,EAAE,MAAM,CAAC,gBAAgB,CAAC,YAAY;YAClD,YAAY,EAAE,KAAK;SACpB,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,IAAM,0BAA0B,GAAG,UAAC,MAAmC;QACrE,IAAA,sBAAM,EAAC,wBAAwB,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG,UAAC,MAA4B;QACvD,IAAA,sBAAM,EAAC,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,IAAM,wBAAwB,GAAG;QAC/B,IAAI,UAAU,EAAE,CAAC;YACf,OAAO;gBACL,KAAK,EAAE,sBAAsB;gBAC7B,KAAK,EAAE,SAAS;gBAChB,WAAW,EACT,gHAAgH;gBAClH,QAAQ,EAAE;oBACR,oCAAoC;oBACpC,yCAAyC;oBACzC,8CAA8C;oBAC9C,4CAA4C;iBAC7C;aACF,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,OAAO;gBACL,KAAK,EAAE,uBAAuB;gBAC9B,KAAK,EAAE,SAAS;gBAChB,WAAW,EACT,4DAA4D;gBAC9D,QAAQ,EAAE;oBACR,0CAA0C;oBAC1C,4CAA4C;oBAC5C,gDAAgD;oBAChD,8CAA8C;iBAC/C;aACF,CAAC;QACJ,CAAC;IACH,CAAC,CAAC;IAEF,IAAM,cAAc,GAAG,wBAAwB,EAAE,CAAC;IAElD,OAAO,CACL,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,uBAAuB,EAAE,OAAO,EAAE,MAAM,EAAE,aAEhE,iCACE,KAAK,EAAE;oBACL,eAAe,EAAE,SAAS;oBAC1B,OAAO,EAAE,MAAM;oBACf,YAAY,EAAE,KAAK;oBACnB,YAAY,EAAE,MAAM;oBACpB,UAAU,EAAE,WAAW;oBACvB,UAAU,EAAE,oBAAa,cAAc,CAAC,KAAK,CAAE;iBAChD,aAED,+BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,YAC7D,cAAc,CAAC,KAAK,GAClB,EACL,gCACE,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,YAEnE,cAAc,CAAC,WAAW,GACvB,EACN,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,aAC7C,2DAA0B,EAC1B,+BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,EAAE,YACpD,cAAc,CAAC,QAAQ,CAAC,GAAG,CAAC,UAAC,OAAO,EAAE,KAAK,IAAK,OAAA,CAC/C,yCAAiB,OAAO,IAAf,KAAK,CAAgB,CAC/B,EAFgD,CAEhD,CAAC,GACC,IACD,IACF,EAGN,iCACE,KAAK,EAAE;oBACL,eAAe,EAAE,SAAS;oBAC1B,OAAO,EAAE,MAAM;oBACf,YAAY,EAAE,KAAK;oBACnB,YAAY,EAAE,MAAM;oBACpB,UAAU,EAAE,WAAW;iBACxB,aAED,+BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,EAAE,8BAEhD,EACL,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,aACjD,4CACE,gEAA+B,SAAG,UAAU,UACxC,EACN,4CACE,2DAA0B,EAAC,GAAG,EAC9B,iCAAM,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,YAC7D,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,GACjC,IACH,EACL,cAAc,CAAC,YAAY,IAAI,CAC9B,4CACE,wDAAuB,EAAC,GAAG,EAC3B,iCAAM,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,YAC1B,cAAc,CAAC,YAAY,GACvB,IACH,CACP,EACA,YAAY,CAAC,MAAM,GAAG,CAAC,IAAI,CAC1B,4CACE,gEAA+B,EAAC,GAAG,EACnC,iCAAM,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,YAC7C,YAAY;6CACV,GAAG,CACF,UAAC,GAAG,EAAE,CAAC;4CACL,OAAA,YAAI,GAAG,eAAI,CAAC,GAAG,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAE;wCAArD,CAAqD,CACxD;6CACA,IAAI,CAAC,EAAE,CAAC,GACN,IACH,CACP,IACG,IACF,EAGN,iCACE,KAAK,EAAE;oBACL,eAAe,EAAE,SAAS;oBAC1B,OAAO,EAAE,MAAM;oBACf,YAAY,EAAE,KAAK;oBACnB,YAAY,EAAE,MAAM;oBACpB,QAAQ,EAAE,MAAM;iBACjB,aAED,+BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,yCAE/C,EACL,gCAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,aAC3C,kFACqC,yDAAsB,IACtD,EACL,wEAC2B,0DAAuB,IAC7C,EACL,uEAC0B,4DAAyB,IAC9C,EACL,kEACqB,2DAAwB,IACxC,EACL,0FAAqD,EACrD,qGAAgE,IAC7D,IACD,EAGN,uBAAC,8BAAoB,IACnB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,mBAAmB,EAAE,uBAAuB,EAC5C,kBAAkB,EAAE,sBAAsB,EAC1C,sBAAsB,EAAE,0BAA0B,EAClD,eAAe,EAAE,mBAAmB,EACpC,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,yBAAyB,EAC5B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,kBAAkB,EACtC,cAAc,EAAC,mBAAmB,EAClC,mBAAmB,EAAE,mBAAmB,EACxC,mBAAmB,EAAE,mBAAmB,EACxC,2BAA2B,EAAE,2BAA2B,EACxD,UAAU,EAAE,UAAU,GACtB,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,eAAe,CAAC"}
@@ -1,13 +0,0 @@
1
- declare const supportedCountries: readonly ["US", "GB", "CA", "AU", "DE", "FR", "IT", "ES", "NL", "BE", "SE", "NO", "DK", "FI", "CH", "AT", "IE", "NZ", "JP", "KR", "CN", "IN", "BR", "MX", "AR", "CL", "CO", "PE", "VE", "EC", "BO", "PY", "UY", "GY", "SR", "FK", "GF", "AD", "AE", "AF", "AG", "AI", "AL", "AM", "AO", "AS", "AW", "AZ", "BA", "BB", "BD", "BF", "BG", "BH", "BI", "BJ", "BL", "BM", "BN", "BS", "BT", "BW", "BY", "BZ", "CD", "CF", "CG", "CI", "CM", "CR", "CU", "CV", "CY", "CZ", "DJ", "DM", "DO", "DZ", "EG", "EH", "ER", "ET", "FJ", "FM", "FO", "GA", "GD", "GE", "GH", "GI", "GL", "GM", "GN", "GP", "GQ", "GT", "GU", "GW", "HK", "HN", "HR", "HT", "HU", "ID", "IL", "IQ", "IR", "IS", "JM", "JO", "KE", "KG", "KH", "KI", "KM", "KN", "KP", "KW", "KY", "KZ", "LA", "LB", "LC", "LI", "LK", "LR", "LS", "LT", "LU", "LV", "LY", "MA", "MC", "MD", "ME", "MF", "MG", "MH", "MK", "ML", "MM", "MN", "MO", "MP", "MQ", "MR", "MS", "MT", "MU", "MV", "MW", "MY", "MZ", "NA", "NC", "NE", "NF", "NG", "NI", "NP", "NR", "NU", "OM", "PA", "PF", "PG", "PH", "PK", "PL", "PM", "PR", "PS", "PW", "QA", "RE", "RO", "RS", "RU", "RW", "SA", "SB", "SC", "SD", "SG", "SH", "SI", "SJ", "SK", "SL", "SM", "SN", "SO", "ST", "SV", "SY", "TC", "TD", "TG", "TH", "TJ", "TK", "TL", "TM", "TN", "TO", "TR", "TT", "TV", "TW", "UA", "UG", "VA", "VC", "VG", "VI", "VN", "VU", "WF", "WS", "YE", "YT", "ZM"];
2
- export type CountryCode = (typeof supportedCountries)[number];
3
- export interface CountryData {
4
- code: CountryCode;
5
- name: string;
6
- dialCode: string;
7
- example: string;
8
- }
9
- export declare const getAllCountryData: () => CountryData[];
10
- export declare const getCountryData: () => CountryData[];
11
- export declare const getCountryByCode: (code: CountryCode) => CountryData | undefined;
12
- export declare const getCountryByDialCode: (dialCode: string) => CountryData | undefined;
13
- export {};