@dataemergencia/emergency 0.1.0 → 0.2.0

package/dist/index.cjs

@@ -436,19 +436,16 @@ const copy = {
 	simulateSuccessDetails: "Mensajes enviados",
 	simulateSuccessCompleted: "Proceso completado",
 	feedbackDismiss: "Entendido",
-	errorTitle: "Error",
+	errorTitle: "Ha ocurrido un error",
 	errorText: "Ha ocurrido un error inesperado.",
 	errorDetailInfo: "Revisa la información requerida",
 	errorDetailRetry: "Intenta nuevamente",
 	retry: "Reintentar",
 	geolocationTitle: "No pudimos obtener tu ubicación",
-	geolocationDenied: "Permiso de ubicación denegado. Activa el permiso o llama directamente.",
-	geolocationUnavailable: "Tu ubicación no está disponible en este momento. Llama directamente.",
-	geolocationTimeout: "La ubicación tardó demasiado. Inténtalo de nuevo o llama directamente.",
-	geolocationUnsupported: "Este dispositivo no permite compartir la ubicación. Llama directamente.",
-	fallbackTitle: "Llama directamente",
-	fallbackDescription: "Si no puedes completar la emergencia desde aquí, llama a este número.",
-	fallbackCall: "Llamar",
+	geolocationDenied: "Permiso de ubicación denegado. Habilita el acceso a la ubicación en tu navegador e inténtalo de nuevo.",
+	geolocationUnavailable: "Tu ubicación no está disponible en este momento. Verifica que el GPS esté activado e inténtalo de nuevo.",
+	geolocationTimeout: "La ubicación tardó demasiado. Muévete a un lugar con mejor señal e inténtalo de nuevo.",
+	geolocationUnsupported: "Este dispositivo no permite compartir la ubicación. Inténtalo desde otro navegador o dispositivo.",
 	resumeTitle: "Emergencia Activa Detectada",
 	resumeDescription: "Se ha detectado una emergencia activa en el sistema. Por favor, revisa el estado de la emergencia inmediatamente.",
 	resumeAction: "Abrir Panel de Emergencia",
@@ -990,7 +987,6 @@ function createEmergencyController(deps) {
 				geolocationError: normalized
 			});
 			transition({ kind: "ready" });
-			pushMessage("error", normalized.message);
 			events.emit("emergency:failed", {
 				error: normalized,
 				operation: "geolocation"
@@ -1294,16 +1290,87 @@ function createEmergencyController(deps) {
 				if (!get().snapshot?.active) patch({ simulationConfirmation: true });
 			},
 			cancelSimulationConfirmation: () => patch({ simulationConfirmation: false }),
-			dismissFeedback: () => patch({
-				abortResult: null,
-				simulationResult: null
-			})
+			dismissFeedback: () => {
+				const state = get();
+				patch({
+					abortResult: null,
+					simulationResult: null,
+					geolocationError: null,
+					...state.geolocationError !== null || state.abortResult?.ok === false || state.simulationResult?.ok === false || state.phase.kind === "ready" && state.lastError !== null ? { lastError: null } : {}
+				});
+			}
 		},
 		store,
 		events
 	};
 }
 
