@magicfeedback/popup-sdk 1.4.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/ui/renderPopup.ts"],"sourcesContent":["import {DeepdotsEventType, PopupActions, PopupStyle, FormData} from '../types';\nimport { buildSurveyIdentity } from '../tracking/tracking-manager';\nimport { buildFontFaceCss, buildFontFamilyValue } from './font';\nimport { sdkLog, sdkWarn, sdkError } from '../util/logger';\nimport magicfeedback from \"@magicfeedback/native\";\nimport magicfeedbackCss from '../assets/style.css';\n\n// Inserta la hoja de estilos de MagicFeedback directamente en el popup para garantizar estilos incluso si el bundler no la inyecta globalmente.\nfunction ensureMagicFeedbackStyles(_popup: HTMLElement) {\n const STYLE_ID = 'magicfeedback-sdk-styles';\n if (document.getElementById(STYLE_ID)) return;\n const style = document.createElement('style');\n style.id = STYLE_ID;\n style.textContent = magicfeedbackCss;\n document.head.appendChild(style);\n}\n\n// Añade estilos de spinner si no existen\nfunction ensureSpinnerStyles(_popup: HTMLElement) {\n if (document.getElementById('deepdots-spinner-styles')) return;\n const style = document.createElement('style');\n style.id = 'deepdots-spinner-styles';\n style.textContent = `\n @keyframes ddspin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }\n .mf-spinner { display:flex; justify-content:center; align-items:center; padding:8px 0; }\n .mf-spinner-circle { width:28px; height:28px; border:3px solid #e0e6ed; border-top-color:#1E293B; border-radius:50%; animation: ddspin 0.9s linear infinite; }\n `;\n document.head.appendChild(style);\n}\n\nfunction ensureResponsiveStyles(_popup: HTMLElement) {\n if (document.getElementById('deepdots-responsive-styles')) return;\n const style = document.createElement('style');\n style.id = 'deepdots-responsive-styles';\n style.textContent = `\n /* Responsive adjustments */\n @media (max-width: 640px) {\n .deepdots-popup {\n width: calc(100% - 24px) !important;\n max-width: calc(100% - 24px) !important;\n height: auto !important;\n max-height: 90vh !important;\n border-radius: 12px !important;\n padding: calc(16px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom)) 16px !important;\n box-sizing: border-box;\n }\n .deepdots-popup .mf-spinner-circle { width: 32px; height: 32px; border-width: 4px; }\n .deepdots-popup button { font-size: 16px !important; }\n .deepdots-popup-header button { width:48px; height:48px; }\n .deepdots-popup-header button svg { width:26px; height:26px; }\n .deepdots-popup-footer { flex-direction: column-reverse !important; gap: 12px !important; }\n .deepdots-popup-footer button { width: 100%; }\n }\n @media (max-width: 400px) {\n .deepdots-popup { padding: calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom)) 12px !important; }\n .deepdots-popup-header button { width:48px; height:48px; }\n .deepdots-popup-header button svg { width:26px; height:26px; }\n }\n @media (orientation: landscape) and (max-height: 480px) {\n .deepdots-popup {\n height: 100vh !important;\n max-height: 100vh !important;\n overflow-y: auto !important;\n }\n }\n `;\n document.head.appendChild(style);\n}\n\n// Inyecta (una sola vez) el @font-face de la fuente personalizada.\nfunction ensureFontFace(family: string, url: string) {\n const css = buildFontFaceCss(family, url);\n if (!css) return;\n const STYLE_ID = 'deepdots-font-face';\n let el = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n if (!el) {\n el = document.createElement('style');\n el.id = STYLE_ID;\n document.head.appendChild(el);\n }\n if (el.textContent !== css) el.textContent = css;\n}\n\n/**\n * Renderiza el popup dentro del contenedor dado usando MagicFeedback para la encuesta.\n */\nexport async function renderPopup(\n container: HTMLElement,\n surveyId: string,\n productId: string,\n actions: PopupActions | undefined,\n emit: (type: DeepdotsEventType, surveyId: string, data?: Record<string, unknown>) => void,\n onClose: () => void,\n env: string = 'production',\n userId?: string,\n style?: PopupStyle,\n sessionId?: string,\n miniService?: string,\n analyticsFeedbackSessionId?: string,\n): Promise<void> {\n let surveyCompletedEmitted = false;\n let stylesInjected = false;\n\n const isDark = style?.theme === 'dark';\n const theme = {\n popupBg: isDark ? '#1e1e1e' : '#fff',\n // El popup fija su propio fondo, así que debe fijar también el esquema de color.\n // Sin esto los controles de formulario (input/textarea/select) caen al estilo por\n // defecto del navegador: en un host con `prefers-color-scheme: dark` se pintan\n // oscuros con texto blanco sobre el fondo claro del popup.\n colorScheme: isDark ? 'dark' : 'light',\n textPrimary: isDark ? '#f0f0f0' : '#111',\n closeBtnHoverBg: isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.06)',\n closeBtnHoverColor: isDark ? '#fff' : '#000000',\n };\n\n const positionMap: Record<string, { justifyContent: string; alignItems: string; padding?: string; background: string }> = {\n 'center': { justifyContent: 'center', alignItems: 'center', background: 'rgba(0,0,0,0.5)' },\n 'bottom': { justifyContent: 'center', alignItems: 'flex-end', padding: '16px', background: 'transparent' },\n 'bottom-right': { justifyContent: 'flex-end', alignItems: 'flex-end', padding: '16px', background: 'transparent' },\n 'bottom-left': { justifyContent: 'flex-start', alignItems: 'flex-end', padding: '16px', background: 'transparent' },\n 'top': { justifyContent: 'center', alignItems: 'flex-start', padding: '16px', background: 'transparent' },\n 'top-right': { justifyContent: 'flex-end', alignItems: 'flex-start', padding: '16px', background: 'transparent' },\n 'top-left': { justifyContent: 'flex-start', alignItems: 'flex-start', padding: '16px', background: 'transparent' },\n };\n const pos = positionMap[style?.position ?? 'center'] ?? positionMap['center'];\n\n // Crear popup base\n const popup = document.createElement('div');\n popup.className = 'deepdots-popup';\n popup.style.cssText = `\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n background: ${theme.popupBg};\n color-scheme: ${theme.colorScheme};\n border-radius: 8px;\n padding: 24px;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n max-width: 600px;\n width: 90%;\n min-height: 200px;\n `;\n\n const font = style?.font;\n if (font?.family) {\n const familyValue = buildFontFamilyValue(font.family);\n // El survey vive dentro del contenedor y hereda esta fuente.\n popup.style.fontFamily = familyValue;\n // La variable habilita que el <h2> (Montserrat por defecto) también la use.\n popup.style.setProperty('--deepdots-font', familyValue);\n // Los controles de formulario (button/input/textarea/select) NO heredan\n // font-family por defecto; esta clase activa la regla que los fuerza a heredar.\n popup.classList.add('deepdots-has-font');\n if (font.url) ensureFontFace(font.family, font.url);\n }\n\n // Sección header (solo botón cerrar)\n const header = document.createElement('div');\n header.className = 'deepdots-popup-header';\n header.style.cssText = 'display:flex; justify-content:flex-end; align-items:center; width:100%;';\n\n // Botón de cierre (X)\n const closeBtn = document.createElement('button');\n closeBtn.type = 'button';\n closeBtn.setAttribute('aria-label', 'Close popup');\n closeBtn.innerHTML = `\n <svg width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M6 18L18 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n `;\n closeBtn.style.cssText = `\n background:transparent;\n border:none;\n width:32px;\n height:32px;\n display:flex;\n align-items:center;\n justify-content:center;\n border-radius: 8px;\n cursor:pointer;\n color:${theme.textPrimary};\n padding:4px;\n transition: color .15s ease, transform .15s ease, background .15s ease;\n box-shadow: none !important;\n `;\n closeBtn.onmouseenter = () => {\n closeBtn.style.color = theme.closeBtnHoverColor;\n closeBtn.style.background = theme.closeBtnHoverBg;\n closeBtn.style.transform = 'scale(1.06)';\n };\n closeBtn.onmouseleave = () => {\n closeBtn.style.color = theme.textPrimary;\n closeBtn.style.background = 'transparent';\n closeBtn.style.transform = 'scale(1)';\n };\n closeBtn.onclick = () => {\n emit('popup_clicked', surveyId, {action: 'close_icon'});\n onClose();\n };\n header.appendChild(closeBtn);\n\n ensureMagicFeedbackStyles(popup);\n ensureSpinnerStyles(popup);\n ensureResponsiveStyles(popup);\n\n const containerContent = document.createElement('div');\n containerContent.className = 'deepdots-popup-container-conetent';\n containerContent.style.cssText = `\n display:flex; \n flex-direction:column; \n padding: 0 20px 12px 20px;\n max-height: 80vh; /* límite general del popup */\n overflow: hidden; /* quita scroll del contenedor principal */\n`\n\n // Sección principal (main) - Contenedor formulario + spinner\n const main = document.createElement('div');\n main.className = 'deepdots-popup-main';\n main.style.cssText = 'display:flex; flex-direction:column; width:100%; max-height:80vh; overflow-y:auto;';\n\n const formWrapper = document.createElement('div');\n formWrapper.style.cssText = 'width:100%; flex: 1 1 auto;';\n\n // Contenedor de aviso de error de validación\n const errorHint = document.createElement('div');\n errorHint.className = 'deepdots-error-hint';\n errorHint.style.cssText = `\n display: none;\n margin: 12px 0 0 0;\n padding: 10px 12px;\n border-radius: 6px;\n background: #FEF3C7; /* amber-100 */\n color: #92400E; /* amber-700 */\n border: 1px solid #FCD34D; /* amber-300 */\n font-size: 13px;\n `;\n errorHint.setAttribute('role', 'alert');\n errorHint.setAttribute('aria-live', 'polite');\n\n const spinnerEl = document.createElement('div');\n spinnerEl.className = 'mf-spinner';\n spinnerEl.setAttribute('role', 'status');\n spinnerEl.setAttribute('aria-label', 'Loading survey');\n spinnerEl.innerHTML = '<div class=\"mf-spinner-circle\"></div>';\n spinnerEl.style.cssText = 'position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);';\n\n const formDivId = `magicfeedback-form-${surveyId}`;\n const formHost = document.createElement('div');\n formHost.id = formDivId;\n formHost.style.cssText = 'width:100%; visibility:hidden;';\n\n formWrapper.appendChild(spinnerEl);\n formWrapper.appendChild(formHost);\n main.appendChild(formWrapper);\n // Insertar el hint justo antes del footer\n main.appendChild(errorHint);\n\n // Sección footer (acciones) - botones en extremos\n const footer = document.createElement('div');\n footer.className = 'deepdots-popup-footer';\n footer.setAttribute('data-actions-wrapper', 'true');\n footer.style.cssText = 'display:flex; flex-direction: row-reverse ;justify-content:space-between; align-items:center; gap:8px; margin-top:auto; width:100%; padding-top:16px;';\n\n // Botones\n const backButton = document.createElement('button');\n backButton.textContent = actions?.back ? actions.back.label : 'Back';\n backButton.style.cssText = `\n background: transparent;\n color: #333;\n border: 1px solid #999;\n padding: 12px 24px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 14px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n transition: filter .15s ease;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n `;\n backButton.onmouseenter = () => {\n backButton.style.filter = 'brightness(0.9)';\n }\n backButton.onmouseleave = () => {\n backButton.style.filter = 'brightness(1)';\n }\n backButton.onclick = () => {\n emit('popup_clicked', surveyId, {action: 'back'});\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (formInstance as any)?.back?.();\n };\n\n // Boton start survyes, solo aprece cuando la encuesta empieza con mensaje de inicio\n // Width de 100% para que ocupe todo el espacio disponible\n const startButton = document.createElement('button');\n startButton.textContent = actions?.start ? actions.start.label : 'Start survey';\n startButton.style.cssText = `\n background: #1E293B;\n color: #fff;\n border: none;\n padding: 12px 24px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 14px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n transition: filter .15s ease;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n `;\n startButton.onclick = () => {\n emit('popup_clicked', surveyId, {action: 'start_survey'});\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (formInstance as any)?.startForm?.();\n };\n\n // Botón cerrar popup, solo aparece al terminar la encuesta\n // Width de 100% para que ocupe todo el espacio disponible\n const closeButton = document.createElement('button');\n closeButton.textContent = actions?.complete ? actions.complete.label : 'Complete survey';\n closeButton.style.cssText = `\n background: #1E293B;\n color: #fff;\n border: none;\n padding: 12px 24px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 14px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n transition: filter .15s ease;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n `;\n closeButton.onmouseenter = () => {\n closeButton.style.filter = 'brightness(0.9)';\n }\n closeButton.onmouseleave = () => {\n closeButton.style.filter = 'brightness(1)';\n }\n closeButton.onclick = () => {\n emit('popup_clicked', surveyId, {action: 'complete'});\n onClose();\n };\n\n // Botón send, si es primera pagina ocupara el espacio completo pero si no estara al lado derecho\n const submitButton = document.createElement('button');\n submitButton.textContent = actions?.accept ? actions.accept.label : 'Send';\n submitButton.style.cssText = `\n background: #1E293B;\n color: #fff;\n border: none;\n padding: 12px 24px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 14px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n transition: filter .15s ease;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n `;\n submitButton.onclick = () => {\n if (!surveyCompletedEmitted) {\n emit('popup_clicked', surveyId, {action: 'manual_send'});\n // Dispara envío nativo si existe\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (formInstance as any)?.send?.();\n }\n };\n\n backButton.style.display = 'none';\n startButton.style.display = 'none';\n submitButton.style.display = 'none';\n closeButton.style.display = 'none';\n\n // Insertar botones dentro del footer en orden visual (row-reverse deja primario a la derecha)\n footer.appendChild(submitButton);\n footer.appendChild(backButton);\n footer.appendChild(closeButton);\n footer.appendChild(startButton);\n\n // Añadir footer al main y main al containerContent\n main.appendChild(footer);\n containerContent.appendChild(main);\n\n // Helper para controlar visibilidad de botones según estado\n type ViewState = 'loading' | 'start' | 'in_progress_first' | 'in_progress_next' | 'completed' | 'error';\n\n function updateButtons(state: ViewState) {\n // Por defecto, ocultar todos\n backButton.style.display = 'none';\n startButton.style.display = 'none';\n submitButton.style.display = 'none';\n closeButton.style.display = 'none';\n // Reset widths por estado\n backButton.style.width = '';\n startButton.style.width = '';\n submitButton.style.width = '';\n closeButton.style.width = '';\n\n switch (state) {\n case 'loading':\n // Footer se ocultará desde setLoading\n break;\n case 'start':\n // Solo botón Start a ancho completo\n startButton.style.display = 'inline-flex';\n startButton.style.width = '100%';\n break;\n case 'in_progress_first':\n // Solo botón Send (lado derecho), ancho auto\n submitButton.style.display = 'inline-flex';\n submitButton.style.width = '';\n setLoading(false);\n break;\n case 'in_progress_next':\n // Mostrar Back (izquierda) + Send (derecha)\n backButton.style.display = 'inline-flex';\n submitButton.style.display = 'inline-flex';\n setLoading(false);\n break;\n case 'completed':\n // Mostrar Close/Complete a ancho completo como acción principal\n closeButton.style.display = 'inline-flex';\n closeButton.style.width = '100%';\n setLoading(false);\n break;\n case 'error':\n // En error, permitir cerrar (ancho auto)\n // closeButton.style.display = 'inline-flex';\n setLoading(false);\n break;\n }\n }\n\n // Ensamblar popup\n popup.appendChild(header);\n popup.appendChild(containerContent);\n\n container.innerHTML = '';\n container.appendChild(popup);\n container.style.display = 'flex';\n container.style.justifyContent = pos.justifyContent;\n container.style.alignItems = pos.alignItems;\n container.style.background = pos.background;\n if (pos.padding) container.style.padding = pos.padding;\n\n // Gestión dinámica de loading\n function setLoading(isLoading: boolean) {\n spinnerEl.style.display = isLoading ? 'flex' : 'none';\n if (!isLoading) {\n formHost.style.visibility = 'visible';\n }\n // Ocultar totalmente los botones cuando está cargando\n footer.style.display = isLoading ? 'none' : 'flex';\n // Ajustar estados de los botones por si se muestran\n backButton.disabled = isLoading;\n startButton.disabled = isLoading;\n closeButton.disabled = isLoading;\n submitButton.disabled = isLoading;\n submitButton.style.opacity = isLoading ? '0.6' : '1';\n submitButton.style.cursor = isLoading ? 'not-allowed' : 'pointer';\n // No sobrescribir el estado de botones al finalizar la carga.\n if (isLoading) {\n updateButtons('loading');\n }\n }\n\n // Estado inicial\n setLoading(true);\n\n // Entorno navegador\n if (typeof window === 'undefined' || typeof document === 'undefined') {\n return;\n }\n\n // Referencia instancia formulario\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n let formInstance: any = null;\n\n try {\n if (!magicfeedback || typeof magicfeedback.form !== 'function') {\n sdkWarn('[MagicFeedback] form() no disponible. Fallback manual.');\n setLoading(false);\n return;\n }\n magicfeedback.init({\n debug: true,\n env: env === 'production' ? 'prod' : 'dev'}\n );\n // Contrato Fase 1 §5: profile = identidad del usuario; metadata = contexto de tracking (session_id + user_id)\n const { profile, metadata } = buildSurveyIdentity(userId ?? null, sessionId ?? null, miniService ?? null, analyticsFeedbackSessionId ?? null);\n formInstance = magicfeedback.form(surveyId, productId, profile, metadata);\n\n interface TypedGenerateOptions {\n addButton: boolean;\n getMetaData: boolean;\n onLoadedEvent?: (args: {\n formData: FormData,\n progress?: number, total?: number\n }) => void;\n beforeSubmitEvent?: () => void;\n afterSubmitEvent?: (args: { error?: string, completed: boolean, progress: number, total: number }) => void;\n onBackEvent?: (args: { error?: string, progress: number, total: number, followup: boolean }) => void;\n }\n\n const generateOptions: TypedGenerateOptions = {\n addButton: false,\n getMetaData: true,\n };\n generateOptions.onLoadedEvent = ({formData}) => {\n // Calcular altura disponible y aplicarla al main (restando header + footer + paddings)\n try {\n /*\n const headerHeight = header.getBoundingClientRect().height;\n const footerHeight = footer.getBoundingClientRect().height;\n const paddingY = 48; // 24px top + 24px bottom\n const viewportLimit = window.innerHeight * 0.8; // coincide con max-height del popup\n const available = viewportLimit - headerHeight - footerHeight - paddingY;\n if (available > 120) { // asegurar un mínimo razonable\n main.style.maxHeight = available + 'px';\n } */\n } catch {\n // silencioso\n }\n // Personalización del popup basada en formData.style\n const s = formData?.style;\n if (s && !stylesInjected) {\n stylesInjected = true;\n // Fondo del contenedor popup\n if (s.boxBackgroundColor) {\n popup.style.background = s.boxBackgroundColor;\n }\n // Alineación del contenido principal\n if (s.contentAlign) {\n // 'top' => start, 'center' => center\n main.style.justifyContent = s.contentAlign === 'center' ? 'center' : 'flex-start';\n }\n // Botón primario (submit, start)\n if (s.buttonPrimaryColor) {\n submitButton.style.background = s.buttonPrimaryColor;\n submitButton.style.border = 'none';\n submitButton.style.color = '#fff';\n\n startButton.style.background = s.buttonPrimaryColor;\n startButton.style.border = 'none';\n startButton.style.color = '#fff';\n\n closeButton.style.background = s.buttonPrimaryColor;\n closeButton.style.border = 'none';\n closeButton.style.color = '#fff';\n }\n // Botón secundario (back) — outlined: fondo blanco, letra y borde del color secundario\n if (s.buttonSecondaryColor) {\n backButton.style.background = '#fff';\n backButton.style.color = s.buttonSecondaryColor;\n backButton.style.border = `1px solid ${s.buttonSecondaryColor}`;\n }\n if (s.logo) {\n if (!document.getElementById('deepdots-popup-logo')) {\n // Insertar logo si existe\n const logoImg = document.createElement('img');\n logoImg.id = 'deepdots-popup-logo';\n logoImg.src = s.logo;\n logoImg.alt = 'Logo';\n logoImg.style.cssText = 'max-height:40px; max-width:100%; object-fit:contain;';\n if (s.logoSize) {\n switch (s.logoSize) {\n case 'small':\n logoImg.style.maxHeight = '30px';\n break;\n case 'medium':\n logoImg.style.maxHeight = '50px';\n break;\n case 'large':\n logoImg.style.maxHeight = '70px';\n break;\n }\n }\n if (s.logoPosition) {\n switch (s.logoPosition) {\n case 'left':\n logoImg.style.margin = '0 16px 42px 0';\n logoImg.style.display = 'block';\n logoImg.style.marginLeft = '0';\n break;\n case 'right':\n logoImg.style.margin = '0 0 42px 16px';\n logoImg.style.display = 'block';\n logoImg.style.marginLeft = 'auto';\n break;\n case 'center':\n logoImg.style.margin = '0 auto 42px auto';\n logoImg.style.display = 'block';\n break;\n }\n }\n // Insertar antes del main si no existe ya\n containerContent.insertBefore(logoImg, main);\n }\n }\n\n if (s.startMessage && s.startMessage !== '') {\n // Si hay mensaje de inicio, mostrar botón Start inicialmente\n sdkLog(s.startMessage);\n updateButtons('start');\n } else {\n // Si no hay mensaje de inicio, mostrar estado de primera página (solo Send)\n updateButtons('in_progress_first');\n }\n } else {\n // Sin estilos, asumir primera página normal\n updateButtons('in_progress_first');\n }\n\n emit('popup_clicked', surveyId, {action: 'loaded'});\n setLoading(false); // hace visible el formulario y oculta el spinner\n };\n generateOptions.beforeSubmitEvent = () => {\n setLoading(true);\n emit('popup_clicked', surveyId, {action: 'before_submit'});\n };\n generateOptions.afterSubmitEvent = ({error, completed, total, progress}) => {\n // No cambiar estado de loading aquí; lo gestiona cada transición\n // Normalizar el error a texto seguro\n const errText = error ? (typeof error === 'string' ? error : ((error as unknown as {message?: string}).message ?? String(error))) : '';\n if (errText) {\n // Desactivar loading para que se vean los botones\n setLoading(false);\n // Caso específico: error de pregunta obligatoria\n if (errText.toLowerCase().includes('no response')) {\n errorHint.textContent = 'Please answer the required question to continue.';\n errorHint.style.display = 'block';\n emit('popup_clicked', surveyId, {action: 'validation_error_required'});\n updateButtons('in_progress_next');\n return;\n }\n // Otros errores: mostrar mensaje genérico y permitir cerrar\n errorHint.textContent = 'An error occurred while submitting. Please try again or close the popup.';\n errorHint.style.display = 'block';\n emit('popup_clicked', surveyId, {action: 'submit_error', error: errText});\n // updateButtons('error');\n return;\n }\n // Limpiar hint si no hay error\n errorHint.style.display = 'none';\n setLoading(false);\n if (completed) {\n emit('survey_completed', surveyId, {action: 'completed'});\n surveyCompletedEmitted = true;\n updateButtons('completed');\n return;\n }\n emit('popup_clicked', surveyId, {action: 'partial'});\n if (total > 1 && progress > 0 && progress < total) {\n updateButtons('in_progress_next');\n } else {\n updateButtons('in_progress_first');\n }\n };\n generateOptions.onBackEvent = ({progress}) => {\n emit('popup_clicked', surveyId, {action: 'back'});\n // Si volvemos a la primera página, ocultar Back\n if (progress === 0) {\n updateButtons('in_progress_first');\n } else {\n updateButtons('in_progress_next');\n }\n };\n\n // Ejecutar generación con opciones tipadas\n formInstance.generate(formDivId, generateOptions)\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n .catch((err: any) => {\n sdkError('[MagicFeedback] Error generating form:', err);\n setLoading(false);\n });\n } catch (e) {\n sdkError('[MagicFeedback] Exception initializing form:', e);\n setLoading(false);\n }\n}\n"],"mappings":"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","names":[]}