ingeniuscliq-core 0.5.46 → 0.5.48

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 (4) hide show
  1. package/dist/components/common/form/FormPhone.d.ts +2 -1
  2. package/dist/components/common/form/FormPhone.d.ts.map +1 -1
  3. package/dist/components/common/form/FormPhone.js +24 -15
  4. package/package.json +1 -1
package/dist/components/common/form/FormPhone.d.ts CHANGED
@@ -21,7 +21,8 @@ interface FormPhoneProps<T extends FieldValues = FieldValues> extends BaseStyleP
21
21
  readonly phoneNumberFieldName?: string;
22
22
  readonly initialCountryCode?: string;
23
23
  readonly selectProps?: React.ComponentProps<typeof Select>;
24
+ readonly validateOnMount?: boolean;
24
25
  }
25
- export declare function FormPhone<T extends FieldValues = FieldValues>({ control, name, label, customLabel, placeholder, className, inputProps, withinLabel, withinMessage, withinControl, required, withoutPlaceholder, setValue, watch, trigger, countryCodeFieldName, phoneNumberFieldName, initialCountryCode, selectProps }: FormPhoneProps<T>): import("react").JSX.Element;
26
+ export declare function FormPhone<T extends FieldValues = FieldValues>({ control, name, label, customLabel, placeholder, className, inputProps, withinLabel, withinMessage, withinControl, required, withoutPlaceholder, setValue, watch, trigger, countryCodeFieldName, phoneNumberFieldName, initialCountryCode, selectProps, validateOnMount }: FormPhoneProps<T>): import("react").JSX.Element;
26
27
  export {};
27
28
  //# sourceMappingURL=FormPhone.d.ts.map
