@rh-support/components 2.6.45 → 2.6.46

package/lib/esm/PhoneInput/CountryData.js

@@ -193,7 +193,7 @@ export const COUNTRY_DATA = [
     ['Israel', ['middle-east'], 'il', '972', '... ... ....'],
     ['Italy', ['europe', 'eu-union'], 'it', '39', '... .......', 0],
     ['Jamaica', ['america', 'carribean'], 'jm', '1876'],
-    ['Japan', ['asia'], 'jp', '81', '.. .... ....'],
+    ['Japan', ['asia'], 'jp', '81', '... .... ....'],
     ['Jordan', ['middle-east'], 'jo', '962'],
     [
         'Kazakhstan',

package/lib/esm/PhoneInput/PhoneInput.d.ts

@@ -11,6 +11,7 @@ interface IProps {
     isLoading?: boolean;
     isDisabled?: boolean;
     shouldNotSetCountryCode?: boolean;
+    preferredCountryIso2?: string;
 }
 export declare const getExactCountry: (phoneNumber: string) => any[] | {
     name: string | number | string[];
@@ -27,6 +28,18 @@ export declare const getPhoneObj: (phoneNumber: string) => {
     countryCode: string;
     phoneLine: string;
 };
+export declare const getCountryByIso2: (iso2: string) => {
+    name: string | number | string[];
+    regions: string | number | string[];
+    iso2: string | number | string[];
+    countryCode: string | number | string[];
+    dialCode: string | number | string[];
+    format: string;
+    priority: string | number | string[];
+    areaCode: string | number | string[];
+    phoneInitials: string[];
+};
+export declare const getPreferredCountryIso2FromTimezone: (timezone?: string | null) => string;
 export declare function PhoneInput(props: IProps): React.JSX.Element;
 export {};
 //# sourceMappingURL=PhoneInput.d.ts.map

package/lib/esm/PhoneInput/PhoneInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAoB3B,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACtE,mBAAmB,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACrC;AAoDD,eAAO,MAAM,eAAe,GAAI,aAAa,MAAM;;;;;;;;;;CAmClD,CAAC;AAyCF,eAAO,MAAM,WAAW,GAAI,aAAa,MAAM;;;CAgB9C,CAAC;AAEF,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,qBA8RvC"}
+{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAoB3B,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,UAAU,MAAM;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACtE,mBAAmB,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,OAAO,KAAA,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CACjC;AAoDD,eAAO,MAAM,eAAe,GAAI,aAAa,MAAM;;;;;;;;;;CAmClD,CAAC;AA6CF,eAAO,MAAM,WAAW,GAAI,aAAa,MAAM;;;CAgB9C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM;;;;;;;;;;CAG5C,CAAC;AAEF,eAAO,MAAM,mCAAmC,GAAI,WAAW,MAAM,GAAG,IAAI,KAAG,MAK9E,CAAC;AAEF,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,qBAoSvC"}

package/lib/esm/PhoneInput/PhoneInput.js

@@ -106,6 +106,9 @@ const formatNumber = (fullPhoneNumber, localFormat) => {
             pattern += localFormat[j];
         }
     }
+    if (i < (phone === null || phone === void 0 ? void 0 : phone.length)) {
+        pattern += (pattern && !pattern.endsWith(' ') ? ' ' : '') + phone.slice(i);
+    }
     const isPatternWithPrefix = (_a = pattern === null || pattern === void 0 ? void 0 : pattern.replace(/\s+/g, '')) === null || _a === void 0 ? void 0 : _a.startsWith(PREFIX);
     // TODO: Temporary — return pattern without forcing + prefix for portal phone without country code.
     pattern = isPatternWithPrefix ? pattern : pattern;
@@ -131,8 +134,21 @@ export const getPhoneObj = (phoneNumber) => {
         phoneLine: localPhone === null || localPhone === void 0 ? void 0 : localPhone.substring((_a = trimAndReplacePlusFromPhone(countryCode)) === null || _a === void 0 ? void 0 : _a.length, localPhone === null || localPhone === void 0 ? void 0 : localPhone.length),
     };
 };
+export const getCountryByIso2 = (iso2) => {
+    if (!iso2)
+        return undefined;
+    return initializedCountries.find((country) => isEqual(country.iso2, iso2.toLowerCase()));
+};
+export const getPreferredCountryIso2FromTimezone = (timezone) => {
+    if (!timezone)
+        return '';
+    const tz = timezone.toLowerCase();
+    if (tz.includes('tokyo') || tz.includes('osaka') || tz.endsWith('/japan'))
+        return 'jp';
+    return '';
+};
 export function PhoneInput(props) {
-    const { phoneValue, countryCode, onCountryCodeChange, onPhoneValueChange, validations, setInvalid, shouldNotSetCountryCode, } = props;
+    const { phoneValue, countryCode, onCountryCodeChange, onPhoneValueChange, validations, setInvalid, shouldNotSetCountryCode, preferredCountryIso2, } = props;
     const { t } = useTranslation();
     const [isOpen, setIsOpen] = useState(false);
     const [iso2, setIso2] = useState('');
@@ -182,10 +198,10 @@ export function PhoneInput(props) {
             !(phone === null || phone === void 0 ? void 0 : phone.trim().startsWith(PREFIX)) &&
             regex.test(phone) &&
             !isEqual(phone, '-')) {
-            onPhoneValueChange(PREFIX + (phone === null || phone === void 0 ? void 0 : phone.trim()));
+            onPhoneValueChange(_formattedNumber || PREFIX + (phone === null || phone === void 0 ? void 0 : phone.trim()));
         }
         else {
-            onPhoneValueChange(phone === null || phone === void 0 ? void 0 : phone.slice(0, localFormat === null || localFormat === void 0 ? void 0 : localFormat.length));
+            onPhoneValueChange(_formattedNumber || phone);
         }
         /* TODO: Revert to previous logic after phone format handling is finalized.
         if (!phone?.trim().startsWith(PREFIX) && regex.test(phone) && !isEqual(phone, '-')) {
@@ -208,8 +224,12 @@ export function PhoneInput(props) {
                     : '';
                 const phoneWithoutCountryCode = (_b = removeAllChars(phoneValue)) === null || _b === void 0 ? void 0 : _b.replace(prevCountryCode, '');
                 const formattedPhone = `${PREFIX}${selection.countryCode}${phoneWithoutCountryCode}`;
-                const localFormattedPhone = setLocalFormat(formattedPhone);
-                onPhoneValueChange(formatNumber(formattedPhone, localFormattedPhone));
+                setIso2(String(selection.iso2));
+                onCountryCodeChange && onCountryCodeChange(PREFIX + selection.dialCode.toString());
+                const localFormattedPhone = selection.format.toString();
+                const formatted = formatNumber(formattedPhone, localFormattedPhone);
+                setFormattedNumber(formatted);
+                onPhoneValueChange(formatted);
                 setIsOpen(false);
                 setActiveItem(itemId);
             }
@@ -233,11 +253,12 @@ export function PhoneInput(props) {
             React.createElement("div", { className: "pf-v6-c-menu__item-main" },
                 React.createElement("div", { className: "pf-v6-c-menu__item-text" }, t('No results found')))));
     }
+    const displayIso2 = iso2 || preferredCountryIso2 || '';
     const placeholder = (React.createElement("div", { className: "phone-number-select-placeholder" },
         React.createElement("div", { className: "pf-v6-u-display-inline-flex" },
             React.createElement("svg", { className: "flag-class-selected" },
-                React.createElement("use", { xlinkHref: `#cc_${iso2}` })),
-            iso2.toUpperCase())));
+                React.createElement("use", { xlinkHref: `#cc_${displayIso2}` })),
+            displayIso2.toUpperCase())));
     useEffect(() => {
         // when user types +, it will be replaced by empty string
         if (isEqual(phoneValue === null || phoneValue === void 0 ? void 0 : phoneValue.trim(), PREFIX) && isEmpty(iso2)) {
@@ -275,8 +296,9 @@ export function PhoneInput(props) {
             setIso2('');
             onCountryCodeChange && onCountryCodeChange('');
         }
-        else {
-            onCountryCodeChange && onCountryCodeChange(PREFIX + countryCode);
+        else if (!isEmpty(countryCode)) {
+            const normalizedCountryCode = countryCode.startsWith(PREFIX) ? countryCode : PREFIX + countryCode;
+            onCountryCodeChange && onCountryCodeChange(normalizedCountryCode);
         }
         // TODO: Temporary — strip leading + when shouldNotSetCountryCode is true.
         const normalizedPhone = shouldNotSetCountryCode
@@ -294,7 +316,7 @@ export function PhoneInput(props) {
         */
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [shouldNotSetCountryCode]);
-    const toggle = (React.createElement(MenuToggle, { ref: toggleRef, onClick: () => setIsOpen(!isOpen), isExpanded: isOpen, className: "phone-number-select", "data-tracking-id": "case-phone-number-country-code", isDisabled: props.isDisabled, "aria-label": "Country Code" }, iso2 && phoneValue !== '' ? placeholder : t('Country Code')));
+    const toggle = (React.createElement(MenuToggle, { ref: toggleRef, onClick: () => setIsOpen(!isOpen), isExpanded: isOpen, className: "phone-number-select", "data-tracking-id": "case-phone-number-country-code", isDisabled: props.isDisabled, "aria-label": "Country Code" }, (iso2 && phoneValue !== '') || preferredCountryIso2 ? placeholder : t('Country Code')));
     const menu = (React.createElement(Menu, { ref: menuRef, onSelect: onCountrySelect, activeItemId: activeItem, isScrollable: true },
         React.createElement(MenuSearch, null,
             React.createElement(MenuSearchInput, null,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@rh-support/components",
-    "version": "2.6.45",
+    "version": "2.6.46",
     "description": "Contains all reusabel components for support app",
     "author": "Vikas Rathee <vrathee@redhat.com>",
     "license": "ISC",
@@ -62,8 +62,8 @@
         "@patternfly/react-icons": "6.2.1",
         "@patternfly/react-table": "6.2.1",
         "@rh-support/types": "2.0.31",
-        "@rh-support/user-permissions": "2.6.42",
-        "@rh-support/utils": "2.6.41",
+        "@rh-support/user-permissions": "2.6.43",
+        "@rh-support/utils": "2.6.42",
         "dompurify": "^2.2.6",
         "js-worker-search": "^1.4.1",
         "lazysizes": "^5.3.2",
@@ -103,5 +103,5 @@
         "defaults and supports es6-module",
         "maintained node versions"
     ],
-    "gitHead": "45704746d332e15fd54506984909bc91452ef4a9"
+    "gitHead": "f93a43376534c539511491878802f207d215360c"
 }