callix-dialer-widget 1.4.9 → 1.5.0

package/dist-widget/callix-dialer.es.js

@@ -53110,6 +53110,9 @@ function normalizePhoneNumberPaste(pastedText) {
     if (numero[0] === "9") {
       return cleaned;
     }
+    if (["2", "3", "4"].includes(numero[0])) {
+      return cleaned;
+    }
     return ddd + "9" + numero;
   }
   if (len === 12) {
@@ -53753,6 +53756,7 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
   const dialerCardRef = useRef(null);
   const dialDisplayRef = useRef(null);
   const hiddenInputRef = useRef(null);
+  const visibleInputRef = useRef(null);
   const [callError, setCallError] = useState(null);
   const [availabilityError, setAvailabilityError] = useState(null);
   const [afterCallError, setAfterCallError] = useState(null);
@@ -53760,6 +53764,7 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
   const [afterCallResult, setAfterCallResult] = useState("success");
   const [selectedQualificationId, setSelectedQualificationId] = useState(null);
   const [callDurationSeconds, setCallDurationSeconds] = useState(0);
+  const [cursorPosition, setCursorPosition] = useState(0);
   const [networkMetric, setNetworkMetric] = useState(INITIAL_NETWORK_METRIC);
   const [audioMetric, setAudioMetric] = useState(INITIAL_AUDIO_METRIC);
   const toneContextRef = useRef(null);
@@ -54226,39 +54231,90 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
         return;
       }
       setCallError(null);
-      setDialValue((prev) => (prev + digit).slice(0, MAX_DIAL_LENGTH));
+      if (!/^[0-9*#]$/.test(digit)) {
+        console.warn("[handleDial] Dígito inválido ignorado:", digit);
+        return;
+      }
+      const capturedPos = cursorPosition;
+      setDialValue((prevValue) => {
+        const currentValue = prevValue;
+        const newValue = currentValue.slice(0, capturedPos) + digit + currentValue.slice(capturedPos);
+        const trimmedValue = newValue.slice(0, MAX_DIAL_LENGTH);
+        const newCursorPos = Math.min(capturedPos + 1, trimmedValue.length);
+        setCursorPosition(newCursorPos);
+        setTimeout(() => {
+          if (visibleInputRef.current) {
+            visibleInputRef.current.focus();
+            visibleInputRef.current.setSelectionRange(newCursorPos, newCursorPos);
+          }
+        }, 0);
+        return trimmedValue;
+      });
     },
-    [playTone, currentCall, isInCall, isRinging, canEditNumber, setDialValue]
+    [playTone, currentCall, isInCall, isRinging, canEditNumber, cursorPosition, setDialValue]
   );
   const handleClear = useCallback(() => {
     setCallError(null);
     setDialValue("");
+    setCursorPosition(0);
+    setTimeout(() => {
+      if (visibleInputRef.current) {
+        visibleInputRef.current.focus();
+      }
+    }, 0);
   }, [setDialValue]);
   const handleBackspace = useCallback(() => {
     setCallError(null);
-    setDialValue((prev) => prev.slice(0, -1));
-  }, [setDialValue]);
+    const capturedPos = cursorPosition;
+    if (capturedPos === 0) {
+      return;
+    }
+    setDialValue((prevValue) => {
+      const newValue = prevValue.slice(0, capturedPos - 1) + prevValue.slice(capturedPos);
+      const newCursorPos = capturedPos - 1;
+      setCursorPosition(newCursorPos);
+      setTimeout(() => {
+        if (visibleInputRef.current) {
+          visibleInputRef.current.focus();
+          visibleInputRef.current.setSelectionRange(newCursorPos, newCursorPos);
+        }
+      }, 0);
+      return newValue;
+    });
+  }, [setDialValue, cursorPosition]);
   const handleCall = useCallback(async () => {
     if (!isIdle && !isOnBreak) {
       return;
     }
-    if (!normalizedNumber) {
+    if (!sanitizedDialValue) {
       setCallError("Informe um numero para ligar.");
       return;
     }
-    if (!isNumberValid) {
-      setCallError("Numero invalido. Digite apenas o numero local, sem o +55.");
+    const normalizedLocal = normalizePhoneNumberPaste(sanitizedDialValue);
+    console.log("[handleCall] sanitizedDialValue:", sanitizedDialValue);
+    console.log("[handleCall] normalizedLocal após normalizePhoneNumberPaste:", normalizedLocal);
+    const e164Number = normalizeToE164(normalizedLocal, DEFAULT_COUNTRY_PREFIX);
+    console.log("[handleCall] e164Number após normalizeToE164:", e164Number);
+    if (!e164Number) {
+      setCallError("Informe um numero para ligar.");
       return;
     }
+    const isValid2 = isValidPhoneNumberSafe(e164Number);
+    console.log("[handleCall] isValidPhoneNumberSafe:", isValid2);
+    if (!isValid2) {
+      setCallError("Numero invalido. Digite um numero de celular valido com DDD.");
+      return;
+    }
+    console.log("[handleCall] 🚀 Ligando para:", e164Number);
     try {
       setCallError(null);
-      setLastDialedNumber(normalizedNumber);
-      await makeManualCall(normalizedNumber);
+      setLastDialedNumber(e164Number);
+      void makeManualCall(e164Number);
     } catch (error2) {
       console.error("Erro ao iniciar chamada", error2);
       setCallError("Nao foi possivel iniciar a ligacao.");
     }
-  }, [isIdle, isOnBreak, normalizedNumber, isNumberValid, makeManualCall]);
+  }, [isIdle, isOnBreak, sanitizedDialValue, makeManualCall]);
   const handleGoOnBreak = useCallback(async (breakId) => {
     try {
       setBreakError(null);
@@ -54280,7 +54336,17 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
     }
   }, [goOffBreak]);
   useEffect(() => {
-    if (!isMiniMode && !isDialerFocused) {
+    if (visibleInputRef.current && sanitizedDialValue.length < cursorPosition) {
+      const newPos = sanitizedDialValue.length;
+      setCursorPosition(newPos);
+      visibleInputRef.current.setSelectionRange(newPos, newPos);
+    }
+  }, [sanitizedDialValue, cursorPosition]);
+  useEffect(() => {
+    if (isMiniMode) {
+      return;
+    }
+    if (!isDialerFocused) {
       return;
     }
     const handleKeyDown = (event2) => {
@@ -54406,6 +54472,13 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
     }
     const normalized = normalizePhoneNumberPaste(pastedText);
     setDialValue(normalized);
+    setCursorPosition(normalized.length);
+    setTimeout(() => {
+      if (visibleInputRef.current) {
+        visibleInputRef.current.focus();
+        visibleInputRef.current.setSelectionRange(normalized.length, normalized.length);
+      }
+    }, 0);
   }, [setDialValue]);
   const handleSelectInputDevice = useCallback((event2) => {
     const value = event2.target.value;
@@ -54671,15 +54744,86 @@ function AuthenticatedDialer({ username, dialValue, setDialValue, onLogout, vari
           ] }) }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
-              className: tw`space-y-1 rounded-xl border border-slate-200 bg-slate-50 px-3 py-2 cursor-text`,
-              onClick: () => {
-                var _a3;
-                return (_a3 = hiddenInputRef.current) == null ? void 0 : _a3.focus();
-              },
+              className: tw`space-y-1 rounded-xl border border-slate-200 bg-slate-50 px-3 py-2`,
               children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: tw`text-[10px] font-semibold uppercase tracking-wide text-slate-500`, children: "Numero" }),
                 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: tw`flex items-center gap-2`, children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: tw`flex-1 truncate text-sm font-semibold text-slate-800`, children: dialDisplayText || /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: tw`text-slate-400 text-xs font-normal`, children: "Digite ou cole um numero" }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    "input",
