@tmsoft/webphone 3.0.25 → 5.0.1

package/dist/webphone.es.js

@@ -7124,11 +7124,11 @@ var concatArrays = (e, t) => {
 		isNumber,
 		isArbitraryVariable,
 		isArbitraryValue
-	], J = () => [
+	], Jp = () => [
 		isNumber,
 		isArbitraryVariable,
 		isArbitraryValue
-	], Y = () => [
+	], J = () => [
 		isFraction,
 		"full",
 		...O()
@@ -8020,9 +8020,9 @@ var concatArrays = (e, t) => {
 			"scale-y": [{ "scale-y": q() }],
 			"scale-z": [{ "scale-z": q() }],
 			"scale-3d": ["scale-3d"],
-			skew: [{ skew: J() }],
-			"skew-x": [{ "skew-x": J() }],
-			"skew-y": [{ "skew-y": J() }],
+			skew: [{ skew: Jp() }],
+			"skew-x": [{ "skew-x": Jp() }],
+			"skew-y": [{ "skew-y": Jp() }],
 			transform: [{ transform: [
 				isArbitraryVariable,
 				isArbitraryValue,
@@ -8033,10 +8033,10 @@ var concatArrays = (e, t) => {
 			] }],
 			"transform-origin": [{ origin: T() }],
 			"transform-style": [{ transform: ["3d", "flat"] }],
-			translate: [{ translate: Y() }],
-			"translate-x": [{ "translate-x": Y() }],
-			"translate-y": [{ "translate-y": Y() }],
-			"translate-z": [{ "translate-z": Y() }],
+			translate: [{ translate: J() }],
+			"translate-x": [{ "translate-x": J() }],
+			"translate-y": [{ "translate-y": J() }],
+			"translate-z": [{ "translate-z": J() }],
 			"translate-none": ["translate-none"],
 			accent: [{ accent: B() }],
 			appearance: [{ appearance: ["none", "auto"] }],
@@ -8425,8 +8425,61 @@ const createSipService = (e, t = {}) => {
 		o.volume = e / 100;
 	}, L = async (e) => {
 		typeof o.setSinkId == "function" && await o.setSinkId(e);
-	}, R = (e) => {
-		l.value = e;
+	}, R = async (t) => {
+		if (!t) return;
+		let n = [...a.value.entries()].flatMap(([e, t]) => {
+			let n = t.sessionDescriptionHandler, i = n?.peerConnection?.getSenders().find((e) => e.track?.kind === "audio");
+			return i ? [{
+				channelId: e,
+				session: t,
+				sdh: n,
+				sender: i
+			}] : [];
+		});
+		if (n.length === 0) {
+			l.value = t;
+			return;
+		}
+		let i = [], o = [];
+		try {
+			for (let { sender: e } of n) {
+				let n = await navigator.mediaDevices.getUserMedia(U(!1, t));
+				i.push(n);
+				let [a] = n.getAudioTracks(), s = e.track;
+				if (!a || !s) throw Error("Could not acquire an audio track for the selected microphone");
+				a.enabled = s.enabled, await e.replaceTrack(a), o.push({
+					sender: e,
+					previousTrack: s
+				});
+			}
+			l.value = t, n.forEach(({ channelId: t, session: n, sdh: a, sender: o }, s) => {
+				let l = i[s]?.getAudioTracks()[0];
+				if (!l) return;
+				let u = e.channels.value.find((e) => e.id === t), f = !(u?.isHeld || u?.isMuted);
+				o.track.enabled = f;
+				let p = a.localMediaStream;
+				p && (p.getAudioTracks().forEach((e) => {
+					e !== l && p.removeTrack(e);
+				}), p.getTracks().includes(l) || p.addTrack(l)), e.activeChannelId.value === t && (p ? d.value = p : d.value && (d.value.getAudioTracks().forEach((e) => {
+					e !== l && d.value?.removeTrack(e);
+				}), d.value.getTracks().includes(l) || d.value.addTrack(l)));
+				try {
+					N(n, t);
+				} catch (e) {
+					console.error("[SipJs] Media-ready callback failed after microphone switch:", e);
+				}
+			});
+			let s = new Set([...a.value.values()].flatMap((e) => e.sessionDescriptionHandler?.peerConnection?.getSenders().map((e) => e.track).filter((e) => e?.kind === "audio") ?? []));
+			o.forEach(({ previousTrack: e }) => {
+				s.has(e) || e.stop();
+			}), i.forEach((e, t) => {
+				e.getTracks().forEach((e) => {
+					e !== n[t]?.sender.track && e.stop();
+				});
+			});
+		} catch (e) {
+			await Promise.allSettled(o.map(({ sender: e, previousTrack: t }) => e.replaceTrack(t))), i.forEach((e) => e.getTracks().forEach((e) => e.stop())), console.warn("[SipJs] Failed to switch microphone:", e);
+		}
 	}, z = (e, t) => {
 		let n = !1, i = e.sessionDescriptionHandler;
 		return i?.peerConnection && i.peerConnection.getSenders().forEach((e) => {
@@ -8462,15 +8515,15 @@ const createSipService = (e, t = {}) => {
 		} catch (e) {
 			console.warn("[SipJs] Failed to recover outbound audio track:", e);
 		}
-	}, U = (e = !1) => {
-		let t = {
+	}, U = (e = !1, t = l.value) => {
+		let n = {
 			echoCancellation: { ideal: !0 },
 			noiseSuppression: { ideal: !1 },
 			autoGainControl: { ideal: !1 },
 			channelCount: 1
 		};
-		return l.value && (t.deviceId = { exact: l.value }), {
-			audio: t,
+		return t && (n.deviceId = { exact: t }), {
+			audio: n,
 			video: e
 		};
 	}, W = async () => {
@@ -8613,14 +8666,14 @@ const createSipService = (e, t = {}) => {
 						isHeld: !1,
 						hasVideo: !1,
 						hasEarlyMedia: !1
-					}), a.value.delete(i), e.activeChannelId.value === i && nm(), F();
+					}), a.value.delete(i), e.activeChannelId.value === i && rm(), F();
 					break;
 				}
 				case SessionState.Established:
 					m.add(i), e.updateChannelState(i, {
 						status: "connected",
 						startTime: Date.now()
-					}), M(i, "connected"), e.activeChannelId.value === i && ($(t), H(t).then(() => N(t, i))), F();
+					}), M(i, "connected"), e.activeChannelId.value === i && (Q(t), H(t).then(() => N(t, i))), F();
 					break;
 			}
 		});
