rampkit-expo-dev 0.0.80 → 0.0.82

package/build/RampkitOverlay.d.ts

@@ -2,8 +2,8 @@ import { RampKitContext, NavigationData } from "./types";
 export declare const injectedHardening = "\n(function(){\n  try {\n    var meta = document.querySelector('meta[name=\"viewport\"]');\n    if (!meta) { meta = document.createElement('meta'); meta.name = 'viewport'; document.head.appendChild(meta); }\n    meta.setAttribute('content','width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover');\n    var style = document.createElement('style');\n    style.textContent='html,body{overflow-x:hidden!important;} html,body,*{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important;-ms-user-select:none!important;touch-action: pan-y;} *{-webkit-tap-highlight-color: rgba(0,0,0,0)!important;} ::selection{background: transparent!important;} ::-moz-selection{background: transparent!important;} a,img{-webkit-user-drag:none!important;user-drag:none!important;-webkit-touch-callout:none!important} input,textarea{caret-color:transparent!important;-webkit-user-select:none!important;user-select:none!important}';\n    document.head.appendChild(style);\n    var prevent=function(e){e.preventDefault&&e.preventDefault();};\n    document.addEventListener('gesturestart',prevent,{passive:false});\n    document.addEventListener('gesturechange',prevent,{passive:false});\n    document.addEventListener('gestureend',prevent,{passive:false});\n    document.addEventListener('dblclick',prevent,{passive:false});\n    document.addEventListener('wheel',function(e){ if(e.ctrlKey) e.preventDefault(); },{passive:false});\n    document.addEventListener('touchmove',function(e){ if(e.scale && e.scale !== 1) e.preventDefault(); },{passive:false});\n    document.addEventListener('selectstart',prevent,{passive:false,capture:true});\n    document.addEventListener('contextmenu',prevent,{passive:false,capture:true});\n    document.addEventListener('copy',prevent,{passive:false,capture:true});\n    document.addEventListener('cut',prevent,{passive:false,capture:true});\n    document.addEventListener('paste',prevent,{passive:false,capture:true});\n    document.addEventListener('dragstart',prevent,{passive:false,capture:true});\n    // Belt-and-suspenders: aggressively clear any attempted selection\n    var clearSel=function(){\n      try{var sel=window.getSelection&&window.getSelection(); if(sel&&sel.removeAllRanges) sel.removeAllRanges();}catch(_){} }\n    document.addEventListener('selectionchange',clearSel,{passive:true,capture:true});\n    document.onselectstart=function(){ clearSel(); return false; };\n    try{ document.documentElement.style.webkitUserSelect='none'; document.documentElement.style.userSelect='none'; }catch(_){ }\n    try{ document.body.style.webkitUserSelect='none'; document.body.style.userSelect='none'; }catch(_){ }\n    var __selTimer = setInterval(clearSel, 160);\n    window.addEventListener('pagehide',function(){ try{ clearInterval(__selTimer); }catch(_){} });\n    // Continuously enforce no-select on all elements and new nodes\n    var enforceNoSelect = function(el){\n      try{\n        el.style && (el.style.webkitUserSelect='none', el.style.userSelect='none', el.style.webkitTouchCallout='none');\n        el.setAttribute && (el.setAttribute('unselectable','on'), el.setAttribute('contenteditable','false'));\n      }catch(_){}\n    }\n    try{\n      var all=document.getElementsByTagName('*');\n      for(var i=0;i<all.length;i++){ enforceNoSelect(all[i]); }\n      var obs = new MutationObserver(function(muts){\n        for(var j=0;j<muts.length;j++){\n          var m=muts[j];\n          if(m.type==='childList'){\n            m.addedNodes && m.addedNodes.forEach && m.addedNodes.forEach(function(n){ if(n && n.nodeType===1){ enforceNoSelect(n); var q=n.getElementsByTagName? n.getElementsByTagName('*'): []; for(var k=0;k<q.length;k++){ enforceNoSelect(q[k]); }}});\n          } else if(m.type==='attributes'){\n            enforceNoSelect(m.target);\n          }\n        }\n      });\n      obs.observe(document.documentElement,{ childList:true, subtree:true, attributes:true, attributeFilter:['contenteditable','style'] });\n    }catch(_){ }\n  } catch(_) {}\n})(); true;\n";
 export declare const injectedNoSelect = "\n(function(){\n  try {\n    if (window.__rkNoSelectApplied) return true;\n    window.__rkNoSelectApplied = true;\n    var style = document.getElementById('rk-no-select-style');\n    if (!style) {\n      style = document.createElement('style');\n      style.id = 'rk-no-select-style';\n      style.innerHTML = \"\n        * {\n          user-select: none !important;\n          -webkit-user-select: none !important;\n          -webkit-touch-callout: none !important;\n        }\n        ::selection {\n          background: transparent !important;\n        }\n      \";\n      document.head.appendChild(style);\n    }\n    var prevent = function(e){ if(e && e.preventDefault) e.preventDefault(); return false; };\n    document.addEventListener('contextmenu', prevent, { passive: false, capture: true });\n    document.addEventListener('selectstart', prevent, { passive: false, capture: true });\n  } catch (_) {}\n  true;\n})();\n";
 export declare const injectedVarsHandler = "\n(function(){\n  try {\n    if (window.__rkVarsHandlerApplied) return true;\n    window.__rkVarsHandlerApplied = true;\n    \n    // Handler function that updates variables and notifies the page\n    window.__rkHandleVarsUpdate = function(vars) {\n      if (!vars || typeof vars !== 'object') return;\n      // Update the global variables object\n      window.__rampkitVariables = vars;\n      // Dispatch a custom event that the page's JS can listen to for re-rendering\n      try {\n        document.dispatchEvent(new CustomEvent('rampkit:vars-updated', { detail: vars }));\n      } catch(e) {}\n      // Also try calling a global handler if the page defined one\n      try {\n        if (typeof window.onRampkitVarsUpdate === 'function') {\n          window.onRampkitVarsUpdate(vars);\n        }\n      } catch(e) {}\n    };\n    \n    // Listen for message events from React Native\n    document.addEventListener('message', function(event) {\n      try {\n        var data = event.data;\n        if (data && data.type === 'rampkit:variables' && data.vars) {\n          window.__rkHandleVarsUpdate(data.vars);\n        }\n      } catch(e) {}\n    }, false);\n    \n    // Also listen on window for compatibility\n    window.addEventListener('message', function(event) {\n      try {\n        var data = event.data;\n        if (data && data.type === 'rampkit:variables' && data.vars) {\n          window.__rkHandleVarsUpdate(data.vars);\n        }\n      } catch(e) {}\n    }, false);\n  } catch (_) {}\n  true;\n})();\n";