+// src/core/fonts.ts
+/**
+* The exact Google Fonts query segment for each family. Family order matters:
+* with every family enabled the generated href is the documented stylesheet
+* URL, byte for byte.
+*/
+const FONT_FAMILY_PARAMS = {
+	googleSans: "family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700",
+	montserrat: "family=Montserrat:ital,wght@0,100..900;1,100..900",
+	poppins: "family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900"
+};
+const FONT_FAMILY_ORDER = [
+	"googleSans",
+	"montserrat",
+	"poppins"
+];
+const FONT_STYLESHEET_BASE = "https://fonts.googleapis.com/css2";
+const FONT_ORIGIN = "https://fonts.googleapis.com";
+const FONT_STATIC_ORIGIN = "https://fonts.gstatic.com";
+/** Marks every link the client injects so repeated mounts stay idempotent. */
+const FONT_LINK_ATTRIBUTE = "data-de-emergency-fonts";
+function normalizeFontLoading(input) {
+	const flags = input?.fonts ?? {};
+	return {
+		load: input?.load ?? true,
+		fonts: {
+			googleSans: flags.googleSans ?? true,
+			montserrat: flags.montserrat ?? true,
+			poppins: flags.poppins ?? true
+		}
+	};
+}
+/**
+* Builds the stylesheet URL for the enabled families, or `null` when the
+* master switch is off or no family is enabled. A disabled family is left out
+* of the request entirely.
+*/
+function buildFontStylesheetHref(input) {
+	const { load, fonts } = normalizeFontLoading(input);
+	if (!load) return null;
+	const params = FONT_FAMILY_ORDER.filter((family) => fonts[family]).map((family) => FONT_FAMILY_PARAMS[family]);
+	if (params.length === 0) return null;
+	return `${FONT_STYLESHEET_BASE}?${params.join("&")}&display=swap`;
+}
+function createFontLink(rel, href, crossorigin = false) {
+	const link = document.createElement("link");
+	link.rel = rel;
+	link.href = href;
+	if (crossorigin) link.crossOrigin = "anonymous";
+	link.setAttribute(FONT_LINK_ATTRIBUTE, "");
+	return link;
+}
+/**
+* Injects the preconnect and stylesheet links the panel needs, once per page.
+* The first successful mount wins: later mounts, including mounts from a
+* duplicated copy of the library, reuse the links already present. The links
+* are page-level assets and are intentionally not removed on `destroy()`.
+*/
+function installEmergencyFonts(input) {
+	if (typeof document === "undefined") return;
+	const href = buildFontStylesheetHref(input);
+	if (href === null) return;
+	if (document.querySelector(`link[${"data-de-emergency-fonts"}]`)) return;
+	(document.head ?? document.documentElement).append(createFontLink("preconnect", FONT_ORIGIN), createFontLink("preconnect", FONT_STATIC_ORIGIN, true), createFontLink("stylesheet", href));
+}
+
 // src/core/config.ts
 const EMERGENCY_CODE_PATTERN = /^[A-Za-z][A-Za-z0-9]{5}$/;
 const LOOPBACK_HOSTS = /* @__PURE__ */ new Set([
@@ -1375,44 +1442,85 @@ function validateConfig(config) {
 			code,
 			locale: config.locale ?? "es",
 			geolocationTimeoutMs: config.geolocationTimeoutMs ?? 8e3,
-			requestTimeoutMs: config.requestTimeoutMs ?? 15e3
+			requestTimeoutMs: config.requestTimeoutMs ?? 15e3,
+			fontLoading: normalizeFontLoading(config.fontLoading)
 		}
 	};
 }
 