@@ -8645,7 +8698,7 @@ const createSipService = (e, t = {}) => {
 					m.add(o), e.channels.value.find((e) => e.id === o)?.status !== "connected" && (e.updateChannelState(o, {
 						status: "connected",
 						startTime: Date.now()
-					}), M(o, "connected"), $(l), H(l).then(() => N(l, o)), F());
+					}), M(o, "connected"), Q(l), H(l).then(() => N(l, o)), F());
 					break;
 				case SessionState.Terminated: {
 					let n = e.channels.value.find((e) => e.id === o);
@@ -8673,7 +8726,7 @@ const createSipService = (e, t = {}) => {
 						startTime: void 0,
 						keypadValue: "",
 						hasVideo: !1
-					}), a.value.delete(o), e.activeChannelId.value === o && nm(), F();
+					}), a.value.delete(o), e.activeChannelId.value === o && rm(), F();
 					break;
 				}
 			}
@@ -8682,41 +8735,44 @@ const createSipService = (e, t = {}) => {
 			sessionDescriptionHandlerOptions: { constraints: U(i) },
 			requestDelegate: {
 				onProgress: (t) => {
-					(t.message.statusCode === 180 || t.message.statusCode === 183) && (t.message.body && (e.updateChannelState(o, { hasEarlyMedia: !0 }), $(l)), F());
+					(t.message.statusCode === 180 || t.message.statusCode === 183) && (t.message.body && (e.updateChannelState(o, { hasEarlyMedia: !0 }), Q(l)), F());
 				},
 				onAccept: (t) => {
 					e.channels.value.find((e) => e.id === o)?.status !== "connected" && (m.add(o), e.updateChannelState(o, {
 						status: "connected",
 						startTime: Date.now()
-					}), M(o, "connected"), $(l), H(l).then(() => N(l, o)), F());
+					}), M(o, "connected"), Q(l), H(l).then(() => N(l, o)), F());
 				}
 			}
 		};
 		await l.invite(u);