-export declare const injectedDynamicTapHandler = "\n(function() {\n    if (window.__rampkitClickInterceptorInstalled) return;\n    window.__rampkitClickInterceptorInstalled = true;\n    \n    // Decode HTML entities\n    function decodeHtml(str) {\n        if (!str) return str;\n        return str.replace(/&quot;/g, '\"').replace(/&#34;/g, '\"').replace(/&#x22;/g, '\"')\n                  .replace(/&apos;/g, \"'\").replace(/&#39;/g, \"'\").replace(/&#x27;/g, \"'\")\n                  .replace(/&lt;/g, '<').replace(/&gt;/g, '>').replace(/&amp;/g, '&');\n    }\n    \n    // Find dynamic tap config on element or ancestors\n    function findDynamicTap(el) {\n        var current = el;\n        var depth = 0;\n        var attrNames = ['data-tap-dynamic', 'data-tapdynamic', 'tapDynamic', 'data-dynamic-tap'];\n        while (current && current !== document.body && current !== document.documentElement && depth < 20) {\n            if (current.getAttribute) {\n                for (var i = 0; i < attrNames.length; i++) {\n                    var attr = current.getAttribute(attrNames[i]);\n                    if (attr && attr.length > 2) {\n                        return { element: current, config: attr };\n                    }\n                }\n                if (current.dataset && current.dataset.tapDynamic) {\n                    return { element: current, config: current.dataset.tapDynamic };\n                }\n            }\n            current = current.parentElement;\n            depth++;\n        }\n        return null;\n    }\n    \n    // Get variables for condition evaluation - check ALL possible sources\n    function getVars() {\n        var vars = {};\n        if (window.__rampkitVariables) {\n            Object.keys(window.__rampkitVariables).forEach(function(k) {\n                vars[k] = window.__rampkitVariables[k];\n            });\n        }\n        if (window.__rampkitVars) {\n            Object.keys(window.__rampkitVars).forEach(function(k) {\n                vars[k] = window.__rampkitVars[k];\n            });\n        }\n        if (window.RK_VARS) {\n            Object.keys(window.RK_VARS).forEach(function(k) {\n                vars[k] = window.RK_VARS[k];\n            });\n        }\n        return vars;\n    }\n    \n    // Evaluate a single rule\n    function evalRule(rule, vars) {\n        if (!rule || !rule.key) return false;\n        var left = vars[rule.key];\n        var right = rule.value;\n        var op = rule.op || '=';\n        if (left === undefined || left === null) left = '';\n        if (right === undefined || right === null) right = '';\n        var leftStr = String(left);\n        var rightStr = String(right);\n        var result = false;\n        switch (op) {\n            case '=': case '==': result = leftStr === rightStr; break;\n            case '!=': case '<>': result = leftStr !== rightStr; break;\n            case '>': result = parseFloat(left) > parseFloat(right); break;\n            case '<': result = parseFloat(left) < parseFloat(right); break;\n            case '>=': result = parseFloat(left) >= parseFloat(right); break;\n            case '<=': result = parseFloat(left) <= parseFloat(right); break;\n            default: result = false;\n        }\n        return result;\n    }\n    \n    // Evaluate all rules (AND logic)\n    function evalRules(rules, vars) {\n        if (!rules || !rules.length) return true;\n        for (var i = 0; i < rules.length; i++) {\n            if (!evalRule(rules[i], vars)) return false;\n        }\n        return true;\n    }\n    \n    // Execute an action\n    function execAction(action) {\n        if (!action || !action.type) return;\n        var msg = null;\n        var actionType = action.type.toLowerCase();\n        \n        switch (actionType) {\n            case 'navigate':\n                msg = { type: 'rampkit:navigate', targetScreenId: action.targetScreenId || '__continue__', animation: action.animation || 'fade' };\n                break;\n            case 'continue':\n                msg = { type: 'rampkit:navigate', targetScreenId: '__continue__', animation: action.animation || 'fade' };\n                break;\n            case 'goback':\n                msg = { type: 'rampkit:goBack', animation: action.animation || 'fade' };\n                break;\n            case 'close':\n                msg = { type: 'rampkit:close' };\n                break;\n            case 'haptic':\n                msg = { type: 'rampkit:haptic', hapticType: action.hapticType || 'impact', impactStyle: action.impactStyle || 'Medium', notificationType: action.notificationType };\n                break;\n            case 'showpaywall':\n                msg = { type: 'rampkit:show-paywall', payload: action.payload || { paywallId: action.paywallId } };\n                break;\n            case 'requestreview':\n                msg = { type: 'rampkit:request-review' };\n                break;\n            case 'requestnotificationpermission':\n                msg = { type: 'rampkit:request-notification-permission' };\n                break;\n            case 'onboardingfinished':\n                msg = { type: 'rampkit:onboarding-finished', payload: action.payload };\n                break;\n            case 'setvariable':\n            case 'setstate':\n            case 'updatevariable':\n            case 'set':\n            case 'assign':\n                var varKey = action.key || action.variableName || action.name || action.variable;\n                var varValue = action.variableValue !== undefined ? action.variableValue :\n                               action.value !== undefined ? action.value :\n                               action.newValue !== undefined ? action.newValue : undefined;\n                if (varKey && varValue !== undefined) {\n                    if (window.__rampkitVariables) window.__rampkitVariables[varKey] = varValue;\n                    if (window.__rampkitVars) window.__rampkitVars[varKey] = varValue;\n                    var updateVars = {};\n                    updateVars[varKey] = varValue;\n                    msg = { type: 'rampkit:variables', vars: updateVars };\n                }\n                break;\n        }\n        if (msg) {\n            try {\n                if (window.ReactNativeWebView && window.ReactNativeWebView.postMessage) {\n                    window.ReactNativeWebView.postMessage(JSON.stringify(msg));\n                }\n            } catch(e) {}\n        }\n    }\n    \n    // Evaluate dynamic tap config\n    function evalDynamicTap(config) {\n        if (!config || !config.values) return false;\n        var vars = getVars();\n        var conditions = config.values;\n        for (var i = 0; i < conditions.length; i++) {\n            var cond = conditions[i];\n            var condType = cond.conditionType || 'if';\n            var rules = cond.rules || [];\n            var actions = cond.actions || [];\n            if (condType === 'else' || evalRules(rules, vars)) {\n                for (var j = 0; j < actions.length; j++) {\n                    execAction(actions[j]);\n                }\n                return true;\n            }\n        }\n        return false;\n    }\n    \n    // Click interceptor - capture phase, runs BEFORE onclick handlers\n    function interceptClick(event) {\n        var result = findDynamicTap(event.target);\n        if (!result) return;\n        \n        try {\n            var configStr = decodeHtml(result.config);\n            var config = JSON.parse(configStr);\n            var handled = evalDynamicTap(config);\n            if (handled) {\n                event.stopImmediatePropagation();\n                event.preventDefault();\n                return false;\n            }\n        } catch (e) {\n            console.log('[RampKit] Dynamic tap error:', e);\n        }\n    }\n    \n    // Install interceptor on window in capture phase\n    window.addEventListener('click', interceptClick, true);\n})();\n";
-export declare const injectedButtonAnimations = "\n(function(){\n  try {\n    if (window.__rkButtonAnimApplied) return true;\n    window.__rkButtonAnimApplied = true;\n    \n    var pressed = null;\n    var pressedOriginalTransform = '';\n    var pressedOriginalOpacity = '';\n    var pressedOriginalTransition = '';\n    var releaseTimer = null;\n    \n    // Find interactive element - very permissive, looks for any clickable-looking element\n    function findInteractive(el) {\n      var current = el;\n      for (var i = 0; i < 20 && current && current !== document.body && current !== document.documentElement; i++) {\n        if (!current || !current.tagName) { current = current.parentElement; continue; }\n        var tag = current.tagName.toLowerCase();\n        \n        // Skip tiny elements (likely icons inside buttons)\n        var rect = current.getBoundingClientRect();\n        if (rect.width < 20 || rect.height < 20) { current = current.parentElement; continue; }\n        \n        // Match standard interactive elements\n        if (tag === 'button' || tag === 'a' || tag === 'input' || tag === 'select') return current;\n        \n        // Match elements with any data attribute containing action/navigate/tap/click\n        var attrs = current.attributes;\n        if (attrs) {\n          for (var j = 0; j < attrs.length; j++) {\n            var attrName = attrs[j].name.toLowerCase();\n            if (attrName.indexOf('click') !== -1 || attrName.indexOf('tap') !== -1 || \n                attrName.indexOf('action') !== -1 || attrName.indexOf('navigate') !== -1 ||\n                attrName.indexOf('press') !== -1) {\n              return current;\n            }\n          }\n        }\n        \n        // Match elements with onclick\n        if (current.onclick || current.hasAttribute('onclick')) return current;\n        \n        // Match elements with role=\"button\" or tabindex\n        if (current.getAttribute('role') === 'button') return current;\n        \n        // Match any element with an ID containing button/btn/cta\n        var id = current.id || '';\n        if (id && (id.toLowerCase().indexOf('button') !== -1 || id.toLowerCase().indexOf('btn') !== -1 || id.toLowerCase().indexOf('cta') !== -1)) return current;\n        \n        // Match elements with button-like classes\n        var className = current.className;\n        if (className && typeof className === 'string') {\n          var cls = className.toLowerCase();\n          if (cls.indexOf('btn') !== -1 || cls.indexOf('button') !== -1 || cls.indexOf('cta') !== -1 || \n              cls.indexOf('clickable') !== -1 || cls.indexOf('tappable') !== -1 || cls.indexOf('pressable') !== -1) {\n            return current;\n          }\n        }\n        \n        // Match elements with cursor pointer\n        try {\n          var computed = window.getComputedStyle(current);\n          if (computed && computed.cursor === 'pointer') return current;\n        } catch(e) {}\n        \n        current = current.parentElement;\n      }\n      return null;\n    }\n    \n    function applyPressedStyle(el) {\n      if (!el || !el.style) return;\n      // Save original styles\n      pressedOriginalTransform = el.style.transform || '';\n      pressedOriginalOpacity = el.style.opacity || '';\n      pressedOriginalTransition = el.style.transition || '';\n      // Apply pressed style with inline styles for maximum specificity\n      el.style.transition = 'transform 80ms cubic-bezier(0.25, 0.1, 0.25, 1), opacity 80ms cubic-bezier(0.25, 0.1, 0.25, 1)';\n      el.style.transform = 'scale(0.97)';\n      el.style.opacity = '0.8';\n    }\n    \n    function applyReleasedStyle(el) {\n      if (!el || !el.style) return;\n      // Apply spring-back animation\n      el.style.transition = 'transform 280ms cubic-bezier(0.34, 1.56, 0.64, 1), opacity 280ms cubic-bezier(0.34, 1.56, 0.64, 1)';\n      el.style.transform = pressedOriginalTransform || 'scale(1)';\n      el.style.opacity = pressedOriginalOpacity || '1';\n    }\n    \n    function resetStyle(el) {\n      if (!el || !el.style) return;\n      el.style.transform = pressedOriginalTransform;\n      el.style.opacity = pressedOriginalOpacity;\n      el.style.transition = pressedOriginalTransition;\n    }\n    \n    function onTouchStart(e) {\n      try {\n        var target = findInteractive(e.target);\n        if (!target) return;\n        if (releaseTimer) { clearTimeout(releaseTimer); releaseTimer = null; }\n        if (pressed && pressed !== target) { resetStyle(pressed); }\n        applyPressedStyle(target);\n        pressed = target;\n      } catch(err) {}\n    }\n    \n    function onTouchEnd(e) {\n      try {\n        if (!pressed) return;\n        var t = pressed;\n        applyReleasedStyle(t);\n        releaseTimer = setTimeout(function() {\n          resetStyle(t);\n          releaseTimer = null;\n        }, 300);\n        pressed = null;\n      } catch(err) {}\n    }\n    \n    function onTouchCancel(e) {\n      try {\n        if (!pressed) return;\n        resetStyle(pressed);\n        pressed = null;\n        if (releaseTimer) { clearTimeout(releaseTimer); releaseTimer = null; }\n      } catch(err) {}\n    }\n    \n    // Use capture phase for immediate response before any other handlers\n    document.addEventListener('touchstart', onTouchStart, { passive: true, capture: true });\n    document.addEventListener('touchend', onTouchEnd, { passive: true, capture: true });\n    document.addEventListener('touchcancel', onTouchCancel, { passive: true, capture: true });\n    // Mouse events for testing\n    document.addEventListener('mousedown', onTouchStart, { passive: true, capture: true });\n    document.addEventListener('mouseup', onTouchEnd, { passive: true, capture: true });\n    \n  } catch (err) {}\n  true;\n})();\n";
+export declare const injectedDynamicTapHandler = "\n(function() {\n    if (window.__rampkitClickInterceptorInstalled) return;\n    window.__rampkitClickInterceptorInstalled = true;\n\n    // ========== DEBUG: Screen 19 specific logging (REMOVE AFTER BUG FIX) ==========\n    var isScreen19Dynamic = function() {\n      var screenId = window.__rampkitScreenId || '';\n      var screenIndex = window.__rampkitScreenIndex;\n      return screenId.indexOf('19') !== -1 ||\n             screenId.toLowerCase().indexOf('screen 19') !== -1 ||\n             screenId.toLowerCase().indexOf('screen19') !== -1 ||\n             screenIndex === 19 ||\n             screenIndex === 18;\n    };\n\n    var debugScreen19Dynamic = function(msg, data) {\n      if (isScreen19Dynamic()) {\n        console.log('[SCREEN19-DEBUG][DynamicTap] ' + msg, JSON.stringify(data || {}));\n      }\n    };\n    // ========== END DEBUG ==========\n\n    // Decode HTML entities\n    function decodeHtml(str) {\n        if (!str) return str;\n        return str.replace(/&quot;/g, '\"').replace(/&#34;/g, '\"').replace(/&#x22;/g, '\"')\n                  .replace(/&apos;/g, \"'\").replace(/&#39;/g, \"'\").replace(/&#x27;/g, \"'\")\n                  .replace(/&lt;/g, '<').replace(/&gt;/g, '>').replace(/&amp;/g, '&');\n    }\n\n    // Find dynamic tap config on element or ancestors\n    function findDynamicTap(el) {\n        var current = el;\n        var depth = 0;\n        var attrNames = ['data-tap-dynamic', 'data-tapdynamic', 'tapDynamic', 'data-dynamic-tap'];\n        var searchTrail = []; // DEBUG: Track search path\n\n        while (current && current !== document.body && current !== document.documentElement && depth < 20) {\n            // DEBUG: Build search trail for Screen 19\n            var trailInfo = {\n              depth: depth,\n              tag: current.tagName,\n              id: current.id || '(none)',\n              class: (current.className && typeof current.className === 'string') ? current.className.substring(0,50) : '(none)'\n            };\n            searchTrail.push(trailInfo);\n\n            if (current.getAttribute) {\n                for (var i = 0; i < attrNames.length; i++) {\n                    var attr = current.getAttribute(attrNames[i]);\n                    if (attr && attr.length > 2) {\n                        var rect = current.getBoundingClientRect ? current.getBoundingClientRect() : {};\n                        debugScreen19Dynamic('FOUND data-tap-dynamic', {\n                          attrName: attrNames[i],\n                          depth: depth,\n                          element: trailInfo,\n                          size: rect.width + 'x' + rect.height,\n                          configPreview: attr.substring(0, 100) + '...',\n                          trail: searchTrail\n                        });\n                        return { element: current, config: attr };\n                    }\n                }\n                if (current.dataset && current.dataset.tapDynamic) {\n                    var rect2 = current.getBoundingClientRect ? current.getBoundingClientRect() : {};\n                    debugScreen19Dynamic('FOUND dataset.tapDynamic', {\n                      depth: depth,\n                      element: trailInfo,\n                      size: rect2.width + 'x' + rect2.height,\n                      trail: searchTrail\n                    });\n                    return { element: current, config: current.dataset.tapDynamic };\n                }\n            }\n            current = current.parentElement;\n            depth++;\n        }\n        debugScreen19Dynamic('NO data-tap-dynamic found', { trail: searchTrail });\n        return null;\n    }\n    \n    // Get variables for condition evaluation - check ALL possible sources\n    function getVars() {\n        var vars = {};\n        if (window.__rampkitVariables) {\n            Object.keys(window.__rampkitVariables).forEach(function(k) {\n                vars[k] = window.__rampkitVariables[k];\n            });\n        }\n        if (window.__rampkitVars) {\n            Object.keys(window.__rampkitVars).forEach(function(k) {\n                vars[k] = window.__rampkitVars[k];\n            });\n        }\n        if (window.RK_VARS) {\n            Object.keys(window.RK_VARS).forEach(function(k) {\n                vars[k] = window.RK_VARS[k];\n            });\n        }\n        return vars;\n    }\n    \n    // Evaluate a single rule\n    function evalRule(rule, vars) {\n        if (!rule || !rule.key) return false;\n        var left = vars[rule.key];\n        var right = rule.value;\n        var op = rule.op || '=';\n        if (left === undefined || left === null) left = '';\n        if (right === undefined || right === null) right = '';\n        var leftStr = String(left);\n        var rightStr = String(right);\n        var result = false;\n        switch (op) {\n            case '=': case '==': result = leftStr === rightStr; break;\n            case '!=': case '<>': result = leftStr !== rightStr; break;\n            case '>': result = parseFloat(left) > parseFloat(right); break;\n            case '<': result = parseFloat(left) < parseFloat(right); break;\n            case '>=': result = parseFloat(left) >= parseFloat(right); break;\n            case '<=': result = parseFloat(left) <= parseFloat(right); break;\n            default: result = false;\n        }\n        return result;\n    }\n    \n    // Evaluate all rules (AND logic)\n    function evalRules(rules, vars) {\n        if (!rules || !rules.length) return true;\n        for (var i = 0; i < rules.length; i++) {\n            if (!evalRule(rules[i], vars)) return false;\n        }\n        return true;\n    }\n    \n    // Execute an action\n    function execAction(action) {\n        if (!action || !action.type) return;\n        var msg = null;\n        var actionType = action.type.toLowerCase();\n        \n        switch (actionType) {\n            case 'navigate':\n                msg = { type: 'rampkit:navigate', targetScreenId: action.targetScreenId || '__continue__', animation: action.animation || 'fade' };\n                break;\n            case 'continue':\n                msg = { type: 'rampkit:navigate', targetScreenId: '__continue__', animation: action.animation || 'fade' };\n                break;\n            case 'goback':\n                msg = { type: 'rampkit:goBack', animation: action.animation || 'fade' };\n                break;\n            case 'close':\n                msg = { type: 'rampkit:close' };\n                break;\n            case 'haptic':\n                msg = { type: 'rampkit:haptic', hapticType: action.hapticType || 'impact', impactStyle: action.impactStyle || 'Medium', notificationType: action.notificationType };\n                break;\n            case 'showpaywall':\n                msg = { type: 'rampkit:show-paywall', payload: action.payload || { paywallId: action.paywallId } };\n                break;\n            case 'requestreview':\n                msg = { type: 'rampkit:request-review' };\n                break;\n            case 'requestnotificationpermission':\n                msg = { type: 'rampkit:request-notification-permission' };\n                break;\n            case 'onboardingfinished':\n                msg = { type: 'rampkit:onboarding-finished', payload: action.payload };\n                break;\n            case 'setvariable':\n            case 'setstate':\n            case 'updatevariable':\n            case 'set':\n            case 'assign':\n                var varKey = action.key || action.variableName || action.name || action.variable;\n                var varValue = action.variableValue !== undefined ? action.variableValue :\n                               action.value !== undefined ? action.value :\n                               action.newValue !== undefined ? action.newValue : undefined;\n                if (varKey && varValue !== undefined) {\n                    if (window.__rampkitVariables) window.__rampkitVariables[varKey] = varValue;\n                    if (window.__rampkitVars) window.__rampkitVars[varKey] = varValue;\n                    var updateVars = {};\n                    updateVars[varKey] = varValue;\n                    msg = { type: 'rampkit:variables', vars: updateVars };\n                }\n                break;\n        }\n        if (msg) {\n            try {\n                if (window.ReactNativeWebView && window.ReactNativeWebView.postMessage) {\n                    window.ReactNativeWebView.postMessage(JSON.stringify(msg));\n                }\n            } catch(e) {}\n        }\n    }\n    \n    // Evaluate dynamic tap config\n    function evalDynamicTap(config) {\n        if (!config || !config.values) return false;\n        var vars = getVars();\n        var conditions = config.values;\n        for (var i = 0; i < conditions.length; i++) {\n            var cond = conditions[i];\n            var condType = cond.conditionType || 'if';\n            var rules = cond.rules || [];\n            var actions = cond.actions || [];\n            if (condType === 'else' || evalRules(rules, vars)) {\n                for (var j = 0; j < actions.length; j++) {\n                    execAction(actions[j]);\n                }\n                return true;\n            }\n        }\n        return false;\n    }\n    \n    // Click interceptor - capture phase, runs BEFORE onclick handlers\n    function interceptClick(event) {\n        // ========== DEBUG: Screen 19 click logging ==========\n        if (isScreen19Dynamic()) {\n          var clickX = event.clientX;\n          var clickY = event.clientY;\n          var originalTarget = event.target;\n          var originalRect = originalTarget.getBoundingClientRect ? originalTarget.getBoundingClientRect() : {};\n          console.log('[SCREEN19-DEBUG][Click] Click at (' + clickX + ',' + clickY + ')', JSON.stringify({\n            originalTarget: {\n              tag: originalTarget.tagName,\n              id: originalTarget.id || '(none)',\n              class: (originalTarget.className && typeof originalTarget.className === 'string') ? originalTarget.className.substring(0,100) : '(none)',\n              size: originalRect.width + 'x' + originalRect.height\n            }\n          }));\n        }\n        // ========== END DEBUG ==========\n\n        var result = findDynamicTap(event.target);\n        if (!result) return;\n\n        // ========== DEBUG: Screen 19 - log when dynamic tap is found ==========\n        if (isScreen19Dynamic()) {\n          var rect = result.element.getBoundingClientRect ? result.element.getBoundingClientRect() : {};\n          var screenWidth = window.innerWidth;\n          var screenHeight = window.innerHeight;\n          var isFullScreen = (rect.width >= screenWidth * 0.9 && rect.height >= screenHeight * 0.9);\n          console.log('[SCREEN19-DEBUG][Click] DYNAMIC TAP WILL BE HANDLED', JSON.stringify({\n            element: {\n              tag: result.element.tagName,\n              id: result.element.id || '(none)',\n              class: (result.element.className && typeof result.element.className === 'string') ? result.element.className.substring(0,100) : '(none)',\n              size: rect.width + 'x' + rect.height\n            },\n            isFullScreen: isFullScreen,\n            WARNING: isFullScreen ? 'FULL SCREEN ELEMENT WITH DYNAMIC TAP - THIS IS THE BUG!' : 'normal element'\n          }));\n        }\n        // ========== END DEBUG ==========\n\n        try {\n            var configStr = decodeHtml(result.config);\n            var config = JSON.parse(configStr);\n\n            // ========== DEBUG: Screen 19 - log parsed config ==========\n            if (isScreen19Dynamic()) {\n              console.log('[SCREEN19-DEBUG][Click] Parsed config:', JSON.stringify({\n                hasValues: !!(config && config.values),\n                valuesCount: config && config.values ? config.values.length : 0,\n                firstCondition: config && config.values && config.values[0] ? {\n                  conditionType: config.values[0].conditionType,\n                  rulesCount: config.values[0].rules ? config.values[0].rules.length : 0,\n                  actionsCount: config.values[0].actions ? config.values[0].actions.length : 0\n                } : null\n              }));\n            }\n            // ========== END DEBUG ==========\n\n            var handled = evalDynamicTap(config);\n            if (handled) {\n                debugScreen19Dynamic('Click HANDLED by dynamic tap - event stopped', { handled: true });\n                event.stopImmediatePropagation();\n                event.preventDefault();\n                return false;\n            }\n        } catch (e) {\n            console.log('[RampKit] Dynamic tap error:', e);\n            if (isScreen19Dynamic()) {\n              console.log('[SCREEN19-DEBUG][Click] Dynamic tap parse error:', e.message);\n            }\n        }\n    }\n\n    // Install interceptor on window in capture phase\n    window.addEventListener('click', interceptClick, true);\n})();\n";
+export declare const injectedButtonAnimations = "\n(function(){\n  try {\n    if (window.__rkButtonAnimApplied) return true;\n    window.__rkButtonAnimApplied = true;\n\n    var pressed = null;\n    var pressedOriginalTransform = '';\n    var pressedOriginalOpacity = '';\n    var pressedOriginalTransition = '';\n    var releaseTimer = null;\n\n    // ========== DEBUG: Screen 19 specific logging (REMOVE AFTER BUG FIX) ==========\n    var isScreen19 = function() {\n      // Check multiple ways to identify Screen 19\n      var screenId = window.__rampkitScreenId || '';\n      var screenIndex = window.__rampkitScreenIndex;\n      return screenId.indexOf('19') !== -1 ||\n             screenId.toLowerCase().indexOf('screen 19') !== -1 ||\n             screenId.toLowerCase().indexOf('screen19') !== -1 ||\n             screenIndex === 19 ||\n             screenIndex === 18; // 0-indexed, so screen 19 would be index 18\n    };\n\n    var debugScreen19 = function(msg, data) {\n      if (isScreen19()) {\n        console.log('[SCREEN19-DEBUG][ButtonAnim] ' + msg, JSON.stringify(data || {}));\n      }\n    };\n    // ========== END DEBUG ==========\n\n    // Find interactive element - very permissive, looks for any clickable-looking element\n    function findInteractive(el) {\n      var current = el;\n      var debugTrail = []; // DEBUG: Track search path for Screen 19\n\n      for (var i = 0; i < 20 && current && current !== document.body && current !== document.documentElement; i++) {\n        if (!current || !current.tagName) { current = current.parentElement; continue; }\n        var tag = current.tagName.toLowerCase();\n\n        // Skip tiny elements (likely icons inside buttons)\n        var rect = current.getBoundingClientRect();\n        if (rect.width < 20 || rect.height < 20) { current = current.parentElement; continue; }\n\n        // DEBUG: Build trail for Screen 19\n        var debugInfo = {\n          depth: i,\n          tag: tag,\n          id: current.id || '(none)',\n          class: (current.className && typeof current.className === 'string') ? current.className.substring(0, 100) : '(none)',\n          size: rect.width + 'x' + rect.height\n        };\n        debugTrail.push(debugInfo);\n\n        // Match standard interactive elements\n        if (tag === 'button' || tag === 'a' || tag === 'input' || tag === 'select') {\n          debugScreen19('MATCHED: standard tag', { reason: 'tag=' + tag, element: debugInfo, trail: debugTrail });\n          return current;\n        }\n\n        // Match elements with any data attribute containing action/navigate/tap/click\n        var attrs = current.attributes;\n        if (attrs) {\n          for (var j = 0; j < attrs.length; j++) {\n            var attrName = attrs[j].name.toLowerCase();\n            if (attrName.indexOf('click') !== -1 || attrName.indexOf('tap') !== -1 ||\n                attrName.indexOf('action') !== -1 || attrName.indexOf('navigate') !== -1 ||\n                attrName.indexOf('press') !== -1) {\n              debugScreen19('MATCHED: data-attr', { reason: 'attr=' + attrName, value: attrs[j].value.substring(0,50), element: debugInfo, trail: debugTrail });\n              return current;\n            }\n          }\n        }\n\n        // Match elements with onclick\n        if (current.onclick || current.hasAttribute('onclick')) {\n          debugScreen19('MATCHED: onclick', { element: debugInfo, trail: debugTrail });\n          return current;\n        }\n\n        // Match elements with role=\"button\" or tabindex\n        if (current.getAttribute('role') === 'button') {\n          debugScreen19('MATCHED: role=button', { element: debugInfo, trail: debugTrail });\n          return current;\n        }\n\n        // Match any element with an ID containing button/btn/cta\n        var id = current.id || '';\n        if (id && (id.toLowerCase().indexOf('button') !== -1 || id.toLowerCase().indexOf('btn') !== -1 || id.toLowerCase().indexOf('cta') !== -1)) {\n          debugScreen19('MATCHED: button-like ID', { reason: 'id=' + id, element: debugInfo, trail: debugTrail });\n          return current;\n        }\n\n        // Match elements with button-like classes\n        var className = current.className;\n        if (className && typeof className === 'string') {\n          var cls = className.toLowerCase();\n          if (cls.indexOf('btn') !== -1 || cls.indexOf('button') !== -1 || cls.indexOf('cta') !== -1 ||\n              cls.indexOf('clickable') !== -1 || cls.indexOf('tappable') !== -1 || cls.indexOf('pressable') !== -1) {\n            debugScreen19('MATCHED: button-like class', { reason: 'class=' + className, element: debugInfo, trail: debugTrail });\n            return current;\n          }\n        }\n\n        // Match elements with cursor pointer\n        try {\n          var computed = window.getComputedStyle(current);\n          if (computed && computed.cursor === 'pointer') {\n            debugScreen19('MATCHED: cursor:pointer', { element: debugInfo, trail: debugTrail });\n            return current;\n          }\n        } catch(e) {}\n\n        current = current.parentElement;\n      }\n      debugScreen19('NO MATCH found', { originalTag: el.tagName, trail: debugTrail });\n      return null;\n    }\n    \n    function applyPressedStyle(el) {\n      if (!el || !el.style) return;\n      // Save original styles\n      pressedOriginalTransform = el.style.transform || '';\n      pressedOriginalOpacity = el.style.opacity || '';\n      pressedOriginalTransition = el.style.transition || '';\n      // Apply pressed style with inline styles for maximum specificity\n      el.style.transition = 'transform 80ms cubic-bezier(0.25, 0.1, 0.25, 1), opacity 80ms cubic-bezier(0.25, 0.1, 0.25, 1)';\n      el.style.transform = 'scale(0.97)';\n      el.style.opacity = '0.8';\n    }\n    \n    function applyReleasedStyle(el) {\n      if (!el || !el.style) return;\n      // Apply spring-back animation\n      el.style.transition = 'transform 280ms cubic-bezier(0.34, 1.56, 0.64, 1), opacity 280ms cubic-bezier(0.34, 1.56, 0.64, 1)';\n      el.style.transform = pressedOriginalTransform || 'scale(1)';\n      el.style.opacity = pressedOriginalOpacity || '1';\n    }\n    \n    function resetStyle(el) {\n      if (!el || !el.style) return;\n      el.style.transform = pressedOriginalTransform;\n      el.style.opacity = pressedOriginalOpacity;\n      el.style.transition = pressedOriginalTransition;\n    }\n    \n    function onTouchStart(e) {\n      try {\n        // ========== DEBUG: Screen 19 touch logging ==========\n        if (isScreen19()) {\n          var touchX = e.touches ? e.touches[0].clientX : e.clientX;\n          var touchY = e.touches ? e.touches[0].clientY : e.clientY;\n          var originalTarget = e.target;\n          var originalRect = originalTarget.getBoundingClientRect ? originalTarget.getBoundingClientRect() : {};\n          console.log('[SCREEN19-DEBUG][TouchStart] Touch at (' + touchX + ',' + touchY + ')', JSON.stringify({\n            originalTarget: {\n              tag: originalTarget.tagName,\n              id: originalTarget.id || '(none)',\n              class: (originalTarget.className && typeof originalTarget.className === 'string') ? originalTarget.className.substring(0,100) : '(none)',\n              size: originalRect.width + 'x' + originalRect.height\n            }\n          }));\n        }\n        // ========== END DEBUG ==========\n\n        var target = findInteractive(e.target);\n        if (!target) return;\n\n        // ========== DEBUG: Screen 19 - log what element was found interactive ==========\n        if (isScreen19() && target) {\n          var targetRect = target.getBoundingClientRect();\n          var screenWidth = window.innerWidth;\n          var screenHeight = window.innerHeight;\n          var isFullScreen = (targetRect.width >= screenWidth * 0.9 && targetRect.height >= screenHeight * 0.9);\n          console.log('[SCREEN19-DEBUG][TouchStart] INTERACTIVE ELEMENT FOUND', JSON.stringify({\n            tag: target.tagName,\n            id: target.id || '(none)',\n            class: (target.className && typeof target.className === 'string') ? target.className.substring(0,100) : '(none)',\n            size: targetRect.width + 'x' + targetRect.height,\n            isFullScreen: isFullScreen,\n            WARNING: isFullScreen ? 'FULL SCREEN ELEMENT DETECTED - THIS IS THE BUG!' : 'normal element'\n          }));\n        }\n        // ========== END DEBUG ==========\n\n        if (releaseTimer) { clearTimeout(releaseTimer); releaseTimer = null; }\n        if (pressed && pressed !== target) { resetStyle(pressed); }\n        applyPressedStyle(target);\n        pressed = target;\n      } catch(err) {}\n    }\n    \n    function onTouchEnd(e) {\n      try {\n        if (!pressed) return;\n        var t = pressed;\n        applyReleasedStyle(t);\n        releaseTimer = setTimeout(function() {\n          resetStyle(t);\n          releaseTimer = null;\n        }, 300);\n        pressed = null;\n      } catch(err) {}\n    }\n    \n    function onTouchCancel(e) {\n      try {\n        if (!pressed) return;\n        resetStyle(pressed);\n        pressed = null;\n        if (releaseTimer) { clearTimeout(releaseTimer); releaseTimer = null; }\n      } catch(err) {}\n    }\n    \n    // Use capture phase for immediate response before any other handlers\n    document.addEventListener('touchstart', onTouchStart, { passive: true, capture: true });\n    document.addEventListener('touchend', onTouchEnd, { passive: true, capture: true });\n    document.addEventListener('touchcancel', onTouchCancel, { passive: true, capture: true });\n    // Mouse events for testing\n    document.addEventListener('mousedown', onTouchStart, { passive: true, capture: true });\n    document.addEventListener('mouseup', onTouchEnd, { passive: true, capture: true });\n    \n  } catch (err) {}\n  true;\n})();\n";
 export type ScreenPayload = {
     id: string;
     html: string;

package/build/RampkitOverlay.js

@@ -181,7 +181,25 @@ exports.injectedDynamicTapHandler = `
 (function() {
     if (window.__rampkitClickInterceptorInstalled) return;
     window.__rampkitClickInterceptorInstalled = true;
-    
+
+    // ========== DEBUG: Screen 19 specific logging (REMOVE AFTER BUG FIX) ==========
+    var isScreen19Dynamic = function() {
+      var screenId = window.__rampkitScreenId || '';
+      var screenIndex = window.__rampkitScreenIndex;
+      return screenId.indexOf('19') !== -1 ||
+             screenId.toLowerCase().indexOf('screen 19') !== -1 ||
+             screenId.toLowerCase().indexOf('screen19') !== -1 ||
+             screenIndex === 19 ||
+             screenIndex === 18;
+    };
+
+    var debugScreen19Dynamic = function(msg, data) {
+      if (isScreen19Dynamic()) {
+        console.log('[SCREEN19-DEBUG][DynamicTap] ' + msg, JSON.stringify(data || {}));
+      }
+    };
+    // ========== END DEBUG ==========
+
     // Decode HTML entities
     function decodeHtml(str) {
         if (!str) return str;
@@ -189,27 +207,55 @@ exports.injectedDynamicTapHandler = `
                   .replace(/'/g, "'").replace(/'/g, "'").replace(/'/g, "'")
                   .replace(/&lt;/g, '<').replace(/&gt;/g, '>').replace(/&amp;/g, '&');
     }
