@coventia/softphone 0.1.0

package/dist/ui/index.js

@@ -0,0 +1,2256 @@
+import { isWebRtcSupported } from '../chunk-KAXEMJ7E.js';
+import { useSoftphone, useSoftphoneState, useCall, useActiveCall, useIsLeader, useLastError, useDevices } from '../chunk-3V2L6UTK.js';
+import '../chunk-N2N2EQQJ.js';
+import { forwardRef, createElement, useState, useRef, useLayoutEffect, useEffect, useCallback, useMemo } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// ../../node_modules/lucide-react/dist/esm/shared/src/utils.js
+var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+var mergeClasses = (...classes) => classes.filter((className, index, array) => {
+  return Boolean(className) && array.indexOf(className) === index;
+}).join(" ");
+
+// ../../node_modules/lucide-react/dist/esm/defaultAttributes.js
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+
+// ../../node_modules/lucide-react/dist/esm/Icon.js
+var Icon = forwardRef(
+  ({
+    color = "currentColor",
+    size = 24,
+    strokeWidth = 2,
+    absoluteStrokeWidth,
+    className = "",
+    children,
+    iconNode,
+    ...rest
+  }, ref) => {
+    return createElement(
+      "svg",
+      {
+        ref,
+        ...defaultAttributes,
+        width: size,
+        height: size,
+        stroke: color,
+        strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
+        className: mergeClasses("lucide", className),
+        ...rest
+      },
+      [
+        ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
+        ...Array.isArray(children) ? children : [children]
+      ]
+    );
+  }
+);
+
+// ../../node_modules/lucide-react/dist/esm/createLucideIcon.js
+var createLucideIcon = (iconName, iconNode) => {
+  const Component = forwardRef(
+    ({ className, ...props }, ref) => createElement(Icon, {
+      ref,
+      iconNode,
+      className: mergeClasses(`lucide-${toKebabCase(iconName)}`, className),
+      ...props
+    })
+  );
+  Component.displayName = `${iconName}`;
+  return Component;
+};
+
+// ../../node_modules/lucide-react/dist/esm/icons/arrow-left-right.js
+var ArrowLeftRight = createLucideIcon("ArrowLeftRight", [
+  ["path", { d: "M8 3 4 7l4 4", key: "9rb6wj" }],
+  ["path", { d: "M4 7h16", key: "6tx8e3" }],
+  ["path", { d: "m16 21 4-4-4-4", key: "siv7j2" }],
+  ["path", { d: "M20 17H4", key: "h6l3hr" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/arrow-left.js
+var ArrowLeft = createLucideIcon("ArrowLeft", [
+  ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
+  ["path", { d: "M19 12H5", key: "x3x0zl" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/arrow-right.js
+var ArrowRight = createLucideIcon("ArrowRight", [
+  ["path", { d: "M5 12h14", key: "1ays0h" }],
+  ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/calendar-clock.js
+var CalendarClock = createLucideIcon("CalendarClock", [
+  ["path", { d: "M21 7.5V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h3.5", key: "1osxxc" }],
+  ["path", { d: "M16 2v4", key: "4m81vk" }],
+  ["path", { d: "M8 2v4", key: "1cmpym" }],
+  ["path", { d: "M3 10h5", key: "r794hk" }],
+  ["path", { d: "M17.5 17.5 16 16.3V14", key: "akvzfd" }],
+  ["circle", { cx: "16", cy: "16", r: "6", key: "qoo3c4" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/check.js
+var Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/chevron-down.js
+var ChevronDown = createLucideIcon("ChevronDown", [
+  ["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/chevron-right.js
+var ChevronRight = createLucideIcon("ChevronRight", [
+  ["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/circle-help.js
+var CircleHelp = createLucideIcon("CircleHelp", [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3", key: "1u773s" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/clock.js
+var Clock = createLucideIcon("Clock", [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["polyline", { points: "12 6 12 12 16 14", key: "68esgv" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/delete.js
+var Delete = createLucideIcon("Delete", [
+  [
+    "path",
+    {
+      d: "M10 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z",
+      key: "1yo7s0"
+    }
+  ],
+  ["path", { d: "m12 9 6 6", key: "anjzzh" }],
+  ["path", { d: "m18 9-6 6", key: "1fp51s" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/external-link.js
+var ExternalLink = createLucideIcon("ExternalLink", [
+  ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
+  ["path", { d: "M10 14 21 3", key: "gplh6r" }],
+  ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6", key: "a6xqqp" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/grid-3x3.js
+var Grid3x3 = createLucideIcon("Grid3x3", [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M3 9h18", key: "1pudct" }],
+  ["path", { d: "M3 15h18", key: "5xshup" }],
+  ["path", { d: "M9 3v18", key: "fh3hqa" }],
+  ["path", { d: "M15 3v18", key: "14nvp0" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/hash.js
+var Hash = createLucideIcon("Hash", [
+  ["line", { x1: "4", x2: "20", y1: "9", y2: "9", key: "4lhtct" }],
+  ["line", { x1: "4", x2: "20", y1: "15", y2: "15", key: "vyu0kd" }],
+  ["line", { x1: "10", x2: "8", y1: "3", y2: "21", key: "1ggp8o" }],
+  ["line", { x1: "16", x2: "14", y1: "3", y2: "21", key: "weycgp" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/headphones.js
+var Headphones = createLucideIcon("Headphones", [
+  [
+    "path",
+    {
+      d: "M3 14h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a9 9 0 0 1 18 0v7a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3",
+      key: "1xhozi"
+    }
+  ]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/loader-circle.js
+var LoaderCircle = createLucideIcon("LoaderCircle", [
+  ["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/mic-off.js
+var MicOff = createLucideIcon("MicOff", [
+  ["line", { x1: "2", x2: "22", y1: "2", y2: "22", key: "a6p6uj" }],
+  ["path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2", key: "80xlxr" }],
+  ["path", { d: "M5 10v2a7 7 0 0 0 12 5", key: "p2k8kg" }],
+  ["path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33", key: "1gzdoj" }],
+  ["path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12", key: "r2i35w" }],
+  ["line", { x1: "12", x2: "12", y1: "19", y2: "22", key: "x3vr5v" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/mic.js
+var Mic = createLucideIcon("Mic", [
+  ["path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z", key: "131961" }],
+  ["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2", key: "1vc78b" }],
+  ["line", { x1: "12", x2: "12", y1: "19", y2: "22", key: "x3vr5v" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/monitor-smartphone.js
+var MonitorSmartphone = createLucideIcon("MonitorSmartphone", [
+  ["path", { d: "M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8", key: "10dyio" }],
+  ["path", { d: "M10 19v-3.96 3.15", key: "1irgej" }],
+  ["path", { d: "M7 19h5", key: "qswx4l" }],
+  ["rect", { width: "6", height: "10", x: "16", y: "12", rx: "2", key: "1egngj" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/pause.js
+var Pause = createLucideIcon("Pause", [
+  ["rect", { x: "14", y: "4", width: "4", height: "16", rx: "1", key: "zuxfzm" }],
+  ["rect", { x: "6", y: "4", width: "4", height: "16", rx: "1", key: "1okwgv" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/phone-incoming.js
+var PhoneIncoming = createLucideIcon("PhoneIncoming", [
+  ["polyline", { points: "16 2 16 8 22 8", key: "1ygljm" }],
+  ["line", { x1: "22", x2: "16", y1: "2", y2: "8", key: "1xzwqn" }],
+  [
+    "path",
+    {
+      d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z",
+      key: "foiqr5"
+    }
+  ]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/phone-missed.js
+var PhoneMissed = createLucideIcon("PhoneMissed", [
+  ["line", { x1: "22", x2: "16", y1: "2", y2: "8", key: "1xzwqn" }],
+  ["line", { x1: "16", x2: "22", y1: "2", y2: "8", key: "13zxdn" }],
+  [
+    "path",
+    {
+      d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z",
+      key: "foiqr5"
+    }
+  ]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/phone-off.js
+var PhoneOff = createLucideIcon("PhoneOff", [
+  [
+    "path",
+    {
+      d: "M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-3.33-2.67m-2.67-3.34a19.79 19.79 0 0 1-3.07-8.63A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91",
+      key: "z86iuo"
+    }
+  ],
+  ["line", { x1: "22", x2: "2", y1: "2", y2: "22", key: "11kh81" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/phone-outgoing.js
+var PhoneOutgoing = createLucideIcon("PhoneOutgoing", [
+  ["polyline", { points: "22 8 22 2 16 2", key: "1g204g" }],
+  ["line", { x1: "16", x2: "22", y1: "8", y2: "2", key: "1ggias" }],
+  [
+    "path",
+    {
+      d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z",
+      key: "foiqr5"
+    }
+  ]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/phone.js
+var Phone = createLucideIcon("Phone", [
+  [
+    "path",
+    {
+      d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z",
+      key: "foiqr5"
+    }
+  ]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/play.js
+var Play = createLucideIcon("Play", [
+  ["polygon", { points: "6 3 20 12 6 21 6 3", key: "1oa8hb" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/search.js
+var Search = createLucideIcon("Search", [
+  ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
+  ["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/settings.js
+var Settings = createLucideIcon("Settings", [
+  [
+    "path",
+    {
+      d: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z",
+      key: "1qme2f"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/timer.js
+var Timer = createLucideIcon("Timer", [
+  ["line", { x1: "10", x2: "14", y1: "2", y2: "2", key: "14vaq8" }],
+  ["line", { x1: "12", x2: "15", y1: "14", y2: "11", key: "17fdiu" }],
+  ["circle", { cx: "12", cy: "14", r: "8", key: "1e1u0o" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/triangle-alert.js
+var TriangleAlert = createLucideIcon("TriangleAlert", [
+  [
+    "path",
+    {
+      d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
+      key: "wmoenq"
+    }
+  ],
+  ["path", { d: "M12 9v4", key: "juzpu7" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/user.js
+var User = createLucideIcon("User", [
+  ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
+  ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/users.js
+var Users = createLucideIcon("Users", [
+  ["path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2", key: "1yyitq" }],
+  ["circle", { cx: "9", cy: "7", r: "4", key: "nufk8" }],
+  ["path", { d: "M22 21v-2a4 4 0 0 0-3-3.87", key: "kshegd" }],
+  ["path", { d: "M16 3.13a4 4 0 0 1 0 7.75", key: "1da9ce" }]
+]);
+
+// ../../node_modules/lucide-react/dist/esm/icons/x.js
+var X = createLucideIcon("X", [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+]);
+
+// src/ui/dialing/countries.ts
+var PACKED = "AC247 AD376 AE971 AF93 AG1 AI1 AL355 AM374 AO244 AR54 AS1 AT43 AU61 AW297 AX358 AZ994 BA387 BB1 BD880 BE32 BF226 BG359 BH973 BI257 BJ229 BL590 BM1 BN673 BO591 BQ599 BR55 BS1 BT975 BW267 BY375 BZ501 CA1 CC61 CD243 CF236 CG242 CH41 CI225 CK682 CL56 CM237 CN86 CO57 CR506 CU53 CV238 CW599 CX61 CY357 CZ420 DE49 DJ253 DK45 DM1 DO1 DZ213 EC593 EE372 EG20 EH212 ER291 ES34 ET251 FI358 FJ679 FK500 FM691 FO298 FR33 GA241 GB44 GD1 GE995 GF594 GG44 GH233 GI350 GL299 GM220 GN224 GP590 GQ240 GR30 GT502 GU1 GW245 GY592 HK852 HN504 HR385 HT509 HU36 ID62 IE353 IL972 IM44 IN91 IO246 IQ964 IR98 IS354 IT39 JE44 JM1 JO962 JP81 KE254 KG996 KH855 KI686 KM269 KN1 KP850 KR82 KW965 KY1 KZ7 LA856 LB961 LC1 LI423 LK94 LR231 LS266 LT370 LU352 LV371 LY218 MA212 MC377 MD373 ME382 MF590 MG261 MH692 MK389 ML223 MM95 MN976 MO853 MP1 MQ596 MR222 MS1 MT356 MU230 MV960 MW265 MX52 MY60 MZ258 NA264 NC687 NE227 NF672 NG234 NI505 NL31 NO47 NP977 NR674 NU683 NZ64 OM968 PA507 PE51 PF689 PG675 PH63 PK92 PL48 PM508 PR1 PS970 PT351 PW680 PY595 QA974 RE262 RO40 RS381 RU7 RW250 SA966 SB677 SC248 SD249 SE46 SG65 SH290 SI386 SJ47 SK421 SL232 SM378 SN221 SO252 SR597 SS211 ST239 SV503 SX1 SY963 SZ268 TA290 TC1 TD235 TG228 TH66 TJ992 TK690 TL670 TM993 TN216 TO676 TR90 TT1 TV688 TW886 TZ255 UA380 UG256 US1 UY598 UZ998 VA39 VC1 VE58 VG1 VI1 VN84 VU678 WF681 WS685 XK383 YE967 YT262 ZA27 ZM260 ZW263";
+var DIAL_CODES = new Map(
+  PACKED.split(" ").map((token) => [token.slice(0, 2), Number(token.slice(2))])
+);
+var DEFAULT_COUNTRY = "ES";
+var REGION_NAMES = (() => {
+  try {
+    return new Intl.DisplayNames(["es"], { type: "region" });
+  } catch {
+    return null;
+  }
+})();
+function countryName(country) {
+  try {
+    return REGION_NAMES?.of(country) ?? country;
+  } catch {
+    return country;
+  }
+}
+var COUNTRIES = [...DIAL_CODES.entries()].map(([code, dial]) => ({ code, name: countryName(code), dial })).sort((a, b) => a.name.localeCompare(b.name, "es"));
+function toE164(country, national) {
+  const typed = String(national ?? "").trim();
+  if (typed.startsWith("+")) return "+" + typed.slice(1).replace(/\D/g, "");
+  const digits = typed.replace(/\D/g, "").replace(/^0+/, "");
+  if (!digits) return "";
+  const dial = DIAL_CODES.get(country);
+  return dial === void 0 ? `+${digits}` : `+${dial}${digits}`;
+}
+var FLAGS = null;
+var flagsPromise = null;
+function loadFlags() {
+  flagsPromise ??= import('../3x2-2HQTJDKZ.js').then((m) => FLAGS = m).catch(() => FLAGS = {});
+  return flagsPromise;
+}
+function useFlags() {
+  const [flags, setFlags] = useState(FLAGS);
+  useEffect(() => {
+    if (flags) return;
+    let alive = true;
+    void loadFlags().then((f) => {
+      if (alive) setFlags(f);
+    });
+    return () => {
+      alive = false;
+    };
+  }, [flags]);
+  return flags;
+}
+function CountryMark({ code }) {
+  const flags = useFlags();
+  const Flag = flags?.[code];
+  return /* @__PURE__ */ jsx("span", { className: "cv-mark", "data-plate": !Flag, "aria-hidden": true, part: "country-mark", children: Flag ? /* @__PURE__ */ jsx(Flag, { className: "cv-mark-svg" }) : code });
+}
+function CountryPicker({
+  value,
+  onChange
+}) {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const rootRef = useRef(null);
+  const inputRef = useRef(null);
+  const results = useMemo(() => {
+    const q = query.trim().toLowerCase().replace(/^\+/, "");
+    if (!q) return COUNTRIES;
+    return COUNTRIES.filter(
+      (c) => c.name.toLowerCase().includes(q) || c.code.toLowerCase().includes(q) || String(c.dial).startsWith(q)
+    );
+  }, [query]);
+  useEffect(() => {
+    if (!open) return;
+    const root = rootRef.current?.getRootNode() ?? document;
+    const onDown = (e) => {
+      if (!rootRef.current?.contains(e.target)) setOpen(false);
+    };
+    const onKey = (e) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    root.addEventListener("pointerdown", onDown);
+    document.addEventListener("keydown", onKey);
+    return () => {
+      root.removeEventListener("pointerdown", onDown);
+      document.removeEventListener("keydown", onKey);
+    };
+  }, [open]);
+  useEffect(() => {
+    if (open) inputRef.current?.focus();
+    else setQuery("");
+  }, [open]);
+  const dial = DIAL_CODES.get(value);
+  return /* @__PURE__ */ jsxs("div", { className: "cv-cp", ref: rootRef, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cv-cp-chip",
+        onClick: () => setOpen((o) => !o),
+        "aria-haspopup": "listbox",
+        "aria-expanded": open,
+        "aria-label": `Prefijo: ${countryName(value)} (+${dial ?? "?"}). Cambiar pa\xEDs`,
+        part: "country-chip",
+        children: [
+          /* @__PURE__ */ jsx(CountryMark, { code: value }),
+          /* @__PURE__ */ jsxs("span", { className: "cv-cp-dial", children: [
+            "+",
+            dial ?? "?"
+          ] }),
+          /* @__PURE__ */ jsx(ChevronDown, { size: 13, className: "cv-cp-caret", "data-open": open })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsxs("div", { className: "cv-cp-pop", role: "dialog", part: "country-list", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          className: "cv-cp-search",
+          value: query,
+          onChange: (e) => setQuery(e.target.value),
+          placeholder: "Buscar pa\xEDs\u2026",
+          "aria-label": "Buscar pa\xEDs"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "cv-cp-list", role: "listbox", children: results.length === 0 ? /* @__PURE__ */ jsx("p", { className: "cv-cp-empty", children: "No se encontr\xF3 ning\xFAn pa\xEDs." }) : results.map((c) => /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          role: "option",
+          "aria-selected": c.code === value,
+          className: "cv-cp-item",
+          onClick: () => {
+            onChange(c.code);
+            setOpen(false);
+          },
+          children: [
+            /* @__PURE__ */ jsx(CountryMark, { code: c.code }),
+            /* @__PURE__ */ jsx("span", { className: "cv-cp-name", children: c.name }),
+            /* @__PURE__ */ jsxs("span", { className: "cv-cp-dial", children: [
+              "+",
+              c.dial
+            ] }),
+            /* @__PURE__ */ jsx(Check, { size: 14, className: "cv-cp-check", "data-on": c.code === value })
+          ]
+        },
+        c.code
+      )) })
+    ] }) : null
+  ] });
+}
+var AsYouType = null;
+var parseIntl = null;
+var loading = null;
+function loadNumberFormatter() {
+  loading ??= import('../min-64GIMWWL.js').then((m) => {
+    AsYouType = m.AsYouType;
+    parseIntl = m.parsePhoneNumberFromString;
+  }).catch(() => {
+  });
+  return loading;
+}
+function formatIntl(e164) {
+  if (!parseIntl) return e164;
+  try {
+    return parseIntl(e164)?.formatInternational() ?? e164;
+  } catch {
+    return e164;
+  }
+}
+function useIntlFormatter() {
+  const [, bump] = useState(0);
+  useEffect(() => {
+    if (parseIntl) return;
+    let alive = true;
+    void loadNumberFormatter().then(() => {
+      if (alive) bump((n) => n + 1);
+    });
+    return () => {
+      alive = false;
+    };
+  }, []);
+  return formatIntl;
+}
+function formatNational(country, digits) {
+  if (!AsYouType || !digits) return digits;
+  try {
+    return new AsYouType(country).input(digits);
+  } catch {
+    return digits;
+  }
+}
+function useNumberFormatter() {
+  const [, bump] = useState(0);
+  useEffect(() => {
+    if (AsYouType) return;
+    let alive = true;
+    void loadNumberFormatter().then(() => {
+      if (alive) bump((n) => n + 1);
+    });
+    return () => {
+      alive = false;
+    };
+  }, []);
+  return formatNational;
+}
+function caretAfterDigits(formatted, digitsBefore) {
+  if (digitsBefore <= 0) return 0;
+  let seen = 0;
+  for (let i = 0; i < formatted.length; i++) {
+    if (/\d/.test(formatted[i])) seen++;
+    if (seen === digitsBefore) return i + 1;
+  }
+  return formatted.length;
+}
+function digitsBeforeCaret(text, caret) {
+  return (text.slice(0, caret).match(/\d/g) ?? []).length;
+}
+var KEYS = [
+  ["1", "", true],
+  ["2", "ABC", true],
+  ["3", "DEF", true],
+  ["4", "GHI", true],
+  ["5", "JKL", true],
+  ["6", "MNO", true],
+  ["7", "PQRS", true],
+  ["8", "TUV", true],
+  ["9", "WXYZ", true],
+  ["*", "", false],
+  ["0", "+", true],
+  ["#", "", false]
+];
+function Dialpad({ outcome = null, onIntent } = {}) {
+  const softphone = useSoftphone();
+  const state = useSoftphoneState();
+  const [value, setValue] = useState("");
+  const [country, setCountry] = useState(DEFAULT_COUNTRY);
+  const format = useNumberFormatter();
+  const inputRef = useRef(null);
+  const caretRef = useRef(null);
+  const display = format(country, value);
+  const target = toE164(country, value);
+  const canCall = state === "online" && target.length > 1;
+  useLayoutEffect(() => {
+    const caret = caretRef.current;
+    if (caret === null || !inputRef.current) return;
+    caretRef.current = null;
+    const pos = caretAfterDigits(display, caret);
+    inputRef.current.setSelectionRange(pos, pos);
+  }, [display]);
+  const append = (key) => {
+    onIntent?.();
+    setValue((v) => v + key);
+  };
+  const backspace = () => {
+    onIntent?.();
+    setValue((v) => v.slice(0, -1));
+  };
+  const call = () => {
+    if (!canCall) return;
+    onIntent?.();
+    void softphone.call(target);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "cv-view", children: [
+    /* @__PURE__ */ jsx("div", { className: "cv-dial-prefix", children: /* @__PURE__ */ jsx(CountryPicker, { value: country, onChange: setCountry }) }),
+    /* @__PURE__ */ jsxs("div", { className: "cv-dial-head", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-dial-side", "aria-hidden": true }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          className: "cv-display",
+          value: display,
+          onChange: (e) => {
+            onIntent?.();
+            caretRef.current = digitsBeforeCaret(e.target.value, e.target.selectionStart ?? 0);
+            setValue(e.target.value.replace(/[^\d+]/g, ""));
+          },
+          onKeyDown: (e) => e.key === "Enter" && call(),
+          placeholder: "N\xFAmero",
+          "aria-label": "N\xFAmero a marcar",
+          inputMode: "tel"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cv-dial-side",
+          "data-hidden": value.length === 0,
+          onClick: backspace,
+          "aria-label": "Borrar",
+          children: /* @__PURE__ */ jsx(Delete, { size: 19 })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "cv-dial-outcome", role: "status", part: "error", "data-shown": outcome !== null, children: outcome?.text ?? "" }),
+    /* @__PURE__ */ jsx("div", { className: "cv-keypad", children: KEYS.map(([key, letters, dialable]) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cv-key",
+        "data-dialable": dialable,
+        onClick: () => dialable && append(key),
+        "aria-disabled": !dialable,
+        title: dialable ? void 0 : "Solo disponible durante una llamada",
+        children: [
+          /* @__PURE__ */ jsx("b", { children: key }),
+          letters ? /* @__PURE__ */ jsx("small", { children: letters }) : null
+        ]
+      },
+      key
+    )) }),
+    /* @__PURE__ */ jsx("div", { className: "cv-dial-foot", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "cv-round cv-round--answer",
+        onClick: call,
+        disabled: !canCall,
+        "aria-label": "Llamar",
+        part: "call-button",
+        children: /* @__PURE__ */ jsx(Phone, { size: 26 })
+      }
+    ) })
+  ] });
+}
+
+// src/ui/lib/format.ts
+function formatDuration(totalSeconds) {
+  const s = Math.max(0, Math.floor(totalSeconds));
+  const hh = Math.floor(s / 3600);
+  const mm = Math.floor(s % 3600 / 60);
+  const ss = s % 60;
+  const pad = (n) => String(n).padStart(2, "0");
+  return hh > 0 ? `${hh}:${pad(mm)}:${pad(ss)}` : `${mm}:${pad(ss)}`;
+}
+function initials(name) {
+  if (!name) return "#";
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  if (words.length === 0 || /^\+?\d/.test(words[0])) return "#";
+  return words.slice(0, 2).map((w) => w[0].toUpperCase()).join("");
+}
+function elapsedSeconds(since, now) {
+  if (!since) return 0;
+  return Math.floor((now - since.getTime()) / 1e3);
+}
+function useTicker(enabled, intervalMs = 1e3) {
+  const [now, setNow] = useState(() => Date.now());
+  useEffect(() => {
+    if (!enabled) return;
+    setNow(Date.now());
+    const id = setInterval(() => setNow(Date.now()), intervalMs);
+    return () => clearInterval(id);
+  }, [enabled, intervalMs]);
+  return now;
+}
+function deviceLabel(device, index, kind) {
+  if (device.label) return device.label;
+  return kind === "input" ? `Micr\xF3fono ${index + 1}` : `Altavoz ${index + 1}`;
+}
+var DEFAULT_OPTION = "";
+function DevicePicker({
+  icon: Icon3,
+  label,
+  kind,
+  options,
+  value,
+  onChange,
+  emptyText
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "cv-settings-row", children: [
+    /* @__PURE__ */ jsx("span", { className: "cv-settings-row-icon", "aria-hidden": true, children: /* @__PURE__ */ jsx(Icon3, { size: 16 }) }),
+    /* @__PURE__ */ jsxs("span", { className: "cv-settings-row-text", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-settings-row-label", id: `cv-settings-label-${kind}`, children: label }),
+      options.length > 0 ? /* @__PURE__ */ jsxs(
+        "select",
+        {
+          className: "cv-settings-select",
+          "aria-labelledby": `cv-settings-label-${kind}`,
+          value: value ?? DEFAULT_OPTION,
+          onChange: (e) => onChange(e.target.value === DEFAULT_OPTION ? null : e.target.value),
+          children: [
+            /* @__PURE__ */ jsx("option", { value: DEFAULT_OPTION, children: "Predeterminado del sistema" }),
+            options.map((d, i) => /* @__PURE__ */ jsx("option", { value: d.deviceId, children: deviceLabel(d, i, kind) }, d.deviceId))
+          ]
+        }
+      ) : /* @__PURE__ */ jsx("span", { className: "cv-settings-empty", children: emptyText })
+    ] })
+  ] });
+}
+function DevicePickers() {
+  const softphone = useSoftphone();
+  const devices = useDevices();
+  useEffect(() => {
+    void softphone.audio.refresh();
+  }, [softphone]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      DevicePicker,
+      {
+        icon: Mic,
+        label: "Micr\xF3fono",
+        kind: "input",
+        options: devices.inputs,
+        value: devices.currentInputId,
+        onChange: (id) => void devices.setInput(id),
+        emptyText: "No se encontr\xF3 ning\xFAn micr\xF3fono"
+      }
+    ),
+    devices.canSelectOutput ? /* @__PURE__ */ jsx(
+      DevicePicker,
+      {
+        icon: Headphones,
+        label: "Altavoces",
+        kind: "output",
+        options: devices.outputs,
+        value: devices.currentOutputId,
+        onChange: (id) => void devices.setOutput(id),
+        emptyText: "No se encontr\xF3 ning\xFAn altavoz"
+      }
+    ) : (
+      // Safari and most of Firefox have no `setSinkId` at all — nothing here would do anything,
+      // and offering a picker that silently fails is worse than not offering one.
+      /* @__PURE__ */ jsx("p", { className: "cv-settings-note", children: "Tu navegador no permite elegir el altavoz desde aqu\xED \u2014 c\xE1mbialo en los ajustes del sistema." })
+    )
+  ] });
+}
+function Control({
+  icon: Icon3,
+  label,
+  pressed = false,
+  tone,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "cv-ctrl-item", children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "cv-ctrl",
+        "data-tone": pressed ? tone : void 0,
+        "aria-pressed": pressed,
+        "aria-label": label,
+        onClick,
+        children: /* @__PURE__ */ jsx(Icon3, { size: 19 })
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "cv-ctrl-label", "aria-hidden": true, children: label })
+  ] });
+}
+var STATUS_LABEL = {
+  ringing: "Llamada entrante",
+  dialing: "Llamando\u2026",
+  early: "Llamando\u2026",
+  answering: "Conectando\u2026",
+  reconnecting: "Reconectando\u2026",
+  held: "En espera"
+};
+function CallScreen({
+  call,
+  incomingCallAction
+}) {
+  const view = useCall(call);
+  const [showTransfer, setShowTransfer] = useState(false);
+  const [transferTo, setTransferTo] = useState("");
+  const [showDevices, setShowDevices] = useState(false);
+  const controlsRef = useRef(null);
+  const now = useTicker(view?.state === "active");
+  const isConnected = view ? view.state === "active" || view.state === "held" || view.state === "reconnecting" : false;
+  useEffect(() => {
+    if (!showDevices) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") setShowDevices(false);
+    };
+    document.addEventListener("keydown", onKey);
+    if (!isConnected) return () => document.removeEventListener("keydown", onKey);
+    const root = controlsRef.current?.getRootNode() ?? document;
+    const onDown = (e) => {
+      if (!controlsRef.current?.contains(e.target)) setShowDevices(false);
+    };
+    root.addEventListener("pointerdown", onDown);
+    return () => {
+      document.removeEventListener("keydown", onKey);
+      root.removeEventListener("pointerdown", onDown);
+    };
+  }, [showDevices, isConnected]);
+  if (!view || view.state === "ended") return null;
+  const s = view.state;
+  const isRinging = s === "ringing";
+  const inCall = isConnected;
+  const name = view.remote.displayName;
+  const number = view.remote.number;
+  const showNumber = number !== name;
+  const incomingAction = isRinging && view.remote.contact && incomingCallAction ? incomingCallAction : null;
+  const IncomingActionIcon = incomingAction?.icon ?? ExternalLink;
+  const [rawM = "0", ss = "00"] = formatDuration(elapsedSeconds(view.answeredAt, now)).split(":");
+  const mm = rawM.padStart(2, "0");
+  return /* @__PURE__ */ jsxs("div", { className: "cv-view", children: [
+    /* @__PURE__ */ jsx("div", { className: "cv-call", children: !inCall && showDevices ? /* @__PURE__ */ jsxs("div", { className: "cv-call-devices-inline", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cv-call-devices-header", children: [
+        /* @__PURE__ */ jsxs("button", { type: "button", className: "cv-call-devices-chip", onClick: () => setShowDevices(false), children: [
+          /* @__PURE__ */ jsx(ArrowLeft, { size: 13, "aria-hidden": true }),
+          "Volver"
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "cv-call-devices-title", children: "Dispositivos" })
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: "cv-call-devices-context", children: [
+        showNumber ? `${number} \xB7 ` : "",
+        STATUS_LABEL[s] ?? ""
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "cv-settings-section-body", children: /* @__PURE__ */ jsx(DevicePickers, {}) })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "cv-avatar-wrap", children: [
+        isRinging ? /* @__PURE__ */ jsx("span", { className: "cv-avatar-ping", "aria-hidden": true }) : null,
+        /* @__PURE__ */ jsx("div", { className: "cv-avatar", "aria-hidden": true, children: initials(name) }),
+        s === "active" ? /* @__PURE__ */ jsx("span", { className: "cv-avatar-dot", "aria-hidden": true }) : null
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "cv-call-name", children: name }),
+      showNumber ? /* @__PURE__ */ jsx("div", { className: "cv-call-number", children: number }) : null,
+      s === "active" ? /* @__PURE__ */ jsxs("div", { className: "cv-timer", "aria-label": "Duraci\xF3n de la llamada", children: [
+        /* @__PURE__ */ jsx("b", { children: mm }),
+        /* @__PURE__ */ jsx("i", { children: ":" }),
+        /* @__PURE__ */ jsx("b", { children: ss })
+      ] }) : /* @__PURE__ */ jsx("div", { className: "cv-call-status", children: s === "held" ? /* @__PURE__ */ jsx("span", { className: "cv-badge-hold", children: STATUS_LABEL[s] }) : STATUS_LABEL[s] ?? "" }),
+      !inCall ? /* @__PURE__ */ jsxs("div", { className: "cv-call-chips", children: [
+        incomingAction ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: "cv-call-devices-chip",
+            onClick: () => incomingAction.onClick(view.remote.contact),
+            children: [
+              /* @__PURE__ */ jsx(IncomingActionIcon, { size: 13, "aria-hidden": true }),
+              incomingAction.label
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs("button", { type: "button", className: "cv-call-devices-chip", onClick: () => setShowDevices(true), children: [
+          /* @__PURE__ */ jsx(Headphones, { size: 13, "aria-hidden": true }),
+          "Dispositivos"
+        ] })
+      ] }) : null,
+      inCall && showTransfer ? /* @__PURE__ */ jsxs("div", { className: "cv-transfer", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            className: "cv-search",
+            value: transferTo,
+            onChange: (e) => setTransferTo(e.target.value),
+            placeholder: "Extensi\xF3n o n\xFAmero",
+            "aria-label": "Transferir a",
+            autoFocus: true
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: "cv-btn cv-btn--accent",
+            disabled: !transferTo.trim(),
+            onClick: () => {
+              void call.transfer(transferTo.trim());
+              setShowTransfer(false);
+            },
+            children: "Transferir"
+          }
+        )
+      ] }) : null
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "cv-controls", ref: controlsRef, children: isRinging ? /* @__PURE__ */ jsxs("div", { className: "cv-controls-primary", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cv-ctrl-item", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cv-round cv-round--hangup",
+            onClick: () => void call.reject(),
+            "aria-label": "Rechazar",
+            children: /* @__PURE__ */ jsx(PhoneOff, { size: 26 })
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "cv-ctrl-label", "aria-hidden": true, children: "Rechazar" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cv-ctrl-item", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cv-round cv-round--answer",
+            onClick: () => void call.answer(),
+            "aria-label": "Contestar",
+            part: "answer-button",
+            children: /* @__PURE__ */ jsx(Phone, { size: 26 })
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "cv-ctrl-label", "aria-hidden": true, children: "Contestar" })
+      ] })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      inCall ? /* @__PURE__ */ jsxs("div", { className: "cv-controls-row", children: [
+        /* @__PURE__ */ jsx(
+          Control,
+          {
+            icon: view.isMuted ? MicOff : Mic,
+            label: view.isMuted ? "Activar" : "Silenciar",
+            pressed: view.isMuted,
+            tone: "danger",
+            onClick: () => call.mute(!view.isMuted)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Control,
+          {
+            icon: view.isOnHold ? Play : Pause,
+            label: view.isOnHold ? "Reanudar" : "Espera",
+            pressed: view.isOnHold,
+            tone: "hold",
+            onClick: () => view.isOnHold ? void call.unhold() : void call.hold()
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Control,
+          {
+            icon: ArrowLeftRight,
+            label: "Transferir",
+            pressed: showTransfer,
+            tone: "accent",
+            onClick: () => setShowTransfer((v) => !v)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Control,
+          {
+            icon: Headphones,
+            label: "Dispositivos",
+            pressed: showDevices,
+            tone: "accent",
+            onClick: () => setShowDevices((v) => !v)
+          }
+        )
+      ] }) : null,
+      /* @__PURE__ */ jsx("div", { className: "cv-controls-primary", children: /* @__PURE__ */ jsxs("div", { className: "cv-ctrl-item", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "cv-round cv-round--hangup",
+            onClick: () => void call.hangup(),
+            "aria-label": "Colgar",
+            part: "hangup-button",
+            children: /* @__PURE__ */ jsx(PhoneOff, { size: 26 })
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "cv-ctrl-label", "aria-hidden": true, children: "Colgar" })
+      ] }) }),
+      inCall && showDevices ? /* @__PURE__ */ jsx("div", { className: "cv-device-popover cv-device-popover--above", role: "dialog", "aria-label": "Dispositivos de audio", children: /* @__PURE__ */ jsx(DevicePickers, {}) }) : null
+    ] }) })
+  ] });
+}
+function DetailRow({
+  icon: Icon3,
+  eyebrow,
+  text,
+  onClick
+}) {
+  const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { className: "cv-detail-row-icon", "aria-hidden": true, children: /* @__PURE__ */ jsx(Icon3, { size: 16 }) }),
+    /* @__PURE__ */ jsxs("span", { className: "cv-detail-row-text", children: [
+      eyebrow ? /* @__PURE__ */ jsx("span", { className: "cv-detail-row-eyebrow", children: eyebrow }) : null,
+      /* @__PURE__ */ jsx("span", { className: "cv-detail-row-value", children: text })
+    ] }),
+    onClick ? /* @__PURE__ */ jsx(ChevronRight, { size: 16, className: "cv-detail-row-chevron", "aria-hidden": true }) : null
+  ] });
+  return onClick ? /* @__PURE__ */ jsx("button", { type: "button", className: "cv-detail-row cv-detail-row--action", onClick, children: inner }) : /* @__PURE__ */ jsx("div", { className: "cv-detail-row", children: inner });
+}
+function ContactDetail({
+  contact,
+  onBack,
+  contactAction
+}) {
+  const softphone = useSoftphone();
+  const formatIntl2 = useIntlFormatter();
+  const formatted = formatIntl2(contact.phone);
+  const name = contact.name ?? formatted;
+  return /* @__PURE__ */ jsxs("div", { className: "cv-detail", role: "region", "aria-label": name, children: [
+    /* @__PURE__ */ jsx("div", { className: "cv-detail-head", children: /* @__PURE__ */ jsxs("button", { type: "button", className: "cv-detail-back", onClick: onBack, children: [
+      /* @__PURE__ */ jsx(ArrowLeft, { size: 16, "aria-hidden": true }),
+      "Contactos"
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "cv-detail-body", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cv-detail-identity", children: [
+        /* @__PURE__ */ jsx("span", { className: "cv-detail-avatar", "aria-hidden": true, children: initials(contact.name) }),
+        /* @__PURE__ */ jsx("h2", { className: "cv-detail-name", children: name })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cv-detail-rows", children: [
+        /* @__PURE__ */ jsx(DetailRow, { icon: Phone, eyebrow: "Tel\xE9fono", text: formatted }),
+        contactAction ? /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            icon: contactAction.icon ?? ExternalLink,
+            text: contactAction.label,
+            onClick: () => contactAction.onClick(contact)
+          }
+        ) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "cv-detail-foot", children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cv-btn cv-btn--accent cv-detail-call",
+        onClick: () => void softphone.call(contact.phone),
+        children: [
+          /* @__PURE__ */ jsx(Phone, { size: 16, "aria-hidden": true }),
+          "Llamar"
+        ]
+      }
+    ) })
+  ] });
+}
+function useInfiniteList(loadPage) {
+  const [items, setItems] = useState([]);
+  const [loading2, setLoading] = useState(true);
+  const [loadingMore, setLoadingMore] = useState(false);
+  const [hasMore, setHasMore] = useState(true);
+  const [error, setError] = useState(false);
+  const seqRef = useRef(0);
+  const itemsRef = useRef(items);
+  itemsRef.current = items;
+  const loadingMoreRef = useRef(false);
+  const hasMoreRef = useRef(true);
+  useEffect(() => {
+    const seq = ++seqRef.current;
+    loadingMoreRef.current = false;
+    hasMoreRef.current = true;
+    setItems([]);
+    setHasMore(true);
+    setError(false);
+    setLoading(true);
+    void loadPage(0).then((page) => {
+      if (seq !== seqRef.current) return;
+      setItems(page.items);
+      setHasMore(page.hasMore);
+      hasMoreRef.current = page.hasMore;
+    }).catch(() => {
+      if (seq !== seqRef.current) return;
+      setItems([]);
+      setHasMore(false);
+      hasMoreRef.current = false;
+      setError(true);
+    }).finally(() => {
+      if (seq === seqRef.current) setLoading(false);
+    });
+  }, [loadPage]);
+  const loadMore = useCallback(() => {
+    if (loadingMoreRef.current || !hasMoreRef.current) return;
+    const seq = seqRef.current;
+    loadingMoreRef.current = true;
+    setLoadingMore(true);
+    void loadPage(itemsRef.current.length).then((page) => {
+      if (seq !== seqRef.current) return;
+      setItems((prev) => [...prev, ...page.items]);
+      setHasMore(page.hasMore);
+      hasMoreRef.current = page.hasMore;
+    }).catch(() => {
+    }).finally(() => {
+      loadingMoreRef.current = false;
+      if (seq === seqRef.current) setLoadingMore(false);
+    });
+  }, [loadPage]);
+  const [containerEl, setContainerEl] = useState(null);
+  const [sentinelEl, setSentinelEl] = useState(null);
+  const loadMoreRef = useRef(loadMore);
+  loadMoreRef.current = loadMore;
+  useEffect(() => {
+    if (!containerEl || !sentinelEl) return;
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        if (entry?.isIntersecting) loadMoreRef.current();
+      },
+      { root: containerEl, rootMargin: "160px" }
+    );
+    observer.observe(sentinelEl);
+    return () => observer.disconnect();
+  }, [containerEl, sentinelEl]);
+  return {
+    items,
+    loading: loading2,
+    loadingMore,
+    hasMore,
+    error,
+    containerRef: setContainerEl,
+    sentinelRef: setSentinelEl
+  };
+}
+var PAGE = 50;
+function ContactsTab({
+  source,
+  contactAction
+}) {
+  const softphone = useSoftphone();
+  const [search, setSearch] = useState("");
+  const [debouncedSearch, setDebouncedSearch] = useState("");
+  const [selected, setSelected] = useState(null);
+  useEffect(() => {
+    const t = setTimeout(() => setDebouncedSearch(search), 200);
+    return () => clearTimeout(t);
+  }, [search]);
+  const loadPage = useCallback(
+    (skip) => source({ search: debouncedSearch, skip, limit: PAGE }).then((page) => ({
+      items: page.items,
+      hasMore: skip + page.items.length < page.total
+    })),
+    [source, debouncedSearch]
+  );
+  const {
+    items,
+    loading: loadingPage,
+    loadingMore,
+    hasMore,
+    containerRef,
+    sentinelRef
+  } = useInfiniteList(loadPage);
+  const loading2 = loadingPage || search !== debouncedSearch;
+  return /* @__PURE__ */ jsxs("div", { className: "cv-view", children: [
+    /* @__PURE__ */ jsx("div", { className: "cv-list-head", children: /* @__PURE__ */ jsxs("div", { className: "cv-search-field", children: [
+      /* @__PURE__ */ jsx(Search, { className: "cv-search-icon", size: 15, "aria-hidden": true }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          className: "cv-search cv-search--icon",
+          value: search,
+          onChange: (e) => setSearch(e.target.value),
+          placeholder: "Buscar contactos",
+          "aria-label": "Buscar contactos"
+        }
+      ),
+      search ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "cv-search-clear",
+          onClick: () => setSearch(""),
+          "aria-label": "Limpiar b\xFAsqueda",
+          children: /* @__PURE__ */ jsx(X, { size: 14 })
+        }
+      ) : null
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "cv-list", ref: containerRef, children: loading2 ? (
+      // The spinner alone was silent to a screen reader — nothing else on this state carries
+      // the word "loading" for it to announce. `role="status"` + real text fixes both the
+      // accessibility gap and, incidentally, gives the icon something to be decorative NEXT TO
+      // rather than being the sole carrier of the information itself.
+      /* @__PURE__ */ jsxs("div", { className: "cv-empty", role: "status", children: [
+        /* @__PURE__ */ jsx(LoaderCircle, { className: "cv-empty-spinner", size: 18, "aria-hidden": true }),
+        /* @__PURE__ */ jsx("span", { className: "cv-empty-title", children: "Cargando\u2026" })
+      ] })
+    ) : items.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "cv-empty", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-empty-icon", "aria-hidden": true, children: /* @__PURE__ */ jsx(Users, { size: 20 }) }),
+      /* @__PURE__ */ jsx("p", { className: "cv-empty-title", children: search ? "Sin resultados" : "No tienes contactos" }),
+      /* @__PURE__ */ jsx("p", { className: "cv-empty-sub", children: search ? `Nada coincide con \xAB${search}\xBB.` : "Tus contactos con tel\xE9fono aparecer\xE1n aqu\xED." })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      items.map((c) => (
+        // A row, not a button: the name area and the call action are separate controls, so
+        // neither is nested inside the other (nested interactives are invalid + inaccessible).
+        /* @__PURE__ */ jsxs("div", { className: "cv-item", children: [
+          /* @__PURE__ */ jsx("span", { className: "cv-item-avatar", "aria-hidden": true, children: initials(c.name) === "#" ? /* @__PURE__ */ jsx(User, { size: 17 }) : initials(c.name) }),
+          /* @__PURE__ */ jsxs("button", { type: "button", className: "cv-item-main", onClick: () => setSelected(c), children: [
+            /* @__PURE__ */ jsx("span", { className: "cv-item-name", children: c.name ?? c.phone }),
+            /* @__PURE__ */ jsx("span", { className: "cv-item-sub", children: c.phone })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "cv-item-action",
+              "data-tone": "accent",
+              "aria-label": `Llamar a ${c.name ?? c.phone}`,
+              onClick: () => void softphone.call(c.phone),
+              children: /* @__PURE__ */ jsx(Phone, { size: 16 })
+            }
+          )
+        ] }, c.id)
+      )),
+      hasMore ? /* @__PURE__ */ jsx("div", { ref: sentinelRef, className: "cv-list-sentinel", "aria-hidden": true }) : null,
+      loadingMore ? /* @__PURE__ */ jsx("div", { className: "cv-list-loading-more", role: "status", "aria-label": "Cargando m\xE1s contactos", children: /* @__PURE__ */ jsx(LoaderCircle, { className: "cv-list-loading-more-spinner", size: 14, "aria-hidden": true }) }) : null
+    ] }) }),
+    selected ? /* @__PURE__ */ jsx(
+      ContactDetail,
+      {
+        contact: selected,
+        onBack: () => setSelected(null),
+        ...contactAction ? { contactAction } : {}
+      }
+    ) : null
+  ] });
+}
+var OUTCOME_LABELS = {
+  "no-answer": "No contestada",
+  busy: "Ocupada",
+  cancelled: "Cancelada",
+  failed: "Fallida",
+  unavailable: "No disponible"
+};
+function timeLabel(at) {
+  return at.toLocaleTimeString("es-ES", { hour: "2-digit", minute: "2-digit" });
+}
+function fullDateLabel(at) {
+  return at.toLocaleString("es-ES", {
+    day: "2-digit",
+    month: "long",
+    year: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function Icon2({ entry }) {
+  if (entry.missed) return /* @__PURE__ */ jsx(PhoneMissed, { size: 16 });
+  return entry.direction === "inbound" ? /* @__PURE__ */ jsx(PhoneIncoming, { size: 16 }) : /* @__PURE__ */ jsx(PhoneOutgoing, { size: 16 });
+}
+function statusIcon(entry) {
+  if (entry.missed) return PhoneMissed;
+  return entry.direction === "inbound" ? PhoneIncoming : PhoneOutgoing;
+}
+function statusTone(entry) {
+  if (entry.missed) return "danger";
+  return entry.direction === "inbound" ? "accent" : "info";
+}
+function HandlerChain({ handlers }) {
+  return /* @__PURE__ */ jsx("span", { className: "cv-detail-handlers", children: handlers.map((h, i) => {
+    const isLast = i === handlers.length - 1;
+    const label = h.name ?? `Ext. ${h.extension}`;
+    return /* @__PURE__ */ jsxs("span", { className: "cv-detail-handler-hop", children: [
+      i > 0 ? /* @__PURE__ */ jsx(ArrowRight, { size: 12, className: "cv-detail-handler-arrow", "aria-hidden": true }) : null,
+      /* @__PURE__ */ jsxs("span", { className: "cv-detail-handler-chip", "data-tone": isLast ? "accent" : void 0, children: [
+        label,
+        h.name ? /* @__PURE__ */ jsxs("span", { className: "cv-detail-handler-ext", children: [
+          "\xB7 ",
+          h.extension
+        ] }) : null
+      ] })
+    ] }, `${h.extension}-${i}`);
+  }) });
+}
+function HistoryDetail({
+  entry,
+  onBack
+}) {
+  const softphone = useSoftphone();
+  const formatIntl2 = useIntlFormatter();
+  const [detail, setDetail] = useState(null);
+  const [loadingDetail, setLoadingDetail] = useState(false);
+  useEffect(() => {
+    const load = entry.loadDetail;
+    if (!load) return;
+    let cancelled = false;
+    setLoadingDetail(true);
+    void load().then((d) => !cancelled && setDetail(d)).catch(() => {
+    }).finally(() => !cancelled && setLoadingDetail(false));
+    return () => {
+      cancelled = true;
+    };
+  }, [entry]);
+  const formatted = formatIntl2(entry.number);
+  const name = entry.name ?? formatted;
+  const handledBy = detail?.handledBy ?? entry.handledBy;
+  const recordingUrls = detail?.recordingUrls ?? [];
+  const loadingRecording = entry.recorded && loadingDetail && recordingUrls.length === 0;
+  const statusText = entry.missed ? entry.outcome ? OUTCOME_LABELS[entry.outcome] : "Perdida" : "Contestada";
+  const handlerLabel = handledBy.length > 1 ? "Ruta de la llamada" : entry.direction === "outbound" ? "Realizada por" : "Atendida por";
+  return /* @__PURE__ */ jsxs("div", { className: "cv-detail", role: "region", "aria-label": name, children: [
+    /* @__PURE__ */ jsx("div", { className: "cv-detail-head", children: /* @__PURE__ */ jsxs("button", { type: "button", className: "cv-detail-back", onClick: onBack, children: [
+      /* @__PURE__ */ jsx(ArrowLeft, { size: 16, "aria-hidden": true }),
+      "Historial"
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "cv-detail-body", children: [
+      /* @__PURE__ */ jsxs("div", { className: "cv-detail-identity", children: [
+        /* @__PURE__ */ jsx("span", { className: "cv-detail-avatar", "data-tone": statusTone(entry), "aria-hidden": true, children: /* @__PURE__ */ jsx(Icon2, { entry }) }),
+        /* @__PURE__ */ jsx("h2", { className: "cv-detail-name", "data-tone": entry.missed ? "danger" : void 0, children: name }),
+        /* @__PURE__ */ jsxs("p", { className: "cv-detail-meta", children: [
+          statusText,
+          " \xB7 ",
+          timeLabel(entry.at)
+        ] })
+      ] }),
+      entry.recorded ? /* @__PURE__ */ jsx("div", { className: "cv-detail-recording", children: loadingRecording ? /* @__PURE__ */ jsxs("div", { className: "cv-detail-recording-status", children: [
+        /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "cv-detail-recording-spinner", "aria-hidden": true }),
+        "Cargando grabaci\xF3n\u2026"
+      ] }) : recordingUrls.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("p", { className: "cv-detail-recording-label", children: recordingUrls.length === 1 ? "Grabaci\xF3n" : "Grabaciones" }),
+        recordingUrls.map((url) => /* @__PURE__ */ jsx("audio", { controls: true, src: url, className: "cv-detail-audio", preload: "metadata" }, url))
+      ] }) : /* @__PURE__ */ jsx("p", { className: "cv-detail-recording-status cv-detail-recording-status--warn", children: "No se pudo cargar la grabaci\xF3n ahora. Int\xE9ntalo de nuevo m\xE1s tarde." }) }) : /* @__PURE__ */ jsxs("p", { className: "cv-detail-recording-status", children: [
+        /* @__PURE__ */ jsx(Mic, { size: 14, "aria-hidden": true }),
+        "Esta llamada no se grab\xF3."
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "cv-detail-rows", children: [
+        /* @__PURE__ */ jsx(DetailRow, { icon: statusIcon(entry), eyebrow: "Estado", text: statusText }),
+        /* @__PURE__ */ jsx(DetailRow, { icon: CalendarClock, eyebrow: "Fecha y hora", text: fullDateLabel(entry.at) }),
+        entry.durationSec > 0 ? /* @__PURE__ */ jsx(DetailRow, { icon: Timer, eyebrow: "Duraci\xF3n", text: formatDuration(entry.durationSec) }) : null,
+        /* @__PURE__ */ jsx(DetailRow, { icon: Phone, eyebrow: "N\xFAmero", text: formatted }),
+        handledBy.length > 0 ? /* @__PURE__ */ jsx(DetailRow, { icon: User, eyebrow: handlerLabel, text: /* @__PURE__ */ jsx(HandlerChain, { handlers: handledBy }) }) : null,
+        entry.direction === "inbound" && entry.did ? /* @__PURE__ */ jsx(DetailRow, { icon: Hash, eyebrow: "N\xFAmero marcado (DID)", text: formatIntl2(entry.did) }) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "cv-detail-foot", children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cv-btn cv-btn--accent cv-detail-call",
+        onClick: () => void softphone.call(entry.number),
+        children: [
+          /* @__PURE__ */ jsx(Phone, { size: 16, "aria-hidden": true }),
+          "Llamar"
+        ]
+      }
+    ) })
+  ] });
+}
+var PAGE2 = 30;
+function startOfDay(at) {
+  return new Date(at.getFullYear(), at.getMonth(), at.getDate()).getTime();
+}
+function dayLabel(at, now) {
+  const diffDays = Math.round((startOfDay(new Date(now)) - startOfDay(at)) / 864e5);
+  if (diffDays === 0) return "Hoy";
+  if (diffDays === 1) return "Ayer";
+  return at.toLocaleDateString("es-ES", { day: "numeric", month: "long" });
+}
+function groupByDay(entries, now) {
+  const groups = [];
+  for (const e of entries) {
+    const label = dayLabel(e.at, now);
+    const last = groups.at(-1);
+    if (last && last.label === label) last.rows.push(e);
+    else groups.push({ label, rows: [e] });
+  }
+  return groups;
+}
+function PersonFilter({
+  value,
+  directory,
+  onChange
+}) {
+  const [open, setOpen] = useState(false);
+  const rootRef = useRef(null);
+  useEffect(() => {
+    if (!open) return;
+    const root = rootRef.current?.getRootNode() ?? document;
+    const onDown = (e) => {
+      if (!rootRef.current?.contains(e.target)) setOpen(false);
+    };
+    const onKey = (e) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    root.addEventListener("pointerdown", onDown);
+    document.addEventListener("keydown", onKey);
+    return () => {
+      root.removeEventListener("pointerdown", onDown);
+      document.removeEventListener("keydown", onKey);
+    };
+  }, [open]);
+  const options = [
+    { v: "", label: "Todas las personas" },
+    ...directory.me ? [{ v: directory.me.userId, label: `Mis llamadas \xB7 ${directory.me.name ?? "Yo"}` }] : [],
+    ...directory.people.filter((p) => !directory.me || p.userId !== directory.me.userId).map((p) => ({ v: p.userId, label: p.name ?? "Sin nombre" }))
+  ];
+  const label = options.find((o) => o.v === value)?.label ?? "Todas las personas";
+  return /* @__PURE__ */ jsxs("div", { className: "cv-person-filter", ref: rootRef, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "cv-person-filter-chip",
+        onClick: () => setOpen((o) => !o),
+        "aria-haspopup": "listbox",
+        "aria-expanded": open,
+        children: [
+          /* @__PURE__ */ jsx(Users, { size: 13, "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { className: "cv-person-filter-label", children: label }),
+          /* @__PURE__ */ jsx(ChevronDown, { size: 13, className: "cv-person-filter-caret", "data-open": open, "aria-hidden": true })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsx("div", { className: "cv-person-filter-pop", role: "listbox", children: options.map((opt) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        role: "option",
+        "aria-selected": opt.v === value,
+        className: "cv-person-filter-item",
+        onClick: () => {
+          onChange(opt.v);
+          setOpen(false);
+        },
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "cv-person-filter-name", children: opt.label }),
+          /* @__PURE__ */ jsx(Check, { size: 14, className: "cv-person-filter-check", "data-on": opt.v === value, "aria-hidden": true })
+        ]
+      },
+      opt.v || "all"
+    )) }) : null
+  ] });
+}
+function HistoryTab({ source }) {
+  const softphone = useSoftphone();
+  const formatIntl2 = useIntlFormatter();
+  const now = Date.now();
+  const [status, setStatus] = useState("all");
+  const [agentId, setAgentId] = useState("");
+  const [directory, setDirectory] = useState(null);
+  const [selected, setSelected] = useState(null);
+  useEffect(() => {
+    const listAgents = softphone.sources?.listAgents;
+    if (!listAgents) return;
+    let cancelled = false;
+    void listAgents().then((d) => !cancelled && setDirectory(d)).catch(() => {
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [softphone]);
+  const loadPage = useCallback(
+    (skip) => source({
+      skip,
+      limit: PAGE2,
+      missed: status === "missed",
+      ...agentId ? { userId: agentId } : {}
+    }).then((rows) => ({ items: rows, hasMore: rows.length === PAGE2 })),
+    [source, status, agentId]
+  );
+  const { items: entries, loading: loading2, loadingMore, hasMore, containerRef, sentinelRef } = useInfiniteList(loadPage);
+  const groups = groupByDay(entries, now);
+  return /* @__PURE__ */ jsxs("div", { className: "cv-view", children: [
+    /* @__PURE__ */ jsxs("div", { className: "cv-list-head", children: [
+      /* @__PURE__ */ jsx("div", { className: "cv-segmented", role: "tablist", "aria-label": "Filtrar por estado", children: ["all", "missed"].map((key) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": status === key,
+          className: "cv-segmented-btn",
+          onClick: () => setStatus(key),
+          children: key === "all" ? "Todas" : "Perdidas"
+        },
+        key
+      )) }),
+      directory ? /* @__PURE__ */ jsx(PersonFilter, { value: agentId, directory, onChange: setAgentId }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "cv-list", ref: containerRef, children: [
+      loading2 && /* @__PURE__ */ jsx("div", { className: "cv-empty", children: "Cargando\u2026" }),
+      !loading2 && entries.length === 0 && /* @__PURE__ */ jsx("div", { className: "cv-empty", children: status === "missed" ? "Sin llamadas perdidas" : "Sin llamadas recientes" }),
+      !loading2 && groups.map((group) => /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("div", { className: "cv-history-day", children: group.label }),
+        group.rows.map((e) => /* @__PURE__ */ jsxs("div", { className: "cv-item", children: [
+          /* @__PURE__ */ jsx("span", { className: "cv-item-avatar", "data-tone": statusTone(e), "aria-hidden": true, children: /* @__PURE__ */ jsx(Icon2, { entry: e }) }),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              className: "cv-item-main",
+              onClick: () => setSelected(e),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "cv-item-name", "data-tone": e.missed ? "danger" : void 0, children: e.name ?? formatIntl2(e.number) }),
+                /* @__PURE__ */ jsxs("span", { className: "cv-item-sub", children: [
+                  /* @__PURE__ */ jsx("span", { className: "tabular-nums", children: timeLabel(e.at) }),
+                  e.missed ? /* @__PURE__ */ jsxs("span", { className: "cv-item-sub-outcome", children: [
+                    " ",
+                    "\xB7 ",
+                    e.outcome ? OUTCOME_LABELS[e.outcome] : "Perdida"
+                  ] }) : e.durationSec > 0 && ` \xB7 ${formatDuration(e.durationSec)}`,
+                  e.recorded ? /* @__PURE__ */ jsx(Mic, { size: 11, className: "cv-item-sub-rec", "aria-label": "Grabada" }) : null
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "cv-item-action",
+              "data-tone": "accent",
+              "aria-label": `Llamar a ${e.name ?? e.number}`,
+              onClick: () => void softphone.call(e.number),
+              children: /* @__PURE__ */ jsx(Phone, { size: 16 })
+            }
+          )
+        ] }, e.id))
+      ] }, group.label)),
+      !loading2 && hasMore ? /* @__PURE__ */ jsx("div", { ref: sentinelRef, className: "cv-list-sentinel", "aria-hidden": true }) : null,
+      loadingMore ? /* @__PURE__ */ jsx("div", { className: "cv-list-loading-more", role: "status", "aria-label": "Cargando m\xE1s llamadas", children: /* @__PURE__ */ jsx(LoaderCircle, { className: "cv-list-loading-more-spinner", size: 14, "aria-hidden": true }) }) : null
+    ] }),
+    selected ? /* @__PURE__ */ jsx(HistoryDetail, { entry: selected, onBack: () => setSelected(null) }) : null
+  ] });
+}
+function SettingsSection({
+  title,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("section", { className: "cv-settings-section", children: [
+    /* @__PURE__ */ jsx("h3", { className: "cv-settings-section-title", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "cv-settings-section-body", children })
+  ] });
+}
+function SettingsTab() {
+  return /* @__PURE__ */ jsx("div", { className: "cv-view cv-settings", children: /* @__PURE__ */ jsxs("div", { className: "cv-settings-body", children: [
+    /* @__PURE__ */ jsx(SettingsSection, { title: "Dispositivos", children: /* @__PURE__ */ jsx(DevicePickers, {}) }),
+    /* @__PURE__ */ jsx("p", { className: "cv-settings-more", children: "M\xE1s ajustes se ir\xE1n a\xF1adiendo pr\xF3ximamente." })
+  ] }) });
+}
+function useMicPermission() {
+  const [state, setState] = useState("checking");
+  const warm = useCallback(async () => {
+    try {
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      for (const track of stream.getTracks()) track.stop();
+      setState("ready");
+    } catch {
+      setState("denied");
+    }
+  }, []);
+  useEffect(() => {
+    if (!isWebRtcSupported()) {
+      setState("unsupported");
+      return;
+    }
+    let cancelled = false;
+    let status = null;
+    const apply = (permission) => {
+      if (cancelled) return;
+      if (permission === "denied") {
+        setState("denied");
+      } else if (permission === "granted") {
+        setState("warming");
+        void warm();
+      } else {
+        setState("prompting");
+      }
+    };
+    void (async () => {
+      try {
+        status = await navigator.permissions.query({ name: "microphone" });
+        if (cancelled) return;
+        apply(status.state);
+        status.onchange = () => status && apply(status.state);
+      } catch {
+        if (!cancelled) setState("prompting");
+      }
+    })();
+    return () => {
+      cancelled = true;
+      if (status) status.onchange = null;
+    };
+  }, [warm]);
+  return { state, request: warm };
+}
+
+// src/ui/permission/unblock-mic.ts
+function detectBrowser(ua) {
+  if (/firefox|fxios/i.test(ua)) return "firefox";
+  if (/edg\//i.test(ua)) return "edge";
+  if (/chrome|chromium|crios/i.test(ua)) return "chromium";
+  if (/safari/i.test(ua)) return "safari";
+  return "unknown";
+}
+var CHROME_HELP = "https://support.google.com/chrome/answer/2693767?hl=es";
+var GUIDES = {
+  chromium: {
+    steps: [
+      "Haz clic en el icono \u{1F512} a la izquierda de la direcci\xF3n web.",
+      "Busca \xABMicr\xF3fono\xBB y c\xE1mbialo a \xABPermitir\xBB.",
+      "Recarga la p\xE1gina."
+    ],
+    url: CHROME_HELP
+  },
+  // Edge is Chromium: same padlock, same panel. The article is Chrome's, so it is offered but not
+  // led with — the steps above match what an Edge user actually sees.
+  edge: {
+    steps: [
+      "Haz clic en el icono \u{1F512} a la izquierda de la direcci\xF3n web.",
+      "Busca \xABMicr\xF3fono\xBB y c\xE1mbialo a \xABPermitir\xBB.",
+      "Recarga la p\xE1gina."
+    ]
+  },
+  firefox: {
+    steps: [
+      "Haz clic en el icono de micr\xF3fono tachado en la barra de direcciones.",
+      "Pulsa la \xAB\u2715\xBB junto a \xABBloqueado\xBB para quitar el bloqueo.",
+      "Recarga la p\xE1gina."
+    ]
+  },
+  safari: {
+    steps: [
+      "Abre \xABSafari\xBB \u2192 \xABAjustes para este sitio web\xBB.",
+      "En \xABMicr\xF3fono\xBB, elige \xABPermitir\xBB.",
+      "Recarga la p\xE1gina."
+    ]
+  },
+  unknown: {
+    steps: [
+      "Abre los permisos de este sitio en tu navegador.",
+      "Cambia el micr\xF3fono a \xABPermitir\xBB.",
+      "Recarga la p\xE1gina."
+    ]
+  }
+};
+function unblockGuide() {
+  const ua = typeof navigator === "undefined" ? "" : navigator.userAgent;
+  return GUIDES[detectBrowser(ua)];
+}
+function MicPrompt({
+  state,
+  onRequest
+}) {
+  if (state === "unsupported") {
+    return /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-state": state, "data-tone": "danger", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(MicOff, { size: 22 }) }),
+      /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", children: "Llamadas no disponibles" }),
+      /* @__PURE__ */ jsx("p", { children: "Este navegador no admite llamadas. Prueba con Chrome, Edge o Firefox." })
+    ] });
+  }
+  if (state === "denied") {
+    const guide = unblockGuide();
+    return /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-state": state, "data-tone": "danger", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(MicOff, { size: 22 }) }),
+      /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", children: "Micr\xF3fono bloqueado" }),
+      /* @__PURE__ */ jsx("p", { children: "Perm\xEDtelo en tu navegador para poder llamar." }),
+      /* @__PURE__ */ jsxs("details", { className: "cv-help", children: [
+        /* @__PURE__ */ jsxs("summary", { children: [
+          /* @__PURE__ */ jsx(CircleHelp, { size: 13, "aria-hidden": true }),
+          "C\xF3mo permitirlo"
+        ] }),
+        /* @__PURE__ */ jsx("ol", { children: guide.steps.map((step) => /* @__PURE__ */ jsx("li", { children: step }, step)) }),
+        guide.url ? /* @__PURE__ */ jsxs("a", { href: guide.url, target: "_blank", rel: "noreferrer noopener", children: [
+          "Gu\xEDa del navegador",
+          /* @__PURE__ */ jsx(ExternalLink, { size: 11, "aria-hidden": true })
+        ] }) : null
+      ] })
+    ] });
+  }
+  if (state === "warming") {
+    return /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-state": state, children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(Mic, { size: 22 }) }),
+      /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", children: "Permite el micr\xF3fono" }),
+      /* @__PURE__ */ jsx("p", { children: "Acepta el aviso que muestra el navegador para continuar." })
+    ] });
+  }
+  if (state === "checking") {
+    return /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-state": state, children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(Mic, { size: 22 }) }),
+      /* @__PURE__ */ jsx("p", { children: "Preparando el micr\xF3fono\u2026" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-state": state, children: [
+    /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(Mic, { size: 22 }) }),
+    /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", children: "Permite el micr\xF3fono" }),
+    /* @__PURE__ */ jsx("p", { children: "Lo necesitamos para que puedas hablar durante las llamadas." }),
+    /* @__PURE__ */ jsx("button", { className: "cv-btn cv-btn--accent", onClick: onRequest, children: "Permitir micr\xF3fono" })
+  ] });
+}
+function MicPermissionGate({ children }) {
+  const { state, request } = useMicPermission();
+  if (state === "ready") return /* @__PURE__ */ jsx(Fragment, { children });
+  return /* @__PURE__ */ jsx("div", { className: "cv-softphone", children: /* @__PURE__ */ jsx(MicPrompt, { state, onRequest: () => void request() }) });
+}
+
+// src/ui/lib/error-text.ts
+var ERROR_TEXT = {
+  // ── Engine lifecycle ────────────────────────────────────────────────────────
+  // Integrator mistakes rather than user-facing failures, but they must still read as something
+  // rather than as a blank panel if one ever reaches the UI.
+  "engine/duplicate-instance": {
+    title: "Tel\xE9fono duplicado",
+    body: "Hay otro tel\xE9fono abierto en esta p\xE1gina. Cierra uno y vuelve a cargar."
+  },
+  "engine/not-started": { title: "El tel\xE9fono a\xFAn no est\xE1 listo" },
+  "engine/destroyed": {
+    title: "Tel\xE9fono cerrado",
+    body: "Vuelve a cargar la p\xE1gina para usarlo de nuevo."
+  },
+  // ── Auth ────────────────────────────────────────────────────────────────────
+  // Never "token": the user has no idea what one is. What they can act on is the session.
+  "auth/token-fetch-failed": {
+    title: "Sin conexi\xF3n con el servidor",
+    body: "No se ha podido activar el tel\xE9fono. Reint\xE9ntalo en unos segundos."
+  },
+  "auth/token-rejected": {
+    title: "Sesi\xF3n caducada",
+    body: "Vuelve a iniciar sesi\xF3n para poder llamar."
+  },
+  // ── Media ───────────────────────────────────────────────────────────────────
+  // Verbatim from MicPermissionGate, which already says these well and says them first.
+  //
+  // NEVER ACTUALLY SHOWN via this table — these four codes (through `media/playback-blocked`, below)
+  // are never raised as a `SoftphoneError` at all. See the fuller comment on each in `core/errors.ts`
+  // for why. Copy kept here anyway so the catalogue and this file stay the same shape as every other
+  // code — `error-text.test.ts` would fail the build the moment they drifted.
+  "media/permission-denied": {
+    title: "Micr\xF3fono bloqueado",
+    body: "Perm\xEDtelo en tu navegador para poder llamar."
+  },
+  "media/no-input-device": {
+    title: "Sin micr\xF3fono",
+    body: "Conecta un micr\xF3fono y vuelve a intentarlo."
+  },
+  "media/webrtc-unsupported": {
+    title: "Llamadas no disponibles",
+    body: "Este navegador no admite llamadas. Prueba con Chrome, Edge o Firefox."
+  },
+  "media/playback-blocked": { title: "Toca la pantalla para activar el sonido" },
+  // ── Network / signalling ────────────────────────────────────────────────────
+  // "Centralita" rather than "SIP" or "registro": the user knows what a phone system is.
+  "net/registration-failed": {
+    title: "No se pudo conectar",
+    body: "No hemos podido conectar con la centralita. Reintenta en unos segundos."
+  },
+  "net/transport-failed": {
+    title: "Conexi\xF3n perdida",
+    body: "Se ha perdido la conexi\xF3n con la centralita."
+  },
+  // NEVER ACTUALLY SHOWN either — CallScreen's own "Reconectando…" already covers this, off the
+  // call's `reconnecting` state rather than this channel. See the comment in `core/errors.ts`.
+  "net/ice-failed": { title: "Recuperando el audio\u2026" },
+  // ── Call ────────────────────────────────────────────────────────────────────
+  /*
+      THE VOICE RULE FOR THIS BLOCK: say what HAPPENED, not what it is called.
+  
+      These were status labels — "Llamada perdida", "Llamada rechazada", "Sin respuesta". Each is a
+      name for a category rather than an account of an event, which is why they read as a database enum
+      someone forgot to translate into human. Worse, a label hides the ACTOR: "Llamada rechazada" never
+      says who rejected what, so the user reading it after declining a call and the user reading it
+      after being declined see the same three words.
+  
+      So each one is a short sentence about what the other person, or the phone, did — the form
+      `call/busy` already had, and the reason it was the only one here that read clearly.
+  
+      Impersonal third-person plural ("contestaron", "colgaron") throughout: the user does not know who
+      is at the other end, and it is what Spanish uses when the subject is unknown. Mixing it with the
+      singular across neighbouring lines reads as carelessness.
+  
+      LENGTH IS A HARD CONSTRAINT, not a preference. `.cv-dial-outcome` is one line at a fixed
+      `1.15rem`, and the keypad below it is `flex: 1` — a title that wraps resizes every key and shifts
+      the grid under a finger already reaching for it. `error-text.test.ts` caps this at 48 characters.
+    */
+  "call/not-answerable": { title: "Esa llamada ya ha terminado" },
+  /*
+    NOT "Comunicando", which is what this said and what sent us looking. SIP 486 is both "the line is
+    engaged" AND what almost every endpoint sends when a person presses decline — including our own
+    `reject()`. One code, two events, no way to tell them apart, so the copy has to hold both rather
+    than assert the less likely one. `call/rejected` can be definite: an endpoint sending 603 Decline
+    means exactly that.
+  */
+  "call/busy": { title: "No contestaron o la l\xEDnea estaba ocupada" },
+  "call/no-answer": { title: "No contestaron" },
+  "call/rejected": { title: "No aceptaron tu llamada" },
+  /*
+    The legacy CRM said "La persona que llamaba colgó antes de que pudieras contestar." — the right
+    fact, at three times the width of the line that has to hold it. This keeps the fact and drops the
+    words: the user needs to know the call was FOR them and that nobody is waiting on the line.
+    "Llamada perdida" alone tested badly for exactly the label reason above — it names the category
+    without saying anyone rang.
+  */
+  "call/missed": { title: "Colgaron antes de que pudieras contestar" },
+  // "No se pudo completar la llamada" was our own "something went wrong": true of every failure and
+  // useful for none. The number is what the user can actually act on.
+  "call/failed": { title: "No se pudo conectar con ese n\xFAmero" },
+  // The load-bearing half is the SECOND sentence: the original call is still up, and a user who
+  // thinks they dropped it will hang up on a client to "fix" it.
+  "call/transfer-failed": { title: "No se pudo transferir. Sigues en la llamada" },
+  "call/unsupported": { title: "Esta funci\xF3n no est\xE1 disponible" },
+  // ── Provider ────────────────────────────────────────────────────────────────
+  "provider/provision-failed": {
+    title: "No se pudo activar el tel\xE9fono",
+    body: "Si el problema contin\xFAa, contacta con soporte."
+  }
+};
+function ErrorGate({
+  error,
+  onRetry
+}) {
+  const text = ERROR_TEXT[error.code];
+  return (
+    /*
+          `part` on all four, because this is the most intrusive thing the SDK draws — it replaces the
+          whole dialpad — and inside `<coventia-softphone>` a shadow root makes it otherwise unreachable
+          from the host's CSS. Custom properties alone only let a host recolour what we chose to draw.
+    
+          `data-code` is NOT a substitute: it is inside the shadow root, so `[data-code=…]` selectors
+          cannot cross the boundary either. It stays for the light-DOM `/ui` path and for debugging.
+        */
+    /* @__PURE__ */ jsxs("div", { className: "cv-gate", "data-tone": "danger", "data-code": error.code, part: "error-gate", children: [
+      /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(TriangleAlert, { size: 22 }) }),
+      /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", part: "error-title", children: text.title }),
+      text.body === void 0 ? null : /* @__PURE__ */ jsx("p", { part: "error-body", children: text.body }),
+      /* @__PURE__ */ jsx("button", { className: "cv-btn cv-btn--accent", onClick: onRetry, part: "error-retry", children: "Reintentar" })
+    ] })
+  );
+}
+function LeaderGate() {
+  return /* @__PURE__ */ jsxs("div", { className: "cv-gate", part: "leader-gate", children: [
+    /* @__PURE__ */ jsx("span", { className: "cv-gate-mark", children: /* @__PURE__ */ jsx(MonitorSmartphone, { size: 22 }) }),
+    /* @__PURE__ */ jsx("h3", { className: "cv-gate-title", part: "leader-title", children: "Tel\xE9fono activo en otra pesta\xF1a" }),
+    /* @__PURE__ */ jsx("p", { part: "leader-body", children: "Solo una pesta\xF1a puede usar el tel\xE9fono a la vez. Cierra la otra para activar esta." })
+  ] });
+}
+var BACKSTOP_MS = 6e3;
+function useCallOutcome() {
+  const softphone = useSoftphone();
+  const [code, setCode] = useState(null);
+  const timer = useRef(void 0);
+  const clear = useCallback(() => {
+    clearTimeout(timer.current);
+    setCode(null);
+  }, []);
+  useEffect(() => {
+    const off = softphone.on("error" /* Error */, (error) => {
+      if (error.fatal) return;
+      clearTimeout(timer.current);
+      setCode(error.code);
+      timer.current = setTimeout(() => setCode(null), BACKSTOP_MS);
+    });
+    return () => {
+      off();
+      clearTimeout(timer.current);
+    };
+  }, [softphone]);
+  useEffect(() => softphone.on("incomingCall" /* IncomingCall */, () => clear()), [softphone, clear]);
+  return {
+    outcome: code === null ? null : { code, text: ERROR_TEXT[code].title },
+    clear
+  };
+}
+
+// src/ui/audio/audio.ts
+var TONE_HZ = 425;
+function createRemoteAudio() {
+  const el = document.createElement("audio");
+  el.autoplay = true;
+  el.style.display = "none";
+  document.body.appendChild(el);
+  return {
+    attach(stream) {
+      el.srcObject = stream;
+      void el.play().catch(() => {
+      });
+    },
+    detach() {
+      el.srcObject = null;
+    },
+    destroy() {
+      el.srcObject = null;
+      el.remove();
+    },
+    async setOutputDevice(deviceId) {
+      if (typeof el.setSinkId !== "function") return;
+      try {
+        await el.setSinkId(deviceId ?? "");
+      } catch {
+      }
+    }
+  };
+}
+var shared = null;
+function sharedContext() {
+  if (shared) return shared;
+  const Ctor = typeof AudioContext !== "undefined" ? AudioContext : globalThis.webkitAudioContext;
+  if (!Ctor) return null;
+  shared = new Ctor();
+  return shared;
+}
+function primeAudio() {
+  const ctx = sharedContext();
+  if (ctx && ctx.state === "suspended") void ctx.resume?.().catch(() => {
+  });
+}
+function playRingtone() {
+  const ctx = sharedContext();
+  if (!ctx) return { stop() {
+  } };
+  const gain = ctx.createGain();
+  gain.gain.value = 0;
+  gain.connect(ctx.destination);
+  const osc = ctx.createOscillator();
+  osc.type = "sine";
+  osc.frequency.value = TONE_HZ;
+  osc.connect(gain);
+  osc.start();
+  const LEVEL = 0.8;
+  const RAMP = 0.02;
+  const burst = (at, dur) => {
+    gain.gain.setValueAtTime(0, at);
+    gain.gain.linearRampToValueAtTime(LEVEL, at + RAMP);
+    gain.gain.setValueAtTime(LEVEL, at + dur - RAMP);
+    gain.gain.linearRampToValueAtTime(0, at + dur);
+  };
+  const scheduleCycle = (at) => {
+    burst(at, 0.4);
+    burst(at + 0.6, 0.4);
+    return 3;
+  };
+  const LOOKAHEAD = 0.5;
+  const TICK_MS = 150;
+  const LEAD = 0.08;
+  let stopped = false;
+  let timer = null;
+  let nextAt = 0;
+  const pump = () => {
+    while (nextAt < ctx.currentTime + LOOKAHEAD) nextAt += scheduleCycle(nextAt);
+  };
+  void Promise.resolve(ctx.resume?.()).catch(() => {
+  }).finally(() => {
+    if (stopped) return;
+    nextAt = ctx.currentTime + LEAD;
+    pump();
+    timer = setInterval(pump, TICK_MS);
+  });
+  return {
+    stop() {
+      stopped = true;
+      if (timer) clearInterval(timer);
+      try {
+        osc.stop();
+      } catch {
+      }
+      try {
+        gain.disconnect();
+      } catch {
+      }
+    }
+  };
+}
+function playCallEndedTone() {
+  const ctx = sharedContext();
+  if (!ctx) return;
+  const gain = ctx.createGain();
+  gain.gain.value = 0;
+  gain.connect(ctx.destination);
+  const osc = ctx.createOscillator();
+  osc.type = "sine";
+  osc.frequency.value = TONE_HZ;
+  osc.connect(gain);
+  osc.start();
+  const LEVEL = 0.55;
+  const RAMP = 8e-3;
+  const BEEP = 0.25;
+  void Promise.resolve(ctx.resume?.()).catch(() => {
+  }).finally(() => {
+    const at = ctx.currentTime + 0.02;
+    gain.gain.setValueAtTime(0, at);
+    gain.gain.linearRampToValueAtTime(LEVEL, at + RAMP);
+    gain.gain.setValueAtTime(LEVEL, at + BEEP - RAMP);
+    gain.gain.linearRampToValueAtTime(0, at + BEEP);
+    const totalMs = (at + BEEP - ctx.currentTime) * 1e3;
+    setTimeout(() => {
+      try {
+        osc.stop();
+      } catch {
+      }
+      try {
+        gain.disconnect();
+      } catch {
+      }
+    }, totalMs);
+  });
+}
+var ringbackUrl = null;
+function ringbackSource() {
+  if (ringbackUrl) return ringbackUrl;
+  const sampleRate = 48e3;
+  const channels = 2;
+  const bytesPerSample = 2;
+  const amp = 0.5;
+  const toneSec = 1.5;
+  const silenceSec = 3;
+  const totalFrames = Math.round((toneSec + silenceSec) * sampleRate);
+  const toneFrames = Math.round(toneSec * sampleRate);
+  const ramp = Math.round(0.02 * sampleRate);
+  const blockAlign = channels * bytesPerSample;
+  const dataSize = totalFrames * blockAlign;
+  const buffer = new ArrayBuffer(44 + dataSize);
+  const view = new DataView(buffer);
+  const str = (off, s) => {
+    for (let i = 0; i < s.length; i++) view.setUint8(off + i, s.charCodeAt(i));
+  };
+  str(0, "RIFF");
+  view.setUint32(4, 36 + dataSize, true);
+  str(8, "WAVE");
+  str(12, "fmt ");
+  view.setUint32(16, 16, true);
+  view.setUint16(20, 1, true);
+  view.setUint16(22, channels, true);
+  view.setUint32(24, sampleRate, true);
+  view.setUint32(28, sampleRate * blockAlign, true);
+  view.setUint16(32, blockAlign, true);
+  view.setUint16(34, bytesPerSample * 8, true);
+  str(36, "data");
+  view.setUint32(40, dataSize, true);
+  for (let i = 0; i < totalFrames; i++) {
+    let sample = 0;
+    if (i < toneFrames) {
+      let env = 1;
+      if (i < ramp) env = i / ramp;
+      else if (i > toneFrames - ramp) env = Math.max(0, (toneFrames - i) / ramp);
+      sample = Math.sin(2 * Math.PI * TONE_HZ * (i / sampleRate)) * amp * env;
+    }
+    const s16 = Math.round(sample * 32767);
+    const off = 44 + i * blockAlign;
+    for (let c = 0; c < channels; c++) view.setInt16(off + c * bytesPerSample, s16, true);
+  }
+  ringbackUrl = URL.createObjectURL(new Blob([buffer], { type: "audio/wav" }));
+  return ringbackUrl;
+}
+function playRingback() {
+  const el = document.createElement("audio");
+  el.src = ringbackSource();
+  el.loop = true;
+  el.style.display = "none";
+  document.body.appendChild(el);
+  void el.play().catch(() => {
+  });
+  return {
+    stop() {
+      el.pause();
+      el.remove();
+    }
+  };
+}
+
+// src/ui/audio/useCallAudio.ts
+function useCallAudio(enabled) {
+  const softphone = useSoftphone();
+  const remote = useRef(null);
+  const tone = useRef(null);
+  useEffect(() => {
+    if (!enabled || typeof document === "undefined") return;
+    const prime = () => primeAudio();
+    const gestures = ["pointerdown", "keydown"];
+    for (const type of gestures) {
+      document.addEventListener(type, prime, { once: true, capture: true });
+    }
+    remote.current = createRemoteAudio();
+    void remote.current.setOutputDevice(softphone.audio.currentOutputId);
+    const offDeviceChange = softphone.on("deviceChange" /* DeviceChange */, () => {
+      void remote.current?.setOutputDevice(softphone.audio.currentOutputId);
+    });
+    const stopTone = () => {
+      tone.current?.stop();
+      tone.current = null;
+    };
+    const setTone = (next) => {
+      stopTone();
+      if (next === "ringtone") tone.current = playRingtone();
+      else if (next === "ringback") tone.current = playRingback();
+    };
+    const perCall = [];
+    const followedCalls = /* @__PURE__ */ new Set();
+    const follow = (call) => {
+      if (followedCalls.has(call)) return;
+      followedCalls.add(call);
+      let wasConnected = call.state === "active" || call.state === "held";
+      const apply = (state) => {
+        if (state === "active" || state === "held") wasConnected = true;
+        if (state === "ringing") setTone("ringtone");
+        else if (state === "dialing" || state === "early") setTone("ringback");
+        else setTone(null);
+      };
+      apply(call.state);
+      perCall.push(
+        call.on("stateChanged" /* StateChanged */, ({ state }) => apply(state)),
+        // Attach on `active` only — see the note above. `remoteStream` is usually already set by
+        // then, since media arrives before the 200 OK.
+        call.on("accepted" /* Accepted */, () => {
+          if (call.remoteStream) remote.current?.attach(call.remoteStream);
+        }),
+        // …but if it arrives late, take it then — as long as we are past ringing.
+        call.on("remoteStream" /* RemoteStream */, ({ stream }) => {
+          if (call.state === "active" || call.state === "held") remote.current?.attach(stream);
+        }),
+        call.on("ended" /* Ended */, ({ reason }) => {
+          followedCalls.delete(call);
+          stopTone();
+          remote.current?.detach();
+          if (wasConnected && (reason === "local" || reason === "remote")) playCallEndedTone();
+        })
+      );
+    };
+    const offIncoming = softphone.on("incomingCall" /* IncomingCall */, follow);
+    const offActive = softphone.on("activeCallChanged" /* ActiveCallChanged */, ({ call }) => {
+      if (call) follow(call);
+      else {
+        stopTone();
+        remote.current?.detach();
+      }
+    });
+    if (softphone.activeCall) follow(softphone.activeCall);
+    return () => {
+      for (const type of gestures) document.removeEventListener(type, prime, { capture: true });
+      offIncoming();
+      offActive();
+      offDeviceChange();
+      for (const off of perCall) off();
+      stopTone();
+      remote.current?.destroy();
+      remote.current = null;
+    };
+  }, [softphone, enabled]);
+}
+function SoftphoneWidget(props) {
+  const {
+    contacts,
+    history,
+    contactAction,
+    incomingCallAction,
+    className,
+    theme = "system",
+    requireMic = true,
+    sounds = true
+  } = props;
+  const softphone = useSoftphone();
+  const fallback = softphone.sources;
+  const contactsSource = contacts ?? fallback?.contacts;
+  const historySource = history ?? fallback?.history;
+  const [tab, setTab] = useState("dialer");
+  const call = useActiveCall();
+  const isLeader = useIsLeader();
+  const softphoneState = useSoftphoneState();
+  const isFollower = !isLeader && softphoneState === "starting";
+  const mic = useMicPermission();
+  useCallAudio(sounds);
+  const blocked = requireMic && mic.state !== "ready";
+  const fatal = useLastError();
+  const { outcome, clear: clearOutcome } = useCallOutcome();
+  const retry = () => {
+    void (async () => {
+      try {
+        await softphone.stop();
+        await softphone.start();
+      } catch {
+      }
+    })();
+  };
+  const tabs = [
+    { id: "dialer", icon: Grid3x3, label: "Teclado", show: true },
+    { id: "contacts", icon: Users, label: "Contactos", show: !!contactsSource },
+    { id: "history", icon: Clock, label: "Historial", show: !!historySource },
+    // Unlike Contactos/Historial, needs no host-supplied source — a microphone and a speaker are not
+    // optional parts of a phone, so this is never conditionally hidden.
+    { id: "settings", icon: Settings, label: "Ajustes", show: true }
+  ].filter((t) => t.show);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: className ? `cv-softphone ${className}` : "cv-softphone",
+      ...theme === "system" ? {} : { "data-cv-theme": theme },
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "cv-body", children: isFollower ? /* @__PURE__ */ jsx(LeaderGate, {}) : blocked ? /* @__PURE__ */ jsx(MicPrompt, { state: mic.state, onRequest: () => void mic.request() }) : call ? /* @__PURE__ */ jsx(CallScreen, { call, ...incomingCallAction ? { incomingCallAction } : {} }) : fatal ? /* @__PURE__ */ jsx(ErrorGate, { error: fatal, onRetry: retry }) : tab === "contacts" && contactsSource ? /* @__PURE__ */ jsx(ContactsTab, { source: contactsSource, ...contactAction ? { contactAction } : {} }) : tab === "history" && historySource ? /* @__PURE__ */ jsx(HistoryTab, { source: historySource }) : tab === "settings" ? /* @__PURE__ */ jsx(SettingsTab, {}) : /* @__PURE__ */ jsx(Dialpad, { outcome, onIntent: clearOutcome }) }),
+        call || blocked || fatal || isFollower ? null : /* @__PURE__ */ jsx("div", { className: "cv-tabs", role: "tablist", children: tabs.map(({ id, icon: Icon3, label }) => /* @__PURE__ */ jsxs(
+          "button",
+          {
+            role: "tab",
+            "aria-selected": tab === id,
+            className: "cv-tab",
+            onClick: () => setTab(id),
+            children: [
+              /* @__PURE__ */ jsx(Icon3, { size: 20 }),
+              /* @__PURE__ */ jsx("span", { children: label })
+            ]
+          },
+          id
+        )) })
+      ]
+    }
+  );
+}
+/*! Bundled license information:
+
+lucide-react/dist/esm/shared/src/utils.js:
+lucide-react/dist/esm/defaultAttributes.js:
+lucide-react/dist/esm/Icon.js:
+lucide-react/dist/esm/createLucideIcon.js:
+lucide-react/dist/esm/icons/arrow-left-right.js:
+lucide-react/dist/esm/icons/arrow-left.js:
+lucide-react/dist/esm/icons/arrow-right.js:
+lucide-react/dist/esm/icons/calendar-clock.js:
+lucide-react/dist/esm/icons/check.js:
+lucide-react/dist/esm/icons/chevron-down.js:
+lucide-react/dist/esm/icons/chevron-right.js:
+lucide-react/dist/esm/icons/circle-help.js:
+lucide-react/dist/esm/icons/clock.js:
+lucide-react/dist/esm/icons/delete.js:
+lucide-react/dist/esm/icons/external-link.js:
+lucide-react/dist/esm/icons/grid-3x3.js:
+lucide-react/dist/esm/icons/hash.js:
+lucide-react/dist/esm/icons/headphones.js:
+lucide-react/dist/esm/icons/loader-circle.js:
+lucide-react/dist/esm/icons/mic-off.js:
+lucide-react/dist/esm/icons/mic.js:
+lucide-react/dist/esm/icons/monitor-smartphone.js:
+lucide-react/dist/esm/icons/pause.js:
+lucide-react/dist/esm/icons/phone-incoming.js:
+lucide-react/dist/esm/icons/phone-missed.js:
+lucide-react/dist/esm/icons/phone-off.js:
+lucide-react/dist/esm/icons/phone-outgoing.js:
+lucide-react/dist/esm/icons/phone.js:
+lucide-react/dist/esm/icons/play.js:
+lucide-react/dist/esm/icons/search.js:
+lucide-react/dist/esm/icons/settings.js:
+lucide-react/dist/esm/icons/timer.js:
+lucide-react/dist/esm/icons/triangle-alert.js:
+lucide-react/dist/esm/icons/user.js:
+lucide-react/dist/esm/icons/users.js:
+lucide-react/dist/esm/icons/x.js:
+lucide-react/dist/esm/lucide-react.js:
+  (**
+   * @license lucide-react v0.436.0 - ISC
+   *
+   * This source code is licensed under the ISC license.
+   * See the LICENSE file in the root directory of this source tree.
+   *)
+*/
+
+export { CallScreen, ContactsTab, Dialpad, HistoryTab, MicPermissionGate, SoftphoneWidget };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map