-	}, J = async (t = !1) => {
+	}, Jp = async (t = !1) => {
 		let n = e.activeChannelId.value, i = a.value.get(n);
 		if (i instanceof Invitation && i.state === SessionState.Initial) {
+			T(), e.updateChannelState(n, {
+				status: "connected",
+				startTime: Date.now()
+			}), F();
 			for (let [t, n] of a.value.entries()) if (t !== e.activeChannelId.value && n.state === SessionState.Established && !e.channels.value.find((e) => e.id === t)?.isHeld) try {
-				await Z(n, !0), e.updateChannelState(t, { isHeld: !0 });
+				await Y(n, !0), e.updateChannelState(t, { isHeld: !0 });
 			} catch (e) {
 				console.error(`[SipJs] Failed to hold channel ${t}:`, e);
 			}
-			let o = { sessionDescriptionHandlerOptions: { constraints: U(t) } };
-			e.updateChannelState(n, {
-				status: "connected",
-				startTime: Date.now()
-			});
+			let o = { sessionDescriptionHandlerOptions: {
+				constraints: U(t),
+				iceGatheringTimeout: 1e3
+			} };
 			try {
-				await i.accept(o), await H(i), F();
+				await i.accept(o), F();
 			} catch (t) {
 				let i = a.value.get(n);
-				throw i instanceof Invitation && i.state === SessionState.Initial && e.updateChannelState(n, {
+				throw i instanceof Invitation && i.state === SessionState.Initial && (e.updateChannelState(n, {
 					status: "incoming",
 					startTime: void 0
-				}), t;
+				}), F()), t;
 			}
 		}
-	}, Y = async () => {
+	}, J = async () => {
 		let t = a.value.get(e.activeChannelId.value);
 		if (t) switch (t.state) {
 			case SessionState.Initial:
@@ -8727,35 +8783,35 @@ const createSipService = (e, t = {}) => {
 				await t.bye();
 				break;
 		}
-	}, Jp = () => {
+	}, Yp = () => {
 		let t = a.value.get(e.activeChannelId.value);
 		if (!t) return;
 		let n = !e.isMuted.value;
 		e.setMuted(n), V(t, e.channels.value.find((t) => t.id === e.activeChannelId.value));
-	}, Z = async (e, t) => {
+	}, Y = async (e, t) => {
 		let n = { sessionDescriptionHandlerOptions: { hold: t } };
 		await e.invite(n);
-	}, Yp = async () => {
+	}, Xp = async () => {
 		let t = a.value.get(e.activeChannelId.value);
 		if (t?.state !== SessionState.Established) return;
 		let n = !e.isHeld.value;
 		try {
-			await Z(t, n), e.setHeld(n), V(t, e.channels.value.find((t) => t.id === e.activeChannelId.value));
+			await Y(t, n), e.setHeld(n), V(t, e.channels.value.find((t) => t.id === e.activeChannelId.value));
 		} catch {}
-	}, Xp = async (t) => {
+	}, Zp = async (t) => {
 		let n = e.activeChannelId.value;
 		if (n === t) return;
 		let i = a.value.get(n), o = a.value.get(t), s = e.channels.value.find((e) => e.id === n), l = e.channels.value.find((e) => e.id === t);
 		if (i && i.state === SessionState.Established && !s?.isHeld) try {
-			await Z(i, !0), e.updateChannelState(n, { isHeld: !0 }), V(i, e.channels.value.find((e) => e.id === n));
+			await Y(i, !0), e.updateChannelState(n, { isHeld: !0 }), V(i, e.channels.value.find((e) => e.id === n));
 		} catch {}
 		if (e.setActiveChannelId(t), F(), o && o.state === SessionState.Established) {
 			if (l?.isHeld) try {
-				await Z(o, !1), e.updateChannelState(t, { isHeld: !1 });
+				await Y(o, !1), e.updateChannelState(t, { isHeld: !1 });
 			} catch {}
-			V(o, e.channels.value.find((e) => e.id === t)), $(o);
-		} else nm();
-	}, Zp = (t) => {
+			V(o, e.channels.value.find((e) => e.id === t)), Q(o);
+		} else rm();
+	}, Qp = (t) => {
 		if (!/^[0-9*#]$/.test(t)) return;
 		let n = a.value.get(e.activeChannelId.value);
 		if (n?.state !== SessionState.Established) return;
@@ -8770,10 +8826,10 @@ const createSipService = (e, t = {}) => {
 			contentDisposition: "signal"
 		} } };
 		n.info(o);
-	}, Q = (t, n) => {
+	}, Z = (t, n) => {
 		let i = e.channels.value.find((e) => e.id === t);
-		!i || i.status !== "connected" || ($(n), V(n, i), H(n), o.play().catch(() => {}));
-	}, Qp = async (t) => {
+		!i || i.status !== "connected" || (Q(n), V(n, i), H(n), o.play().catch(() => {}));
+	}, $p = async (t) => {
 		console.log("[SipJs] 🔄 transferCall iniciado"), console.log("[SipJs] Target:", t);
 		let i = e.activeChannelId.value, o = a.value.get(i);
 		if (!o) throw console.error("[SipJs] ❌ No hay sesión activa en el canal", i), Error("No active session to transfer");
@@ -8793,7 +8849,7 @@ const createSipService = (e, t = {}) => {
 					},
 					onReject: (e) => {
 						let t = e.message.statusCode;
-						console.error("[SipJs] ❌ Transfer REFER rechazado:", t), console.error("[SipJs] Response completo:", e.message), Q(i, o);
+						console.error("[SipJs] ❌ Transfer REFER rechazado:", t), console.error("[SipJs] Response completo:", e.message), Z(i, o);
 					}
 				},
 				onNotify: (e) => {
@@ -8816,7 +8872,7 @@ const createSipService = (e, t = {}) => {
 									487: "Transferencia cancelada",
 									503: "Servicio no disponible - el destino puede estar fuera de línea"
 								}[t] || `Error en transferencia (código ${t})`;
-								console.warn("[SipJs] 💬", e), Q(i, o);
+								console.warn("[SipJs] 💬", e), Z(i, o);
 							} else t >= 100 && t < 200 && console.log("[SipJs] 📞 Transferencia en progreso:", t, n);
 						} else console.warn("[SipJs] ⚠️ No se pudo extraer el código de estado del NOTIFY body");
 					} else console.warn("[SipJs] ⚠️ NOTIFY sin body");