-    
+
     // Find dynamic tap config on element or ancestors
     function findDynamicTap(el) {
         var current = el;
         var depth = 0;
         var attrNames = ['data-tap-dynamic', 'data-tapdynamic', 'tapDynamic', 'data-dynamic-tap'];
+        var searchTrail = []; // DEBUG: Track search path
+
         while (current && current !== document.body && current !== document.documentElement && depth < 20) {
+            // DEBUG: Build search trail for Screen 19
+            var trailInfo = {
+              depth: depth,
+              tag: current.tagName,
+              id: current.id || '(none)',
+              class: (current.className && typeof current.className === 'string') ? current.className.substring(0,50) : '(none)'
+            };
+            searchTrail.push(trailInfo);
+
             if (current.getAttribute) {
                 for (var i = 0; i < attrNames.length; i++) {
                     var attr = current.getAttribute(attrNames[i]);
                     if (attr && attr.length > 2) {
+                        var rect = current.getBoundingClientRect ? current.getBoundingClientRect() : {};
+                        debugScreen19Dynamic('FOUND data-tap-dynamic', {
+                          attrName: attrNames[i],
+                          depth: depth,
+                          element: trailInfo,
+                          size: rect.width + 'x' + rect.height,
+                          configPreview: attr.substring(0, 100) + '...',
+                          trail: searchTrail
+                        });
                         return { element: current, config: attr };
                     }
                 }
                 if (current.dataset && current.dataset.tapDynamic) {
+                    var rect2 = current.getBoundingClientRect ? current.getBoundingClientRect() : {};
+                    debugScreen19Dynamic('FOUND dataset.tapDynamic', {
+                      depth: depth,
+                      element: trailInfo,
+                      size: rect2.width + 'x' + rect2.height,
+                      trail: searchTrail
+                    });
                     return { element: current, config: current.dataset.tapDynamic };
                 }
             }
             current = current.parentElement;
             depth++;
         }
+        debugScreen19Dynamic('NO data-tap-dynamic found', { trail: searchTrail });
         return null;
     }
     
