// Lucide-style line icons, kept simple
const Icon = ({ name, size = 18, stroke = 1.75 }) => {
const props = {
width: size, height: size, viewBox: "0 0 24 24",
fill: "none", stroke: "currentColor", strokeWidth: stroke,
strokeLinecap: "round", strokeLinejoin: "round",
};
const paths = {
box: <>,
layers: <>,
clock: <>,
history: <>,
bell: <>,
volume: <>,
settings: <>,
logout: <>,
refresh: <>,
check: <>,
x: <>,
chevronRight: <>,
arrowRight: <>,
chef: <>,
bag: <>,
user: <>,
phone: <>,
pin: <>,
note: <>,
moon: <>,
sun: <>,
grid: <>,
list: <>,
flame: <>,
eye: <>,
plus: <>,
moto: <>,
card: <>,
money: <>,
printer: <>,
trash: <>,
timer: <>,
play: <>,
truck: <>,
info: <>,
package: <>,
store: <>,
link: <>,
shield: <>,
coffee: <>,
users: <>,
edit: <>,
lock: <>,
save: <>,
chevronDown: <>,
alert: <>,
search: <>,
menu: <>,
tag: <>,
toggleOn: <>,
toggleOff: <>,
volumeOff: <>,
barChart: <>,
calendar: <>,
filter: <>,
download: <>,
ban: <>,
zap: <>,
trendingUp: <>,
};
return ;
};
// ============ Audio Alert System ============
const AudioAlert = (() => {
let audioCtx = null;
let enabled = localStorage.getItem("alertSound") !== "off";
function getCtx() {
if (!audioCtx) {
try { audioCtx = new (window.AudioContext || window.webkitAudioContext)(); }
catch (e) { return null; }
}
// Los navegadores suspenden el contexto sin interacción/al pasar a segundo plano.
// Reanudarlo aquí garantiza que el sonido se reproduzca al llegar un pedido.
if (audioCtx.state === "suspended") audioCtx.resume().catch(() => {});
return audioCtx;
}
function emitTone(ctx, freq, duration, type) {
const osc = ctx.createOscillator();
const gain = ctx.createGain();
osc.connect(gain);
gain.connect(ctx.destination);
osc.type = type;
osc.frequency.value = freq;
const t = ctx.currentTime;
gain.gain.setValueAtTime(0.3, t);
gain.gain.exponentialRampToValueAtTime(0.01, t + duration);
osc.start(t);
osc.stop(t + duration);
}
function playTone(freq, duration, type = "sine") {
if (!enabled) return;
try {
const ctx = getCtx();
if (!ctx) return;
// Si está suspendido, esperar a que reanude antes de emitir (si no, no suena).
if (ctx.state === "suspended") {
ctx.resume().then(() => emitTone(ctx, freq, duration, type)).catch(() => {});
} else {
emitTone(ctx, freq, duration, type);
}
} catch (e) { /* silent fail */ }
}
return {
newOrder() {
// Triple beep: urgent attention sound
playTone(880, 0.15);
setTimeout(() => playTone(880, 0.15), 200);
setTimeout(() => playTone(1100, 0.3), 400);
},
action() {
playTone(660, 0.1);
},
urgent() {
// Rapid double beep for urgent orders
playTone(1000, 0.12, "square");
setTimeout(() => playTone(1200, 0.2, "square"), 150);
},
isEnabled() { return enabled; },
toggle() {
enabled = !enabled;
localStorage.setItem("alertSound", enabled ? "on" : "off");
if (enabled) { playTone(660, 0.1); }
return enabled;
},
// Warm up on first user click (browsers require user gesture)
warmUp() {
try { getCtx(); } catch {}
},
};
})();
// ============ SLA Timer Component ============
const SLATimer = ({ minutes, status }) => {
// SLA thresholds: green < 5min, yellow 5-10min, red > 10min
let level = "sla-ok";
let icon = "clock";
if (status === "ready" || status === "dispatched") {
level = "sla-done";
} else if (minutes >= 15) {
level = "sla-critical";
icon = "flame";
} else if (minutes >= 10) {
level = "sla-danger";
icon = "flame";
} else if (minutes >= 5) {
level = "sla-warn";
icon = "alert";
}
const display = minutes < 60
? `${minutes}m`
: `${Math.floor(minutes/60)}h${minutes%60}m`;
return (
{display}
);
};
window.Icon = Icon;
window.AudioAlert = AudioAlert;
window.SLATimer = SLATimer;