Skip to content

Commit 8dc039c

Browse files
pre-commit-ci[bot]pre-commit-ci[bot]
committed
Pre-commit: reformat and fix code indentations
1 parent 373cdf3 commit 8dc039c

File tree

7 files changed

+305
-305
lines changed

7 files changed

+305
-305
lines changed

‎development/public/index.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8"/>
5-
<meta name="viewport" content="width=device-width, initial-scale=1"/>
6-
<title>Development</title>
4+
<meta charset="utf-8"/>
5+
<meta name="viewport" content="width=device-width, initial-scale=1"/>
6+
<title>Development</title>
77
</head>
88
<body>
99
<div id="root" style="height: 100%;"></div>

‎development/src/phone-hooks/styles.ts

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
export const jsonToCss = (stylesheet: object) => {
2-
/** Convert the given `stylesheet` object to raw CSS */
3-
return Object.entries(stylesheet).map(([selector, rules]) => {
4-
return `${selector} {` + Object.entries(rules).map(([key, value]) => {
5-
return `${key}: ${value}; `;
6-
}).join("") + "} ";
7-
}).join("");
2+
/** Convert the given `stylesheet` object to raw CSS */
3+
return Object.entries(stylesheet).map(([selector, rules]) => {
4+
return `${selector} {` + Object.entries(rules).map(([key, value]) => {
5+
return `${key}: ${value}; `;
6+
}).join("") + "} ";
7+
}).join("");
88
}
99

1010
export const injectStyles = (cssText: string) => {
11-
/** Inject the given `cssText` in the document head */
12-
const style = document.createElement("style");
13-
style.setAttribute("type", "text/css");
11+
/** Inject the given `cssText` in the document head */
12+
const style = document.createElement("style");
13+
style.setAttribute("type", "text/css");
1414

15-
if ((style as any).styleSheet) {
16-
(style as any).styleSheet.cssText = cssText;
17-
} else {
18-
style.appendChild(document.createTextNode(cssText));
19-
}
15+
if ((style as any).styleSheet) {
16+
(style as any).styleSheet.cssText = cssText;
17+
} else {
18+
style.appendChild(document.createTextNode(cssText));
19+
}
2020

21-
document.head.appendChild(style);
21+
document.head.appendChild(style);
2222
}

‎src/index.ts

Lines changed: 114 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -9,149 +9,149 @@ import validations from "./metadata/validations.json";
99
const slots = new Set(".");
1010

1111
export const getMetadata = (rawValue: string, countriesList: typeof countries = countries, country: any = null) => {
12-
country = country == null && rawValue.startsWith("44") ? "gb" : country;
13-
if (country != null) {
14-
countriesList = countriesList.filter((c) => c[0] === country);
15-
countriesList = countriesList.sort((a, b) => b[2].length - a[2].length);
16-
}
17-
return countriesList.find((c) => rawValue.startsWith(c[2]));
12+
country = country == null && rawValue.startsWith("44") ? "gb" : country;
13+
if (country != null) {
14+
countriesList = countriesList.filter((c) => c[0] === country);
15+
countriesList = countriesList.sort((a, b) => b[2].length - a[2].length);
16+
}
17+
return countriesList.find((c) => rawValue.startsWith(c[2]));
1818
}
1919

2020
export const getCountry = (countryCode: keyof typeof countries) => {
21-
return countries.find(([iso]) => iso === countryCode);
21+
return countries.find(([iso]) => iso === countryCode);
2222
}
2323

2424
export const getRawValue = (value: PhoneNumber | string) => {
25-
if (typeof value === "string") return value.replaceAll(/\D/g, "");
26-
return [value?.countryCode, value?.areaCode, value?.phoneNumber].filter(Boolean).join("");
25+
if (typeof value === "string") return value.replaceAll(/\D/g, "");
26+
return [value?.countryCode, value?.areaCode, value?.phoneNumber].filter(Boolean).join("");
2727
}
2828