-// src/styles/assets/paramedical-mark.tsx
+// src/react/components/icons/paramedical-mark.tsx
 /**
 * Neutral inline illustration used by the idle panel.
 */
 function ParamedicalMark({ className, title }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		version: "1.0",
+		viewBox: "0 0 192 192",
+		width: "192",
+		height: "192",
+		id: "Star of life",
 		className,
-		viewBox: "0 0 96 96",
-		role: "img",
 		"aria-label": title,
-		xmlns: "http://www.w3.org/2000/svg",
 		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-				cx: "48",
-				cy: "48",
-				r: "46",
-				fill: "#ff0000"
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-				cx: "48",
-				cy: "48",
-				r: "37",
-				fill: "#fff"
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("defs", { id: "defs2886" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+				id: "cross",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+					d: "m 74,133 0,52 44,0 0,-52 44,26 22,-38 L 140,96 184,70 162,32 117,58 117,7 74,7 74,58 30,32 8,70 52,96 8,121 30,159 z",
+					id: "outline",
+					style: {
+						fill: "none",
+						stroke: "#3333bb",
+						strokeWidth: 6
+					}
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+					d: "m 74,133 0,52 44,0 0,-52 44,26 22,-38 L 140,96 184,70 162,32 117,58 117,7 74,7 74,58 30,32 8,70 52,96 8,121 30,159 z",
+					id: "inner",
+					style: {
+						fill: "#0000bb",
+						fillRule: "evenodd",
+						stroke: "#ffffff",
+						strokeWidth: 2
+					}
+				})]
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
-				d: "M42 26h12v16h16v12H54v16H42V54H26V42h16z",
-				fill: "#ff0000"
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+				id: "symbols",
+				style: {
+					fill: "#ffffff",
+					fillRule: "evenodd",
+					stroke: "#3333bb",
+					strokeWidth: 2
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+					d: "m 93,166 c 0,7 6,7 6,0 l 3,-138 c 0,-8 -12,-8 -12,0 l 3,135 0,3 z",
+					id: "rod"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+					id: "snake",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						d: "m 100,153 c 7,4 3,15 -3,15 2,-5 3,-9 3,-15 z m 1,-40 c 10,9 4,22 -3,26 -6,3 -6,7 -6,15 -9,-10 -4,-19 4,-24 5,-4 5,-10 5,-17 z m 1,-30 c 0,11 -17,14 -17,22 0,3 1,9 6,12 0,-11 9,-12 15,-18 7,-7 7,-19 -4,-28 0,4 0,8 0,12 z M 90,77 C 80,69 76,55 80,46 c 3,-10 20,-11 20,-3 0,8 -20,3 -13,16 l 3,5 0,13 z",
+						id: "body"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						d: "m 95,43 c 7,-3 -7,-3 0,0 z",
+						id: "eye",
+						style: {
+							fill: "#3333bb",
+							fillRule: "evenodd",
+							stroke: "none"
+						}
+					})]
+				})]
 			})
 		]
 	});
 }
 
 // src/react/components/Icon/index.tsx
+/** Icons whose artwork does not fit the default 24x24 grid need their own canvas. */
+const viewBoxes = { emergency: "0 0 640 640" };
+/** Icons rendered as a solid shape instead of a stroked outline. */
+const filledIcons = /* @__PURE__ */ new Set(["emergency"]);
 const paths = {
 	close: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M6 6l12 12M18 6L6 18" }),
 	"alert-triangle": /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
@@ -1464,21 +1572,18 @@ const paths = {
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 7h.01" })
 	] }),
 	"arrow-left": /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M19 12H5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m12 19-7-7 7-7" })] }),