package/dist/components/common/form/FormPhone.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormPhone.d.ts","sourceRoot":"","sources":["../../../../src/components/common/form/FormPhone.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAyD,MAAM,wBAAwB,CAAC;AAEvG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAWnF,UAAU,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CAAE,SAAQ,cAAc;IAClF,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG,kBAAkB,CAAC;IACzE,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IACtC,QAAQ,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IACtC,QAAQ,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC;IACvC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IACpE,QAAQ,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IACvC,QAAQ,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IACvC,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IACrC,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;CAC5D;AAED,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,EAC7D,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,WAAuB,EACvB,WAAgB,EAChB,SAAc,EACd,UAAe,EACf,WAAmB,EACnB,aAAqB,EACrB,aAAqB,EACrB,QAAgB,EAChB,kBAA0B,EAC1B,QAAQ,EACR,KAAK,EACL,OAAO,EACP,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,EAClB,WAAgB,EACjB,EAAE,cAAc,CAAC,CAAC,CAAC,+BAoKnB"}
1
+ {"version":3,"file":"FormPhone.d.ts","sourceRoot":"","sources":["../../../../src/components/common/form/FormPhone.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAyD,MAAM,wBAAwB,CAAC;AAEvG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAWnF,UAAU,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CAAE,SAAQ,cAAc;IAClF,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG,kBAAkB,CAAC;IACzE,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IACtC,QAAQ,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IACtC,QAAQ,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC;IACvC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IACpE,QAAQ,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IACvC,QAAQ,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IACvC,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IACrC,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;IAC3D,QAAQ,CAAC,eAAe,CAAC,EAAE,OAAO,CAAC;CACpC;AAED,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,EAC7D,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,WAAuB,EACvB,WAAgB,EAChB,SAAc,EACd,UAAe,EACf,WAAmB,EACnB,aAAqB,EACrB,aAAqB,EACrB,QAAgB,EAChB,kBAA0B,EAC1B,QAAQ,EACR,KAAK,EACL,OAAO,EACP,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,EAClB,WAAgB,EAChB,eAAuB,EACxB,EAAE,cAAc,CAAC,CAAC,CAAC,+BAqLnB"}
package/dist/components/common/form/FormPhone.js CHANGED
@@ -32,7 +32,8 @@ function FormPhone({
32
32
  countryCodeFieldName,
33
33
  phoneNumberFieldName,
34
34
  initialCountryCode,
35
- selectProps = {}
35
+ selectProps = {},
36
+ validateOnMount = false
36
37
  }) {
37
38
  const { t, language } = useLanguage();
38
39
  const countryCodes = useMemo(() => {
@@ -61,13 +62,14 @@ function FormPhone({
61
62
  useEffect(() => {
62
63
  if (initialCountryCode && !watch(countryCodeField)) {
63
64
  const country = countryCodes.find((c) => c.countryCode === initialCountryCode);
64
- if (country) {
65
- setValue(countryCodeField, country.callingCode);
66
- setValue(selectedCountryField, country.countryCode);
67
- setValue(phoneNumberField, "");
65
+ if (country && validateOnMount) {
66
+ setValue(countryCodeField, country.callingCode, { shouldValidate: false });
67
+ setValue(selectedCountryField, country.countryCode, { shouldValidate: false });
68
+ setValue(phoneNumberField, "", { shouldValidate: false });
69
+ setValue(name, "", { shouldValidate: validateOnMount });
68
70
  }
69
71
  }
70
- }, [initialCountryCode, countryCodes]);
72
+ }, [initialCountryCode, countryCodes, validateOnMount, watch, setValue, countryCodeField, selectedCountryField, phoneNumberField, name]);
71
73
  useEffect(() => {
72
74
  const fullPhone = watch(name);
73
75
  const currentCountryCode = watch(countryCodeField);
@@ -76,18 +78,18 @@ function FormPhone({
76
78
  if (matchedCountry) {
77
79
  const callingCode = matchedCountry.callingCode;
78
80
  const phoneNumber = fullPhone.substring(callingCode.length);
79
- setValue(countryCodeField, callingCode);
80
- setValue(phoneNumberField, phoneNumber);
81
- setValue(selectedCountryField, matchedCountry.countryCode);
81
+ setValue(countryCodeField, callingCode, { shouldValidate: false });
82
+ setValue(phoneNumberField, phoneNumber, { shouldValidate: false });
83
+ setValue(selectedCountryField, matchedCountry.countryCode, { shouldValidate: false });
82
84
  }
83
85
  }
84
- }, [watch(name), countryCodes]);
86
+ }, [name, countryCodes, watch, setValue, countryCodeField, phoneNumberField, selectedCountryField]);
85
87
  const getPlaceholder = useCallback(() => {
86
88
  if (withoutPlaceholder) return "";
87
89
  if (placeholder) return required ? placeholder : `${placeholder} ${t("fields.optional")}`;
88
90
  if (name) return required ? t(`fields.${name}`) : `${t("fields." + name)} ${t("fields.fieldLabel.optional")}`;
89
91
  return "";
90
- }, [withoutPlaceholder, placeholder, name, required]);
92
+ }, [withoutPlaceholder, placeholder, name, required, t]);
91
93
  const getLabel = useCallback(() => {
92
94
  if (withinLabel) return "";
93
95
  if (label) return required ? `${label} *` : label;
@@ -113,13 +115,15 @@ function FormPhone({
113
115
  const [isoCode, callingCode] = value.split("|");
114
116
  setValue(countryCodeField, callingCode);
115
117
  setValue(selectedCountryField, isoCode);
116
- const phoneNumber = watch(phoneNumberField);
118
+ const phoneNumber = watch(phoneNumberField) || "";
117
119
  if (phoneNumber) {
118
120
  const fullNumber = `${callingCode}${phoneNumber}`;
119
121
  field.onChange(fullNumber);
120
122
  if (trigger) {
121
123
  trigger(name);
122
124
  }
125
+ } else {
126
+ field.onChange("");
123
127
  }
124
128
  },
125
129
  value: (
@@ -150,13 +154,18 @@ function FormPhone({
150
154
  onChange: (e) => {
151
155
  const phoneNumber = e.target.value.replace(/[^\d]/g, "");
152
156
  setValue(phoneNumberField, phoneNumber);
153
- const countryCode = watch(countryCodeField);
154
- if (countryCode) {
155
- const fullNumber = phoneNumber ? `${countryCode}${phoneNumber}` : "";
157
+ if (phoneNumber) {
158
+ const countryCode = watch(countryCodeField) || "+53";
159
+ const fullNumber = `${countryCode}${phoneNumber}`;
156
160
  field.onChange(fullNumber);
157
161
  if (trigger) {
158
162
  trigger(name);
159
163
  }
164
+ } else {
165
+ field.onChange("");
166
+ if (trigger) {
167
+ trigger(name);
168
+ }
160
169
  }
161
170
  },
162
171
  onBlur: field.onBlur,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ingeniuscliq-core",
3
- "version": "0.5.46",
3
+ "version": "0.5.48",
4
4
  "description": "IngeniusCliq Core UI y lógica compartida",
5
5
  "license": "MIT",
6
6
  "type": "module",