@@ -349,23 +395,78 @@ exports.injectedDynamicTapHandler = `
     
     // Click interceptor - capture phase, runs BEFORE onclick handlers
     function interceptClick(event) {
+        // ========== DEBUG: Screen 19 click logging ==========
+        if (isScreen19Dynamic()) {
+          var clickX = event.clientX;
+          var clickY = event.clientY;
+          var originalTarget = event.target;
+          var originalRect = originalTarget.getBoundingClientRect ? originalTarget.getBoundingClientRect() : {};
+          console.log('[SCREEN19-DEBUG][Click] Click at (' + clickX + ',' + clickY + ')', JSON.stringify({
+            originalTarget: {
+              tag: originalTarget.tagName,
+              id: originalTarget.id || '(none)',
+              class: (originalTarget.className && typeof originalTarget.className === 'string') ? originalTarget.className.substring(0,100) : '(none)',
+              size: originalRect.width + 'x' + originalRect.height
+            }
+          }));
+        }
+        // ========== END DEBUG ==========
+
         var result = findDynamicTap(event.target);
         if (!result) return;
-        
+
+        // ========== DEBUG: Screen 19 - log when dynamic tap is found ==========
+        if (isScreen19Dynamic()) {
+          var rect = result.element.getBoundingClientRect ? result.element.getBoundingClientRect() : {};
+          var screenWidth = window.innerWidth;
+          var screenHeight = window.innerHeight;
+          var isFullScreen = (rect.width >= screenWidth * 0.9 && rect.height >= screenHeight * 0.9);
+          console.log('[SCREEN19-DEBUG][Click] DYNAMIC TAP WILL BE HANDLED', JSON.stringify({
+            element: {
+              tag: result.element.tagName,
+              id: result.element.id || '(none)',
+              class: (result.element.className && typeof result.element.className === 'string') ? result.element.className.substring(0,100) : '(none)',
+              size: rect.width + 'x' + rect.height
+            },
+            isFullScreen: isFullScreen,
+            WARNING: isFullScreen ? 'FULL SCREEN ELEMENT WITH DYNAMIC TAP - THIS IS THE BUG!' : 'normal element'
+          }));
+        }
+        // ========== END DEBUG ==========
+
         try {
             var configStr = decodeHtml(result.config);
             var config = JSON.parse(configStr);
+
+            // ========== DEBUG: Screen 19 - log parsed config ==========
+            if (isScreen19Dynamic()) {
+              console.log('[SCREEN19-DEBUG][Click] Parsed config:', JSON.stringify({
+                hasValues: !!(config && config.values),
+                valuesCount: config && config.values ? config.values.length : 0,
+                firstCondition: config && config.values && config.values[0] ? {
+                  conditionType: config.values[0].conditionType,
+                  rulesCount: config.values[0].rules ? config.values[0].rules.length : 0,
+                  actionsCount: config.values[0].actions ? config.values[0].actions.length : 0
+                } : null
+              }));
+            }
+            // ========== END DEBUG ==========
+
             var handled = evalDynamicTap(config);
             if (handled) {
+                debugScreen19Dynamic('Click HANDLED by dynamic tap - event stopped', { handled: true });
                 event.stopImmediatePropagation();
                 event.preventDefault();
                 return false;
             }
         } catch (e) {
             console.log('[RampKit] Dynamic tap error:', e);
+            if (isScreen19Dynamic()) {
+              console.log('[SCREEN19-DEBUG][Click] Dynamic tap parse error:', e.message);
+            }
         }
     }
-    
+
     // Install interceptor on window in capture phase
     window.addEventListener('click', interceptClick, true);
 })();
@@ -378,68 +479,117 @@ exports.injectedButtonAnimations = `
   try {
     if (window.__rkButtonAnimApplied) return true;
     window.__rkButtonAnimApplied = true;
-    
+
     var pressed = null;
     var pressedOriginalTransform = '';
     var pressedOriginalOpacity = '';
     var pressedOriginalTransition = '';
     var releaseTimer = null;
-    
+
+    // ========== DEBUG: Screen 19 specific logging (REMOVE AFTER BUG FIX) ==========
+    var isScreen19 = function() {
+      // Check multiple ways to identify Screen 19
+      var screenId = window.__rampkitScreenId || '';
+      var screenIndex = window.__rampkitScreenIndex;
+      return screenId.indexOf('19') !== -1 ||
+             screenId.toLowerCase().indexOf('screen 19') !== -1 ||
+             screenId.toLowerCase().indexOf('screen19') !== -1 ||
+             screenIndex === 19 ||
+             screenIndex === 18; // 0-indexed, so screen 19 would be index 18
+    };
+
+    var debugScreen19 = function(msg, data) {
+      if (isScreen19()) {
+        console.log('[SCREEN19-DEBUG][ButtonAnim] ' + msg, JSON.stringify(data || {}));
+      }
+    };
+    // ========== END DEBUG ==========
+
     // Find interactive element - very permissive, looks for any clickable-looking element
     function findInteractive(el) {
       var current = el;
+      var debugTrail = []; // DEBUG: Track search path for Screen 19
+
       for (var i = 0; i < 20 && current && current !== document.body && current !== document.documentElement; i++) {
         if (!current || !current.tagName) { current = current.parentElement; continue; }
         var tag = current.tagName.toLowerCase();
-        
+
         // Skip tiny elements (likely icons inside buttons)
         var rect = current.getBoundingClientRect();
         if (rect.width < 20 || rect.height < 20) { current = current.parentElement; continue; }
-        
+
+        // DEBUG: Build trail for Screen 19
+        var debugInfo = {
+          depth: i,
+          tag: tag,
+          id: current.id || '(none)',
+          class: (current.className && typeof current.className === 'string') ? current.className.substring(0, 100) : '(none)',
+          size: rect.width + 'x' + rect.height
+        };
+        debugTrail.push(debugInfo);
+
         // Match standard interactive elements
-        if (tag === 'button' || tag === 'a' || tag === 'input' || tag === 'select') return current;
-        
+        if (tag === 'button' || tag === 'a' || tag === 'input' || tag === 'select') {
+          debugScreen19('MATCHED: standard tag', { reason: 'tag=' + tag, element: debugInfo, trail: debugTrail });
+          return current;
+        }
+
         // Match elements with any data attribute containing action/navigate/tap/click
         var attrs = current.attributes;
         if (attrs) {
           for (var j = 0; j < attrs.length; j++) {
             var attrName = attrs[j].name.toLowerCase();
-            if (attrName.indexOf('click') !== -1 || attrName.indexOf('tap') !== -1 || 
+            if (attrName.indexOf('click') !== -1 || attrName.indexOf('tap') !== -1 ||
                 attrName.indexOf('action') !== -1 || attrName.indexOf('navigate') !== -1 ||
                 attrName.indexOf('press') !== -1) {
+              debugScreen19('MATCHED: data-attr', { reason: 'attr=' + attrName, value: attrs[j].value.substring(0,50), element: debugInfo, trail: debugTrail });
               return current;
             }
           }
         }
-        
+
         // Match elements with onclick
-        if (current.onclick || current.hasAttribute('onclick')) return current;
-        
+        if (current.onclick || current.hasAttribute('onclick')) {
+          debugScreen19('MATCHED: onclick', { element: debugInfo, trail: debugTrail });
+          return current;
+        }
+
         // Match elements with role="button" or tabindex
-        if (current.getAttribute('role') === 'button') return current;
-        
+        if (current.getAttribute('role') === 'button') {
+          debugScreen19('MATCHED: role=button', { element: debugInfo, trail: debugTrail });
+          return current;
+        }
+
         // Match any element with an ID containing button/btn/cta
         var id = current.id || '';
-        if (id && (id.toLowerCase().indexOf('button') !== -1 || id.toLowerCase().indexOf('btn') !== -1 || id.toLowerCase().indexOf('cta') !== -1)) return current;
-        
+        if (id && (id.toLowerCase().indexOf('button') !== -1 || id.toLowerCase().indexOf('btn') !== -1 || id.toLowerCase().indexOf('cta') !== -1)) {
+          debugScreen19('MATCHED: button-like ID', { reason: 'id=' + id, element: debugInfo, trail: debugTrail });
+          return current;
+        }
+
         // Match elements with button-like classes
         var className = current.className;
         if (className && typeof className === 'string') {
           var cls = className.toLowerCase();
-          if (cls.indexOf('btn') !== -1 || cls.indexOf('button') !== -1 || cls.indexOf('cta') !== -1 || 
+          if (cls.indexOf('btn') !== -1 || cls.indexOf('button') !== -1 || cls.indexOf('cta') !== -1 ||
               cls.indexOf('clickable') !== -1 || cls.indexOf('tappable') !== -1 || cls.indexOf('pressable') !== -1) {
+            debugScreen19('MATCHED: button-like class', { reason: 'class=' + className, element: debugInfo, trail: debugTrail });
             return current;
           }
         }
-        
+
         // Match elements with cursor pointer
         try {
           var computed = window.getComputedStyle(current);
-          if (computed && computed.cursor === 'pointer') return current;
+          if (computed && computed.cursor === 'pointer') {
+            debugScreen19('MATCHED: cursor:pointer', { element: debugInfo, trail: debugTrail });
+            return current;
+          }
         } catch(e) {}
-        
+
         current = current.parentElement;
       }
+      debugScreen19('NO MATCH found', { originalTag: el.tagName, trail: debugTrail });
       return null;
     }
     
@@ -472,8 +622,43 @@ exports.injectedButtonAnimations = `
     
     function onTouchStart(e) {
       try {
+        // ========== DEBUG: Screen 19 touch logging ==========
+        if (isScreen19()) {
+          var touchX = e.touches ? e.touches[0].clientX : e.clientX;
+          var touchY = e.touches ? e.touches[0].clientY : e.clientY;
+          var originalTarget = e.target;
+          var originalRect = originalTarget.getBoundingClientRect ? originalTarget.getBoundingClientRect() : {};
+          console.log('[SCREEN19-DEBUG][TouchStart] Touch at (' + touchX + ',' + touchY + ')', JSON.stringify({
+            originalTarget: {
+              tag: originalTarget.tagName,
+              id: originalTarget.id || '(none)',
+              class: (originalTarget.className && typeof originalTarget.className === 'string') ? originalTarget.className.substring(0,100) : '(none)',
+              size: originalRect.width + 'x' + originalRect.height
+            }
+          }));
+        }
+        // ========== END DEBUG ==========
+
         var target = findInteractive(e.target);
         if (!target) return;
+
+        // ========== DEBUG: Screen 19 - log what element was found interactive ==========
+        if (isScreen19() && target) {
+          var targetRect = target.getBoundingClientRect();
+          var screenWidth = window.innerWidth;
+          var screenHeight = window.innerHeight;
+          var isFullScreen = (targetRect.width >= screenWidth * 0.9 && targetRect.height >= screenHeight * 0.9);
+          console.log('[SCREEN19-DEBUG][TouchStart] INTERACTIVE ELEMENT FOUND', JSON.stringify({
+            tag: target.tagName,
+            id: target.id || '(none)',
+            class: (target.className && typeof target.className === 'string') ? target.className.substring(0,100) : '(none)',
+            size: targetRect.width + 'x' + targetRect.height,
+            isFullScreen: isFullScreen,
+            WARNING: isFullScreen ? 'FULL SCREEN ELEMENT DETECTED - THIS IS THE BUG!' : 'normal element'
+          }));
+        }
+        // ========== END DEBUG ==========
+
         if (releaseTimer) { clearTimeout(releaseTimer); releaseTimer = null; }
         if (pressed && pressed !== target) { resetStyle(pressed); }
         applyPressedStyle(target);
@@ -1077,7 +1262,7 @@ function Overlay(props) {
         // Clear the queue
         pendingActionsRef.current[screenIndex] = [];
     };
-    // Activate a screen (set visibility flag and dispatch event)
+    // Activate a screen (set visibility flag, dispatch event, and resume Lotties)
     const activateScreen = (screenIndex) => {
         var _a;
         const wv = webviewsRef.current[screenIndex];
@@ -1092,6 +1277,24 @@ function Overlay(props) {
       window.__rampkitScreenIndex = ${screenIndex};
       console.log('🔓 Screen ${screenIndex} ACTIVATED');
 
+      // Resume all Lottie animations
+      try {
+        // lottie-web global API
+        if (typeof lottie !== 'undefined' && lottie.play) {
+          lottie.play();
+        }
+        // dotLottie players
+        document.querySelectorAll('dotlottie-player, lottie-player').forEach(function(el) {
+          if (el.play) el.play();
+        });
+        // lottie-web individual animations stored on window
+        if (window.__rampkitLottieAnimations) {
+          window.__rampkitLottieAnimations.forEach(function(anim) {
+            if (anim && anim.play) anim.play();
+          });
+        }
+      } catch(e) { console.log('Lottie play error:', e); }
+
       // Dispatch custom event that HTML can listen to
       try {
         document.dispatchEvent(new CustomEvent('rampkit:screen-visible', {
@@ -1104,7 +1307,7 @@ function Overlay(props) {
         // Process any pending actions for this screen
         processPendingActions(screenIndex);
     };
-    // Deactivate a screen (clear visibility flag)
+    // Deactivate a screen (clear visibility flag and pause Lotties)
     const deactivateScreen = (screenIndex) => {
         const wv = webviewsRef.current[screenIndex];
         if (!wv)
@@ -1115,6 +1318,24 @@ function Overlay(props) {
         const deactivateScript = `(function() {
       window.__rampkitScreenVisible = false;
       console.log('🔒 Screen ${screenIndex} DEACTIVATED');
+
+      // Pause all Lottie animations
+      try {
+        // lottie-web global API
+        if (typeof lottie !== 'undefined' && lottie.pause) {
+          lottie.pause();
+        }
+        // dotLottie players
+        document.querySelectorAll('dotlottie-player, lottie-player').forEach(function(el) {
+          if (el.pause) el.pause();
+        });
+        // lottie-web individual animations stored on window
+        if (window.__rampkitLottieAnimations) {
+          window.__rampkitLottieAnimations.forEach(function(anim) {
+            if (anim && anim.pause) anim.pause();
+          });
+        }
+      } catch(e) { console.log('Lottie pause error:', e); }
     })();`;
         // @ts-ignore: injectJavaScript exists on WebView instance
         wv.injectJavaScript(deactivateScript);
@@ -1322,26 +1543,26 @@ function Overlay(props) {
         const nextScreenAnim = screenAnims[nextIndex];
         const isForward = nextIndex > index;
         const direction = isForward ? 1 : -1;
-        // Slide animation: animate both screens simultaneously
+        // Slide animation: animate both screens simultaneously using full screen width
         if (animationType === "slide") {
             setIsTransitioning(true);
-            // Set up next screen starting position (offscreen in direction of navigation)
-            nextScreenAnim.translateX.setValue(SLIDE_FADE_OFFSET * direction);
+            // Set up next screen starting position (fully offscreen in direction of navigation)
+            nextScreenAnim.translateX.setValue(windowWidth * direction);
             nextScreenAnim.opacity.setValue(1);
-            // Animate both screens
+            // Animate both screens with smooth slide
             react_native_1.Animated.parallel([
-                // Current screen slides out
+                // Current screen slides out (to the opposite side)
                 react_native_1.Animated.timing(currentScreenAnim.translateX, {
-                    toValue: -SLIDE_FADE_OFFSET * direction,
-                    duration: SLIDE_FADE_DURATION,
-                    easing: react_native_1.Easing.out(react_native_1.Easing.ease),
+                    toValue: -windowWidth * direction,
+                    duration: 300,
+                    easing: react_native_1.Easing.out(react_native_1.Easing.cubic),
                     useNativeDriver: true,
                 }),
-                // Next screen slides in
+                // Next screen slides in (from offscreen to center)
                 react_native_1.Animated.timing(nextScreenAnim.translateX, {
                     toValue: 0,
-                    duration: SLIDE_FADE_DURATION,
-                    easing: react_native_1.Easing.out(react_native_1.Easing.ease),
+                    duration: 300,
+                    easing: react_native_1.Easing.out(react_native_1.Easing.cubic),
                     useNativeDriver: true,
                 }),
             ]).start(() => {
@@ -1705,7 +1926,7 @@ function Overlay(props) {
             !visible && styles.invisible,
             visible && { opacity: overlayOpacity },
         ], pointerEvents: visible && !isClosing ? "auto" : "none", children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: react_native_1.StyleSheet.absoluteFill, children: docs.map((doc, i) => {
-                    var _a, _b;
+                    var _a, _b, _c, _d;
                     return ((0, jsx_runtime_1.jsx)(react_native_1.Animated.View, { style: [
                             react_native_1.StyleSheet.absoluteFill,
                             {
@@ -1722,7 +1943,8 @@ function Overlay(props) {
                             // This prevents review/notification requests from firing on inactive screens at startup.
                             `window.__rampkitScreenVisible = ${i === 0};
                  window.__rampkitScreenIndex = ${i};
-                 console.log('[RampKit] Screen ${i} visibility initialized: ' + (${i === 0} ? 'ACTIVE' : 'INACTIVE'));
+                 window.__rampkitScreenId = '${((_c = props.screens[i]) === null || _c === void 0 ? void 0 : _c.id) || ""}';
+                 console.log('[RampKit] Screen ${i} (ID: ${((_d = props.screens[i]) === null || _d === void 0 ? void 0 : _d.id) || "unknown"}) visibility initialized: ' + (${i === 0} ? 'ACTIVE' : 'INACTIVE'));
                 ` + exports.injectedHardening + exports.injectedDynamicTapHandler + exports.injectedButtonAnimations, injectedJavaScript: exports.injectedNoSelect + exports.injectedVarsHandler + exports.injectedButtonAnimations, automaticallyAdjustContentInsets: false, contentInsetAdjustmentBehavior: "never", bounces: false, scrollEnabled: false, overScrollMode: "never", scalesPageToFit: false, showsHorizontalScrollIndicator: false, dataDetectorTypes: "none", allowsLinkPreview: false, allowsInlineMediaPlayback: true, mediaPlaybackRequiresUserAction: false, cacheEnabled: true, javaScriptEnabled: true, domStorageEnabled: true, hideKeyboardAccessoryView: true, onLoadEnd: () => {
                                 // Only initialize each screen ONCE to avoid repeated processing
                                 if (initializedScreensRef.current.has(i)) {
@@ -1758,10 +1980,46 @@ function Overlay(props) {
                                 if (i === 0) {
                                     activateScreen(i);
                                 }
+                                else {
+                                    // For non-active screens, pause Lotties immediately after load
+                                    // (they may have auto-started during page render)
+                                    const wv = webviewsRef.current[i];
+                                    if (wv) {
+                                        const pauseLottiesScript = `(function() {
+                      try {
+                        if (typeof lottie !== 'undefined' && lottie.pause) lottie.pause();
+                        document.querySelectorAll('dotlottie-player, lottie-player').forEach(function(el) {
+                          if (el.pause) el.pause();
+                        });
+                        if (window.__rampkitLottieAnimations) {
+                          window.__rampkitLottieAnimations.forEach(function(anim) {
+                            if (anim && anim.pause) anim.pause();
+                          });
+                        }
+                      } catch(e) {}
+                    })();`;
+                                        // @ts-ignore
+                                        wv.injectJavaScript(pauseLottiesScript);
+                                    }
+                                }
                             }, onMessage: (ev) => {
-                                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+                                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
                                 const raw = ev.nativeEvent.data;
                                 console.log("raw", raw);
+                                // ========== DEBUG: Screen 19 onMessage logging (REMOVE AFTER BUG FIX) ==========
+                                const screenId = ((_a = props.screens[i]) === null || _a === void 0 ? void 0 : _a.id) || "";
+                                const isScreen19OnMsg = screenId.indexOf('19') !== -1 ||
+                                    screenId.toLowerCase().indexOf('screen 19') !== -1 ||
+                                    screenId.toLowerCase().indexOf('screen19') !== -1 ||
+                                    i === 19 || i === 18;
+                                if (isScreen19OnMsg) {
+                                    console.log(`[SCREEN19-DEBUG][onMessage] Received message from screen ${i} (ID: ${screenId})`, JSON.stringify({
+                                        rawPreview: raw.substring(0, 200),
+                                        isActiveScreen: i === activeScreenIndexRef.current,
+                                        activeScreenIndex: activeScreenIndexRef.current
+                                    }));
+                                }
+                                // ========== END DEBUG ==========
                                 // Accept either raw strings or JSON payloads from your editor
                                 try {
                                     // JSON path
@@ -1887,7 +2145,7 @@ function Overlay(props) {
                                     if ((data === null || data === void 0 ? void 0 : data.type) === "rampkit:onboarding-finished") {
                                         setOnboardingCompleted(true);
                                         try {
-                                            (_a = props.onOnboardingFinished) === null || _a === void 0 ? void 0 : _a.call(props, data === null || data === void 0 ? void 0 : data.payload);
+                                            (_b = props.onOnboardingFinished) === null || _b === void 0 ? void 0 : _b.call(props, data === null || data === void 0 ? void 0 : data.payload);
                                         }
                                         catch (_) { }
                                         handleRequestClose({ completed: true });
@@ -1896,7 +2154,7 @@ function Overlay(props) {
                                     // 6) Request to show paywall
                                     if ((data === null || data === void 0 ? void 0 : data.type) === "rampkit:show-paywall") {
                                         try {
-                                            (_b = props.onShowPaywall) === null || _b === void 0 ? void 0 : _b.call(props, data === null || data === void 0 ? void 0 : data.payload);
+                                            (_c = props.onShowPaywall) === null || _c === void 0 ? void 0 : _c.call(props, data === null || data === void 0 ? void 0 : data.payload);
                                         }
                                         catch (_) { }
                                         return;
@@ -1907,9 +2165,9 @@ function Overlay(props) {
                                         if (questionId) {
                                             const response = {
                                                 questionId,
-                                                answer: (_c = data === null || data === void 0 ? void 0 : data.answer) !== null && _c !== void 0 ? _c : "",
+                                                answer: (_d = data === null || data === void 0 ? void 0 : data.answer) !== null && _d !== void 0 ? _d : "",
                                                 questionText: data === null || data === void 0 ? void 0 : data.questionText,
-                                                screenName: (_d = props.screens[i]) === null || _d === void 0 ? void 0 : _d.id,
+                                                screenName: (_e = props.screens[i]) === null || _e === void 0 ? void 0 : _e.id,
                                                 answeredAt: new Date().toISOString(),
                                             };
                                             OnboardingResponseStorage_1.OnboardingResponseStorage.saveResponse(response);
@@ -1924,6 +2182,14 @@ function Overlay(props) {
                                                 console.log(`[RampKit] Ignoring continue from inactive screen ${i}`);
                                             return;
                                         }
+                                        // ========== DEBUG: Screen 19 continue logging ==========
+                                        if (isScreen19OnMsg) {
+                                            console.log(`[SCREEN19-DEBUG][onMessage] CONTINUE action triggered from screen ${i}`, JSON.stringify({
+                                                animation: (data === null || data === void 0 ? void 0 : data.animation) || "fade",
+                                                screenId: screenId
+                                            }));
+                                        }
+                                        // ========== END DEBUG ==========
                                         handleAdvance(i, (data === null || data === void 0 ? void 0 : data.animation) || "fade");
                                         return;
                                     }
@@ -1935,6 +2201,15 @@ function Overlay(props) {
                                             return;
                                         }
                                         const target = data === null || data === void 0 ? void 0 : data.targetScreenId;
+                                        // ========== DEBUG: Screen 19 navigate logging ==========
+                                        if (isScreen19OnMsg) {
+                                            console.log(`[SCREEN19-DEBUG][onMessage] NAVIGATE action triggered from screen ${i}`, JSON.stringify({
+                                                target: target,
+                                                animation: (data === null || data === void 0 ? void 0 : data.animation) || "fade",
+                                                screenId: screenId
+                                            }));
+                                        }
+                                        // ========== END DEBUG ==========
                                         if (target === "__goBack__") {
                                             handleGoBack(i, (data === null || data === void 0 ? void 0 : data.animation) || "fade");
                                             return;
@@ -1965,7 +2240,7 @@ function Overlay(props) {
                                     if ((data === null || data === void 0 ? void 0 : data.type) === "rampkit:close") {
                                         // Track close action for onboarding completion
                                         try {
-                                            (_e = props.onCloseAction) === null || _e === void 0 ? void 0 : _e.call(props, i, ((_f = props.screens[i]) === null || _f === void 0 ? void 0 : _f.id) || "");
+                                            (_f = props.onCloseAction) === null || _f === void 0 ? void 0 : _f.call(props, i, ((_g = props.screens[i]) === null || _g === void 0 ? void 0 : _g.id) || "");
                                         }
                                         catch (_) { }
                                         handleRequestClose({ completed: true }); // Mark as completed so abandonment isn't tracked
@@ -1976,7 +2251,7 @@ function Overlay(props) {
                                         return;
                                     }
                                 }
-                                catch (_l) {
+                                catch (_m) {
                                     // String path
                                     if (raw === "rampkit:tap" ||
                                         raw === "next" ||
@@ -2027,7 +2302,7 @@ function Overlay(props) {
                                     if (raw === "rampkit:onboarding-finished") {
                                         setOnboardingCompleted(true);
                                         try {
-                                            (_g = props.onOnboardingFinished) === null || _g === void 0 ? void 0 : _g.call(props, undefined);
+                                            (_h = props.onOnboardingFinished) === null || _h === void 0 ? void 0 : _h.call(props, undefined);
                                         }
                                         catch (_) { }
                                         handleRequestClose({ completed: true });
@@ -2035,7 +2310,7 @@ function Overlay(props) {
                                     }
                                     if (raw === "rampkit:show-paywall") {
                                         try {
-                                            (_h = props.onShowPaywall) === null || _h === void 0 ? void 0 : _h.call(props);
+                                            (_j = props.onShowPaywall) === null || _j === void 0 ? void 0 : _j.call(props);
                                         }
                                         catch (_) { }
                                         return;
@@ -2078,7 +2353,7 @@ function Overlay(props) {
                                     if (raw === "rampkit:close") {
                                         // Track close action for onboarding completion
                                         try {
-                                            (_j = props.onCloseAction) === null || _j === void 0 ? void 0 : _j.call(props, i, ((_k = props.screens[i]) === null || _k === void 0 ? void 0 : _k.id) || "");
+                                            (_k = props.onCloseAction) === null || _k === void 0 ? void 0 : _k.call(props, i, ((_l = props.screens[i]) === null || _l === void 0 ? void 0 : _l.id) || "");
                                         }
                                         catch (_) { }
                                         handleRequestClose({ completed: true }); // Mark as completed so abandonment isn't tracked

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rampkit-expo-dev",
-  "version": "0.0.80",
+  "version": "0.0.82",
   "description": "The Expo SDK for RampKit. Build, test, and personalize app onboardings with instant updates.",
   "main": "build/index.js",
   "types": "build/index.d.ts",