@superdispatch/phones 0.13.0 → 0.16.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-node/index.js +710 -37
- package/dist-node/index.js.map +1 -1
- package/dist-src/index.js +3 -1
- package/dist-src/v5/apn/APN.js +27 -0
- package/dist-src/v5/country-code-metadata/CountryCodeMetadata.js +27 -0
- package/dist-src/v5/formatted-phone-number/FormattedPhoneNumber.js +21 -0
- package/dist-src/v5/index.js +6 -0
- package/dist-src/v5/phone-field/PhoneField.js +149 -0
- package/dist-src/v5/phone-field/PhoneFieldFlag.js +46 -0
- package/dist-src/v5/phone-field/PhoneFieldMenu.js +40 -0
- package/dist-src/v5/phone-field/PhoneFieldMenuItem.js +54 -0
- package/dist-src/v5/phone-field/PhoneFieldStartAdornment.js +62 -0
- package/dist-src/v5/phone-link/PhoneLink.js +56 -0
- package/dist-src/v5/phone-service/PhoneService.js +185 -0
- package/dist-src/v5/phone-text/PhoneText.js +34 -0
- package/dist-types/index.d.ts +158 -2
- package/dist-web/index.js +683 -7
- package/dist-web/index.js.map +1 -1
- package/package.json +5 -3
package/dist-node/index.js
CHANGED
|
@@ -7,11 +7,14 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
|
|
|
7
7
|
var react = require('react');
|
|
8
8
|
var _objectSpread = _interopDefault(require('@babel/runtime/helpers/objectSpread2'));
|
|
9
9
|
var _objectWithoutProperties = _interopDefault(require('@babel/runtime/helpers/objectWithoutProperties'));
|
|
10
|
-
var
|
|
10
|
+
var material = require('@mui/material');
|
|
11
11
|
var ui = require('@superdispatch/ui');
|
|
12
|
-
var styles = require('@
|
|
12
|
+
var styles = require('@mui/styles');
|
|
13
13
|
var clsx = _interopDefault(require('clsx'));
|
|
14
14
|
var jsxRuntime = require('react/jsx-runtime');
|
|
15
|
+
var iconsMaterial = require('@mui/icons-material');
|
|
16
|
+
var core = require('@material-ui/core');
|
|
17
|
+
var styles$1 = require('@material-ui/styles');
|
|
15
18
|
var icons = require('@material-ui/icons');
|
|
16
19
|
|
|
17
20
|
var COUNTRY_CODE_METADATA = /*#__PURE__*/JSON.parse('[["US",1,"United States"],["CA",1,"Canada"],["AU",61,"Australia"],["NZ",64,"New Zealand"],["AC",247,"Ascension Island"],["AD",376,"Andorra"],["AE",971,"United Arab Emirates"],["AF",93,"Afghanistan"],["AG",1,"Antigua and Barbuda"],["AI",1,"Anguilla"],["AL",355,"Albania"],["AM",374,"Armenia"],["AO",244,"Angola"],["AR",54,"Argentina"],["AS",1,"American Samoa"],["AT",43,"Austria"],["AW",297,"Aruba"],["AX",358,"Åland Islands"],["AZ",994,"Azerbaijan"],["BA",387,"Bosnia and Herzegovina"],["BB",1,"Barbados"],["BD",880,"Bangladesh"],["BE",32,"Belgium"],["BF",226,"Burkina Faso"],["BG",359,"Bulgaria"],["BH",973,"Bahrain"],["BI",257,"Burundi"],["BJ",229,"Benin"],["BL",590,"Saint Barthélemy"],["BM",1,"Bermuda"],["BN",673,"Brunei"],["BO",591,"Bolivia"],["BQ",599,"Caribbean Netherlands"],["BR",55,"Brazil"],["BS",1,"Bahamas"],["BT",975,"Bhutan"],["BW",267,"Botswana"],["BY",375,"Belarus"],["BZ",501,"Belize"],["CC",61,"Cocos"],["CD",243,"Congo"],["CF",236,"Central African Republic"],["CG",242,"Congo"],["CH",41,"Switzerland"],["CI",225,"Côte d’Ivoire"],["CK",682,"Cook Islands"],["CL",56,"Chile"],["CM",237,"Cameroon"],["CN",86,"China"],["CO",57,"Colombia"],["CR",506,"Costa Rica"],["CU",53,"Cuba"],["CV",238,"Cape Verde"],["CW",599,"Curaçao"],["CX",61,"Christmas Island"],["CY",357,"Cyprus"],["CZ",420,"Czech Republic"],["DE",49,"Germany"],["DJ",253,"Djibouti"],["DK",45,"Denmark"],["DM",1,"Dominica"],["DO",1,"Dominican Republic"],["DZ",213,"Algeria"],["EC",593,"Ecuador"],["EE",372,"Estonia"],["EG",20,"Egypt"],["EH",212,"Western Sahara"],["ER",291,"Eritrea"],["ES",34,"Spain"],["ET",251,"Ethiopia"],["FI",358,"Finland"],["FJ",679,"Fiji"],["FK",500,"Falkland Islands"],["FM",691,"Micronesia"],["FO",298,"Faroe Islands"],["FR",33,"France"],["GA",241,"Gabon"],["GB",44,"United Kingdom"],["GD",1,"Grenada"],["GE",995,"Georgia"],["GF",594,"French Guiana"],["GG",44,"Guernsey"],["GH",233,"Ghana"],["GI",350,"Gibraltar"],["GL",299,"Greenland"],["GM",220,"Gambia"],["GN",224,"Guinea"],["GP",590,"Guadeloupe"],["GQ",240,"Equatorial Guinea"],["GR",30,"Greece"],["GT",502,"Guatemala"],["GU",1,"Guam"],["GW",245,"Guinea-Bissau"],["GY",592,"Guyana"],["HK",852,"Hong Kong"],["HN",504,"Honduras"],["HR",385,"Croatia"],["HT",509,"Haiti"],["HU",36,"Hungary"],["ID",62,"Indonesia"],["IE",353,"Ireland"],["IL",972,"Israel"],["IM",44,"Isle of Man"],["IN",91,"India"],["IO",246,"British Indian Ocean Territory"],["IQ",964,"Iraq"],["IR",98,"Iran"],["IS",354,"Iceland"],["IT",39,"Italy"],["JE",44,"Jersey"],["JM",1,"Jamaica"],["JO",962,"Jordan"],["JP",81,"Japan"],["KE",254,"Kenya"],["KG",996,"Kyrgyzstan"],["KH",855,"Cambodia"],["KI",686,"Kiribati"],["KM",269,"Comoros"],["KN",1,"Saint Kitts and Nevis"],["KP",850,"North Korea"],["KR",82,"South Korea"],["KW",965,"Kuwait"],["KY",1,"Cayman Islands"],["KZ",7,"Kazakhstan"],["LA",856,"Laos"],["LB",961,"Lebanon"],["LC",1,"Saint Lucia"],["LI",423,"Liechtenstein"],["LK",94,"Sri Lanka"],["LR",231,"Liberia"],["LS",266,"Lesotho"],["LT",370,"Lithuania"],["LU",352,"Luxembourg"],["LV",371,"Latvia"],["LY",218,"Libya"],["MA",212,"Morocco"],["MC",377,"Monaco"],["MD",373,"Moldova"],["ME",382,"Montenegro"],["MF",590,"Saint Martin"],["MG",261,"Madagascar"],["MH",692,"Marshall Islands"],["MK",389,"Macedonia"],["ML",223,"Mali"],["MM",95,"Myanmar"],["MN",976,"Mongolia"],["MO",853,"Macau"],["MP",1,"Northern Mariana Islands"],["MQ",596,"Martinique"],["MR",222,"Mauritania"],["MS",1,"Montserrat"],["MT",356,"Malta"],["MU",230,"Mauritius"],["MV",960,"Maldives"],["MW",265,"Malawi"],["MX",52,"Mexico"],["MY",60,"Malaysia"],["MZ",258,"Mozambique"],["NA",264,"Namibia"],["NC",687,"New Caledonia"],["NE",227,"Niger"],["NF",672,"Norfolk Island"],["NG",234,"Nigeria"],["NI",505,"Nicaragua"],["NL",31,"Netherlands"],["NO",47,"Norway"],["NP",977,"Nepal"],["NR",674,"Nauru"],["NU",683,"Niue"],["OM",968,"Oman"],["PA",507,"Panama"],["PE",51,"Peru"],["PF",689,"French Polynesia"],["PG",675,"Papua New Guinea"],["PH",63,"Philippines"],["PK",92,"Pakistan"],["PL",48,"Poland"],["PM",508,"Saint Pierre and Miquelon"],["PR",1,"Puerto Rico"],["PS",970,"Palestine"],["PT",351,"Portugal"],["PW",680,"Palau"],["PY",595,"Paraguay"],["QA",974,"Qatar"],["RE",262,"Réunion"],["RO",40,"Romania"],["RS",381,"Serbia"],["RU",7,"Russia"],["RW",250,"Rwanda"],["SA",966,"Saudi Arabia"],["SB",677,"Solomon Islands"],["SC",248,"Seychelles"],["SD",249,"Sudan"],["SE",46,"Sweden"],["SG",65,"Singapore"],["SH",290,"Saint Helena"],["SI",386,"Slovenia"],["SJ",47,"Svalbard and Jan Mayen"],["SK",421,"Slovakia"],["SL",232,"Sierra Leone"],["SM",378,"San Marino"],["SN",221,"Senegal"],["SO",252,"Somalia"],["SR",597,"Suriname"],["SS",211,"South Sudan"],["ST",239,"São Tomé and Príncipe"],["SV",503,"El Salvador"],["SX",1,"Sint Maarten"],["SY",963,"Syria"],["SZ",268,"Swaziland"],["TA",290,"Tristan da Cunha"],["TC",1,"Turks and Caicos Islands"],["TD",235,"Chad"],["TG",228,"Togo"],["TH",66,"Thailand"],["TJ",992,"Tajikistan"],["TK",690,"Tokelau"],["TL",670,"Timor-Leste"],["TM",993,"Turkmenistan"],["TN",216,"Tunisia"],["TO",676,"Tonga"],["TR",90,"Turkey"],["TT",1,"Trinidad and Tobago"],["TV",688,"Tuvalu"],["TW",886,"Taiwan"],["TZ",255,"Tanzania"],["UA",380,"Ukraine"],["UG",256,"Uganda"],["UY",598,"Uruguay"],["UZ",998,"Uzbekistan"],["VA",39,"Vatican City"],["VC",1,"Saint Vincent and the Grenadines"],["VE",58,"Venezuela"],["VG",1,"British Virgin Islands"],["VI",1,"U.S. Virgin Islands"],["VN",84,"Vietnam"],["VU",678,"Vanuatu"],["WF",681,"Wallis and Futuna"],["WS",685,"Samoa"],["XK",383,"Kosovo"],["YE",967,"Yemen"],["YT",262,"Mayotte"],["ZA",27,"South Africa"],["ZM",260,"Zambia"],["ZW",263,"Zimbabwe"]]');
|
|
@@ -289,7 +292,7 @@ var PhoneFieldFlag = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
289
292
|
var styles = useStyles();
|
|
290
293
|
|
|
291
294
|
if (country === 'AC' || country === 'BQ' || country === 'EH' || country === 'TA') {
|
|
292
|
-
return /*#__PURE__*/jsxRuntime.jsx(
|
|
295
|
+
return /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
|
|
293
296
|
ref: ref,
|
|
294
297
|
variant: "h6",
|
|
295
298
|
align: "center",
|
|
@@ -316,6 +319,9 @@ var useStyles$1 = /*#__PURE__*/styles.makeStyles(theme => ({
|
|
|
316
319
|
gutters: {},
|
|
317
320
|
root: {},
|
|
318
321
|
selected: {},
|
|
322
|
+
disabled: {},
|
|
323
|
+
divider: {},
|
|
324
|
+
focusVisible: {},
|
|
319
325
|
flag: {
|
|
320
326
|
marginRight: theme.spacing(1)
|
|
321
327
|
}
|
|
@@ -338,14 +344,13 @@ var PhoneFieldMenuItem = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
338
344
|
styles = _objectWithoutProperties(_useStyles, _excluded2);
|
|
339
345
|
|
|
340
346
|
var countryCode = react.useMemo(() => getCountryCode(country), [country]);
|
|
341
|
-
return /*#__PURE__*/jsxRuntime.jsxs(
|
|
347
|
+
return /*#__PURE__*/jsxRuntime.jsxs(material.MenuItem, _objectSpread(_objectSpread({}, props), {}, {
|
|
342
348
|
ref: ref,
|
|
343
|
-
button: true,
|
|
344
349
|
classes: styles,
|
|
345
350
|
children: [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldFlag, {
|
|
346
351
|
country: country,
|
|
347
352
|
className: flagClassName
|
|
348
|
-
}), formatCountry(country), "\xA0", /*#__PURE__*/jsxRuntime.jsx(
|
|
353
|
+
}), formatCountry(country), "\xA0", /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
|
|
349
354
|
color: "textSecondary",
|
|
350
355
|
children: countryCode
|
|
351
356
|
})]
|
|
@@ -368,7 +373,7 @@ var PhoneFieldMenu = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
368
373
|
onChange
|
|
369
374
|
} = _ref;
|
|
370
375
|
var styles = useStyles$2();
|
|
371
|
-
return /*#__PURE__*/jsxRuntime.jsx(
|
|
376
|
+
return /*#__PURE__*/jsxRuntime.jsx(material.Menu, {
|
|
372
377
|
ref: ref,
|
|
373
378
|
open: !!anchorEl,
|
|
374
379
|
onClose: onClose,
|
|
@@ -383,22 +388,25 @@ var PhoneFieldMenu = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
383
388
|
onChange(country);
|
|
384
389
|
onClose();
|
|
385
390
|
}
|
|
386
|
-
}, country), country === 'NZ' && /*#__PURE__*/jsxRuntime.jsx(
|
|
391
|
+
}, country), country === 'NZ' && /*#__PURE__*/jsxRuntime.jsx(material.Divider, {}, "divider")])
|
|
387
392
|
});
|
|
388
393
|
});
|
|
389
394
|
if (process.env.NODE_ENV !== "production") PhoneFieldMenu.displayName = "PhoneFieldMenu";
|
|
390
395
|
|
|
396
|
+
var {
|
|
397
|
+
Color
|
|
398
|
+
} = ui.v5;
|
|
391
399
|
var useStyles$3 = /*#__PURE__*/styles.makeStyles(theme => ({
|
|
392
400
|
root: {
|
|
393
401
|
marginLeft: theme.spacing(-1),
|
|
394
402
|
marginRight: 0
|
|
395
403
|
},
|
|
396
404
|
button: {
|
|
397
|
-
color:
|
|
405
|
+
color: Color.Blue300,
|
|
398
406
|
padding: theme.spacing(0.5, 0.5, 0.5, 1),
|
|
399
407
|
borderRadius: theme.spacing(0.5, 0, 0, 0.5),
|
|
400
408
|
'&:hover, &:focus': {
|
|
401
|
-
backgroundColor:
|
|
409
|
+
backgroundColor: Color.Blue50
|
|
402
410
|
}
|
|
403
411
|
}
|
|
404
412
|
}), {
|
|
@@ -415,22 +423,22 @@ var PhoneFieldStartAdornment = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
415
423
|
var code = "+".concat(getCountryCode(country));
|
|
416
424
|
return ["".concat(formatCountry(country), ": ").concat(code), code];
|
|
417
425
|
}, [country]);
|
|
418
|
-
return /*#__PURE__*/jsxRuntime.jsx(
|
|
426
|
+
return /*#__PURE__*/jsxRuntime.jsx(material.InputAdornment, {
|
|
419
427
|
ref: ref,
|
|
420
428
|
position: "start",
|
|
421
429
|
className: styles.root,
|
|
422
|
-
children: /*#__PURE__*/jsxRuntime.jsxs(
|
|
430
|
+
children: /*#__PURE__*/jsxRuntime.jsxs(material.ButtonBase, {
|
|
423
431
|
title: title,
|
|
424
432
|
onClick: onClick,
|
|
425
433
|
className: styles.button,
|
|
426
434
|
"aria-expanded": isExpanded,
|
|
427
435
|
children: [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldFlag, {
|
|
428
436
|
country: country
|
|
429
|
-
}), isExpanded ? /*#__PURE__*/jsxRuntime.jsx(
|
|
430
|
-
htmlColor:
|
|
431
|
-
}) : /*#__PURE__*/jsxRuntime.jsx(
|
|
432
|
-
htmlColor:
|
|
433
|
-
}), /*#__PURE__*/jsxRuntime.jsx(
|
|
437
|
+
}), isExpanded ? /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.ArrowDropUp, {
|
|
438
|
+
htmlColor: Color.Dark200
|
|
439
|
+
}) : /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.ArrowDropDown, {
|
|
440
|
+
htmlColor: Color.Dark200
|
|
441
|
+
}), /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
|
|
434
442
|
color: "textPrimary",
|
|
435
443
|
children: countryCode
|
|
436
444
|
})]
|
|
@@ -441,6 +449,9 @@ if (process.env.NODE_ENV !== "production") PhoneFieldStartAdornment.displayName
|
|
|
441
449
|
|
|
442
450
|
var _excluded$2 = ["value", "onBlur", "onFocus", "onChange"],
|
|
443
451
|
_excluded2$1 = ["label", "fullWidth", "helperText", "suspenseFallback"];
|
|
452
|
+
var {
|
|
453
|
+
mergeRefs
|
|
454
|
+
} = ui.v5;
|
|
444
455
|
|
|
445
456
|
function normalizeValue(value) {
|
|
446
457
|
return typeof value === 'string' ? value : '';
|
|
@@ -512,13 +523,13 @@ var PhoneField = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
512
523
|
onChange: nextRegion => {
|
|
513
524
|
handleChange(_onChange, nextRegion, nationalNumber);
|
|
514
525
|
}
|
|
515
|
-
}), /*#__PURE__*/jsxRuntime.jsx(
|
|
526
|
+
}), /*#__PURE__*/jsxRuntime.jsx(material.TextField, _objectSpread(_objectSpread({}, props), {}, {
|
|
516
527
|
type: "tel",
|
|
517
528
|
variant: "outlined",
|
|
518
529
|
autoComplete: "off",
|
|
519
530
|
value: nationalNumber,
|
|
520
531
|
placeholder: placeholder,
|
|
521
|
-
ref:
|
|
532
|
+
ref: mergeRefs(ref, rootRef),
|
|
522
533
|
inputRef: inputRef,
|
|
523
534
|
onBlur: event => {
|
|
524
535
|
handleChangeEvent(_onBlur, event);
|
|
@@ -553,7 +564,7 @@ var SuspendedPhoneField = /*#__PURE__*/react.forwardRef((_ref3, ref) => {
|
|
|
553
564
|
label,
|
|
554
565
|
fullWidth,
|
|
555
566
|
helperText,
|
|
556
|
-
suspenseFallback = /*#__PURE__*/jsxRuntime.jsx(
|
|
567
|
+
suspenseFallback = /*#__PURE__*/jsxRuntime.jsx(material.TextField, {
|
|
557
568
|
disabled: true,
|
|
558
569
|
label: label,
|
|
559
570
|
fullWidth: fullWidth,
|
|
@@ -577,6 +588,9 @@ if (process.env.NODE_ENV !== "production") SuspendedPhoneField.displayName = "Su
|
|
|
577
588
|
|
|
578
589
|
var _excluded$3 = ["phone", "country", "fallback", "format"],
|
|
579
590
|
_excluded2$2 = ["suspenseFallback"];
|
|
591
|
+
var {
|
|
592
|
+
renderChildren
|
|
593
|
+
} = ui.v5;
|
|
580
594
|
var PhoneLink = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
581
595
|
var {
|
|
582
596
|
phone,
|
|
@@ -600,7 +614,7 @@ var PhoneLink = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
|
600
614
|
format: 'rfc3966'
|
|
601
615
|
})];
|
|
602
616
|
}, [phone, country, format, service]);
|
|
603
|
-
return !href ?
|
|
617
|
+
return !href ? renderChildren(fallback) : /*#__PURE__*/jsxRuntime.jsx(material.Link, _objectSpread(_objectSpread({}, props), {}, {
|
|
604
618
|
ref: ref,
|
|
605
619
|
href: href,
|
|
606
620
|
children: text
|
|
@@ -623,6 +637,9 @@ var SuspendedPhoneLink = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
|
|
|
623
637
|
if (process.env.NODE_ENV !== "production") SuspendedPhoneLink.displayName = "SuspendedPhoneLink";
|
|
624
638
|
|
|
625
639
|
var _excluded$4 = ["suspenseFallback"];
|
|
640
|
+
var {
|
|
641
|
+
renderChildren: renderChildren$1
|
|
642
|
+
} = ui.v5;
|
|
626
643
|
function PhoneText(_ref) {
|
|
627
644
|
var {
|
|
628
645
|
phone,
|
|
@@ -634,7 +651,7 @@ function PhoneText(_ref) {
|
|
|
634
651
|
format,
|
|
635
652
|
country
|
|
636
653
|
});
|
|
637
|
-
return
|
|
654
|
+
return renderChildren$1(children || fallback);
|
|
638
655
|
}
|
|
639
656
|
function SuspendedPhoneText(_ref2) {
|
|
640
657
|
var {
|
|
@@ -648,19 +665,675 @@ function SuspendedPhoneText(_ref2) {
|
|
|
648
665
|
});
|
|
649
666
|
}
|
|
650
667
|
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
668
|
+
|
|
669
|
+
|
|
670
|
+
var index = /*#__PURE__*/Object.freeze({
|
|
671
|
+
__proto__: null,
|
|
672
|
+
DEFAULT_COUNTRY: DEFAULT_COUNTRY,
|
|
673
|
+
listCountries: listCountries,
|
|
674
|
+
isCountryISO: isCountryISO,
|
|
675
|
+
toCountryISO: toCountryISO,
|
|
676
|
+
getCountryCode: getCountryCode,
|
|
677
|
+
formatCountry: formatCountry,
|
|
678
|
+
useFormattedPhoneNumber: useFormattedPhoneNumber,
|
|
679
|
+
PhoneField: PhoneField,
|
|
680
|
+
SuspendedPhoneField: SuspendedPhoneField,
|
|
681
|
+
PhoneLink: PhoneLink,
|
|
682
|
+
SuspendedPhoneLink: SuspendedPhoneLink,
|
|
683
|
+
PhoneService: PhoneService,
|
|
684
|
+
usePhoneService: usePhoneService,
|
|
685
|
+
PhoneText: PhoneText,
|
|
686
|
+
SuspendedPhoneText: SuspendedPhoneText
|
|
687
|
+
});
|
|
688
|
+
|
|
689
|
+
var COUNTRY_CODE_METADATA$1 = /*#__PURE__*/JSON.parse('[["US",1,"United States"],["CA",1,"Canada"],["AU",61,"Australia"],["NZ",64,"New Zealand"],["AC",247,"Ascension Island"],["AD",376,"Andorra"],["AE",971,"United Arab Emirates"],["AF",93,"Afghanistan"],["AG",1,"Antigua and Barbuda"],["AI",1,"Anguilla"],["AL",355,"Albania"],["AM",374,"Armenia"],["AO",244,"Angola"],["AR",54,"Argentina"],["AS",1,"American Samoa"],["AT",43,"Austria"],["AW",297,"Aruba"],["AX",358,"Åland Islands"],["AZ",994,"Azerbaijan"],["BA",387,"Bosnia and Herzegovina"],["BB",1,"Barbados"],["BD",880,"Bangladesh"],["BE",32,"Belgium"],["BF",226,"Burkina Faso"],["BG",359,"Bulgaria"],["BH",973,"Bahrain"],["BI",257,"Burundi"],["BJ",229,"Benin"],["BL",590,"Saint Barthélemy"],["BM",1,"Bermuda"],["BN",673,"Brunei"],["BO",591,"Bolivia"],["BQ",599,"Caribbean Netherlands"],["BR",55,"Brazil"],["BS",1,"Bahamas"],["BT",975,"Bhutan"],["BW",267,"Botswana"],["BY",375,"Belarus"],["BZ",501,"Belize"],["CC",61,"Cocos"],["CD",243,"Congo"],["CF",236,"Central African Republic"],["CG",242,"Congo"],["CH",41,"Switzerland"],["CI",225,"Côte d’Ivoire"],["CK",682,"Cook Islands"],["CL",56,"Chile"],["CM",237,"Cameroon"],["CN",86,"China"],["CO",57,"Colombia"],["CR",506,"Costa Rica"],["CU",53,"Cuba"],["CV",238,"Cape Verde"],["CW",599,"Curaçao"],["CX",61,"Christmas Island"],["CY",357,"Cyprus"],["CZ",420,"Czech Republic"],["DE",49,"Germany"],["DJ",253,"Djibouti"],["DK",45,"Denmark"],["DM",1,"Dominica"],["DO",1,"Dominican Republic"],["DZ",213,"Algeria"],["EC",593,"Ecuador"],["EE",372,"Estonia"],["EG",20,"Egypt"],["EH",212,"Western Sahara"],["ER",291,"Eritrea"],["ES",34,"Spain"],["ET",251,"Ethiopia"],["FI",358,"Finland"],["FJ",679,"Fiji"],["FK",500,"Falkland Islands"],["FM",691,"Micronesia"],["FO",298,"Faroe Islands"],["FR",33,"France"],["GA",241,"Gabon"],["GB",44,"United Kingdom"],["GD",1,"Grenada"],["GE",995,"Georgia"],["GF",594,"French Guiana"],["GG",44,"Guernsey"],["GH",233,"Ghana"],["GI",350,"Gibraltar"],["GL",299,"Greenland"],["GM",220,"Gambia"],["GN",224,"Guinea"],["GP",590,"Guadeloupe"],["GQ",240,"Equatorial Guinea"],["GR",30,"Greece"],["GT",502,"Guatemala"],["GU",1,"Guam"],["GW",245,"Guinea-Bissau"],["GY",592,"Guyana"],["HK",852,"Hong Kong"],["HN",504,"Honduras"],["HR",385,"Croatia"],["HT",509,"Haiti"],["HU",36,"Hungary"],["ID",62,"Indonesia"],["IE",353,"Ireland"],["IL",972,"Israel"],["IM",44,"Isle of Man"],["IN",91,"India"],["IO",246,"British Indian Ocean Territory"],["IQ",964,"Iraq"],["IR",98,"Iran"],["IS",354,"Iceland"],["IT",39,"Italy"],["JE",44,"Jersey"],["JM",1,"Jamaica"],["JO",962,"Jordan"],["JP",81,"Japan"],["KE",254,"Kenya"],["KG",996,"Kyrgyzstan"],["KH",855,"Cambodia"],["KI",686,"Kiribati"],["KM",269,"Comoros"],["KN",1,"Saint Kitts and Nevis"],["KP",850,"North Korea"],["KR",82,"South Korea"],["KW",965,"Kuwait"],["KY",1,"Cayman Islands"],["KZ",7,"Kazakhstan"],["LA",856,"Laos"],["LB",961,"Lebanon"],["LC",1,"Saint Lucia"],["LI",423,"Liechtenstein"],["LK",94,"Sri Lanka"],["LR",231,"Liberia"],["LS",266,"Lesotho"],["LT",370,"Lithuania"],["LU",352,"Luxembourg"],["LV",371,"Latvia"],["LY",218,"Libya"],["MA",212,"Morocco"],["MC",377,"Monaco"],["MD",373,"Moldova"],["ME",382,"Montenegro"],["MF",590,"Saint Martin"],["MG",261,"Madagascar"],["MH",692,"Marshall Islands"],["MK",389,"Macedonia"],["ML",223,"Mali"],["MM",95,"Myanmar"],["MN",976,"Mongolia"],["MO",853,"Macau"],["MP",1,"Northern Mariana Islands"],["MQ",596,"Martinique"],["MR",222,"Mauritania"],["MS",1,"Montserrat"],["MT",356,"Malta"],["MU",230,"Mauritius"],["MV",960,"Maldives"],["MW",265,"Malawi"],["MX",52,"Mexico"],["MY",60,"Malaysia"],["MZ",258,"Mozambique"],["NA",264,"Namibia"],["NC",687,"New Caledonia"],["NE",227,"Niger"],["NF",672,"Norfolk Island"],["NG",234,"Nigeria"],["NI",505,"Nicaragua"],["NL",31,"Netherlands"],["NO",47,"Norway"],["NP",977,"Nepal"],["NR",674,"Nauru"],["NU",683,"Niue"],["OM",968,"Oman"],["PA",507,"Panama"],["PE",51,"Peru"],["PF",689,"French Polynesia"],["PG",675,"Papua New Guinea"],["PH",63,"Philippines"],["PK",92,"Pakistan"],["PL",48,"Poland"],["PM",508,"Saint Pierre and Miquelon"],["PR",1,"Puerto Rico"],["PS",970,"Palestine"],["PT",351,"Portugal"],["PW",680,"Palau"],["PY",595,"Paraguay"],["QA",974,"Qatar"],["RE",262,"Réunion"],["RO",40,"Romania"],["RS",381,"Serbia"],["RU",7,"Russia"],["RW",250,"Rwanda"],["SA",966,"Saudi Arabia"],["SB",677,"Solomon Islands"],["SC",248,"Seychelles"],["SD",249,"Sudan"],["SE",46,"Sweden"],["SG",65,"Singapore"],["SH",290,"Saint Helena"],["SI",386,"Slovenia"],["SJ",47,"Svalbard and Jan Mayen"],["SK",421,"Slovakia"],["SL",232,"Sierra Leone"],["SM",378,"San Marino"],["SN",221,"Senegal"],["SO",252,"Somalia"],["SR",597,"Suriname"],["SS",211,"South Sudan"],["ST",239,"São Tomé and Príncipe"],["SV",503,"El Salvador"],["SX",1,"Sint Maarten"],["SY",963,"Syria"],["SZ",268,"Swaziland"],["TA",290,"Tristan da Cunha"],["TC",1,"Turks and Caicos Islands"],["TD",235,"Chad"],["TG",228,"Togo"],["TH",66,"Thailand"],["TJ",992,"Tajikistan"],["TK",690,"Tokelau"],["TL",670,"Timor-Leste"],["TM",993,"Turkmenistan"],["TN",216,"Tunisia"],["TO",676,"Tonga"],["TR",90,"Turkey"],["TT",1,"Trinidad and Tobago"],["TV",688,"Tuvalu"],["TW",886,"Taiwan"],["TZ",255,"Tanzania"],["UA",380,"Ukraine"],["UG",256,"Uganda"],["UY",598,"Uruguay"],["UZ",998,"Uzbekistan"],["VA",39,"Vatican City"],["VC",1,"Saint Vincent and the Grenadines"],["VE",58,"Venezuela"],["VG",1,"British Virgin Islands"],["VI",1,"U.S. Virgin Islands"],["VN",84,"Vietnam"],["VU",678,"Vanuatu"],["WF",681,"Wallis and Futuna"],["WS",685,"Samoa"],["XK",383,"Kosovo"],["YE",967,"Yemen"],["YT",262,"Mayotte"],["ZA",27,"South Africa"],["ZM",260,"Zambia"],["ZW",263,"Zimbabwe"]]');
|
|
690
|
+
var DEFAULT_COUNTRY$1 = 'US';
|
|
691
|
+
var COUNTRIES$1 = [];
|
|
692
|
+
var COUNTRY_CODE_MAP$1 = /*#__PURE__*/new Map();
|
|
693
|
+
var COUNTRY_NAME_MAP$1 = /*#__PURE__*/new Map();
|
|
694
|
+
|
|
695
|
+
for (var [country$1, code$1, name$1] of COUNTRY_CODE_METADATA$1) {
|
|
696
|
+
COUNTRIES$1.push(country$1);
|
|
697
|
+
COUNTRY_CODE_MAP$1.set(country$1, code$1);
|
|
698
|
+
COUNTRY_NAME_MAP$1.set(country$1, name$1);
|
|
699
|
+
}
|
|
700
|
+
|
|
701
|
+
function listCountries$1() {
|
|
702
|
+
return COUNTRIES$1;
|
|
703
|
+
}
|
|
704
|
+
function isCountryISO$1(value) {
|
|
705
|
+
return typeof value == 'string' && COUNTRY_CODE_MAP$1.has(value);
|
|
706
|
+
}
|
|
707
|
+
function toCountryISO$1(value) {
|
|
708
|
+
return isCountryISO$1(value) ? value : DEFAULT_COUNTRY$1;
|
|
709
|
+
}
|
|
710
|
+
function getCountryCode$1(country) {
|
|
711
|
+
return COUNTRY_CODE_MAP$1.get(country) || 0;
|
|
712
|
+
}
|
|
713
|
+
function formatCountry$1(country) {
|
|
714
|
+
return COUNTRY_NAME_MAP$1.get(country) || 'Invalid Country ISO';
|
|
715
|
+
}
|
|
716
|
+
|
|
717
|
+
var loadError$1;
|
|
718
|
+
var loadedAPN$1;
|
|
719
|
+
function loadAPN$1() {
|
|
720
|
+
return Promise.resolve().then(() => require('awesome-phonenumber')).then(apn => {
|
|
721
|
+
loadedAPN$1 = apn.default;
|
|
722
|
+
return loadedAPN$1;
|
|
723
|
+
}, error => {
|
|
724
|
+
loadError$1 = error;
|
|
725
|
+
throw error;
|
|
726
|
+
});
|
|
727
|
+
}
|
|
728
|
+
function getAPN$1() {
|
|
729
|
+
if (loadError$1) {
|
|
730
|
+
throw loadError$1;
|
|
731
|
+
}
|
|
732
|
+
|
|
733
|
+
if (!loadedAPN$1) {
|
|
734
|
+
// eslint-disable-next-line @typescript-eslint/no-throw-literal
|
|
735
|
+
throw loadAPN$1();
|
|
736
|
+
}
|
|
737
|
+
|
|
738
|
+
return loadedAPN$1;
|
|
739
|
+
}
|
|
740
|
+
|
|
741
|
+
var PLUS_SIGN$1 = '+';
|
|
742
|
+
var NON_PHONE_SYMBOLS_PATTERN$1 = /[^+\d]/g;
|
|
743
|
+
var PHONE_PATTERN$1 = /^\+?\d+/g;
|
|
744
|
+
|
|
745
|
+
function getPrefix$1(country) {
|
|
746
|
+
return PLUS_SIGN$1 + String(getCountryCode$1(toCountryISO$1(country)));
|
|
747
|
+
}
|
|
748
|
+
|
|
749
|
+
function trim$1(input) {
|
|
750
|
+
return typeof input == 'string' ? input.trim() : undefined;
|
|
751
|
+
}
|
|
752
|
+
|
|
753
|
+
function normalize$1(input) {
|
|
754
|
+
if (typeof input == 'string') {
|
|
755
|
+
var matches = input.replace(NON_PHONE_SYMBOLS_PATTERN$1, '').match(PHONE_PATTERN$1);
|
|
756
|
+
if (matches !== null && matches !== void 0 && matches[0]) return matches[0];
|
|
757
|
+
}
|
|
758
|
+
|
|
759
|
+
return '';
|
|
760
|
+
}
|
|
761
|
+
|
|
762
|
+
function normalizeNational$1(country, input) {
|
|
763
|
+
var phone = normalize$1(input);
|
|
764
|
+
var prefix = getPrefix$1(country);
|
|
765
|
+
|
|
766
|
+
if (phone.startsWith(PLUS_SIGN$1)) {
|
|
767
|
+
return phone.slice(prefix.length);
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
return phone;
|
|
771
|
+
}
|
|
772
|
+
|
|
773
|
+
class PhoneService$1 {
|
|
774
|
+
static load() {
|
|
775
|
+
return loadAPN$1().then(APN => new PhoneService$1(APN));
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
static checkPossibility(input) {
|
|
779
|
+
return this.load().then(phoneService => phoneService.checkPossibility(input));
|
|
780
|
+
}
|
|
781
|
+
|
|
782
|
+
static validate(input, rules) {
|
|
783
|
+
return this.load().then(phoneService => phoneService.validate(input, rules));
|
|
784
|
+
}
|
|
785
|
+
|
|
786
|
+
constructor(APN) {
|
|
787
|
+
this.APN = APN;
|
|
788
|
+
}
|
|
789
|
+
|
|
790
|
+
createAPN(phone, country) {
|
|
791
|
+
var asYouType = this.APN.getAsYouType(toCountryISO$1(country));
|
|
792
|
+
asYouType.reset(normalize$1(phone));
|
|
793
|
+
return asYouType.getPhoneNumber();
|
|
794
|
+
}
|
|
795
|
+
|
|
796
|
+
getJSON(phone, country) {
|
|
797
|
+
return this.createAPN(phone, country).toJSON();
|
|
798
|
+
}
|
|
799
|
+
|
|
800
|
+
checkPossibility(input) {
|
|
801
|
+
var phone = trim$1(input);
|
|
802
|
+
|
|
803
|
+
if (!phone) {
|
|
804
|
+
return 'unknown';
|
|
805
|
+
}
|
|
806
|
+
|
|
807
|
+
var apn = phone.startsWith(PLUS_SIGN$1) ? new this.APN(phone) : new this.APN(phone, DEFAULT_COUNTRY$1);
|
|
808
|
+
var {
|
|
809
|
+
valid,
|
|
810
|
+
possible,
|
|
811
|
+
possibility
|
|
812
|
+
} = apn.toJSON(); // Avoid false positive short phone numbers.
|
|
813
|
+
|
|
814
|
+
if (!valid && possible) {
|
|
815
|
+
return 'invalid-number';
|
|
816
|
+
}
|
|
817
|
+
|
|
818
|
+
return possibility;
|
|
819
|
+
}
|
|
820
|
+
|
|
821
|
+
validate(input) {
|
|
822
|
+
var {
|
|
823
|
+
required,
|
|
824
|
+
requiredMessage = 'This field is required',
|
|
825
|
+
invalidMessage = 'Invalid phone number',
|
|
826
|
+
tooLongMessage = 'Phone number is too long',
|
|
827
|
+
tooShortMessage = 'Phone number is too short'
|
|
828
|
+
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
829
|
+
var phone = trim$1(input);
|
|
830
|
+
|
|
831
|
+
if (!phone) {
|
|
832
|
+
if (required) {
|
|
833
|
+
return requiredMessage;
|
|
834
|
+
}
|
|
835
|
+
|
|
836
|
+
return undefined;
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
switch (this.checkPossibility(phone)) {
|
|
840
|
+
case 'is-possible':
|
|
841
|
+
return undefined;
|
|
842
|
+
|
|
843
|
+
case 'too-long':
|
|
844
|
+
return tooLongMessage;
|
|
845
|
+
|
|
846
|
+
case 'too-short':
|
|
847
|
+
return tooShortMessage;
|
|
848
|
+
}
|
|
849
|
+
|
|
850
|
+
return invalidMessage;
|
|
851
|
+
}
|
|
852
|
+
|
|
853
|
+
getInfo(phone) {
|
|
854
|
+
var {
|
|
855
|
+
regionCode,
|
|
856
|
+
number: {
|
|
857
|
+
input,
|
|
858
|
+
national: nationalNumber
|
|
859
|
+
}
|
|
860
|
+
} = this.getJSON(phone);
|
|
861
|
+
var country = toCountryISO$1(regionCode);
|
|
862
|
+
|
|
863
|
+
if (!nationalNumber) {
|
|
864
|
+
nationalNumber = normalizeNational$1(country, input);
|
|
865
|
+
}
|
|
866
|
+
|
|
867
|
+
return {
|
|
868
|
+
country,
|
|
869
|
+
nationalNumber
|
|
870
|
+
};
|
|
871
|
+
}
|
|
872
|
+
|
|
873
|
+
format(input) {
|
|
874
|
+
var {
|
|
875
|
+
country,
|
|
876
|
+
format = 'e164',
|
|
877
|
+
fallback = ''
|
|
878
|
+
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
879
|
+
var phone = normalize$1(input);
|
|
880
|
+
|
|
881
|
+
if (!phone) {
|
|
882
|
+
return fallback;
|
|
883
|
+
}
|
|
884
|
+
|
|
885
|
+
var apn = this.createAPN(phone, country);
|
|
886
|
+
var formatted = apn.getNumber(format);
|
|
887
|
+
|
|
888
|
+
if (!formatted) {
|
|
889
|
+
country = toCountryISO$1(apn.getRegionCode());
|
|
890
|
+
var nationalNumber = normalizeNational$1(country, phone);
|
|
891
|
+
|
|
892
|
+
if (format === 'national') {
|
|
893
|
+
return nationalNumber;
|
|
894
|
+
}
|
|
895
|
+
|
|
896
|
+
var prefix = '';
|
|
897
|
+
var separator = '';
|
|
898
|
+
|
|
899
|
+
if (format === 'rfc3966') {
|
|
900
|
+
prefix = 'tel:';
|
|
901
|
+
separator = '-';
|
|
902
|
+
}
|
|
903
|
+
|
|
904
|
+
if (format === 'international') {
|
|
905
|
+
separator = ' ';
|
|
906
|
+
}
|
|
907
|
+
|
|
908
|
+
formatted = prefix + getPrefix$1(country);
|
|
909
|
+
|
|
910
|
+
if (nationalNumber) {
|
|
911
|
+
formatted += separator + nationalNumber;
|
|
912
|
+
}
|
|
913
|
+
}
|
|
914
|
+
|
|
915
|
+
return formatted;
|
|
916
|
+
}
|
|
917
|
+
|
|
918
|
+
}
|
|
919
|
+
function usePhoneService$1() {
|
|
920
|
+
var APN = getAPN$1();
|
|
921
|
+
return react.useMemo(() => new PhoneService$1(APN), [APN]);
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
function useFormattedPhoneNumber$1(input) {
|
|
925
|
+
var {
|
|
926
|
+
format,
|
|
927
|
+
country,
|
|
928
|
+
fallback = ''
|
|
929
|
+
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
930
|
+
var phoneService = usePhoneService$1();
|
|
931
|
+
return react.useMemo(() => {
|
|
932
|
+
if (phoneService.checkPossibility(input) !== 'is-possible') {
|
|
933
|
+
return fallback;
|
|
934
|
+
}
|
|
935
|
+
|
|
936
|
+
return phoneService.format(input, {
|
|
937
|
+
format,
|
|
938
|
+
country,
|
|
939
|
+
fallback
|
|
940
|
+
});
|
|
941
|
+
}, [phoneService, input, format, country, fallback]);
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
var _excluded$5 = ["country", "alt", "className"];
|
|
945
|
+
var useStyles$4 = /*#__PURE__*/styles$1.makeStyles(theme => ({
|
|
946
|
+
root: {
|
|
947
|
+
minHeight: theme.spacing(2),
|
|
948
|
+
minWidth: theme.spacing(2.75)
|
|
949
|
+
}
|
|
950
|
+
}), {
|
|
951
|
+
name: 'SD-PhoneFieldFlag'
|
|
952
|
+
});
|
|
953
|
+
var PhoneFieldFlag$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
954
|
+
var {
|
|
955
|
+
country,
|
|
956
|
+
alt = country,
|
|
957
|
+
className
|
|
958
|
+
} = _ref,
|
|
959
|
+
props = _objectWithoutProperties(_ref, _excluded$5);
|
|
960
|
+
|
|
961
|
+
var styles = useStyles$4();
|
|
962
|
+
|
|
963
|
+
if (country === 'AC' || country === 'BQ' || country === 'EH' || country === 'TA') {
|
|
964
|
+
return /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
|
|
965
|
+
ref: ref,
|
|
966
|
+
variant: "h6",
|
|
967
|
+
align: "center",
|
|
968
|
+
component: "span",
|
|
969
|
+
color: "textSecondary",
|
|
970
|
+
className: clsx(styles.root, className),
|
|
971
|
+
children: country
|
|
972
|
+
});
|
|
973
|
+
}
|
|
974
|
+
|
|
975
|
+
return /*#__PURE__*/jsxRuntime.jsx("img", _objectSpread(_objectSpread({}, props), {}, {
|
|
976
|
+
alt: alt,
|
|
977
|
+
ref: ref,
|
|
978
|
+
className: clsx(styles.root, className),
|
|
979
|
+
src: "https://cdn.jsdelivr.net/gh/madebybowtie/FlagKit@2.2/Assets/SVG/".concat(country, ".svg")
|
|
980
|
+
}));
|
|
981
|
+
});
|
|
982
|
+
if (process.env.NODE_ENV !== "production") PhoneFieldFlag$1.displayName = "PhoneFieldFlag";
|
|
983
|
+
|
|
984
|
+
var _excluded$6 = ["country", "classes"],
|
|
985
|
+
_excluded2$3 = ["flag"];
|
|
986
|
+
var useStyles$5 = /*#__PURE__*/styles$1.makeStyles(theme => ({
|
|
987
|
+
dense: {},
|
|
988
|
+
gutters: {},
|
|
989
|
+
root: {},
|
|
990
|
+
selected: {},
|
|
991
|
+
flag: {
|
|
992
|
+
marginRight: theme.spacing(1)
|
|
993
|
+
}
|
|
994
|
+
}), {
|
|
995
|
+
name: 'SD-PhoneFieldMenuItem'
|
|
996
|
+
});
|
|
997
|
+
var PhoneFieldMenuItem$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
998
|
+
var {
|
|
999
|
+
country,
|
|
1000
|
+
classes
|
|
1001
|
+
} = _ref,
|
|
1002
|
+
props = _objectWithoutProperties(_ref, _excluded$6);
|
|
1003
|
+
|
|
1004
|
+
var _useStyles = useStyles$5({
|
|
1005
|
+
classes
|
|
1006
|
+
}),
|
|
1007
|
+
{
|
|
1008
|
+
flag: flagClassName
|
|
1009
|
+
} = _useStyles,
|
|
1010
|
+
styles = _objectWithoutProperties(_useStyles, _excluded2$3);
|
|
1011
|
+
|
|
1012
|
+
var countryCode = react.useMemo(() => getCountryCode$1(country), [country]);
|
|
1013
|
+
return /*#__PURE__*/jsxRuntime.jsxs(core.MenuItem, _objectSpread(_objectSpread({}, props), {}, {
|
|
1014
|
+
ref: ref,
|
|
1015
|
+
button: true,
|
|
1016
|
+
classes: styles,
|
|
1017
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldFlag$1, {
|
|
1018
|
+
country: country,
|
|
1019
|
+
className: flagClassName
|
|
1020
|
+
}), formatCountry$1(country), "\xA0", /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
|
|
1021
|
+
color: "textSecondary",
|
|
1022
|
+
children: countryCode
|
|
1023
|
+
})]
|
|
1024
|
+
}));
|
|
1025
|
+
});
|
|
1026
|
+
if (process.env.NODE_ENV !== "production") PhoneFieldMenuItem$1.displayName = "PhoneFieldMenuItem";
|
|
1027
|
+
|
|
1028
|
+
var useStyles$6 = /*#__PURE__*/styles$1.makeStyles(theme => ({
|
|
1029
|
+
paper: {
|
|
1030
|
+
maxHeight: theme.spacing(30)
|
|
1031
|
+
}
|
|
1032
|
+
}), {
|
|
1033
|
+
name: 'SD-PhoneFieldMenu'
|
|
1034
|
+
});
|
|
1035
|
+
var PhoneFieldMenu$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
1036
|
+
var {
|
|
1037
|
+
anchorEl,
|
|
1038
|
+
value,
|
|
1039
|
+
onClose,
|
|
1040
|
+
onChange
|
|
1041
|
+
} = _ref;
|
|
1042
|
+
var styles = useStyles$6();
|
|
1043
|
+
return /*#__PURE__*/jsxRuntime.jsx(core.Menu, {
|
|
1044
|
+
ref: ref,
|
|
1045
|
+
open: !!anchorEl,
|
|
1046
|
+
onClose: onClose,
|
|
1047
|
+
anchorEl: anchorEl,
|
|
1048
|
+
classes: {
|
|
1049
|
+
paper: styles.paper
|
|
1050
|
+
},
|
|
1051
|
+
children: listCountries$1().map(country => [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldMenuItem$1, {
|
|
1052
|
+
country: country,
|
|
1053
|
+
selected: country === value,
|
|
1054
|
+
onClick: () => {
|
|
1055
|
+
onChange(country);
|
|
1056
|
+
onClose();
|
|
1057
|
+
}
|
|
1058
|
+
}, country), country === 'NZ' && /*#__PURE__*/jsxRuntime.jsx(core.Divider, {}, "divider")])
|
|
1059
|
+
});
|
|
1060
|
+
});
|
|
1061
|
+
if (process.env.NODE_ENV !== "production") PhoneFieldMenu$1.displayName = "PhoneFieldMenu";
|
|
1062
|
+
|
|
1063
|
+
var useStyles$7 = /*#__PURE__*/styles$1.makeStyles(theme => ({
|
|
1064
|
+
root: {
|
|
1065
|
+
marginLeft: theme.spacing(-1),
|
|
1066
|
+
marginRight: 0
|
|
1067
|
+
},
|
|
1068
|
+
button: {
|
|
1069
|
+
color: ui.Color.Blue300,
|
|
1070
|
+
padding: theme.spacing(0.5, 0.5, 0.5, 1),
|
|
1071
|
+
borderRadius: theme.spacing(0.5, 0, 0, 0.5),
|
|
1072
|
+
'&:hover, &:focus': {
|
|
1073
|
+
backgroundColor: ui.Color.Blue50
|
|
1074
|
+
}
|
|
1075
|
+
}
|
|
1076
|
+
}), {
|
|
1077
|
+
name: 'SD-PhoneFieldStartAdornment'
|
|
1078
|
+
});
|
|
1079
|
+
var PhoneFieldStartAdornment$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
1080
|
+
var {
|
|
1081
|
+
country,
|
|
1082
|
+
onClick,
|
|
1083
|
+
isExpanded
|
|
1084
|
+
} = _ref;
|
|
1085
|
+
var styles = useStyles$7();
|
|
1086
|
+
var [title, countryCode] = react.useMemo(() => {
|
|
1087
|
+
var code = "+".concat(getCountryCode$1(country));
|
|
1088
|
+
return ["".concat(formatCountry$1(country), ": ").concat(code), code];
|
|
1089
|
+
}, [country]);
|
|
1090
|
+
return /*#__PURE__*/jsxRuntime.jsx(core.InputAdornment, {
|
|
1091
|
+
ref: ref,
|
|
1092
|
+
position: "start",
|
|
1093
|
+
className: styles.root,
|
|
1094
|
+
children: /*#__PURE__*/jsxRuntime.jsxs(core.ButtonBase, {
|
|
1095
|
+
title: title,
|
|
1096
|
+
onClick: onClick,
|
|
1097
|
+
className: styles.button,
|
|
1098
|
+
"aria-expanded": isExpanded,
|
|
1099
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldFlag$1, {
|
|
1100
|
+
country: country
|
|
1101
|
+
}), isExpanded ? /*#__PURE__*/jsxRuntime.jsx(icons.ArrowDropUp, {
|
|
1102
|
+
htmlColor: ui.Color.Dark200
|
|
1103
|
+
}) : /*#__PURE__*/jsxRuntime.jsx(icons.ArrowDropDown, {
|
|
1104
|
+
htmlColor: ui.Color.Dark200
|
|
1105
|
+
}), /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
|
|
1106
|
+
color: "textPrimary",
|
|
1107
|
+
children: countryCode
|
|
1108
|
+
})]
|
|
1109
|
+
})
|
|
1110
|
+
});
|
|
1111
|
+
});
|
|
1112
|
+
if (process.env.NODE_ENV !== "production") PhoneFieldStartAdornment$1.displayName = "PhoneFieldStartAdornment";
|
|
1113
|
+
|
|
1114
|
+
var _excluded$7 = ["value", "onBlur", "onFocus", "onChange"],
|
|
1115
|
+
_excluded2$4 = ["label", "fullWidth", "helperText", "suspenseFallback"];
|
|
1116
|
+
|
|
1117
|
+
function normalizeValue$1(value) {
|
|
1118
|
+
return typeof value === 'string' ? value : '';
|
|
1119
|
+
}
|
|
1120
|
+
|
|
1121
|
+
var PhoneField$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
1122
|
+
var {
|
|
1123
|
+
value: valueProp,
|
|
1124
|
+
onBlur: _onBlur,
|
|
1125
|
+
onFocus: _onFocus,
|
|
1126
|
+
onChange: _onChange
|
|
1127
|
+
} = _ref,
|
|
1128
|
+
props = _objectWithoutProperties(_ref, _excluded$7);
|
|
1129
|
+
|
|
1130
|
+
var rootRef = react.useRef(null);
|
|
1131
|
+
var inputRef = react.useRef(null);
|
|
1132
|
+
var [menuAnchor, setMenuAnchor] = react.useState(null);
|
|
1133
|
+
var phoneService = usePhoneService$1();
|
|
1134
|
+
var createState = react.useCallback(value => _objectSpread({
|
|
1135
|
+
value
|
|
1136
|
+
}, phoneService.getInfo(value)), [phoneService]);
|
|
1137
|
+
var value = react.useMemo(() => normalizeValue$1(valueProp), [valueProp]);
|
|
1138
|
+
var [{
|
|
1139
|
+
country,
|
|
1140
|
+
nationalNumber
|
|
1141
|
+
}, setValue] = react.useState(() => createState(value));
|
|
1142
|
+
var placeholder = react.useMemo(() => phoneService.APN.getExample(country).getNumber('national'), [country, phoneService.APN]);
|
|
1143
|
+
|
|
1144
|
+
function handleChange(fn, nextCountry, nextNationalNumber) {
|
|
1145
|
+
if (fn) {
|
|
1146
|
+
var nextValue = phoneService.format(nextNationalNumber, {
|
|
1147
|
+
country: nextCountry
|
|
1148
|
+
});
|
|
1149
|
+
setValue({
|
|
1150
|
+
value: nextValue,
|
|
1151
|
+
country: nextCountry,
|
|
1152
|
+
nationalNumber: nextNationalNumber
|
|
1153
|
+
});
|
|
1154
|
+
fn(nextValue);
|
|
1155
|
+
}
|
|
1156
|
+
}
|
|
1157
|
+
|
|
1158
|
+
function handleChangeEvent(fn, _ref2) {
|
|
1159
|
+
var {
|
|
1160
|
+
target: {
|
|
1161
|
+
value: nextValue
|
|
1162
|
+
}
|
|
1163
|
+
} = _ref2;
|
|
1164
|
+
|
|
1165
|
+
if (fn) {
|
|
1166
|
+
handleChange(fn, country, phoneService.format(nextValue, {
|
|
1167
|
+
country,
|
|
1168
|
+
format: 'national'
|
|
1169
|
+
}));
|
|
1170
|
+
}
|
|
1171
|
+
}
|
|
1172
|
+
|
|
1173
|
+
react.useEffect(() => {
|
|
1174
|
+
setValue(prev => // Ignore `props.value` changes when they were performed from inside.
|
|
1175
|
+
prev.value === value ? prev : createState(value));
|
|
1176
|
+
}, [value, createState]);
|
|
1177
|
+
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
1178
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(PhoneFieldMenu$1, {
|
|
1179
|
+
value: country,
|
|
1180
|
+
anchorEl: menuAnchor,
|
|
1181
|
+
onClose: () => {
|
|
1182
|
+
setMenuAnchor(null);
|
|
1183
|
+
},
|
|
1184
|
+
onChange: nextRegion => {
|
|
1185
|
+
handleChange(_onChange, nextRegion, nationalNumber);
|
|
1186
|
+
}
|
|
1187
|
+
}), /*#__PURE__*/jsxRuntime.jsx(core.TextField, _objectSpread(_objectSpread({}, props), {}, {
|
|
1188
|
+
type: "tel",
|
|
1189
|
+
variant: "outlined",
|
|
1190
|
+
autoComplete: "off",
|
|
1191
|
+
value: nationalNumber,
|
|
1192
|
+
placeholder: placeholder,
|
|
1193
|
+
ref: ui.mergeRefs(ref, rootRef),
|
|
1194
|
+
inputRef: inputRef,
|
|
1195
|
+
onBlur: event => {
|
|
1196
|
+
handleChangeEvent(_onBlur, event);
|
|
1197
|
+
},
|
|
1198
|
+
onFocus: event => {
|
|
1199
|
+
handleChangeEvent(_onFocus, event);
|
|
1200
|
+
},
|
|
1201
|
+
onChange: event => {
|
|
1202
|
+
handleChangeEvent(_onChange, event);
|
|
1203
|
+
},
|
|
1204
|
+
InputProps: {
|
|
1205
|
+
startAdornment: /*#__PURE__*/jsxRuntime.jsx(PhoneFieldStartAdornment$1, {
|
|
1206
|
+
country: country,
|
|
1207
|
+
isExpanded: !!menuAnchor,
|
|
1208
|
+
onClick: () => {
|
|
1209
|
+
var _inputRef$current; // `FocusTrap` inside of `Menu` will restore focus to
|
|
1210
|
+
// the last focused element. We want to manually focus input
|
|
1211
|
+
// to trick the `FocusTrap`.
|
|
1212
|
+
|
|
1213
|
+
|
|
1214
|
+
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
|
|
1215
|
+
setMenuAnchor(rootRef.current);
|
|
1216
|
+
}
|
|
1217
|
+
})
|
|
1218
|
+
}
|
|
1219
|
+
}))]
|
|
1220
|
+
});
|
|
1221
|
+
});
|
|
1222
|
+
if (process.env.NODE_ENV !== "production") PhoneField$1.displayName = "PhoneField";
|
|
1223
|
+
var SuspendedPhoneField$1 = /*#__PURE__*/react.forwardRef((_ref3, ref) => {
|
|
1224
|
+
var {
|
|
1225
|
+
label,
|
|
1226
|
+
fullWidth,
|
|
1227
|
+
helperText,
|
|
1228
|
+
suspenseFallback = /*#__PURE__*/jsxRuntime.jsx(core.TextField, {
|
|
1229
|
+
disabled: true,
|
|
1230
|
+
label: label,
|
|
1231
|
+
fullWidth: fullWidth,
|
|
1232
|
+
helperText: helperText,
|
|
1233
|
+
placeholder: "Loading\u2026"
|
|
1234
|
+
})
|
|
1235
|
+
} = _ref3,
|
|
1236
|
+
props = _objectWithoutProperties(_ref3, _excluded2$4);
|
|
1237
|
+
|
|
1238
|
+
return /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
|
|
1239
|
+
fallback: suspenseFallback,
|
|
1240
|
+
children: /*#__PURE__*/jsxRuntime.jsx(PhoneField$1, _objectSpread(_objectSpread({}, props), {}, {
|
|
1241
|
+
ref: ref,
|
|
1242
|
+
label: label,
|
|
1243
|
+
fullWidth: fullWidth,
|
|
1244
|
+
helperText: helperText
|
|
1245
|
+
}))
|
|
1246
|
+
});
|
|
1247
|
+
});
|
|
1248
|
+
if (process.env.NODE_ENV !== "production") SuspendedPhoneField$1.displayName = "SuspendedPhoneField";
|
|
1249
|
+
|
|
1250
|
+
var _excluded$8 = ["phone", "country", "fallback", "format"],
|
|
1251
|
+
_excluded2$5 = ["suspenseFallback"];
|
|
1252
|
+
var PhoneLink$1 = /*#__PURE__*/react.forwardRef((_ref, ref) => {
|
|
1253
|
+
var {
|
|
1254
|
+
phone,
|
|
1255
|
+
country,
|
|
1256
|
+
fallback,
|
|
1257
|
+
format = 'international'
|
|
1258
|
+
} = _ref,
|
|
1259
|
+
props = _objectWithoutProperties(_ref, _excluded$8);
|
|
1260
|
+
|
|
1261
|
+
var service = usePhoneService$1();
|
|
1262
|
+
var [text, href] = react.useMemo(() => {
|
|
1263
|
+
if (service.checkPossibility(phone) !== 'is-possible') {
|
|
1264
|
+
return [undefined, undefined];
|
|
1265
|
+
}
|
|
1266
|
+
|
|
1267
|
+
return [service.format(phone, {
|
|
1268
|
+
country,
|
|
1269
|
+
format
|
|
1270
|
+
}), service.format(phone, {
|
|
1271
|
+
country,
|
|
1272
|
+
format: 'rfc3966'
|
|
1273
|
+
})];
|
|
1274
|
+
}, [phone, country, format, service]);
|
|
1275
|
+
return !href ? ui.renderChildren(fallback) : /*#__PURE__*/jsxRuntime.jsx(core.Link, _objectSpread(_objectSpread({}, props), {}, {
|
|
1276
|
+
ref: ref,
|
|
1277
|
+
href: href,
|
|
1278
|
+
children: text
|
|
1279
|
+
}));
|
|
1280
|
+
});
|
|
1281
|
+
if (process.env.NODE_ENV !== "production") PhoneLink$1.displayName = "PhoneLink";
|
|
1282
|
+
var SuspendedPhoneLink$1 = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
|
|
1283
|
+
var {
|
|
1284
|
+
suspenseFallback = null
|
|
1285
|
+
} = _ref2,
|
|
1286
|
+
props = _objectWithoutProperties(_ref2, _excluded2$5);
|
|
1287
|
+
|
|
1288
|
+
return /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
|
|
1289
|
+
fallback: suspenseFallback,
|
|
1290
|
+
children: /*#__PURE__*/jsxRuntime.jsx(PhoneLink$1, _objectSpread(_objectSpread({}, props), {}, {
|
|
1291
|
+
ref: ref
|
|
1292
|
+
}))
|
|
1293
|
+
});
|
|
1294
|
+
});
|
|
1295
|
+
if (process.env.NODE_ENV !== "production") SuspendedPhoneLink$1.displayName = "SuspendedPhoneLink";
|
|
1296
|
+
|
|
1297
|
+
var _excluded$9 = ["suspenseFallback"];
|
|
1298
|
+
function PhoneText$1(_ref) {
|
|
1299
|
+
var {
|
|
1300
|
+
phone,
|
|
1301
|
+
country,
|
|
1302
|
+
fallback,
|
|
1303
|
+
format = 'international'
|
|
1304
|
+
} = _ref;
|
|
1305
|
+
var children = useFormattedPhoneNumber$1(phone, {
|
|
1306
|
+
format,
|
|
1307
|
+
country
|
|
1308
|
+
});
|
|
1309
|
+
return ui.renderChildren(children || fallback);
|
|
1310
|
+
}
|
|
1311
|
+
function SuspendedPhoneText$1(_ref2) {
|
|
1312
|
+
var {
|
|
1313
|
+
suspenseFallback = null
|
|
1314
|
+
} = _ref2,
|
|
1315
|
+
props = _objectWithoutProperties(_ref2, _excluded$9);
|
|
1316
|
+
|
|
1317
|
+
return /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
|
|
1318
|
+
fallback: suspenseFallback,
|
|
1319
|
+
children: /*#__PURE__*/jsxRuntime.jsx(PhoneText$1, _objectSpread({}, props))
|
|
1320
|
+
});
|
|
1321
|
+
}
|
|
1322
|
+
|
|
1323
|
+
exports.DEFAULT_COUNTRY = DEFAULT_COUNTRY$1;
|
|
1324
|
+
exports.PhoneField = PhoneField$1;
|
|
1325
|
+
exports.PhoneLink = PhoneLink$1;
|
|
1326
|
+
exports.PhoneService = PhoneService$1;
|
|
1327
|
+
exports.PhoneText = PhoneText$1;
|
|
1328
|
+
exports.SuspendedPhoneField = SuspendedPhoneField$1;
|
|
1329
|
+
exports.SuspendedPhoneLink = SuspendedPhoneLink$1;
|
|
1330
|
+
exports.SuspendedPhoneText = SuspendedPhoneText$1;
|
|
1331
|
+
exports.formatCountry = formatCountry$1;
|
|
1332
|
+
exports.getCountryCode = getCountryCode$1;
|
|
1333
|
+
exports.isCountryISO = isCountryISO$1;
|
|
1334
|
+
exports.listCountries = listCountries$1;
|
|
1335
|
+
exports.toCountryISO = toCountryISO$1;
|
|
1336
|
+
exports.useFormattedPhoneNumber = useFormattedPhoneNumber$1;
|
|
1337
|
+
exports.usePhoneService = usePhoneService$1;
|
|
1338
|
+
exports.v5 = index;
|
|
666
1339
|
//# sourceMappingURL=index.js.map
|