@@ -8825,14 +8881,14 @@ const createSipService = (e, t = {}) => {
 		} catch (e) {
 			throw console.error("[SipJs] ❌ Error en transferCall:", e), console.error("[SipJs] Error type:", e?.constructor?.name), console.error("[SipJs] Error message:", e instanceof Error ? e.message : String(e)), console.error("[SipJs] Error stack:", e instanceof Error ? e.stack : "N/A"), e;
 		}
-	}, $p = async (t) => {
+	}, em = async (t) => {
 		console.log("[SipJs] 🔄 startAttendedTransfer iniciado"), console.log("[SipJs] Target:", t);
 		let n = e.activeChannelId.value, i = a.value.get(n);
 		if (console.log("[SipJs] Canal original:", n), console.log("[SipJs] Sesión original:", i?.state), !i || i.state !== SessionState.Established) throw console.error("[SipJs] ❌ No hay llamada establecida para transferir"), Error("No established call to transfer");
 		let o = e.channels.value.find((e) => e.status === "idle");
 		if (console.log("[SipJs] Canal de consulta encontrado:", o?.id), !o) throw console.error("[SipJs] ❌ No hay canales disponibles para llamada de consulta"), Error("No available channel for consultation call");
 		try {
-			console.log("[SipJs] 🔇 Poniendo llamada original en hold..."), await Z(i, !0), e.updateChannelState(n, { isHeld: !0 }), console.log("[SipJs] ✅ Llamada original en hold");
+			console.log("[SipJs] 🔇 Poniendo llamada original en hold..."), await Y(i, !0), e.updateChannelState(n, { isHeld: !0 }), console.log("[SipJs] ✅ Llamada original en hold");
 		} catch (e) {
 			throw console.error("[SipJs] ❌ Failed to hold original call:", e), Error("Failed to put call on hold");
 		}
@@ -8844,9 +8900,9 @@ const createSipService = (e, t = {}) => {
 				targetNumber: t
 			}), console.log("[SipJs] 📋 Transferencia en progreso registrada");
 		} catch (t) {
-			throw console.error("[SipJs] ❌ Failed to start consultation call:", t), console.log("[SipJs] 🔄 Volviendo al canal original y quitando hold..."), e.setActiveChannelId(n), await Z(i, !1).catch(() => {}), e.updateChannelState(n, { isHeld: !1 }), Error("Failed to initiate consultation call");
+			throw console.error("[SipJs] ❌ Failed to start consultation call:", t), console.log("[SipJs] 🔄 Volviendo al canal original y quitando hold..."), e.setActiveChannelId(n), await Y(i, !1).catch(() => {}), e.updateChannelState(n, { isHeld: !1 }), Error("Failed to initiate consultation call");
 		}