-	emergency: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 2v6M12 16v6M2 12h6M16 12h6" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-		cx: "12",
-		cy: "12",
-		r: "3"
-	})] })
+	emergency: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M272.5 96C272.5 78.3 286.8 64 304.5 64L336.5 64C354.2 64 368.5 78.3 368.5 96L368.5 236.9L490.5 166.5C505.8 157.7 525.4 162.9 534.2 178.2L550.2 205.9C559 221.2 553.8 240.8 538.5 249.6L416.5 320L538.5 390.4C553.8 399.2 559.1 418.8 550.2 434.1L534.2 461.8C525.4 477.1 505.8 482.4 490.5 473.5L368.5 403.1L368.5 544C368.5 561.7 354.2 576 336.5 576L304.5 576C286.8 576 272.5 561.7 272.5 544L272.5 403.1L150.5 473.5C135.2 482.3 115.6 477.1 106.8 461.8L90.8 434.1C82 418.8 87.2 399.2 102.5 390.4L224.5 320L102.5 249.6C87.2 240.8 82 221.2 90.8 205.9L106.8 178.2C115.6 162.9 135.2 157.7 150.5 166.5L272.5 236.9L272.5 96z" }) })
 };
 function Icon({ name, className, title }) {
+	const stroked = !filledIcons.has(name);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
 		className,
-		viewBox: "0 0 24 24",
-		width: "1em",
-		height: "1em",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "2",
+		viewBox: viewBoxes[name] ?? "0 0 24 24",
+		width: "1rem",
+		height: "1rem",
+		fill: stroked ? "none" : "currentColor",
+		stroke: stroked ? "currentColor" : "none",
+		strokeWidth: stroked ? 2 : void 0,
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		"aria-hidden": title ? void 0 : "true",
@@ -1497,14 +1602,16 @@ var panel_module_default = {
 	"de-emergency-slide-up": "de-emergency-de-emergency-slide-up-kMlO0G",
 	"de-emergency-spin": "de-emergency-de-emergency-spin-kMlO0G",
 	"emergency-confirmation": "de-emergency-emergency-confirmation-kMlO0G",
-	"emergency-confirmation__actions": "de-emergency-emergency-confirmation__actions-kMlO0G",
+	"emergency-confirmation__body": "de-emergency-emergency-confirmation__body-kMlO0G",
 	"emergency-confirmation__button": "de-emergency-emergency-confirmation__button-kMlO0G",
 	"emergency-confirmation__button--cancel": "de-emergency-emergency-confirmation__button--cancel-kMlO0G",
 	"emergency-confirmation__button--confirm": "de-emergency-emergency-confirmation__button--confirm-kMlO0G",
 	"emergency-confirmation__button--danger": "de-emergency-emergency-confirmation__button--danger-kMlO0G",
 	"emergency-confirmation__card": "de-emergency-emergency-confirmation__card-kMlO0G",
-	"emergency-confirmation__card--danger": "de-emergency-emergency-confirmation__card--danger-kMlO0G",
+	"emergency-confirmation__footer": "de-emergency-emergency-confirmation__footer-kMlO0G",
 	"emergency-confirmation__icon": "de-emergency-emergency-confirmation__icon-kMlO0G",
+	"emergency-confirmation__icon--danger": "de-emergency-emergency-confirmation__icon--danger-kMlO0G",
+	"emergency-confirmation__icon--information": "de-emergency-emergency-confirmation__icon--information-kMlO0G",
 	"emergency-confirmation__text": "de-emergency-emergency-confirmation__text-kMlO0G",
 	"emergency-confirmation__title": "de-emergency-emergency-confirmation__title-kMlO0G",
 	"emergency-error-message": "de-emergency-emergency-error-message-kMlO0G",
@@ -1515,10 +1622,6 @@ var panel_module_default = {
 	"emergency-error-message__icon": "de-emergency-emergency-error-message__icon-kMlO0G",
 	"emergency-error-message__text": "de-emergency-emergency-error-message__text-kMlO0G",
 	"emergency-error-message__title": "de-emergency-emergency-error-message__title-kMlO0G",
-	"emergency-fallback": "de-emergency-emergency-fallback-kMlO0G",
-	"emergency-fallback__phone": "de-emergency-emergency-fallback__phone-kMlO0G",
-	"emergency-fallback__text": "de-emergency-emergency-fallback__text-kMlO0G",
-	"emergency-fallback__title": "de-emergency-emergency-fallback__title-kMlO0G",
 	"emergency-feedback": "de-emergency-emergency-feedback-kMlO0G",
 	"emergency-feedback__dismiss": "de-emergency-emergency-feedback__dismiss-kMlO0G",
 	"emergency-panel": "de-emergency-emergency-panel-kMlO0G",
@@ -1550,15 +1653,6 @@ var panel_module_default = {
 	"emergency-status__header": "de-emergency-emergency-status__header-kMlO0G",
 	"emergency-status__loading": "de-emergency-emergency-status__loading-kMlO0G",
 	"emergency-status__loading-text": "de-emergency-emergency-status__loading-text-kMlO0G",
-	"emergency-status__message-icon": "de-emergency-emergency-status__message-icon-kMlO0G",
-	"emergency-status__message-icon--failed": "de-emergency-emergency-status__message-icon--failed-kMlO0G",
-	"emergency-status__message-icon--success": "de-emergency-emergency-status__message-icon--success-kMlO0G",
-	"emergency-status__message-row": "de-emergency-emergency-status__message-row-kMlO0G",
-	"emergency-status__message-row--failed": "de-emergency-emergency-status__message-row--failed-kMlO0G",
-	"emergency-status__message-row--success": "de-emergency-emergency-status__message-row--success-kMlO0G",
-	"emergency-status__message-sent-at": "de-emergency-emergency-status__message-sent-at-kMlO0G",
-	"emergency-status__message-text": "de-emergency-emergency-status__message-text-kMlO0G",
-	"emergency-status__message-text-container": "de-emergency-emergency-status__message-text-container-kMlO0G",
 	"emergency-status__panel": "de-emergency-emergency-status__panel-kMlO0G",
 	"emergency-status__row": "de-emergency-emergency-status__row-kMlO0G",
 	"emergency-status__row-container": "de-emergency-emergency-status__row-container-kMlO0G",
@@ -1569,7 +1663,6 @@ var panel_module_default = {
 	"emergency-status-panel__refresh-icon": "de-emergency-emergency-status-panel__refresh-icon-kMlO0G",
 	"emergency-status-panel__title": "de-emergency-emergency-status-panel__title-kMlO0G",
 	"responder-name": "de-emergency-responder-name-kMlO0G",
-	"sent-at--verified": "de-emergency-sent-at--verified-kMlO0G",
 	"simulacrum-success-message": "de-emergency-simulacrum-success-message-kMlO0G",
 	"simulacrum-success-message__container": "de-emergency-simulacrum-success-message__container-kMlO0G",
 	"simulacrum-success-message__content": "de-emergency-simulacrum-success-message__content-kMlO0G",
@@ -1608,7 +1701,10 @@ function MessageSurface(props) {
 			className: cls(`${prefix}__container`),
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: cls(`${prefix}__icon`),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: icon })
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					name: icon,
+					className: "status-icon"
+				})
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: cls(`${prefix}__content`),
 				children: [
@@ -1656,8 +1752,12 @@ function EmergencyError({ error, onRetry }) {
 	});
 }
 
-// src/react/components/EmergencyFallback/index.tsx
-function errorCopy(error) {
+// src/react/components/EmergencyFeedback/index.tsx
+/** Time the feedback stays on screen before dismissing itself. */
+const FEEDBACK_AUTO_DISMISS_MS = 3e3;
+/** Time the geolocation feedback stays on screen before dismissing itself. */
+const GEOLOCATION_FEEDBACK_AUTO_DISMISS_MS = 5e3;
+function geolocationText(error) {
 	switch (error.code) {
 		case "geolocation_denied": return copy.geolocationDenied;
 		case "geolocation_timeout": return copy.geolocationTimeout;
@@ -1665,34 +1765,35 @@ function errorCopy(error) {
 		default: return copy.geolocationUnavailable;
 	}
 }
-function EmergencyFallback({ fallback, error }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: cls("emergency-fallback"),
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
-				className: cls("emergency-fallback__title"),
-				children: copy.fallbackTitle
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: cls("emergency-fallback__text"),
-				children: errorCopy(error)
-			}),
-			fallback ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
-				className: cls("emergency-fallback__phone"),
-				href: `tel:${fallback.phone.replace(/[^\d+]/g, "")}`,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "message" }), fallback.label]
-			}) : null
-		]
+function EmergencyFeedback({ abortResult, simulationResult, geolocationError, activationError, onDismiss }) {
+	const result = abortResult ?? simulationResult;
+	const feedbackActivationError = result ? null : activationError ?? null;
+	const feedbackGeolocationError = result || feedbackActivationError ? null : geolocationError;
+	if (!result && !feedbackActivationError && !feedbackGeolocationError) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FeedbackSurface, {
+		result,
+		aborting: abortResult !== null,
+		geolocationError: feedbackGeolocationError,
+		activationError: feedbackActivationError,
+		onDismiss
 	});
 }
