@arkyn/components 1.4.55 → 1.4.56

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.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,eAAe,EAAE,MAAM,cAAc,CAAC;AAY5D,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,2CAiKzC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAe,eAAe,EAAE,MAAM,cAAc,CAAC;AAY5D,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,2CAkKzC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
@@ -1,5 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { countries } from "@arkyn/templates";
3
+ import { formatToPhone } from "@arkyn/shared";
3
4
  import { useRef, useState } from "react";
4
5
  import { useFormController } from "../Form/FormController";
5
6
  import { PhoneInputContainer } from "./components/PhoneInputContainer";
@@ -16,6 +17,7 @@ function PhoneInput(props) {
16
17
  const [search, setSearch] = useState("");
17
18
  const [showCountryOptions, setShowCountryOptions] = useState(false);
18
19
  const [value, setValue] = useState(defaultData.formattedNumber || "");
20
+ const usedValue = formatToPhone(fixedValue) || value;
19
21
  const [currentCountry, setCurrentCountry] = useState(() => {
20
22
  if (defaultData.country)
21
23
  return defaultData.country;
@@ -73,7 +75,7 @@ function PhoneInput(props) {
73
75
  if (currentCountry.prefix)
74
76
  returnValue += `-${currentCountry.prefix}`;
75
77
  returnValue += " ";
76
- returnValue += removeNumberMasks(fixedValue || props || value);
78
+ returnValue += removeNumberMasks(props || usedValue);
77
79
  return returnValue;
78
80
  }
79
81
  return (_jsxs(PhoneInputContainer, { id: id, disabled: disabled, isError: isError, isLoading: isLoading, isFocused: isFocused, readOnly: readOnly, size: size, variant: variant, className: className, onFocus: handleContainerFocus, children: [_jsx(PhoneInputCountrySelector, { currentCountry: currentCountry, onClick: handleOpenCountryOptions, size: size }), _jsxs(PhoneInputCountryOptionsContainer, { isOpen: showCountryOptions, search: search, placeholder: searchCountryPlaceholder, onSearch: setSearch, children: [countries
@@ -83,7 +85,7 @@ function PhoneInput(props) {
83
85
  setShowCountryOptions(false);
84
86
  setValue(country.mask);
85
87
  }, isActive: country.iso === currentCountry.iso, size: size }, country.iso))), countries.filter((country) => filterCountryFunction(country))
86
- .length === 0 && _jsx("p", { children: notFoundCountryText })] }), _jsx(PhoneInputCountriesOverlay, { isOpen: showCountryOptions, onClick: handleCloseCountryOptions }), _jsx(PhoneInputMask, { ref: inputPhoneMaskRef, currentCountry: currentCountry, value: inputValue(fixedValue || value), onChange: (e) => {
88
+ .length === 0 && _jsx("p", { children: notFoundCountryText })] }), _jsx(PhoneInputCountriesOverlay, { isOpen: showCountryOptions, onClick: handleCloseCountryOptions }), _jsx(PhoneInputMask, { ref: inputPhoneMaskRef, currentCountry: currentCountry, value: usedValue, onChange: (e) => {
87
89
  setValue(e);
88
90
  onChange && onChange(inputValue(e));
89
91
  }, disabled: disabled, onBlur: handleInputBlur, onFocus: handleInputFocus, size: size }), _jsx("input", { ref: inputRef, type: "hidden", name: name, value: inputValue() })] }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arkyn/components",
3
- "version": "1.4.55",
3
+ "version": "1.4.56",
4
4
  "main": "./dist/bundle.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "author": "Lucas Gonçalves",
@@ -1,4 +1,5 @@
1
1
  import { countries } from "@arkyn/templates";
2
+ import { formatToPhone } from "@arkyn/shared";
2
3
  import { CountryType, PhoneInputProps } from "@arkyn/types";
3
4
  import { useRef, useState } from "react";
4
5
 
@@ -35,6 +36,7 @@ function PhoneInput(props: PhoneInputProps) {
35
36
  const [search, setSearch] = useState("");
36
37
  const [showCountryOptions, setShowCountryOptions] = useState(false);
37
38
  const [value, setValue] = useState(defaultData.formattedNumber || "");
39
+ const usedValue = formatToPhone(fixedValue) || value;
38
40
 
39
41
  const [currentCountry, setCurrentCountry] = useState<CountryType>(() => {
40
42
  if (defaultData.country) return defaultData.country;
@@ -101,7 +103,7 @@ function PhoneInput(props: PhoneInputProps) {
101
103
  let returnValue = currentCountry.code;
102
104
  if (currentCountry.prefix) returnValue += `-${currentCountry.prefix}`;
103
105
  returnValue += " ";
104
- returnValue += removeNumberMasks(fixedValue || props || value);
106
+ returnValue += removeNumberMasks(props || usedValue);
105
107
  return returnValue;
106
108
  }
107
109
 
@@ -158,7 +160,7 @@ function PhoneInput(props: PhoneInputProps) {
158
160
  <PhoneInputMask
159
161
  ref={inputPhoneMaskRef}
160
162
  currentCountry={currentCountry}
161
- value={inputValue(fixedValue || value)}
163
+ value={usedValue}
162
164
  onChange={(e) => {
163
165
  setValue(e);
164
166
  onChange && onChange(inputValue(e));