-	}, em = async () => {
+	}, tm = async () => {
 		console.log("[SipJs] 🔄 completeAttendedTransfer iniciado");
 		let t = e.transferInProgress.value;
 		if (!t) throw console.error("[SipJs] ❌ No hay transferencia en progreso"), Error("No transfer in progress");
@@ -8889,7 +8945,7 @@ const createSipService = (e, t = {}) => {
 		} catch (e) {
 			throw console.error("[SipJs] Attended transfer failed:", e), e;
 		}
-	}, tm = async () => {
+	}, nm = async () => {
 		let t = e.transferInProgress.value;
 		if (!t) throw Error("No transfer in progress");
 		console.log("[SipJs] Canceling attended transfer...");
@@ -8900,12 +8956,12 @@ const createSipService = (e, t = {}) => {
 			console.warn("[SipJs] Error ending consultation:", e);
 		}
 		if (n) try {
-			e.setActiveChannelId(t.originalChannelId), await Z(n, !1), e.updateChannelState(t.originalChannelId, { isHeld: !1 }), console.log("[SipJs] Returned to original call");
+			e.setActiveChannelId(t.originalChannelId), await Y(n, !1), e.updateChannelState(t.originalChannelId, { isHeld: !1 }), console.log("[SipJs] Returned to original call");
 		} catch (e) {
 			console.warn("[SipJs] Error resuming original call:", e);
 		}
 		e.setTransferInProgress(null);
-	}, $ = (e) => {
+	}, Q = (e) => {
 		let t = e.sessionDescriptionHandler;
 		if (!t) {
 			console.error("[SipJs] setupRemoteMedia: no sessionDescriptionHandler");
@@ -8936,23 +8992,23 @@ const createSipService = (e, t = {}) => {
 		}, { signal: _.signal });
 		let [s] = n.getTracks();
 		s && (o.srcObject = n, a(s), i && N(e, i.id));
-	}, nm = () => {
+	}, rm = () => {
 		v?.abort(), v = null, _?.abort(), _ = null, o.pause(), o.srcObject = null, u.value = null, d.value = null;
 	};
 	return {
 		initUserAgent: Wp,
 		stop: Kp,
 		makeCall: q,
-		answerCall: J,
-		hangupCall: Y,
-		toggleMute: Jp,
-		toggleHold: Yp,
-		sendDTMF: Zp,
-		transferCall: Qp,
-		startAttendedTransfer: $p,
-		completeAttendedTransfer: em,
-		cancelAttendedTransfer: tm,
-		switchChannel: Xp,
+		answerCall: Jp,
+		hangupCall: J,
+		toggleMute: Yp,
+		toggleHold: Xp,
+		sendDTMF: Qp,
+		transferCall: $p,
+		startAttendedTransfer: em,
+		completeAttendedTransfer: tm,
+		cancelAttendedTransfer: nm,
+		switchChannel: Zp,
 		extension: S,
 		setVolume: I,
 		setNotificationVolume: O,
@@ -16371,12 +16427,12 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 			if (!e) return "";
 			let t = e.trim(), n = t.startsWith("+"), i = t.replace(/[^\d]/g, "");
 			return n ? `+${i}` : i;
-		}, H = computed(() => {
+		}, H = (e) => /\d/.test(e) && /^[+\d\s().*#-]+$/.test(e.trim()), U = computed(() => {
 			let e = p.value, t = e?.remoteNumber || e?.keypadValue, n = e?.remoteDisplayName;
 			if (!t) return "Unknown";
 			let i = B(t), a = o.contacts?.find((e) => B(e.number) === i);
-			return a ? a.name : n && n !== t ? n : o.maskNumber ? maskPhoneNumber(t) : t;
-		}), U = computed(() => {
+			return a ? a.name : n && n !== t ? o.maskNumber && H(n) ? B(n) === i ? maskPhoneNumber(t) : maskPhoneNumber(n) : n : o.maskNumber ? maskPhoneNumber(t) : t;
+		}), W = computed(() => {
 			let e = p.value, t = e?.remoteNumber || e?.keypadValue || "";
 			return o.maskNumber ? maskPhoneNumber(t) : t;
 		});