2929
export const displayFormat = (value: string) => {
30-
/** Returns the formatted value that can be displayed as an actual input value */
31-
return value.replace(/[.\s\D]+$/, "").replace(/(\(\d+)$/, "$1)");
30+
/** Returns the formatted value that can be displayed as an actual input value */
31+
return value.replace(/[.\s\D]+$/, "").replace(/(\(\d+)$/, "$1)");
3232
}
3333

3434
export const cleanInput = (input: any, pattern: string) => {
35-
input = input.match(/\d/g) || [];
36-
return Array.from(pattern, c => input[0] === c || slots.has(c) ? input.shift() || c : c);
35+
input = input.match(/\d/g) || [];
36+
return Array.from(pattern, c => input[0] === c || slots.has(c) ? input.shift() || c : c);
3737
}
3838

3939
export const getFormattedNumber = (rawValue: any, pattern: string) => {
40-
/** Returns the reformatted input value based on the given pattern */
41-
return displayFormat(cleanInput(rawValue, pattern.replaceAll(/\d/g, ".")).join(""));
40+
/** Returns the reformatted input value based on the given pattern */
41+
return displayFormat(cleanInput(rawValue, pattern.replaceAll(/\d/g, ".")).join(""));
4242
}
4343

4444
export const checkValidity = (metadata: PhoneNumber, strict: boolean = false) => {
45-
/** Checks if both the area code and phone number match the validation pattern */
46-
const pattern = (validations as any)[metadata.isoCode as keyof typeof validations][Number(strict)];
47-
return new RegExp(pattern).test([metadata.areaCode, metadata.phoneNumber].filter(Boolean).join(""));
45+
/** Checks if both the area code and phone number match the validation pattern */
46+
const pattern = (validations as any)[metadata.isoCode as keyof typeof validations][Number(strict)];
47+
return new RegExp(pattern).test([metadata.areaCode, metadata.phoneNumber].filter(Boolean).join(""));
4848
}
4949

5050
export const getDefaultISO2Code = () => {
51-
/** Returns the default ISO2 code, based on the user's timezone */
52-
return (timezones[Intl.DateTimeFormat().resolvedOptions().timeZone as keyof typeof timezones] || "") || "us";
51+
/** Returns the default ISO2 code, based on the user's timezone */
52+
return (timezones[Intl.DateTimeFormat().resolvedOptions().timeZone as keyof typeof timezones] || "") || "us";
5353
}
5454

5555
export const parsePhoneNumber = (formattedNumber: string, countriesList: typeof countries = countries, country: any = null): PhoneNumber => {
56-
const value = getRawValue(formattedNumber);
57-
const isoCode = getMetadata(value, countriesList, country)?.[0] || getDefaultISO2Code();
58-
const countryCodePattern = /\+\d+/;
59-
const areaCodePattern = /\((\d+)\)/;
56+
const value = getRawValue(formattedNumber);
57+
const isoCode = getMetadata(value, countriesList, country)?.[0] || getDefaultISO2Code();
58+
const countryCodePattern = /\+\d+/;
59+
const areaCodePattern = /\((\d+)\)/;
6060

61-
/** Parses the matching partials of the phone number by predefined regex patterns */
62-
const countryCodeMatch = formattedNumber ? (formattedNumber.match(countryCodePattern) || []) : [];
63-
const areaCodeMatch = formattedNumber ? (formattedNumber.match(areaCodePattern) || []) : [];
61+
/** Parses the matching partials of the phone number by predefined regex patterns */
62+
const countryCodeMatch = formattedNumber ? (formattedNumber.match(countryCodePattern) || []) : [];
63+
const areaCodeMatch = formattedNumber ? (formattedNumber.match(areaCodePattern) || []) : [];
6464

65-
/** Converts the parsed values of the country and area codes to integers if values present */
66-
const countryCode = countryCodeMatch.length > 0 ? parseInt(countryCodeMatch[0]) : null;
67-
const areaCode = areaCodeMatch.length > 1 ? areaCodeMatch[1] : null;
65+
/** Converts the parsed values of the country and area codes to integers if values present */
66+
const countryCode = countryCodeMatch.length > 0 ? parseInt(countryCodeMatch[0]) : null;
67+
const areaCode = areaCodeMatch.length > 1 ? areaCodeMatch[1] : null;
6868

69-
/** Parses the phone number by removing the country and area codes from the formatted value */
70-
const phoneNumberPattern = new RegExp(`^${countryCode}${(areaCode || "")}(\\d+)`);
71-
const phoneNumberMatch = value ? (value.match(phoneNumberPattern) || []) : [];
72-
const phoneNumber = phoneNumberMatch.length > 1 ? phoneNumberMatch[1] : null;
69+
/** Parses the phone number by removing the country and area codes from the formatted value */
70+
const phoneNumberPattern = new RegExp(`^${countryCode}${(areaCode || "")}(\\d+)`);
71+
const phoneNumberMatch = value ? (value.match(phoneNumberPattern) || []) : [];
72+
const phoneNumber = phoneNumberMatch.length > 1 ? phoneNumberMatch[1] : null;
7373

74-
return {countryCode, areaCode, phoneNumber, isoCode};
74+
return {countryCode, areaCode, phoneNumber, isoCode};
7575
}
7676

7777
export const usePhone = ({
78-
query = "",
79-
country = "",
80-
countryCode = "",
81-
initialValue = "",
82-
onlyCountries = [],
83-
excludeCountries = [],
84-
preferredCountries = [],
85-
}: usePhoneOptions) => {
86-
const defaultValue = getRawValue(initialValue);
87-
const defaultMetadata = getMetadata(defaultValue) || countries.find(([iso]) => iso === country);
88-
const defaultValueState = defaultValue || countries.find(([iso]) => iso === defaultMetadata?.[0])?.[2] as string;
89-
90-
const backRef = useRef<boolean>(false);
91-
const [value, setValue] = useState<string>(defaultValueState);
92-
93-
const countriesOnly = useMemo(() => {
94-
const allowList = onlyCountries.length > 0 ? onlyCountries : countries.map(([iso]) => iso);
95-
return countries.map(([iso]) => iso).filter((iso) => {
96-
return allowList.includes(iso) && !excludeCountries.includes(iso);
97-
});
98-
}, [onlyCountries, excludeCountries])
99-
100-
const countriesList = useMemo(() => {
101-
const filteredCountries = countries.filter(([iso, name, _1, dial]) => {
102-
return countriesOnly.includes(iso) && (
103-
name.toLowerCase().startsWith(query.toLowerCase()) || dial.includes(query)
104-
);
105-
});
106-
return [
107-
...filteredCountries.filter(([iso]) => preferredCountries.includes(iso)),
108-
...filteredCountries.filter(([iso]) => !preferredCountries.includes(iso)),
109-
];
110-
}, [countriesOnly, preferredCountries, query])
111-
112-
const metadata = useMemo(() => {
113-
const calculatedMetadata = getMetadata(getRawValue(value), countriesList, countryCode);
114-
if (countriesList.find(([iso]) => iso === calculatedMetadata?.[0] || iso === defaultMetadata?.[0])) {
115-
return calculatedMetadata || defaultMetadata;
116-
}
117-
return countriesList[0];
118-
}, [countriesList, countryCode, defaultMetadata, value])
119-
120-
const pattern = useMemo(() => {
121-
return metadata?.[3] || defaultMetadata?.[3] || "";
122-
}, [defaultMetadata, metadata])
123-
124-
const clean = useCallback((input: any) => {
125-
return cleanInput(input, pattern.replaceAll(/\d/g, "."));
126-
}, [pattern])
127-
128-
const first = useMemo(() => {
129-
return [...pattern].findIndex(c => slots.has(c));
130-
}, [pattern])
131-
132-
const prev = useMemo((j = 0) => {
133-
return Array.from(pattern.replaceAll(/\d/g, "."), (c, i) => {
134-
return slots.has(c) ? j = i + 1 : j;
135-
});
136-
}, [pattern])
137-
138-
const format = useCallback(({target}: ChangeEvent<HTMLInputElement>) => {
139-
const [i, j] = [target.selectionStart, target.selectionEnd].map((i: any) => {
140-
i = clean(target.value.slice(0, i)).findIndex(c => slots.has(c));
141-
return i < 0 ? prev[prev.length - 1] : backRef.current ? prev[i - 1] || first : i;
142-
});
143-
target.value = getFormattedNumber(target.value, pattern);
144-
target.setSelectionRange(i, j);
145-
backRef.current = false;
146-
setValue(target.value);
147-
}, [clean, first, pattern, prev])
148-
149-
return {
150-
clean,
151-
value,
152-
format,
153-
metadata,
154-
setValue,
155-
countriesList,
156-
}
78+
query = "",
79+
country = "",
80+
countryCode = "",
81+
initialValue = "",
82+
onlyCountries = [],
83+
excludeCountries = [],
84+
preferredCountries = [],
85+
}: usePhoneOptions) => {
86+
const defaultValue = getRawValue(initialValue);
87+
const defaultMetadata = getMetadata(defaultValue) || countries.find(([iso]) => iso === country);
88+
const defaultValueState = defaultValue || countries.find(([iso]) => iso === defaultMetadata?.[0])?.[2] as string;
89+
90+
const backRef = useRef<boolean>(false);
91+
const [value, setValue] = useState<string>(defaultValueState);
92+
93+
const countriesOnly = useMemo(() => {
94+
const allowList = onlyCountries.length > 0 ? onlyCountries : countries.map(([iso]) => iso);
95+
return countries.map(([iso]) => iso).filter((iso) => {
96+
return allowList.includes(iso) && !excludeCountries.includes(iso);
97+
});
98+
}, [onlyCountries, excludeCountries])
99+
100+
const countriesList = useMemo(() => {
101+
const filteredCountries = countries.filter(([iso, name, _1, dial]) => {
102+
return countriesOnly.includes(iso) && (
103+
name.toLowerCase().startsWith(query.toLowerCase()) || dial.includes(query)
104+
);
105+
});
106+
return [
107+
...filteredCountries.filter(([iso]) => preferredCountries.includes(iso)),
108+
...filteredCountries.filter(([iso]) => !preferredCountries.includes(iso)),
109+
];
110+
}, [countriesOnly, preferredCountries, query])
111+
112+
const metadata = useMemo(() => {
113+
const calculatedMetadata = getMetadata(getRawValue(value), countriesList, countryCode);
114+
if (countriesList.find(([iso]) => iso === calculatedMetadata?.[0] || iso === defaultMetadata?.[0])) {
115+
return calculatedMetadata || defaultMetadata;
116+
}
117+
return countriesList[0];
118+
}, [countriesList, countryCode, defaultMetadata, value])
119+
120+
const pattern = useMemo(() => {
121+
return metadata?.[3] || defaultMetadata?.[3] || "";
122+
}, [defaultMetadata, metadata])
123+
124+
const clean = useCallback((input: any) => {
125+
return cleanInput(input, pattern.replaceAll(/\d/g, "."));
126+
}, [pattern])
127+
128+
const first = useMemo(() => {
129+
return [...pattern].findIndex(c => slots.has(c));
130+
}, [pattern])
131+
132+
const prev = useMemo((j = 0) => {
133+
return Array.from(pattern.replaceAll(/\d/g, "."), (c, i) => {
134+
return slots.has(c) ? j = i + 1 : j;
135+
});
136+
}, [pattern])
137+
138+
const format = useCallback(({target}: ChangeEvent<HTMLInputElement>) => {
139+
const [i, j] = [target.selectionStart, target.selectionEnd].map((i: any) => {
140+
i = clean(target.value.slice(0, i)).findIndex(c => slots.has(c));
141+
return i < 0 ? prev[prev.length - 1] : backRef.current ? prev[i - 1] || first : i;
142+
});
143+
target.value = getFormattedNumber(target.value, pattern);
144+
target.setSelectionRange(i, j);
145+
backRef.current = false;
146+
setValue(target.value);
147+
}, [clean, first, pattern, prev])
148+
149+
return {
150+
clean,
151+
value,
152+
format,
153+
metadata,
154+
setValue,
155+
countriesList,
156+
}
157157
}

‎src/styles.ts

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
export const jsonToCss = (stylesheet: object) => {
2-
/** Convert the given `stylesheet` object to raw CSS */
3-
return Object.entries(stylesheet).map(([selector, rules]) => {
4-
return `${selector} {` + Object.entries(rules).map(([key, value]) => {
5-
return `${key}: ${value}; `;
6-
}).join("") + "} ";
7-
}).join("");
2+
/** Convert the given `stylesheet` object to raw CSS */
3+
return Object.entries(stylesheet).map(([selector, rules]) => {
4+
return `${selector} {` + Object.entries(rules).map(([key, value]) => {
5+
return `${key}: ${value}; `;
6+
}).join("") + "} ";
7+
}).join("");
88
}
99

1010
export const injectStyles = (cssText: string) => {
11-
/** Inject the given `cssText` in the document head */
12-
const style = document.createElement("style");
13-
style.setAttribute("type", "text/css");
11+
/** Inject the given `cssText` in the document head */
12+
const style = document.createElement("style");
13+
style.setAttribute("type", "text/css");
1414

15-
if ((style as any).styleSheet) {
16-
(style as any).styleSheet.cssText = cssText;
17-
} else {
18-
style.appendChild(document.createTextNode(cssText));
19-
}
15+
if ((style as any).styleSheet) {
16+
(style as any).styleSheet.cssText = cssText;
17+
} else {
18+
style.appendChild(document.createTextNode(cssText));
19+
}
2020

21-
document.head.appendChild(style);
21+
document.head.appendChild(style);
2222
}

‎src/types.ts

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
export interface PhoneNumber {
2-
countryCode?: number | null;
3-
areaCode?: string | null;
4-
phoneNumber?: string | null;
5-
isoCode?: string;
2+
countryCode?: number | null;
3+
areaCode?: string | null;
4+
phoneNumber?: string | null;
5+
isoCode?: string;
66

7-
valid?(strict?: boolean): boolean;
7+
valid?(strict?: boolean): boolean;
88
}
99

1010
export interface usePhoneOptions {
11-
query?: string;
12-
country?: string;
13-
countryCode?: string;
14-
onlyCountries?: string[];
15-
excludeCountries?: string[];
16-
preferredCountries?: string[];
17-
initialValue?: PhoneNumber | string;
11+
query?: string;
12+
country?: string;
13+
countryCode?: string;
14+
onlyCountries?: string[];
15+
excludeCountries?: string[];
16+
preferredCountries?: string[];
17+
initialValue?: PhoneNumber | string;
1818
}

0 commit comments

Comments
 (0)