-
-// src/react/components/EmergencyFeedback/index.tsx
-function EmergencyFeedback({ abortResult, simulationResult, onDismiss }) {
-	const result = abortResult ?? simulationResult;
-	if (!result) return null;
-	const aborting = abortResult !== null;
-	const success = result.ok;
+function FeedbackSurface({ result, aborting, geolocationError, activationError, onDismiss }) {
+	const dismissRef = (0, react.useRef)(onDismiss);
+	(0, react.useEffect)(() => {
+		dismissRef.current = onDismiss;
+	}, [onDismiss]);
+	(0, react.useEffect)(() => {
+		const timeout = setTimeout(() => dismissRef.current(), geolocationError || activationError ? GEOLOCATION_FEEDBACK_AUTO_DISMISS_MS : FEEDBACK_AUTO_DISMISS_MS);
+		return () => clearTimeout(timeout);
+	}, [
+		result?.at,
+		geolocationError,
+		activationError
+	]);
+	const success = result?.ok === true;
 	const title = success ? aborting ? copy.abortSuccessTitle : copy.simulateSuccessTitle : copy.errorTitle;
+	const text = success ? result?.message ?? "" : geolocationError ? geolocationText(geolocationError) : activationError ? activationError.message || copy.errorText : result?.message ?? copy.errorText;
 	const details = success ? aborting ? [{
 		icon: "message",
 		text: copy.abortSuccessDetails
@@ -1713,7 +1814,7 @@ function EmergencyFeedback({ abortResult, simulationResult, onDismiss }) {
 		variant: success ? "success" : "error",
 		icon: success ? "check-circle" : "alert-triangle",
 		title,
-		text: result.message,
+		text,
 		details,
 		className: cls("emergency-feedback"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
@@ -1767,43 +1868,6 @@ function normalizePeriod(dayPeriod) {
 	return /^a/i.test(dayPeriod) ? "am" : "";
 }
 
-// src/react/components/EmergencyMessageRow/index.tsx
-/**
-* Renders one message row per responder.
-*/
-function EmergencyMessageRow({ responder, locale }) {
-	const message = responder.lastMessage;
-	const hasContent = Boolean(message?.content);
-	const modifier = hasContent ? "emergency-status__message-row--success" : "emergency-status__message-row--failed";
-	const iconModifier = hasContent ? "emergency-status__message-icon--success" : "emergency-status__message-icon--failed";
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: cls("emergency-status__message-row", modifier),
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
-			className: cls("emergency-status__message-text-container"),
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-				name: "flag",
-				className: cls("emergency-status__message-icon", iconModifier)
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-				className: cls("emergency-status__message-text"),
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: copy.statusPrefix }),
-					" ",
-					message?.content ?? ""
-				]
-			})]
-		}), message ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
-			className: cls("emergency-status__message-text-container", "sent-at--verified"),
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-				name: "double-check",
-				className: cls("emergency-status__message-icon")
-			}), message.sentAt ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: cls("emergency-status__message-sent-at"),
-				children: formatShortTime(message.sentAt, locale)
-			}) : null]
-		}) : null]
-	});
-}
-
 // src/react/components/StatusIcon/index.tsx
 /**
 * Explicit responder state model:
@@ -1839,10 +1903,10 @@ function StatusCell({ confirmed, timestamp, failed = false, isFailedIcon = false
 
 // src/react/components/ResponderRow/index.tsx
 function ResponderRow({ responder, locale }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: cls("emergency-status__row-container"),
 		"data-responder-id": responder.phone,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: cls("emergency-status__row"),
 			children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -1872,10 +1936,7 @@ function ResponderRow({ responder, locale }) {
 					locale
 				})
 			]
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyMessageRow, {
-			responder,
-			locale
-		})]
+		})
 	});
 }
 
@@ -1953,34 +2014,31 @@ function EmergencyStatusPanel({ responders, refreshing, locale, onRefresh }) {
 
 // src/react/components/EmergencyBody/index.tsx
 function EmergencyBody(props) {
-	const { active, responders, refreshing, loading, locale, geolocationError, error, fallback, abortResult, simulationResult, onRefresh, onRetry, onDismissFeedback } = props;
+	const { active, responders, refreshing, loading, locale, geolocationError, activationError, error, abortResult, simulationResult, onRefresh, onRetry, onDismissFeedback } = props;
+	const showingFeedback = geolocationError !== null || Boolean(activationError) || abortResult !== null || simulationResult !== null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		!loading && !showingFeedback ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: cls("sos-img__container"),
 			id: "sos-img__container",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ParamedicalMark, {
 				className: cls("sos-img"),
 				title: copy.illustrationAlt
 			})
-		}),
-		active ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		}) : null,
+		active || loading || showingFeedback ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: cls("emergency-panel__body-title-container"),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
 				className: cls("emergency-panel__body-title"),
 				children: copy.question
 			})
 		}),
-		active ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyStatusPanel, {
+		active && !showingFeedback ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyStatusPanel, {
 			responders,
 			refreshing,
 			locale,
 			onRefresh
 		}) : null,
 		loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyLoading, {}) : null,
-		geolocationError ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyFallback, {
-			fallback,
-			error: geolocationError
-		}) : null,
 		error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyError, {
 			error,
 			onRetry
@@ -1988,6 +2046,8 @@ function EmergencyBody(props) {
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyFeedback, {
 			abortResult,
 			simulationResult,
+			geolocationError,
+			activationError,
 			onDismiss: onDismissFeedback
 		})
 	] });
@@ -2006,6 +2066,7 @@ function EmergencyConfirmation(props) {
 	if (!open) return null;
 	const title = danger ? copy.abortConfirmTitle : copy.simulateConfirmTitle;
 	const text = danger ? copy.abortConfirmText : copy.simulateConfirmText;
+	const tone = danger ? "danger" : "information";
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: cls("emergency-confirmation"),
 		role: "dialog",
@@ -2013,50 +2074,52 @@ function EmergencyConfirmation(props) {
 		"aria-labelledby": titleId,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			ref: cardRef,
-			className: cls("emergency-confirmation__card", danger && "emergency-confirmation__card--danger"),
-			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: cls("emergency-confirmation__icon"),
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: danger ? "alert-triangle" : "info" })
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
-					className: cls("emergency-confirmation__title"),
-					id: titleId,
-					children: title
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-					className: cls("emergency-confirmation__text"),
-					children: text
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: cls("emergency-confirmation__actions"),
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-						type: "button",
-						className: cls("emergency-confirmation__button", "emergency-confirmation__button--cancel"),
-						onClick: danger ? onCancelAbort : onCancelSimulation,
-						children: danger ? copy.abortCancel : copy.simulateCancel
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-						type: "button",
-						className: cls("emergency-confirmation__button", danger ? "emergency-confirmation__button--danger" : "emergency-confirmation__button--confirm"),
-						onClick: danger ? onConfirmAbort : onConfirmSimulation,
-						children: danger ? copy.abortConfirm : copy.simulateConfirm
-					})]
-				})
-			]
+			className: cls("emergency-confirmation__card"),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: cls("emergency-confirmation__body"),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: cls("emergency-confirmation__icon", `emergency-confirmation__icon--${tone}`),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: danger ? "alert-triangle" : "info" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h5", {
+						className: cls("emergency-confirmation__title"),
+						id: titleId,
+						children: title
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: cls("emergency-confirmation__text"),
+						children: text
+					})
+				]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: cls("emergency-confirmation__footer"),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: cls("emergency-confirmation__button", "emergency-confirmation__button--cancel"),
+					onClick: danger ? onCancelAbort : onCancelSimulation,
+					children: danger ? copy.abortCancel : copy.simulateCancel
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: cls("emergency-confirmation__button", danger ? "emergency-confirmation__button--danger" : "emergency-confirmation__button--confirm"),
+					onClick: danger ? onConfirmAbort : onConfirmSimulation,
+					children: danger ? copy.abortConfirm : copy.simulateConfirm
+				})]
+			})]
 		})
 	});
 }
 
 // src/react/components/EmergencyFooter/index.tsx
 function EmergencyFooter(props) {
-	const { active, busy, aborting, onActivate, onRequestAbort, onRequestSimulation } = props;
+	const { active, busy, aborting, feedbackVisible, onActivate, onRequestAbort, onRequestSimulation } = props;
 	if (active) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("footer", {
 		className: cls("emergency-panel__footer"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 			type: "button",
 			className: cls("emergency-status__abort-btn"),
 			"aria-label": copy.abort,
-			disabled: aborting,
+			disabled: aborting || feedbackVisible,
 			onClick: onRequestAbort,
 			children: [copy.abort, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "alert-triangle" })]
 		})
@@ -2067,14 +2130,14 @@ function EmergencyFooter(props) {
 			type: "button",
 			className: cls("emergency-panel__button", "emergency-panel__button--emergency"),
 			"aria-label": copy.emergencyAria,
-			disabled: busy,
+			disabled: busy || feedbackVisible,
 			onClick: onActivate,
 			children: [copy.emergency, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "emergency" })]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 			type: "button",
 			className: cls("emergency-panel__button", "emergency-panel__button--simulation"),
 			"aria-label": copy.testAria,
-			disabled: busy,
+			disabled: busy || feedbackVisible,
 			onClick: onRequestSimulation,
 			children: [copy.test, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "list-check" })]
 		})]
@@ -2171,9 +2234,10 @@ function useFocusTrap(ref, active) {
 
 // src/react/components/EmergencyPanel/index.tsx
 function EmergencyPanel(props) {
-	const { open, theme, active, busy, aborting, loading, locale, responders, refreshing, geolocationError, error, fallback, abortResult, simulationResult, abortConfirmation, simulationConfirmation, onClose, onActivate, onRefresh, onRetry, onDismissFeedback, onRequestAbort, onRequestSimulation, onCancelAbort, onCancelSimulation, onConfirmAbort, onConfirmSimulation } = props;
+	const { open, theme, active, busy, aborting, loading, locale, responders, refreshing, geolocationError, activationError, error, abortResult, simulationResult, abortConfirmation, simulationConfirmation, onClose, onActivate, onRefresh, onRetry, onDismissFeedback, onRequestAbort, onRequestSimulation, onCancelAbort, onCancelSimulation, onConfirmAbort, onConfirmSimulation } = props;
 	const titleId = (0, react.useId)();
 	const dialogRef = (0, react.useRef)(null);
+	const feedbackVisible = geolocationError !== null || Boolean(activationError) || abortResult !== null || simulationResult !== null;
 	const closeOnEscape = (0, react.useCallback)(() => {
 		onClose("escape");
 	}, [onClose]);
@@ -2204,8 +2268,8 @@ function EmergencyPanel(props) {
 					loading,
 					locale,
 					geolocationError,
+					activationError,
 					error,
-					fallback,
 					abortResult,
 					simulationResult,
 					onRefresh,
@@ -2217,6 +2281,7 @@ function EmergencyPanel(props) {
 				active,
 				busy,
 				aborting,
+				feedbackVisible,
 				onActivate,
 				onRequestAbort,
 				onRequestSimulation
@@ -2320,7 +2385,9 @@ function EmergencyRoot() {
 	const simulationConfirmation = useEmergencyStore((state) => state.simulationConfirmation);
 	const active = snapshot?.active === true;
 	const busy = BUSY_PHASES.includes(phase.kind);
-	const showError = phase.kind === "error" || lastError !== null && geolocationError === null && abortResult === null && simulationResult === null;
+	const feedbackActive = geolocationError !== null || abortResult !== null || simulationResult !== null;
+	const activationError = phase.kind === "ready" && !feedbackActive ? lastError : null;
+	const showError = phase.kind === "error" || lastError !== null && !feedbackActive && activationError === null;
 	const error = phase.kind === "error" ? phase.error : lastError;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmergencyResumeNotification, {
 		resumeAvailable,
@@ -2336,8 +2403,8 @@ function EmergencyRoot() {
 		responders,
 		refreshing: phase.kind === "refreshing",
 		geolocationError,
+		activationError,
 		error: showError ? error : null,
-		fallback: config.fallback ?? null,
 		abortResult,
 		simulationResult,
 		abortConfirmation,
@@ -2462,6 +2529,7 @@ function mount(options) {
 	const validation = validateConfig(options);
 	if (!validation.ok || !validation.config) return reportConfigurationError(validation.error ?? createEmergencyError("configuration", "Invalid emergency configuration."), options);
 	const config = validation.config;
+	installEmergencyFonts(config.fontLoading);
 	const controller = createEmergencyController({ config });
 	const container = document.createElement("div");
 	container.setAttribute("data-de-emergency-container", "");