@@ -16473,7 +16529,7 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 			})) : (openBlock(), createBlock(unref(CircleUser), {
 				key: 4,
 				class: "wp:w-3 wp:h-3"
-			}))], 2), createElementVNode("div", _hoisted_9$4, [createElementVNode("span", _hoisted_10$3, toDisplayString(e.name), 1), createElementVNode("span", _hoisted_11$3, toDisplayString(e.number), 1)])], 40, _hoisted_8$4))), 128))], 512), [[vShow, v.value && E.value && (O.value.length > 0 || D.value)]])], 512)])) : (p.value?.status || "idle") === "connected" ? (openBlock(), createElementBlock("div", _hoisted_12$3, [createElementVNode("div", _hoisted_13$1, [createElementVNode("div", _hoisted_14$1, " En llamada con " + toDisplayString(H.value), 1), H.value === U.value ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_15$1, toDisplayString(U.value), 1))])])) : (p.value?.status || "idle") === "idle" ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_16$1, [createElementVNode("div", _hoisted_17$1, [createElementVNode("div", _hoisted_18, [createElementVNode("div", _hoisted_19, toDisplayString(H.value), 1), H.value === U.value ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_20, toDisplayString(U.value), 1))]), createVNode(unref(TooltipProvider_default), null, {
+			}))], 2), createElementVNode("div", _hoisted_9$4, [createElementVNode("span", _hoisted_10$3, toDisplayString(e.name), 1), createElementVNode("span", _hoisted_11$3, toDisplayString(e.number), 1)])], 40, _hoisted_8$4))), 128))], 512), [[vShow, v.value && E.value && (O.value.length > 0 || D.value)]])], 512)])) : (p.value?.status || "idle") === "connected" ? (openBlock(), createElementBlock("div", _hoisted_12$3, [createElementVNode("div", _hoisted_13$1, [createElementVNode("div", _hoisted_14$1, " En llamada con " + toDisplayString(U.value), 1), U.value === W.value ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_15$1, toDisplayString(W.value), 1))])])) : (p.value?.status || "idle") === "idle" ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_16$1, [createElementVNode("div", _hoisted_17$1, [createElementVNode("div", _hoisted_18, [createElementVNode("div", _hoisted_19, toDisplayString(U.value), 1), U.value === W.value ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", _hoisted_20, toDisplayString(W.value), 1))]), createVNode(unref(TooltipProvider_default), null, {
 				default: withCtx(() => [createVNode(unref(Tooltip_default), null, {
 					default: withCtx(() => [createVNode(unref(TooltipTrigger_default), { "as-child": "" }), createVNode(unref(TooltipContent_default), { class: "wp:flex wp:items-center wp:gap-2" }, {
 						default: withCtx(() => [createElementVNode("span", null, toDisplayString(unref(t).isKeypadVisible ? "Ocultar" : "Mostrar") + " teclado", 1), createVNode(unref(Kbd_default), null, {
@@ -17656,59 +17712,59 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 		}), qp = computed(() => {
 			let e = Gp.value?.remoteNumber || x.remoteNumber;
 			return o.maskNumber ? maskPhoneNumber(e) : e;
-		}), q = computed(() => (W.value, !!Gp.value?.hasVideo || G(E.value) || G(D.value))), { isOnline: J } = useNetwork(), Y = computed(() => !J.value), Z = ref(null), Q = ref(!1), em = computed(() => o.enablePictureInPicture), tm = () => {
-			em.value && Z.value?.toggle();
-		}, $ = async (e, t) => {
+		}), q = computed(() => (W.value, !!Gp.value?.hasVideo || G(E.value) || G(D.value))), { isOnline: Jp } = useNetwork(), J = computed(() => !Jp.value), Y = ref(null), Z = ref(!1), tm = computed(() => o.enablePictureInPicture), nm = () => {
+			tm.value && Y.value?.toggle();
+		}, Q = async (e, t) => {
 			try {
 				t === "blind" ? await S.transferCall(e) : await S.startAttendedTransfer(e);
 			} catch (e) {
 				console.error("[WebPhone] Transfer error:", e), alert(e instanceof Error ? e.message : "Transfer failed. Please try again.");
 			}
-		}, nm = async () => {
+		}, rm = async () => {
 			try {
 				await S.completeAttendedTransfer();
 			} catch (e) {
 				console.error("[WebPhone] Complete transfer error:", e), alert(e instanceof Error ? e.message : "Failed to complete transfer.");
 			}
-		}, rm = async () => {
+		}, im = async () => {
 			try {
 				await S.cancelAttendedTransfer();
 			} catch (e) {
 				console.error("[WebPhone] Cancel transfer error:", e), alert(e instanceof Error ? e.message : "Failed to cancel transfer.");
 			}
-		}, im = (e) => {
-			x.keypadValue = e, S.makeCall(e);
 		}, am = (e) => {
+			x.keypadValue = e, S.makeCall(e);
+		}, om = (e) => {
 			if (o.onAnswer) {
 				o.onAnswer(e);
 				return;
 			}
 			S.answerCall(e);
-		}, om = () => {
+		}, sm = () => {
 			if (o.onHangup) {
 				o.onHangup();
 				return;
 			}
 			S.hangupCall();
-		}, sm = () => {
+		}, cm = () => {
 			if (o.onReject) {
 				o.onReject();
 				return;
 			}
 			S.hangupCall();
-		}, cm = () => {
-			j.value = !0, Z.value?.close(), window.focus();
 		}, lm = () => {
-			if (!em.value) return !1;
-			let e = x.callStatus !== "idle", t = document.hidden || !document.hasFocus();
-			return e && t && !Q.value;
+			j.value = !0, Y.value?.close(), window.focus();
 		}, um = () => {
+			if (!tm.value) return !1;
+			let e = x.callStatus !== "idle", t = document.hidden || !document.hasFocus();
+			return e && t && !Z.value;
+		}, $ = () => {
 			window.setTimeout(() => {
-				lm() && Z.value?.open();
+				um() && Y.value?.open();
 			}, 150);
 		};
 		watchEffect(() => {
-			F.value && (Q.value || !E.value ? F.value.srcObject = null : F.value.srcObject = E.value), L.value && (Q.value || !D.value ? L.value.srcObject = null : L.value.srcObject = D.value);
+			F.value && (Z.value || !E.value ? F.value.srcObject = null : F.value.srcObject = E.value), L.value && (Z.value || !D.value ? L.value.srcObject = null : L.value.srcObject = D.value);
 		});
 		let dm = (e) => {
 			if (!e || typeof e.addEventListener != "function" || typeof e.removeEventListener != "function") return () => {};
@@ -17775,7 +17831,7 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 		], vm = ref(!1), ym = computed({
 			get: () => x.activeChannelId.toString(),
 			set: async (e) => {
-				if (!Y.value && e && !vm.value) {
+				if (!J.value && e && !vm.value) {
 					vm.value = !0;
 					try {
 						await T(parseInt(e));
@@ -17791,9 +17847,9 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 			let t = x.channels.find((t) => t.id === e);
 			return t ? t.isHeld || t.status === "held" : !1;
 		}, Sm = (e) => {
-			Y.value || (ym.value = e.toString());
+			J.value || (ym.value = e.toString());
 		}, Cm = (e) => {
-			if (!Y.value && ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "h" && (e.preventDefault(), k.value = !0), (e.metaKey || e.ctrlKey) && e.key === "," && (e.preventDefault(), O.value = !0), (e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k" && (e.preventDefault(), x.toggleKeypad()), (e.metaKey || e.ctrlKey) && [
+			if (!J.value && ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "h" && (e.preventDefault(), k.value = !0), (e.metaKey || e.ctrlKey) && e.key === "," && (e.preventDefault(), O.value = !0), (e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k" && (e.preventDefault(), x.toggleKeypad()), (e.metaKey || e.ctrlKey) && [
 				"1",
 				"2",
 				"3"
@@ -17806,14 +17862,14 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 			}
 		};
 		watch(() => x.callStatus, () => {
-			lm() && um();
+			um() && $();
 		}), watch(() => x.isConnected, (e) => {
 			v.value && a.set(v.value, e);
-		}, { immediate: !0 }), watch(em, (e) => {
-			!e && Q.value && Z.value?.close();
+		}, { immediate: !0 }), watch(tm, (e) => {
+			!e && Z.value && Y.value?.close();
 		});
 		let wm = ref(!1), Tm = async () => {
-			wm.value || Y.value || !o.host || !o.extension || !o.password || (await w({
+			wm.value || J.value || !o.host || !o.extension || !o.password || (await w({
 				uri: `sip:${o.extension}@${o.host}`,
 				transportOptions: { server: _.value },
 				authorizationUsername: o.extension,
@@ -17828,22 +17884,22 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 				await S.stop(), wm.value = !1;
 			}
 		}), onMounted(async () => {
-			window.addEventListener("keydown", Cm), document.addEventListener("visibilitychange", um), window.addEventListener("blur", um), window.addEventListener("pagehide", um), !(o.mode === "webcall" && (!o.to || !o.logo)) && await Tm();
-		}), watch(() => J.value, async (e) => {
+			window.addEventListener("keydown", Cm), document.addEventListener("visibilitychange", $), window.addEventListener("blur", $), window.addEventListener("pagehide", $), !(o.mode === "webcall" && (!o.to || !o.logo)) && await Tm();
+		}), watch(() => Jp.value, async (e) => {
 			e && await Tm();
 		}), onUnmounted(() => {
-			S.stop(), window.removeEventListener("keydown", Cm), document.removeEventListener("visibilitychange", um), window.removeEventListener("blur", um), window.removeEventListener("pagehide", um);
+			S.stop(), window.removeEventListener("keydown", Cm), document.removeEventListener("visibilitychange", $), window.removeEventListener("blur", $), window.removeEventListener("pagehide", $);
 		}), (e, t) => (openBlock(), createElementBlock(Fragment, null, [
 			createElementVNode("div", {
 				ref_key: "phoneRef",
 				ref: N,
 				style: normalizeStyle(unref(gm)),
-				class: normalizeClass(["webphone webphone-container wp:bg-white wp:dark:bg-neutral-800 wp:rounded-lg wp:shadow-sm wp:inset-shadow-2xs wp:w-[min(92vw,330px)] wp:fixed wp:z-50 wp:select-none wp:[&_button]:cursor-pointer wp:**:[[role=button]]:cursor-pointer", Y.value ? "wp:opacity-70" : ""]),
+				class: normalizeClass(["webphone webphone-container wp:bg-white wp:dark:bg-neutral-800 wp:rounded-lg wp:shadow-sm wp:inset-shadow-2xs wp:w-[min(92vw,330px)] wp:fixed wp:z-50 wp:select-none wp:[&_button]:cursor-pointer wp:**:[[role=button]]:cursor-pointer", J.value ? "wp:opacity-70" : ""]),
 				"data-mode": o.mode,
 				"data-call-status": x.callStatus,
-				"data-network-status": Y.value ? "offline" : "online"
+				"data-network-status": J.value ? "offline" : "online"
 			}, [
-				q.value && !Q.value ? (openBlock(), createElementBlock("div", _hoisted_2, [createElementVNode("video", {
+				q.value && !Z.value ? (openBlock(), createElementBlock("div", _hoisted_2, [createElementVNode("video", {
 					ref_key: "remoteVideoRef",
 					ref: F,
 					autoplay: "",
@@ -17864,7 +17920,7 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 							type: "button",
 							role: "radio",
 							"aria-checked": ym.value === e.value.toString(),
-							disabled: Y.value,
+							disabled: J.value,
 							title: `${e.label} (${unref(H)}${e.value + 1})`,
 							class: normalizeClass(["webphone__channel-button wp:flex wp:items-center wp:gap-1 wp:px-2 wp:py-2 wp:rounded-lg wp:transition-colors wp:duration-200 wp:outline-none wp:focus-visible:ring-2 wp:focus-visible:ring-[var(--p-primary-color)] wp:focus-visible:ring-offset-2 wp:focus-visible:ring-offset-white wp:dark:focus-visible:ring-offset-neutral-900", xm(e.value) ? "wp:bg-status-hold/12 hover:wp:bg-status-hold/18" : bm(e.value) ? "wp:bg-[var(--color-red)]/12 hover:wp:bg-[var(--color-red)]/18" : ym.value === e.value.toString() ? "wp:bg-[var(--p-primary-color)]/12" : "wp:hover:bg-neutral-100 wp:dark:hover:bg-neutral-800/80"]),
 							"data-channel-id": e.value,
@@ -17881,9 +17937,9 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 									default: withCtx(() => [createVNode(unref(Button_default), {
 										variant: "ghost",
 										size: "icon",
-										class: normalizeClass(["wp:h-8 wp:w-8 wp:rounded-full", Q.value ? "wp:text-primary" : ""]),
+										class: normalizeClass(["wp:h-8 wp:w-8 wp:rounded-full", Z.value ? "wp:text-primary" : ""]),
 										title: "Picture-in-Picture",
-										onClick: tm
+										onClick: nm
 									}, {
 										default: withCtx(() => [createVNode(unref(PictureInPicture2), { class: "wp:w-4 wp:h-4 wp:text-[var(--color-settings)]" })]),
 										_: 1
@@ -17927,7 +17983,7 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 						"channel-id": e.id,
 						"allow-input": !U.value,
 						"is-web-call": U.value,
-						"is-online": unref(J),
+						"is-online": unref(Jp),
 						contacts: o.contacts,
 						user: o.extension,
 						"mask-number": o.maskNumber
@@ -17946,15 +18002,15 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 					}, [createVNode(KeyPad_default)], 10, _hoisted_10),
 					createVNode(CallActions_default, {
 						class: "webphone__actions",
-						style: normalizeStyle(Y.value ? "pointer-events: none;" : void 0),
+						style: normalizeStyle(J.value ? "pointer-events: none;" : void 0),
 						destination: U.value ? o.to : void 0,
 						"is-video": o.mode === "video",
 						"on-answer": o.onAnswer,
 						"on-hangup": o.onHangup,
 						"on-reject": o.onReject,
 						onTransfer: t[1] ||= (e) => j.value = !0,
-						onCompleteTransfer: nm,
-						onCancelTransfer: rm
+						onCompleteTransfer: rm,
+						onCancelTransfer: im
 					}, null, 8, [
 						"style",
 						"destination",
@@ -17964,7 +18020,7 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 						"on-reject"
 					])
 				]),
-				Y.value ? (openBlock(), createElementBlock("div", _hoisted_11, [...t[10] ||= [createElementVNode("span", { class: "wp:text-sm wp:font-semibold wp:text-status-disconnected" }, "Sin internet", -1)]])) : createCommentVNode("", !0),
+				J.value ? (openBlock(), createElementBlock("div", _hoisted_11, [...t[10] ||= [createElementVNode("span", { class: "wp:text-sm wp:font-semibold wp:text-status-disconnected" }, "Sin internet", -1)]])) : createCommentVNode("", !0),
 				U.value ? (openBlock(), createElementBlock("div", _hoisted_12, [...t[11] ||= [createElementVNode("div", { class: "webphone__footer-label wp:text-[10px] wp:text-primary" }, "Powered By", -1), createElementVNode("div", { class: "webphone__footer-content wp:flex wp:items-center wp:gap-2" }, [createElementVNode("a", {
 					href: "https://www.nebula123.com",
 					target: "_blank",
@@ -17979,20 +18035,20 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 				visible: k.value,
 				"onUpdate:visible": t[3] ||= (e) => k.value = e,
 				contacts: o.contacts,
-				onCall: im
+				onCall: am
 			}, null, 8, ["visible", "contacts"]),
 			createVNode(TransferDialog_default, {
 				visible: j.value,
 				"onUpdate:visible": t[4] ||= (e) => j.value = e,
 				contacts: o.contacts,
-				onTransfer: $
+				onTransfer: Q
 			}, null, 8, ["visible", "contacts"]),
 			createVNode(DocumentPip_default, {
 				ref_key: "documentPipRef",
-				ref: Z,
-				active: Q.value,
-				"onUpdate:active": t[5] ||= (e) => Q.value = e,
-				"auto-open-on-blur": em.value,
+				ref: Y,
+				active: Z.value,
+				"onUpdate:active": t[5] ||= (e) => Z.value = e,
+				"auto-open-on-blur": tm.value,
 				"is-connected": x.isConnected,
 				"remote-number": qp.value,
 				"caller-name": Kp.value,
@@ -18004,11 +18060,11 @@ var icon_phone_default = { render }, Tooltip_default = /* @__PURE__ */ defineCom
 				"call-status": x.callStatus,
 				"is-muted": x.isMuted,
 				"is-held": x.isHeld,
-				onTransfer: cm,
-				onTransferRequest: $,
-				onHangup: om,
-				onReject: sm,
-				onAnswer: am,
+				onTransfer: lm,
+				onTransferRequest: Q,
+				onHangup: sm,
+				onReject: cm,
+				onAnswer: om,
 				onToggleMute: t[6] ||= (e) => unref(S).toggleMute(),
 				onToggleHold: t[7] ||= (e) => unref(S).toggleHold()
 			}, null, 8, [