+                    {
+                      ref: visibleInputRef,
+                      type: "text",
+                      inputMode: "tel",
+                      value: sanitizedDialValue,
+                      onChange: (e) => {
+                        const input = e.target;
+                        setCursorPosition(input.selectionStart || 0);
+                      },
+                      onClick: (e) => {
+                        setCursorPosition(e.target.selectionStart || 0);
+                      },
+                      onKeyUp: (e) => {
+                        setCursorPosition(e.target.selectionStart || 0);
+                      },
+                      onSelect: (e) => {
+                        setCursorPosition(e.target.selectionStart || 0);
+                      },
+                      onKeyDown: (e) => {
+                        if (!miniCanUseKeypad) {
+                          e.preventDefault();
+                          return;
+                        }
+                        const key = e.key;
+                        const input = e.target;
+                        const currentPos = input.selectionStart || 0;
+                        setCursorPosition(currentPos);
+                        if (key === "Backspace") {
+                          e.preventDefault();
+                          handleBackspace();
+                          return;
+                        }
+                        if (key === "Delete") {
+                          e.preventDefault();
+                          const capturedPos = currentPos;
+                          setDialValue((prevValue) => {
+                            if (capturedPos < prevValue.length) {
+                              const newValue = prevValue.slice(0, capturedPos) + prevValue.slice(capturedPos + 1);
+                              setTimeout(() => {
+                                if (visibleInputRef.current) {
+                                  visibleInputRef.current.setSelectionRange(capturedPos, capturedPos);
+                                  setCursorPosition(capturedPos);
+                                }
+                              }, 0);
+                              return newValue;
+                            }
+                            return prevValue;
+                          });
+                          return;
+                        }
+                        if (key === "Enter") {
+                          e.preventDefault();
+                          void handleCall();
+                          return;
+                        }
+                        if (["ArrowLeft", "ArrowRight", "Home", "End"].includes(key)) {
+                          return;
+                        }
+                        if ((e.ctrlKey || e.metaKey) && ["a", "c", "v", "x"].includes(key.toLowerCase())) {
+                          return;
+                        }
+                        if (/^[0-9*#]$/.test(key)) {
+                          e.preventDefault();
+                          handleDial(key);
+                          return;
+                        }
+                        e.preventDefault();
+                      },
+                      onPaste: handlePaste,
+                      disabled: !miniCanUseKeypad,
+                      placeholder: "Digite ou cole um numero",
+                      className: tw`flex-1 bg-transparent text-sm font-semibold text-slate-800 outline-none placeholder:text-slate-400 placeholder:text-xs placeholder:font-normal disabled:opacity-60 disabled:cursor-not-allowed`
+                    }
+                  ),
                   /* @__PURE__ */ jsxRuntimeExports.jsx(
                     "button",
                     {
@@ -55172,7 +55316,15 @@ function normalizeToE164(rawValue, defaultPrefix) {
   if (!prefixDigits) {
     return `+${digits}`;
   }
-  return `+${prefixDigits}${digits}`;
+  let phoneNumber = digits;
+  if (prefixDigits === "55" && digits.length >= 10) {
+    const ddd = digits.substring(0, 2);
+    const number = digits.substring(2);
+    if (number.length === 8 && !["2", "3", "4"].includes(number[0])) {
+      phoneNumber = `${ddd}9${number}`;
+    }
+  }
+  return `+${prefixDigits}${phoneNumber}`;
 }
 function isValidPhoneNumberSafe(value) {
   try {