@buoy-gg/highlight-updates 2.0.2

package/lib/commonjs/highlight-updates/utils/ProfilerInterceptor.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0,exports.disableProfilerLogging=disableProfilerLogging,exports.enableProfilerLogging=enableProfilerLogging,exports.installProfilerInterceptor=installProfilerInterceptor,exports.isInterceptorInstalled=isInterceptorInstalled,exports.isLoggingEnabled=isLoggingEnabled,exports.logHookStructure=logHookStructure,exports.logRendererInterfaces=logRendererInterfaces,exports.setComparisonCallback=setComparisonCallback,exports.uninstallProfilerInterceptor=uninstallProfilerInterceptor;let originalHookEmit=null,originalAgentEmit=null,isInstalled=!1,loggingEnabled=!1,comparisonCallback=null;function describeNode(e){if(!e)return{type:"null"};const n=e,o={};if(n.canonical){o.type="Fabric";const e=n.canonical;if(e.publicInstance){const n=e.publicInstance;o.hasMeasure="function"==typeof n.measure,o.nativeTag=n.__nativeTag??n._nativeTag??"unknown"}}else"function"==typeof n.measure?(o.type="Legacy",o.hasMeasure=!0,o.nativeTag=n.__nativeTag??n._nativeTag??n.nativeTag??"unknown"):(o.type="Unknown",o.keys=Object.keys(n).slice(0,10));return o}function swizzleHookEmit(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e&&"function"==typeof e.emit&&(originalHookEmit||(originalHookEmit=e.emit.bind(e),e.emit=function(e,...n){if("traceUpdates"===e&&loggingEnabled){const e=n[0];e.size>0&&console.log(`[PROFILER] traceUpdates: ${e.size} nodes`,Array.from(e).map((e,n)=>({index:n,...describeNode(e)}))),comparisonCallback&&comparisonCallback(e)}return originalHookEmit(e,...n)}))}function swizzleAgentEmit(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__,n=e?.reactDevtoolsAgent;n&&"function"==typeof n.emit&&(originalAgentEmit||(originalAgentEmit=n.emit.bind(n),n.emit=function(e,...n){if(loggingEnabled&&"drawTraceUpdates"===e){const e=n[0];e.length>0&&console.log(`[PROFILER] drawTraceUpdates: ${e.length} nodes`,e.map((e,n)=>({index:n,color:e.color,...describeNode(e.node)})))}return originalAgentEmit(e,...n)}))}function logRendererInterfaces(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!e?.rendererInterfaces)return void console.log("[ProfilerInterceptor] No rendererInterfaces available");const n=[];e.rendererInterfaces.forEach((e,o)=>{const t=Object.keys(e).filter(n=>"function"==typeof e[n]);n.push({id:o,hasSetTraceUpdatesEnabled:"function"==typeof e.setTraceUpdatesEnabled,methods:t.slice(0,20)})}),console.log(`[ProfilerInterceptor] Found ${e.rendererInterfaces.size} renderer interface(s)`,n)}function logHookStructure(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!e)return void console.log("[ProfilerInterceptor] No hook available");const n={};for(const o in e){const t=e[o];"function"==typeof t?n[o]="function":t instanceof Map?n[o]=`Map(${t.size})`:t instanceof Set?n[o]=`Set(${t.size})`:n[o]="object"==typeof t&&null!==t?"object":typeof t}console.log("[ProfilerInterceptor] Hook structure:",n)}function enableTracingOnAllRenderers(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e?.rendererInterfaces&&e.rendererInterfaces.forEach(e=>{if("function"==typeof e.setTraceUpdatesEnabled)try{e.setTraceUpdatesEnabled(!0)}catch{}})}function disableTracingOnAllRenderers(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e?.rendererInterfaces&&e.rendererInterfaces.forEach(e=>{if("function"==typeof e.setTraceUpdatesEnabled)try{e.setTraceUpdatesEnabled(!1)}catch{}})}function setComparisonCallback(e){comparisonCallback=e}function installProfilerInterceptor(){("undefined"==typeof __DEV__||__DEV__)&&(isInstalled||(swizzleHookEmit(),swizzleAgentEmit(),isInstalled=!0))}function uninstallProfilerInterceptor(){if(!isInstalled)return;const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;originalHookEmit&&e&&(e.emit=originalHookEmit,originalHookEmit=null),originalAgentEmit&&e?.reactDevtoolsAgent&&(e.reactDevtoolsAgent.emit=originalAgentEmit,originalAgentEmit=null),disableTracingOnAllRenderers(),comparisonCallback=null,isInstalled=!1}function isInterceptorInstalled(){return isInstalled}function enableProfilerLogging(){loggingEnabled=!0}function disableProfilerLogging(){loggingEnabled=!1}function isLoggingEnabled(){return loggingEnabled}var _default=exports.default={install:installProfilerInterceptor,uninstall:uninstallProfilerInterceptor,isInstalled:isInterceptorInstalled,setComparisonCallback:setComparisonCallback,enableTracing:enableTracingOnAllRenderers,disableTracing:disableTracingOnAllRenderers,enableLogging:enableProfilerLogging,disableLogging:disableProfilerLogging,isLoggingEnabled:isLoggingEnabled};

package/lib/commonjs/highlight-updates/utils/RenderCauseDetector.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.capturePropsSnapshot=capturePropsSnapshot,exports.captureStateSnapshot=captureStateSnapshot,exports.clearRenderCauseState=clearRenderCauseState,exports.detectRenderCause=detectRenderCause,exports.getRenderCauseStats=getRenderCauseStats,exports.removeRenderCauseState=removeRenderCauseState,exports.safeCloneForHistory=safeCloneForHistory;const COMPONENT_PROP_CONFIGS={RCTText:{alwaysTrack:["children"],skip:[],description:"Text component - children is the displayed content"},RCTVirtualText:{alwaysTrack:["children"],skip:[],description:"Virtual Text (nested) - children is the displayed content"},RCTView:{alwaysTrack:[],skip:["children"],description:"View container - children are React elements"},RCTImageView:{alwaysTrack:["source"],skip:["children"],description:"Image - source contains the image URL/require"},RCTTextInput:{alwaysTrack:["value","defaultValue"],skip:["children"],description:"TextInput - value is the input content"},RCTSwitch:{alwaysTrack:["value"],skip:["children"],description:"Switch - value is the toggle state"},default:{alwaysTrack:[],skip:["children"],description:"Unknown component type"}};function getComponentPropConfig(e){return e&&COMPONENT_PROP_CONFIGS[e]||COMPONENT_PROP_CONFIGS.default}const componentFiberStates=new WeakMap;function getComponentFiberPrevState(e){if(!e)return;let o=componentFiberStates.get(e);return o||(e.alternate&&(o=componentFiberStates.get(e.alternate),o)?o:void 0)}function setComponentFiberState(e,o){e&&(componentFiberStates.set(e,o),e.alternate&&componentFiberStates.set(e.alternate,o))}const previousStates=new Map,MAX_STORED_STATES=500,MAX_CHANGED_KEYS=10,MAX_HOOK_DEPTH=50,MAX_PARENT_DEPTH=50,INTERNAL_COMPONENT_NAMES=new Set(["View","Text","TextImpl","Image","ScrollView","FlatList","SectionList","TouchableOpacity","TouchableHighlight","TouchableWithoutFeedback","Pressable","TextInput","Switch","ActivityIndicator","Modal","StatusBar","KeyboardAvoidingView","AnimatedComponent","AnimatedComponentWrapper","Fragment","Suspense","Provider","Consumer","Context","ForwardRef","Unknown","Component"]);function isInternalComponentName(e){return!e||!!INTERNAL_COMPONENT_NAMES.has(e)||!!e.startsWith("Animated")}function getOwningComponentFiber(e){if(!e)return null;let o=e._debugOwner||e.return,t=0,n=null;for(;o&&t<30;){const e=o.tag;if((0===e||1===e||11===e||15===e)&&(n||(n=o),!isInternalComponentName(getComponentNameFromFiber(o))))return o;o=o.return,t++}return n}function getComponentNameFromFiber(e){if(!e)return null;const o=e.type;if(o){if("string"==typeof o)return o;if(o.name)return o.name;if(o.displayName)return o.displayName}return null}function detectHookType(e){if(!e||"object"!=typeof e)return"unknown";if(null!==e.queue&&void 0!==e.queue)return"useState";const o=e.memoizedState;if(null!==o&&"object"==typeof o&&!Array.isArray(o)&&"current"in o&&1===Object.keys(o).length)return"useRef";if(Array.isArray(o)&&2===o.length){const[,e]=o;if(Array.isArray(e)||null===e)return"function"==typeof o[0]?"useCallback":"useMemo"}return null!==o&&"object"==typeof o&&!Array.isArray(o)&&("tag"in o||"create"in o||"destroy"in o)?"useEffect":"unknown"}function extractHookValue(e,o){const t=e?.memoizedState;switch(o){case"useState":case"useReducer":default:return t;case"useRef":return t?.current;case"useMemo":case"useCallback":return Array.isArray(t)?t[0]:t;case"useEffect":return"[effect]"}}function extractHookStates(e){if(!e?.memoizedState)return null;const o=e.memoizedState;if("object"!=typeof o||null===o)return null;if(!("next"in o)&&!("queue"in o)&&!("memoizedState"in o))return null;const t=[];let n=o,r=0;for(;null!==n&&r<MAX_HOOK_DEPTH;){const e=detectHookType(n),o=extractHookValue(n,e);t.push({index:r,type:e,value:o,rawState:n.memoizedState}),n=n.next,r++}return t.length>0?t:null}function compareHookStates(e,o){if(!e||!o)return null;const t=[],n=Math.max(e.length,o.length);for(let r=0;r<n;r++){const n=e[r],a=o[r];if(n||!a)if(!n||a){if(n&&a){if(n.rawState===a.rawState)continue;if("useEffect"===a.type)continue;if("useMemo"===a.type||"useCallback"===a.type)continue;if("useState"===a.type||"useReducer"===a.type||"useRef"===a.type){const e=formatHookValue(n.value,n.type),o=formatHookValue(a.value,a.type);t.push({index:r,type:a.type,previousValue:e,currentValue:o,description:`${e} → ${o}`})}}}else t.push({index:r,type:n.type,previousValue:formatHookValue(n.value,n.type),description:`Hook[${r}] removed`});else t.push({index:r,type:a.type,currentValue:formatHookValue(a.value,a.type),description:`Hook[${r}] added`})}return t.length>0?t:null}function formatHookValue(e,o){return formatDisplayValue(e)}function formatDisplayValue(e){return null===e?null:void 0!==e?"boolean"==typeof e||"number"==typeof e?e:"string"==typeof e?e.length>30?e.slice(0,30)+"...":e:"function"==typeof e?`[Function: ${e.name||"anonymous"}]`:Array.isArray(e)?`[Array: ${e.length} items]`:"object"==typeof e?`{Object: ${Object.keys(e).length} keys}`:String(e):void 0}function detectComponentCause(e){if(!e)return{cause:"unknown",hookChanges:null};let o=e,t=e.alternate;const n=getComponentFiberPrevState(e);if(n&&t){const r=extractHookStates(e),a=extractHookStates(t),s=n.extractedHooks;if(r&&a&&s&&s.length>0){const n=s.find(e=>"useState"===e.type);if(n){const s=r.find(e=>e.index===n.index),i=a.find(e=>e.index===n.index);if(s&&i){const r=s.value===n.value,a=i.value===n.value;r&&!a&&(o=t,t=e)}}}}const r=extractHookStates(o);let a=null,s=null,i=null;return t?(a=t.memoizedProps,s=t.memoizedState,i=extractHookStates(t)):n&&(a=n.memoizedProps,s=n.memoizedState,i=n.extractedHooks),setComponentFiberState(o,{memoizedProps:o.memoizedProps,memoizedState:o.memoizedState,extractedHooks:r}),null===a?{cause:"mount",hookChanges:null}:shallowEqual(a,o.memoizedProps)?s!==o.memoizedState?{cause:"state",hookChanges:compareHookStates(i,r)}:{cause:"parent",hookChanges:null}:{cause:"props",hookChanges:null}}function shallowEqual(e,o){if(e===o)return!0;if(!e||!o)return!1;if("object"!=typeof e||"object"!=typeof o)return!1;const t=Object.keys(e),n=Object.keys(o);if(t.length!==n.length)return!1;for(const n of t)if(e[n]!==o[n])return!1;return!0}function safeStringify(e,o=3){const t=new WeakSet;return function e(n,r){if(r>o)return"[MAX_DEPTH]";if(null===n)return null;if(void 0===n)return;if("function"==typeof n)return`[Function: ${n.name||"anonymous"}]`;if("symbol"==typeof n)return`[Symbol: ${n.toString()}]`;if("object"!=typeof n)return n;if(t.has(n))return"[Circular]";if(t.add(n),Array.isArray(n))return n.slice(0,10).map(o=>e(o,r+1));const a={},s=Object.keys(n).slice(0,20);for(const o of s)try{a[o]=e(n[o],r+1)}catch{a[o]="[Error accessing]"}return a}(e,0)}function logRawFiberData(e,o,t,n,r,a){const s=getComponentNameFromFiber(t)||"Unknown";if(console.log("\n========================================"),console.log("[RN-BUOY DEBUG] RENDER EVENT"),console.log("========================================"),console.log(`Native Tag: ${e}`),console.log(`Component Name: ${s}`),console.log(`Is First Render: ${!n}`),console.log(`Component Cause Detected: ${a}`),console.log("----------------------------------------"),console.log("\n--- NATIVE FIBER (Host Component) ---"),console.log("fiber.type:",o?.type),console.log("fiber.tag:",o?.tag),console.log("fiber.memoizedProps (CURRENT):",safeStringify(o?.memoizedProps)),console.log("fiber.memoizedState:",safeStringify(o?.memoizedState)),n&&(console.log("PREVIOUS memoizedProps:",safeStringify(n.memoizedProps)),console.log("PREVIOUS memoizedState:",safeStringify(n.memoizedState))),console.log("\n--- COMPONENT FIBER (React Component) ---"),t){console.log("componentFiber.type:",t?.type?.name||t?.type),console.log("componentFiber.tag:",t?.tag),console.log("componentFiber.memoizedProps:",safeStringify(t?.memoizedProps)),console.log("componentFiber.memoizedState:",safeStringify(t?.memoizedState)),console.log("\n--- HOOKS STATE (linked list walk) ---");let e=t?.memoizedState,o=0;for(;e&&o<10;)console.log(`Hook[${o}]:`,safeStringify({memoizedState:e.memoizedState,baseState:e.baseState,queue:e.queue?"[Queue object]":null})),e=e.next,o++;console.log("\n--- EXTRACTED HOOKS (Phase 3) ---");const n=extractHookStates(t);if(n)for(const e of n)console.log(`Hook[${e.index}] (${e.type}):`,formatDisplayValue(e.value));else console.log("(No hooks extracted)")}else console.log("(No component fiber found)");console.log("\n--- CHILDREN/TEXT CONTENT ---");const i=o?.memoizedProps?.children;console.log("children type:",typeof i),console.log("children value:",safeStringify(i)),console.log("\n========================================\n")}function getTagName(e){return void 0===e?"undefined":{0:"FunctionComponent",1:"ClassComponent",2:"IndeterminateComponent",3:"HostRoot",4:"HostPortal",5:"HostComponent",6:"HostText",7:"Fragment",8:"Mode",9:"ContextConsumer",10:"ContextProvider",11:"ForwardRef",12:"Profiler",13:"SuspenseComponent",14:"MemoComponent",15:"SimpleMemoComponent"}[e]||`Unknown(${e})`}function logMinimal(e,o){if(o.hookChanges&&0!==o.hookChanges.length)for(const t of o.hookChanges)console.log(`[${e||"Unknown"}] ${t.type}[${t.index}]: ${t.previousValue} → ${t.currentValue}`)}function logVerbose(e,o,t,n,r){const a=getComponentNameFromFiber(t)||"Unknown",s="string"==typeof o?.type?o.type:"Unknown",{cause:i,hookChanges:l}=n;if(console.log(`[RENDER] ${a} (${s}:${e}) | Cause: ${i.toUpperCase()}`+(r&&r.length>0?` | Props: [${r.join(", ")}]`:"")),l&&l.length>0)for(const e of l)console.log(`  └─ ${e.type}[${e.index}]: ${e.previousValue} → ${e.currentValue}`)}function logComprehensiveRenderData(e,o,t,n,r,a,s){const i=getComponentNameFromFiber(t)||"Unknown",l="string"==typeof o?.type?o.type:"Unknown";console.log("\n[RN-BUOY RENDER DEBUG] ═══════════════════════════════════════"),console.log(`Render #${s} for ${l} (nativeTag: ${e})`),console.log(`Timestamp: ${(new Date).toISOString()}`),console.log("═══════════════════════════════════════════════════════════════\n"),console.log(`NATIVE FIBER (${l}):`),console.log(`  type: "${o?.type}"`),console.log(`  tag: ${o?.tag} (${getTagName(o?.tag)})`);const c=o?.alternate,u=c?"alternate":n?"storage":"none";console.log(`  Previous values source: ${u}`);const m=o?.memoizedProps?.children,p=c?.memoizedProps?.children,f=void 0!==p?p:n?.memoizedProps?.children,g=void 0!==f&&m!==f;console.log(`  memoizedProps.children: ${formatDisplayValue(m)}${g?` (was: ${formatDisplayValue(f)})`:void 0!==f?" (unchanged)":" (first render)"}`);const d=o?.memoizedProps?.style,y=c?.memoizedProps?.style,S=void 0!==y?y:n?.memoizedProps?.style,h=void 0!==S&&d!==S;if(d&&(console.log(`  memoizedProps.style: ${JSON.stringify(safeStringify(d,2))}${h?" (REFERENCE CHANGED)":""}`),h&&S)){const e=deepEqual(d,S);console.log(`    └─ Values actually changed: ${!e}`)}console.log(`  All memoizedProps keys: [${Object.keys(o?.memoizedProps||{}).join(", ")}]`);const C=o?.memoizedProps?.testID,b=o?.memoizedProps?.nativeID,k=o?.memoizedProps?.accessibilityLabel;if(C&&console.log(`  testID: "${C}"`),b&&console.log(`  nativeID: "${b}"`),k&&console.log(`  accessibilityLabel: "${k}"`),console.log("  alternate: "+(c?"YES":"NO")),c&&console.log(`    alternate.memoizedProps.children: ${formatDisplayValue(p)}`),console.log("  Tree structure:"),console.log(`    return (parent): ${o?.return?getTagName(o.return.tag):"null"}`),console.log(`    child: ${o?.child?getTagName(o.child.tag):"null"}`),console.log(`    sibling: ${o?.sibling?getTagName(o.sibling.tag):"null"}`),console.log(""),console.log(`COMPONENT FIBER (${i}):`),t){if(console.log(`  name: "${i}"`),console.log(`  type: ${typeof t.type} (${t.type?.name||t.type?.displayName||"anonymous"})`),console.log(`  tag: ${t.tag} (${getTagName(t.tag)})`),console.log(`  memoizedProps: ${JSON.stringify(safeStringify(t.memoizedProps,2))}`),console.log("  alternate: "+(t.alternate?"YES":"NO")),t.alternate){console.log(`  ALTERNATE memoizedProps: ${JSON.stringify(safeStringify(t.alternate.memoizedProps,2))}`);const e=!shallowEqual(t.alternate.memoizedProps,t.memoizedProps);console.log("  Props changed (vs alternate): "+(e?"YES":"NO")),console.log("  ALTERNATE memoizedState: "+(t.alternate.memoizedState===t.memoizedState?"SAME":"DIFFERENT"))}const e=getComponentFiberPrevState(t);if(e){console.log(`  WeakMap PREVIOUS memoizedProps: ${JSON.stringify(safeStringify(e.memoizedProps,2))}`);const o=!shallowEqual(e.memoizedProps,t.memoizedProps);console.log("  Props changed (vs WeakMap): "+(o?"YES":"NO"))}else console.log("  WeakMap PREVIOUS state: (not found - first render or WeakMap cleared)");if(t._debugOwner){const e=getComponentNameFromFiber(t._debugOwner);console.log(`  _debugOwner: "${e}"`);let o=t._debugOwner,n=1;for(;o&&n<5;){const e=getComponentNameFromFiber(o);console.log(`    └─[${n}] ${e||"unknown"} (tag: ${o.tag})`),o=o._debugOwner,n++}}let n=0,r=o._debugOwner||o.return;for(;r&&r!==t&&n<30;)r=r.return,n++;console.log(`  Depth from native fiber: ${n}`)}else console.log("  (No component fiber found - could not walk up tree)");if(console.log(""),console.log("HOOKS:"),t?.memoizedState){const e=extractHookStates(t),o=t.alternate?extractHookStates(t.alternate):null,n=getComponentFiberPrevState(t),r=o||n?.extractedHooks,a=o?"alternate":n?"WeakMap":"none";e&&e.length>0?(console.log(`  Total hooks: ${e.length}`),console.log(`  Previous values source: ${a}`),e.forEach((e,o)=>{const t=r?.[o],n=!!t&&t.rawState!==e.rawState,a=t?formatDisplayValue(t.value):"N/A",s=n?" ← CHANGED":"";console.log(`  [${o}] ${e.type}: ${formatDisplayValue(e.value)}${t?` (was: ${a})`:" (first render)"}${s}`)})):(console.log("  (Could not extract hooks - memoizedState structure not recognized)"),console.log("  Raw memoizedState type: "+typeof t.memoizedState),console.log(`  Has 'next' property: ${"next"in(t.memoizedState||{})}`),console.log(`  Has 'queue' property: ${"queue"in(t.memoizedState||{})}`))}else console.log("  (No memoizedState - class component, no hooks, or not a function component)");if(console.log(""),console.log("RAW HOOKS DATA:"),t?.memoizedState&&"object"==typeof t.memoizedState){let e=t.memoizedState,o=0;for(;e&&o<10;)console.log(`  Hook[${o}]:`),console.log(`    memoizedState: ${safeStringify(e.memoizedState,2)}`),console.log(`    baseState: ${safeStringify(e.baseState,2)}`),console.log("    queue: "+(e.queue?"[Queue present]":"null")),console.log("    next: "+(e.next?"[Next hook]":"null")),e=e.next,o++;0===o&&console.log("  (memoizedState is not a hooks linked list)")}console.log(""),console.log("DETECTION RESULTS:"),console.log(`  Component Cause: ${r.cause.toUpperCase()}`),r.hookChanges&&r.hookChanges.length>0&&(console.log("  Hook Changes Detected:"),r.hookChanges.forEach(e=>{console.log(`    [${e.index}] ${e.type}: ${e.previousValue} → ${e.currentValue}`),e.description&&console.log(`         ${e.description}`)}));const T="string"==typeof o?.type?o.type:void 0,E=getChangedKeys(n?.memoizedProps,o?.memoizedProps,T);E&&E.length>0?console.log(`  Native Props Changed: [${E.join(", ")}]`):n&&console.log("  Native Props Changed: (none detected)"),console.log(""),console.log("BATCH CONTEXT:"),console.log(`  Batch size: ${a.size}`),console.log(`  All tags in batch: [${Array.from(a).slice(0,20).join(", ")}${a.size>20?"...":""}]`);const z=getParentNativeTag(o),N=null!==z&&a.has(z);if(console.log(`  Parent nativeTag: ${z??"not found"}`),console.log("  Parent in batch: "+(N?"YES":"NO")),a.size>1){console.log("  Components in same batch:");let e=o?.return,t=0;for(;e&&t<10;){const o=getNativeTagFromStateNode(e.stateNode);if(null!==o&&a.has(o)){const n=getComponentNameFromFiber(e)||e.type;console.log(`    [depth ${t}] ${n} (tag: ${o})`)}e=e.return,t++}}console.log("\n═══════════════════════════════════════════════════════════════\n")}function detectRenderCause(e,o,t,n="off"){const r=Date.now();if(!o)return{type:"unknown",timestamp:r};let a=o,s=o.alternate;const i=previousStates.get(e);if(i&&s){const e=i.memoizedProps?.children,t=o.memoizedProps?.children,r=s.memoizedProps?.children,l=o.memoizedProps===i.memoizedProps||void 0!==e&&t===e,c=s.memoizedProps===i.memoizedProps||void 0!==e&&r===e;l&&!c&&(a=s,s=o,"all"===n&&console.log("[RenderCause] Detected fiber swap - using alternate as current"))}let l=null,c=null;s?(l=s.memoizedProps,c=s.memoizedState):i&&(l=i.memoizedProps,c=i.memoizedState);const u=null!==l?{memoizedProps:l,memoizedState:c,timestamp:r}:void 0,m={memoizedProps:a.memoizedProps,memoizedState:a.memoizedState,timestamp:r};updateStoredState(e,m);const p=getOwningComponentFiber(a),f=getComponentNameFromFiber(p)||void 0,g=detectComponentCause(p),d=g.cause,y=g.hookChanges;if(!u){if("off"!==n)if("minimal"===n)console.log(`[${f||"Unknown"}] MOUNT`);else if("verbose"===n){const o="string"==typeof a?.type?a.type:"Unknown";console.log(`[RENDER] ${f||"Unknown"} (${o}:${e}) | Cause: MOUNT`)}else"all"===n&&logComprehensiveRenderData(e,a,p,u,g,t,previousStates.has(e)?previousStates.size:1);return{type:"mount",timestamp:r,componentCause:"mount",componentName:f}}const S="string"==typeof a.type?a.type:void 0,h=getChangedKeys(u.memoizedProps,m.memoizedProps,S);if("off"!==n&&("minimal"===n?logMinimal(f,g):"verbose"===n?logVerbose(e,a,p,g,h):"all"===n&&logComprehensiveRenderData(e,a,p,u,g,t,previousStates.has(e)?previousStates.size:1)),h&&h.length>0)return{type:"props",changedKeys:h.slice(0,MAX_CHANGED_KEYS),timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0};const C=detectHookChanges(u.memoizedState,m.memoizedState);if(C&&C.length>0)return{type:"hooks",hookIndices:C,timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0};const b=getParentNativeTag(a);return b&&t.has(b)?{type:"parent",timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0}:"state"===d?{type:"state",timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0}:"props"===d?{type:"props",timestamp:r,componentCause:d,componentName:f}:"parent"===d?{type:"parent",timestamp:r,componentCause:d,componentName:f}:{type:"unknown",timestamp:r,componentCause:d,componentName:f}}function getChangedKeys(e,o,t){if(e===o)return null;if(!e||!o)return null;if("object"!=typeof e||"object"!=typeof o)return null;if(Array.isArray(e)||Array.isArray(o))return null;const n=getComponentPropConfig(t),r=new Set([...Object.keys(e),...Object.keys(o)]),a=[];for(const t of r)if(!t.startsWith("__")&&!n.skip.includes(t)){if("children"===t){if(!n.alwaysTrack.includes("children"))continue;const r=e[t],s=o[t];r!==s&&(isPrimitive(r)&&isPrimitive(s)?a.push(`children: ${formatValue(r)} → ${formatValue(s)}`):a.push("children (content)"));continue}if(e[t]!==o[t]){const n=e[t],r=o[t];"style"===t?deepEqual(n,r)?a.push(`${t} (ref only)`):a.push(t):"function"==typeof n&&"function"==typeof r?a.push(`${t} (fn ref)`):a.push(t)}}return a.length>0?a:null}function isPlainObject(e){if(null===e||"object"!=typeof e)return!1;if(Array.isArray(e))return!1;const o=Object.getPrototypeOf(e);return o===Object.prototype||null===o}function deepEqual(e,o,t=0){if(t>5)return!1;if(e===o)return!0;if(typeof e!=typeof o)return!1;if("object"!=typeof e||null===e||null===o)return e===o;if(Array.isArray(e)!==Array.isArray(o))return!1;if(Array.isArray(e)){if(e.length!==o.length)return!1;for(let n=0;n<e.length;n++)if(!deepEqual(e[n],o[n],t+1))return!1;return!0}const n=Object.keys(e),r=Object.keys(o);if(n.length!==r.length)return!1;for(const a of n){if(!r.includes(a))return!1;if(!deepEqual(e[a],o[a],t+1))return!1}return!0}function isPrimitive(e){return null==e||"string"==typeof e||"number"==typeof e||"boolean"==typeof e}function formatValue(e){return null===e?"null":void 0===e?"undefined":"string"==typeof e?e.length>20?`"${e.slice(0,20)}..."`:`"${e}"`:"number"==typeof e||"boolean"==typeof e?String(e):"[object]"}function detectHookChanges(e,o){if(e===o)return null;if(null==e||null==o)return null;if("object"!=typeof e||"object"!=typeof o)return null;const t=[];let n=e,r=o,a=0;for(;null!==r&&a<MAX_HOOK_DEPTH;)(null===n||didHookChange(n,r))&&t.push(a),r=r?.next??null,n=n?.next??null,a++;return t.length>0?t:null}function didHookChange(e,o){return e!==o&&(e.memoizedState!==o.memoizedState||void 0!==e.baseState&&e.baseState!==o.baseState)}function getParentNativeTag(e){let o=e?.return,t=0;for(;o&&t<50;){if(o.stateNode){const e=getNativeTagFromStateNode(o.stateNode);if(null!=e)return e}o=o.return,t++}return null}function getNativeTagFromStateNode(e){return e?"number"==typeof e.__nativeTag?e.__nativeTag:"number"==typeof e._nativeTag?e._nativeTag:"number"==typeof e.canonical?.__nativeTag?e.canonical.__nativeTag:"number"==typeof e.canonical?.publicInstance?.__nativeTag?e.canonical.publicInstance.__nativeTag:null:null}function updateStoredState(e,o){if(previousStates.size>=MAX_STORED_STATES){const e=Array.from(previousStates.entries());e.sort((e,o)=>e[1].timestamp-o[1].timestamp);const o=Math.floor(MAX_STORED_STATES/4);for(let t=0;t<o;t++)previousStates.delete(e[t][0])}previousStates.set(e,o)}function clearRenderCauseState(){previousStates.clear()}function removeRenderCauseState(e){previousStates.delete(e)}function getRenderCauseStats(){return{storedStates:previousStates.size,maxStates:MAX_STORED_STATES}}const MAX_CLONE_DEPTH=5,MAX_STRING_LENGTH=200,MAX_ARRAY_ITEMS=20,MAX_OBJECT_KEYS=30;function safeCloneForHistory(e,o=0,t=new WeakSet){if(null==e)return e;if("boolean"==typeof e||"number"==typeof e)return e;if("string"==typeof e)return e.length>MAX_STRING_LENGTH?e.slice(0,MAX_STRING_LENGTH)+"...":e;if("function"==typeof e)return`[Function: ${e.name||"anonymous"}]`;if("symbol"==typeof e)return`[Symbol: ${e.description||""}]`;if(o>=MAX_CLONE_DEPTH)return Array.isArray(e)?`[Array: ${e.length} items]`:"object"==typeof e?`[Object: ${Object.keys(e).length} keys]`:"[...]";if("object"==typeof e){if(t.has(e))return"[Circular]";t.add(e)}if(Array.isArray(e)){const n=e.slice(0,MAX_ARRAY_ITEMS).map(e=>safeCloneForHistory(e,o+1,t));return e.length>MAX_ARRAY_ITEMS&&n.push(`[...${e.length-MAX_ARRAY_ITEMS} more]`),n}if(e instanceof Date)return e.toISOString();if(e instanceof Error)return`[Error: ${e.message}]`;if(e instanceof RegExp)return e.toString();if(e instanceof Map){const n={__type:"Map",__size:e.size};let r=0;for(const[a,s]of e){if(r>=MAX_OBJECT_KEYS){n[`...${e.size-r} more`]=!0;break}n["string"==typeof a?a:String(a)]=safeCloneForHistory(s,o+1,t),r++}return n}if(e instanceof Set)return{__type:"Set",__size:e.size,values:Array.from(e).slice(0,MAX_ARRAY_ITEMS).map(e=>safeCloneForHistory(e,o+1,t))};if("object"==typeof e){const n={},r=Object.keys(e),a=r.slice(0,MAX_OBJECT_KEYS);for(const r of a)if(!r.startsWith("__")&&"children"!==r)try{n[r]=safeCloneForHistory(e[r],o+1,t)}catch{n[r]="[Error accessing property]"}return r.length>MAX_OBJECT_KEYS&&(n[`...${r.length-MAX_OBJECT_KEYS} more keys`]=!0),n}return"[Unknown type]"}function capturePropsSnapshot(e){if(e?.memoizedProps)return safeCloneForHistory(e.memoizedProps)}function captureStateSnapshot(e){if(!e?.memoizedState)return;const o=e.memoizedState;if("object"==typeof o&&null!==o&&"next"in o){const e=[];let t=o,n=0;for(;t&&n<MAX_HOOK_DEPTH;)e.push({index:n,memoizedState:safeCloneForHistory(t.memoizedState)}),t=t.next,n++;return{__type:"Hooks",hooks:e}}return safeCloneForHistory(o)}

package/lib/commonjs/highlight-updates/utils/RenderTracker.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.RenderTracker=void 0;var _ViewTypeMapper=require("./ViewTypeMapper"),_PerformanceLogger=require("./PerformanceLogger");const MAX_TRACKED_COMPONENTS=200,DEFAULT_BATCH_SIZE=150;class RenderTrackerSingleton{renders=new Map;listeners=new Set;stateListeners=new Set;settingsListeners=new Set;filterListeners=new Set;isTracking=!1;isPaused=!1;settings={batchSize:150,showRenderCount:!0,performanceLogging:!1,trackRenderCauses:!1,enableRenderHistory:!0,maxRenderHistoryPerComponent:20,capturePropsOnRender:!1,captureStateOnRender:!1,debugLogLevel:"off",debugRawFiberLogging:!1};isBatchMode=!1;batchDirty=!1;filters={includeTestID:new Set,includeNativeID:new Set,includeViewType:new Set,includeComponent:new Set,excludeTestID:new Set,excludeNativeID:new Set,excludeViewType:new Set,excludeComponent:new Set,includePatterns:[],excludePatterns:[]};trackRender(e){if(this.isPaused)return;const t=String(e.nativeTag),s=Date.now(),i=this.renders.get(t);if(i)i.renderCount=e.count,i.lastRenderTime=s,i.color=e.color,e.measurements&&(i.measurements=e.measurements),e.testID&&!i.testID&&(i.testID=e.testID),e.nativeID&&!i.nativeID&&(i.nativeID=e.nativeID),e.accessibilityLabel&&!i.accessibilityLabel&&(i.accessibilityLabel=e.accessibilityLabel),e.componentName&&!i.componentName&&(i.componentName=e.componentName),e.renderCause&&(i.lastRenderCause=e.renderCause),this.settings.enableRenderHistory&&e.renderCause&&this.addRenderEvent(i,e.renderCause,e.capturedProps,e.capturedState);else{const i={id:t,nativeTag:e.nativeTag,viewType:e.viewType,displayName:(0,_ViewTypeMapper.getComponentDisplayName)(e.viewType),testID:e.testID,nativeID:e.nativeID,accessibilityLabel:e.accessibilityLabel,componentName:e.componentName,renderCount:e.count,firstRenderTime:s,lastRenderTime:s,measurements:e.measurements,color:e.color,lastRenderCause:e.renderCause};if(this.settings.enableRenderHistory&&e.renderCause&&(i.renderHistory=[],this.addRenderEvent(i,e.renderCause,e.capturedProps,e.capturedState)),this.renders.set(t,i),this.renders.size>200){const e=Array.from(this.renders.values()).sort((e,t)=>e.lastRenderTime-t.lastRenderTime).slice(0,this.renders.size-200);for(const t of e)this.renders.delete(t.id)}}this.isBatchMode?this.batchDirty=!0:this.notifyListeners()}addRenderEvent(e,t,s,i){e.renderHistory||(e.renderHistory=[]);const r={id:`${e.nativeTag}-${t.timestamp}`,timestamp:t.timestamp,cause:t,renderNumber:e.renderCount,capturedProps:this.settings.capturePropsOnRender?s:void 0,capturedState:this.settings.captureStateOnRender?i:void 0};e.renderHistory.push(r);const n=Math.max(5,Math.min(50,this.settings.maxRenderHistoryPerComponent));e.renderHistory.length>n&&(e.renderHistory=e.renderHistory.slice(-n))}startBatch(){this.isBatchMode=!0,this.batchDirty=!1}endBatch(){this.isBatchMode=!1,this.batchDirty&&(this.batchDirty=!1,this.notifyListeners())}getRenders(){return Array.from(this.renders.values()).map(e=>({...e}))}passesFilters(e){if(this.filters.includePatterns.length>0&&!this.matchesAnyPatternForInfo(e,this.filters.includePatterns))return!1;if(this.filters.excludePatterns.length>0&&this.matchesAnyPatternForInfo(e,this.filters.excludePatterns))return!1;if(this.filters.includeViewType.size>0){const t=e.viewType||"",s=e.displayName||"";if(!this.matchesPattern(t,this.filters.includeViewType)&&!this.matchesPattern(s,this.filters.includeViewType))return!1}if(this.filters.includeTestID.size>0&&(!e.testID||!this.matchesPattern(e.testID,this.filters.includeTestID)))return!1;if(this.filters.includeNativeID.size>0&&(!e.nativeID||!this.matchesPattern(e.nativeID,this.filters.includeNativeID)))return!1;if(this.filters.includeComponent.size>0&&(!e.componentName||!this.matchesPattern(e.componentName,this.filters.includeComponent)))return!1;if(this.filters.excludeViewType.size>0){const t=e.viewType||"",s=e.displayName||"";if(this.matchesPattern(t,this.filters.excludeViewType)||this.matchesPattern(s,this.filters.excludeViewType))return!1}return!(this.filters.excludeTestID.size>0&&e.testID&&this.matchesPattern(e.testID,this.filters.excludeTestID)||this.filters.excludeNativeID.size>0&&e.nativeID&&this.matchesPattern(e.nativeID,this.filters.excludeNativeID)||this.filters.excludeComponent.size>0&&e.componentName&&this.matchesPattern(e.componentName,this.filters.excludeComponent))}matchesAnyPatternForInfo(e,t){for(const s of t){const t=s.value.toLowerCase();switch(s.type){case"any":if(e.viewType.toLowerCase().includes(t)||e.displayName?.toLowerCase().includes(t)||e.testID?.toLowerCase().includes(t)||e.nativeID?.toLowerCase().includes(t)||e.componentName?.toLowerCase().includes(t)||e.accessibilityLabel?.toLowerCase().includes(t))return!0;break;case"viewType":if(e.viewType.toLowerCase().includes(t)||e.displayName?.toLowerCase().includes(t))return!0;break;case"testID":if(e.testID?.toLowerCase().includes(t))return!0;break;case"nativeID":if(e.nativeID?.toLowerCase().includes(t))return!0;break;case"component":if(e.componentName?.toLowerCase().includes(t))return!0;break;case"accessibilityLabel":if(e.accessibilityLabel?.toLowerCase().includes(t))return!0}}return!1}hasActiveFilters(){return this.filters.includePatterns.length>0||this.filters.excludePatterns.length>0||this.filters.includeViewType.size>0||this.filters.includeTestID.size>0||this.filters.includeNativeID.size>0||this.filters.includeComponent.size>0||this.filters.excludeViewType.size>0||this.filters.excludeTestID.size>0||this.filters.excludeNativeID.size>0||this.filters.excludeComponent.size>0||void 0!==this.filters.minRenderCount||void 0!==this.filters.maxRenderCount}getFilteredRenders(e=""){let t=this.getRenders();if(e.trim()){const s=e.toLowerCase();t=t.filter(e=>e.viewType.toLowerCase().includes(s)||e.displayName.toLowerCase().includes(s)||e.testID?.toLowerCase().includes(s)||e.nativeID?.toLowerCase().includes(s)||e.accessibilityLabel?.toLowerCase().includes(s)||e.componentName?.toLowerCase().includes(s)||String(e.nativeTag).includes(s))}return t=t.filter(e=>this.passesFilters(e)),void 0!==this.filters.minRenderCount&&(t=t.filter(e=>e.renderCount>=this.filters.minRenderCount)),void 0!==this.filters.maxRenderCount&&(t=t.filter(e=>e.renderCount<=this.filters.maxRenderCount)),t.sort((e,t)=>t.lastRenderTime-e.lastRenderTime)}matchesPattern(e,t){const s=e.toLowerCase();for(const e of t){const t=e.toLowerCase();if(s.includes(t))return!0}return!1}getRender(e){return this.renders.get(e)}clear(){this.renders.clear(),this.notifyListeners()}resetRenderCount(e){const t=this.renders.get(e);t&&(t.renderCount=0,this.notifyListeners())}start(){this.isTracking=!0,this.isPaused=!1,this.notifyStateListeners()}stop(){this.isTracking=!1,this.isPaused=!1,this.notifyStateListeners()}pause(){this.isPaused=!0,this.notifyStateListeners()}resume(){this.isPaused=!1,this.notifyStateListeners()}togglePause(){this.isPaused=!this.isPaused,this.notifyStateListeners()}getState(){return{isTracking:this.isTracking,isPaused:this.isPaused}}getFilters(){return this.filters}setFilters(e){this.filters={...this.filters,...e},this.notifyListeners(),this.notifyFilterListeners()}addIncludePattern(e,t){const s=`include${e.charAt(0).toUpperCase()+e.slice(1)}`;this.filters[s].add(t),this.notifyListeners()}removeIncludePattern(e,t){const s=`include${e.charAt(0).toUpperCase()+e.slice(1)}`;this.filters[s].delete(t),this.notifyListeners()}addExcludePattern(e,t){const s=`exclude${e.charAt(0).toUpperCase()+e.slice(1)}`;this.filters[s].add(t),this.notifyListeners()}removeExcludePattern(e,t){const s=`exclude${e.charAt(0).toUpperCase()+e.slice(1)}`;this.filters[s].delete(t),this.notifyListeners()}clearFilters(){this.filters={includeTestID:new Set,includeNativeID:new Set,includeViewType:new Set,includeComponent:new Set,excludeTestID:new Set,excludeNativeID:new Set,excludeViewType:new Set,excludeComponent:new Set,includePatterns:[],excludePatterns:[],minRenderCount:void 0,maxRenderCount:void 0},this.notifyListeners()}getAvailableProps(){const e=new Set,t=new Set,s=new Set,i=new Set,r=new Set;for(const n of this.renders.values())n.viewType&&e.add(n.viewType),n.testID&&t.add(n.testID),n.nativeID&&s.add(n.nativeID),n.componentName&&i.add(n.componentName),n.accessibilityLabel&&r.add(n.accessibilityLabel);return{viewTypes:Array.from(e).sort(),testIDs:Array.from(t).sort(),nativeIDs:Array.from(s).sort(),componentNames:Array.from(i).sort(),accessibilityLabels:Array.from(r).sort()}}getStats(){let e=0;for(const t of this.renders.values())e+=t.renderCount;return{totalComponents:this.renders.size,totalRenders:e}}subscribe(e){return this.listeners.add(e),e(this.getRenders()),()=>{this.listeners.delete(e)}}subscribeToState(e){return this.stateListeners.add(e),e(this.getState()),()=>{this.stateListeners.delete(e)}}subscribeToSettings(e){return this.settingsListeners.add(e),e(this.settings),()=>{this.settingsListeners.delete(e)}}subscribeToFilters(e){return this.filterListeners.add(e),e(this.filters),()=>{this.filterListeners.delete(e)}}shouldShowRender(e){const t=this.filters;return!(t.includePatterns.length>0&&!this.matchesAnyPatternForInfo(e,t.includePatterns))&&(!(t.excludePatterns.length>0&&this.matchesAnyPatternForInfo(e,t.excludePatterns))&&(!((t.includeViewType.size>0||t.includeTestID.size>0||t.includeNativeID.size>0||t.includeComponent.size>0)&&!(t.includeViewType.size>0&&t.includeViewType.has(e.viewType)||t.includeTestID.size>0&&e.testID&&t.includeTestID.has(e.testID)||t.includeNativeID.size>0&&e.nativeID&&t.includeNativeID.has(e.nativeID)||t.includeComponent.size>0&&e.componentName&&t.includeComponent.has(e.componentName)))&&!(t.excludeViewType.has(e.viewType)||e.testID&&t.excludeTestID.has(e.testID)||e.nativeID&&t.excludeNativeID.has(e.nativeID)||e.componentName&&t.excludeComponent.has(e.componentName))))}getSettings(){return{...this.settings}}setSettings(e){void 0!==e.batchSize&&(e.batchSize=Math.max(10,Math.min(500,e.batchSize))),void 0!==e.maxRenderHistoryPerComponent&&(e.maxRenderHistoryPerComponent=Math.max(5,Math.min(50,e.maxRenderHistoryPerComponent))),e.enableRenderHistory&&!this.settings.trackRenderCauses&&(e.trackRenderCauses=!0),!1===e.trackRenderCauses&&this.settings.enableRenderHistory&&(e.enableRenderHistory=!1),this.settings={...this.settings,...e},void 0!==e.performanceLogging&&_PerformanceLogger.PerformanceLogger.setEnabled(e.performanceLogging),this.notifySettingsListeners()}clearAllRenderHistory(){for(const e of this.renders.values())e.renderHistory=[];this.notifyListeners()}clearRenderHistory(e){const t=this.renders.get(e);t&&(t.renderHistory=[],this.notifyListeners())}getRenderHistoryStats(){let e=0,t=0;for(const s of this.renders.values())s.renderHistory&&s.renderHistory.length>0&&(e+=s.renderHistory.length,t++);return{totalEvents:e,componentsWithHistory:t,averageEventsPerComponent:t>0?e/t:0}}getBatchSize(){return this.settings.batchSize}setBatchSize(e){this.setSettings({batchSize:e})}notifyListeners(){const e=this.getRenders();for(const t of this.listeners)try{t(e)}catch(e){console.error("[RenderTracker] Error in listener:",e)}}notifyStateListeners(){const e=this.getState();for(const t of this.stateListeners)try{t(e)}catch(e){console.error("[RenderTracker] Error in state listener:",e)}}notifySettingsListeners(){const e=this.getSettings();for(const t of this.settingsListeners)try{t(e)}catch(e){console.error("[RenderTracker] Error in settings listener:",e)}}notifyFilterListeners(){const e=this.getFilters();for(const t of this.filterListeners)try{t(e)}catch(e){console.error("[RenderTracker] Error in filter listener:",e)}}}const RenderTracker=exports.RenderTracker=new RenderTrackerSingleton;var _default=exports.default=RenderTracker;

package/lib/commonjs/highlight-updates/utils/ViewTypeMapper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.VIEW_TYPE_MAP=void 0,exports.getAllComponentNames=getAllComponentNames,exports.getAllNativeViewTypes=getAllNativeViewTypes,exports.getComponentDisplayName=getComponentDisplayName,exports.getNativeViewType=getNativeViewType,exports.isKnownViewType=isKnownViewType;const VIEW_TYPE_MAP=exports.VIEW_TYPE_MAP={RCTView:"View",RCTSafeAreaView:"SafeAreaView",RCTModalHostView:"Modal",RCTText:"Text",RCTRawText:"RawText",RCTVirtualText:"VirtualText",RCTTextInlineImage:"TextInlineImage",RCTImageView:"Image",RCTImage:"Image",RCTScrollView:"ScrollView",RCTScrollContentView:"ScrollContentView",AndroidHorizontalScrollView:"HorizontalScrollView",AndroidHorizontalScrollContentView:"HorizontalScrollContentView",RCTSinglelineTextInputView:"TextInput",RCTMultilineTextInputView:"TextInput (Multiline)",AndroidTextInput:"TextInput",RCTInputAccessoryView:"InputAccessoryView",RCTRefreshControl:"RefreshControl",AndroidSwipeRefreshLayout:"RefreshControl",PullToRefreshView:"RefreshControl",RCTSwitch:"Switch",AndroidSwitch:"Switch",RCTSlider:"Slider",RCTActivityIndicatorView:"ActivityIndicator",AndroidProgressBar:"ActivityIndicator",AndroidDrawerLayout:"DrawerLayout",VirtualView:"VirtualView",VirtualViewExperimental:"VirtualView",DebuggingOverlay:"DebuggingOverlay",LayoutConformance:"LayoutConformance",UnimplementedNativeView:"UnimplementedView",RKShimmeringView:"ShimmeringView",RCTTemplateView:"TemplateView",RCTAxialGradientView:"AxialGradientView",RCTMap:"Map",RCTWebView:"WebView",RCTKeyframes:"Keyframes",RCTImpressionTrackingView:"ImpressionTrackingView",RNSVGSvgView:"Svg",RNSVGGroup:"G",RNSVGPath:"Path",RNSVGText:"SvgText",RNSVGTSpan:"TSpan",RNSVGTextPath:"TextPath",RNSVGImage:"SvgImage",RNSVGCircle:"Circle",RNSVGEllipse:"Ellipse",RNSVGLine:"Line",RNSVGRect:"Rect",RNSVGClipPath:"ClipPath",RNSVGDefs:"Defs",RNSVGUse:"Use",RNSVGSymbol:"Symbol",RNSVGPattern:"Pattern",RNSVGMask:"Mask",RNSVGForeignObject:"ForeignObject",RNSVGMarker:"Marker",RNSVGLinearGradient:"LinearGradient",RNSVGRadialGradient:"RadialGradient",RNSVGFilter:"Filter",RNSVGFeBlend:"FeBlend",RNSVGFeColorMatrix:"FeColorMatrix",RNSVGFeComposite:"FeComposite",RNSVGFeFlood:"FeFlood",RNSVGFeGaussianBlur:"FeGaussianBlur",RNSVGFeMerge:"FeMerge",RNSVGFeOffset:"FeOffset",RNSVGPolygon:"Polygon",RNSVGPolyline:"Polyline",RNSVGStop:"Stop",RNGestureHandlerRootView:"GestureHandlerRootView",RNGestureHandlerButton:"GestureHandlerButton",RNCSafeAreaProvider:"SafeAreaProvider",RNCSafeAreaView:"SafeAreaView",RNSScreen:"Screen",RNSScreenContainer:"ScreenContainer",RNSScreenStack:"ScreenStack",RNSScreenStackHeaderConfig:"ScreenStackHeaderConfig",RNSScreenStackHeaderSubview:"ScreenStackHeaderSubview",RNSSearchBar:"SearchBar",RNSFullWindowOverlay:"FullWindowOverlay",RNSModalScreen:"ModalScreen",ReanimatedView:"Animated.View",ExpoView:"ExpoView",ExpoBlurView:"BlurView",ExpoLinearGradient:"LinearGradient",ExpoImage:"ExpoImage",ExpoVideoView:"VideoView",ExpoCamera:"Camera",ExpoBarCodeScannerView:"BarCodeScanner",RNCWebView:"WebView",AIRMap:"MapView",AIRMapMarker:"Marker",AIRMapPolyline:"Polyline",AIRMapPolygon:"Polygon",AIRMapCircle:"Circle",AIRMapCallout:"Callout",RCTVideo:"Video",LottieAnimationView:"LottieView",FastImageView:"FastImage"};function getComponentDisplayName(e){return VIEW_TYPE_MAP[e]||e}function getNativeViewType(e){for(const[i,t]of Object.entries(VIEW_TYPE_MAP))if(t===e)return i;return null}function isKnownViewType(e){return e in VIEW_TYPE_MAP}function getAllNativeViewTypes(){return Object.keys(VIEW_TYPE_MAP)}function getAllComponentNames(){return[...new Set(Object.values(VIEW_TYPE_MAP))]}var _default=exports.default={VIEW_TYPE_MAP:VIEW_TYPE_MAP,getComponentDisplayName:getComponentDisplayName,getNativeViewType:getNativeViewType,isKnownViewType:isKnownViewType,getAllNativeViewTypes:getAllNativeViewTypes,getAllComponentNames:getAllComponentNames};

package/lib/commonjs/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"CAUSE_CONFIG",{enumerable:!0,get:function(){return _RenderCauseBadge.CAUSE_CONFIG}}),Object.defineProperty(exports,"COMPONENT_CAUSE_CONFIG",{enumerable:!0,get:function(){return _RenderCauseBadge.COMPONENT_CAUSE_CONFIG}}),Object.defineProperty(exports,"HighlightFilterView",{enumerable:!0,get:function(){return _HighlightFilterView.HighlightFilterView}}),Object.defineProperty(exports,"HighlightUpdatesController",{enumerable:!0,get:function(){return _HighlightUpdatesController.default}}),Object.defineProperty(exports,"HighlightUpdatesModal",{enumerable:!0,get:function(){return _HighlightUpdatesModal.HighlightUpdatesModal}}),Object.defineProperty(exports,"HighlightUpdatesOverlay",{enumerable:!0,get:function(){return _HighlightUpdatesOverlay.HighlightUpdatesOverlay}}),Object.defineProperty(exports,"PerformanceLogger",{enumerable:!0,get:function(){return _PerformanceLogger.PerformanceLogger}}),Object.defineProperty(exports,"RenderCauseBadge",{enumerable:!0,get:function(){return _RenderCauseBadge.RenderCauseBadge}}),Object.defineProperty(exports,"RenderDetailView",{enumerable:!0,get:function(){return _RenderDetailView.RenderDetailView}}),Object.defineProperty(exports,"RenderHistoryFooter",{enumerable:!0,get:function(){return _RenderHistoryViewer.RenderHistoryFooter}}),Object.defineProperty(exports,"RenderHistoryViewer",{enumerable:!0,get:function(){return _RenderHistoryViewer.RenderHistoryViewer}}),Object.defineProperty(exports,"RenderListItem",{enumerable:!0,get:function(){return _RenderListItem.RenderListItem}}),Object.defineProperty(exports,"RenderTracker",{enumerable:!0,get:function(){return _RenderTracker.RenderTracker}}),Object.defineProperty(exports,"TwoLevelCauseBadge",{enumerable:!0,get:function(){return _RenderCauseBadge.TwoLevelCauseBadge}}),Object.defineProperty(exports,"VIEW_TYPE_MAP",{enumerable:!0,get:function(){return _ViewTypeMapper.VIEW_TYPE_MAP}}),Object.defineProperty(exports,"capturePropsSnapshot",{enumerable:!0,get:function(){return _RenderCauseDetector.capturePropsSnapshot}}),Object.defineProperty(exports,"captureStateSnapshot",{enumerable:!0,get:function(){return _RenderCauseDetector.captureStateSnapshot}}),Object.defineProperty(exports,"clearRenderCauseState",{enumerable:!0,get:function(){return _RenderCauseDetector.clearRenderCauseState}}),Object.defineProperty(exports,"createHighlightUpdatesModalTool",{enumerable:!0,get:function(){return _preset.createHighlightUpdatesModalTool}}),Object.defineProperty(exports,"createHighlightUpdatesTool",{enumerable:!0,get:function(){return _preset.createHighlightUpdatesTool}}),Object.defineProperty(exports,"detectRenderCause",{enumerable:!0,get:function(){return _RenderCauseDetector.detectRenderCause}}),Object.defineProperty(exports,"disableProfilerLogging",{enumerable:!0,get:function(){return _ProfilerInterceptor.disableProfilerLogging}}),Object.defineProperty(exports,"enableProfilerLogging",{enumerable:!0,get:function(){return _ProfilerInterceptor.enableProfilerLogging}}),Object.defineProperty(exports,"getAllComponentNames",{enumerable:!0,get:function(){return _ViewTypeMapper.getAllComponentNames}}),Object.defineProperty(exports,"getAllNativeViewTypes",{enumerable:!0,get:function(){return _ViewTypeMapper.getAllNativeViewTypes}}),Object.defineProperty(exports,"getComponentDisplayName",{enumerable:!0,get:function(){return _ViewTypeMapper.getComponentDisplayName}}),Object.defineProperty(exports,"getNativeViewType",{enumerable:!0,get:function(){return _ViewTypeMapper.getNativeViewType}}),Object.defineProperty(exports,"getRenderCauseStats",{enumerable:!0,get:function(){return _RenderCauseDetector.getRenderCauseStats}}),Object.defineProperty(exports,"highlightUpdatesModalPreset",{enumerable:!0,get:function(){return _preset.highlightUpdatesModalPreset}}),Object.defineProperty(exports,"highlightUpdatesPreset",{enumerable:!0,get:function(){return _preset.highlightUpdatesPreset}}),Object.defineProperty(exports,"installProfilerInterceptor",{enumerable:!0,get:function(){return _ProfilerInterceptor.installProfilerInterceptor}}),Object.defineProperty(exports,"isInterceptorInstalled",{enumerable:!0,get:function(){return _ProfilerInterceptor.isInterceptorInstalled}}),Object.defineProperty(exports,"isKnownViewType",{enumerable:!0,get:function(){return _ViewTypeMapper.isKnownViewType}}),Object.defineProperty(exports,"isLoggingEnabled",{enumerable:!0,get:function(){return _ProfilerInterceptor.isLoggingEnabled}}),Object.defineProperty(exports,"removeRenderCauseState",{enumerable:!0,get:function(){return _RenderCauseDetector.removeRenderCauseState}}),Object.defineProperty(exports,"safeCloneForHistory",{enumerable:!0,get:function(){return _RenderCauseDetector.safeCloneForHistory}}),Object.defineProperty(exports,"setComparisonCallback",{enumerable:!0,get:function(){return _ProfilerInterceptor.setComparisonCallback}}),Object.defineProperty(exports,"uninstallProfilerInterceptor",{enumerable:!0,get:function(){return _ProfilerInterceptor.uninstallProfilerInterceptor}});var _preset=require("./preset"),_HighlightUpdatesController=_interopRequireDefault(require("./highlight-updates/utils/HighlightUpdatesController")),_HighlightUpdatesOverlay=require("./highlight-updates/HighlightUpdatesOverlay"),_ProfilerInterceptor=require("./highlight-updates/utils/ProfilerInterceptor"),_RenderTracker=require("./highlight-updates/utils/RenderTracker"),_RenderCauseDetector=require("./highlight-updates/utils/RenderCauseDetector"),_PerformanceLogger=require("./highlight-updates/utils/PerformanceLogger"),_ViewTypeMapper=require("./highlight-updates/utils/ViewTypeMapper"),_HighlightUpdatesModal=require("./highlight-updates/components/HighlightUpdatesModal"),_RenderListItem=require("./highlight-updates/components/RenderListItem"),_RenderDetailView=require("./highlight-updates/components/RenderDetailView"),_HighlightFilterView=require("./highlight-updates/components/HighlightFilterView"),_RenderCauseBadge=require("./highlight-updates/components/RenderCauseBadge"),_RenderHistoryViewer=require("./highlight-updates/components/RenderHistoryViewer");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}

package/lib/commonjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/lib/commonjs/preset.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.createHighlightUpdatesModalTool=createHighlightUpdatesModalTool,exports.createHighlightUpdatesTool=createHighlightUpdatesTool,exports.highlightUpdatesPreset=exports.highlightUpdatesModalPreset=void 0;var _react=_interopRequireWildcard(require("react")),_floatingToolsCore=require("@buoy-gg/floating-tools-core"),_HighlightUpdatesController=_interopRequireDefault(require("./highlight-updates/utils/HighlightUpdatesController")),_HighlightUpdatesModal=require("./highlight-updates/components/HighlightUpdatesModal"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var l,a,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(l=t?o:i){if(l.has(e))return l.get(e);l.set(e,n)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(l=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?l(n,t,a):n[t]=e[t]);return n})(e,t)}function HighlightIcon({size:e}){const[t,i]=(0,_react.useState)(()=>_HighlightUpdatesController.default.isEnabled());return(0,_react.useEffect)(()=>_HighlightUpdatesController.default.subscribe(e=>{i(e)}),[]),(0,_jsxRuntime.jsx)(_floatingToolsCore.HighlighterIcon,{size:e,color:t?"#10b981":"#6b7280"})}function EmptyComponent(){return null}function HighlightUpdatesModalWithBadgeNavigation(e){const[t,i]=(0,_react.useState)(null);(0,_react.useEffect)(()=>(e.visible&&_HighlightUpdatesController.default.setBadgePressCallback(e=>{i(e)}),()=>{e.visible||_HighlightUpdatesController.default.setBadgePressCallback(null)}),[e.visible]);const o=(0,_react.useCallback)(()=>{i(null)},[]);return(0,_jsxRuntime.jsx)(_HighlightUpdatesModal.HighlightUpdatesModal,{...e,initialNativeTag:t,onInitialNativeTagHandled:o})}const highlightUpdatesPreset=exports.highlightUpdatesPreset={id:"highlight-updates",name:"HIGHLIGHT",description:"Toggle component render highlights",slot:"row",icon:HighlightIcon,component:EmptyComponent,props:{},launchMode:"toggle-only",onPress:()=>{_HighlightUpdatesController.default.isInitialized()||_HighlightUpdatesController.default.initialize(),_HighlightUpdatesController.default.toggle()}};function createHighlightUpdatesTool(e){const t=e?.enabledColor||"#10b981",i=e?.disabledColor||"#6b7280";return e?.autoInitialize&&setTimeout(()=>{_HighlightUpdatesController.default.initialize()},1e3),{id:e?.id||"highlight-updates",name:e?.name||"HIGHLIGHT",description:e?.description||"Toggle component render highlights",slot:"row",icon:({size:e})=>{const[o,l]=(0,_react.useState)(()=>_HighlightUpdatesController.default.isEnabled());return(0,_react.useEffect)(()=>_HighlightUpdatesController.default.subscribe(e=>{l(e)}),[]),(0,_jsxRuntime.jsx)(_floatingToolsCore.HighlighterIcon,{size:e,color:o?t:i})},component:EmptyComponent,props:{},launchMode:"toggle-only",onPress:()=>{_HighlightUpdatesController.default.isInitialized()||_HighlightUpdatesController.default.initialize(),_HighlightUpdatesController.default.toggle()}}}const highlightUpdatesModalPreset=exports.highlightUpdatesModalPreset={id:"highlight-updates-modal",name:"HIGHLIGHT",description:"View component render tracking modal",slot:"both",icon:({size:e})=>(0,_jsxRuntime.jsx)(_floatingToolsCore.HighlighterIcon,{size:e}),component:HighlightUpdatesModalWithBadgeNavigation,props:{enableSharedModalDimensions:!1}};function createHighlightUpdatesModalTool(e){const t=e?.enabledColor||"#10b981";return e?.autoInitialize&&setTimeout(()=>{_HighlightUpdatesController.default.initialize()},1e3),{id:e?.id||"highlight-updates-modal",name:e?.name||"HIGHLIGHT",description:e?.description||"View component render tracking modal",slot:"both",icon:({size:e})=>(0,_jsxRuntime.jsx)(_floatingToolsCore.HighlighterIcon,{size:e,color:t}),component:HighlightUpdatesModalWithBadgeNavigation,props:{enableSharedModalDimensions:!1}}}

package/lib/module/highlight-updates/HighlightUpdatesOverlay.js

@@ -0,0 +1 @@
+"use strict";import React,{useEffect,useState,useRef,useCallback,useLayoutEffect}from"react";import{View,Text,StyleSheet,TouchableOpacity}from"react-native";import{buoyColors}from"@buoy-gg/shared-ui";import HighlightUpdatesController from"./utils/HighlightUpdatesController";import{PerformanceLogger,markOverlayRendered}from"./utils/PerformanceLogger";import{RenderTracker}from"./utils/RenderTracker";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";const HIGHLIGHT_DURATION=1e3;export function HighlightUpdatesOverlay({onBadgePress:e}={}){const[t,r]=useState([]),[o,l]=useState(()=>HighlightUpdatesController.getFrozen()),[s,i]=useState(null),n=useRef(null),a=useRef(0),h=useRef(0),g=useRef(o);g.current=o,PerformanceLogger.isEnabled()&&(a.current=performance.now(),h.current=t.length),useLayoutEffect(()=>{if(PerformanceLogger.isEnabled()&&a.current>0&&h.current>0){const e=performance.now()-a.current;markOverlayRendered(h.current,e)}}),useEffect(()=>HighlightUpdatesController.subscribeToFreeze(e=>{l(e)}),[]),useEffect(()=>RenderTracker.subscribeToFilters(()=>{r(e=>e.filter(e=>{const t=RenderTracker.getRender(String(e.id));return!t||RenderTracker.shouldShowRender(t)}))}),[]),useEffect(()=>(HighlightUpdatesController.setSpotlightCallback(e=>{i(e)}),()=>{HighlightUpdatesController.setSpotlightCallback(null)}),[]);const d=useCallback(e=>{const t=Date.now(),o=e.map(e=>({...e,timestamp:t}));r(e=>{const t=[...e];for(const e of o){const r=t.findIndex(t=>t.id===e.id);r>=0?t[r]=e:t.push(e)}return t})},[]);useEffect(()=>(HighlightUpdatesController.setHighlightCallback(d),n.current=setInterval(()=>{if(g.current)return;const e=Date.now();r(t=>t.filter(t=>e-t.timestamp<1e3))},50),()=>{HighlightUpdatesController.setHighlightCallback(null),n.current&&clearInterval(n.current)}),[d]);const c=e||HighlightUpdatesController.getBadgePressCallback(),u=useCallback(t=>{e?e(t):HighlightUpdatesController.handleBadgePress(t)},[e]),p=s?RenderTracker.getRender(String(s)):null;return 0!==t.length||p?.measurements?_jsxs(View,{style:styles.overlay,pointerEvents:"box-none",nativeID:"highlight-updates-overlay",children:[p?.measurements&&_jsxs(_Fragment,{children:[_jsx(View,{pointerEvents:"none",nativeID:"__spotlight_highlight__",style:[styles.spotlightHighlight,{left:p.measurements.x-3,top:p.measurements.y-3,width:p.measurements.width+6,height:p.measurements.height+6}]}),_jsx(View,{pointerEvents:"none",style:[styles.spotlightLabel,{left:p.measurements.x,top:p.measurements.y+p.measurements.height+4}],children:_jsx(Text,{style:styles.spotlightLabelText,children:p.componentName||p.displayName||p.viewType})})]}),t.map(e=>_jsx(View,{pointerEvents:"box-none",nativeID:`__highlight_rect_${e.id}__`,style:[styles.highlight,{left:e.x,top:e.y,width:e.width,height:e.height,borderColor:e.color}],children:e.count>0&&(c?_jsx(TouchableOpacity,{onPress:()=>u(e.id),style:[styles.badge,{backgroundColor:e.color}],activeOpacity:.7,hitSlop:{top:8,bottom:8,left:8,right:8},children:_jsx(Text,{style:styles.badgeText,nativeID:`__highlight_text_${e.id}__`,children:e.count})}):_jsx(View,{style:[styles.badge,{backgroundColor:e.color}],nativeID:`__highlight_badge_${e.id}__`,pointerEvents:"none",children:_jsx(Text,{style:styles.badgeText,nativeID:`__highlight_text_${e.id}__`,children:e.count})}))},`highlight-${e.id}`))]}):null}const styles=StyleSheet.create({overlay:{position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:999999,elevation:999999,borderWidth:0},highlight:{position:"absolute",borderWidth:2,borderStyle:"solid",backgroundColor:"transparent"},badge:{position:"absolute",top:0,right:0,height:14,borderRadius:0,justifyContent:"center",alignItems:"center",paddingHorizontal:2},badgeText:{color:"#000",fontSize:9,fontWeight:"bold"},spotlightHighlight:{position:"absolute",borderWidth:2,borderStyle:"dashed",borderColor:buoyColors.primary,backgroundColor:"transparent"},spotlightLabel:{position:"absolute",backgroundColor:buoyColors.card,borderWidth:1,borderColor:buoyColors.primary,paddingHorizontal:8,paddingVertical:3,borderRadius:4},spotlightLabelText:{color:buoyColors.primary,fontSize:11,fontWeight:"600",fontFamily:"monospace"}});export default HighlightUpdatesOverlay;

package/lib/module/highlight-updates/components/HighlightFilterView.js

@@ -0,0 +1 @@
+"use strict";import React,{useState,useCallback}from"react";import{View,Text,TouchableOpacity,TextInput,StyleSheet,ScrollView,Modal,Pressable,Switch}from"react-native";import{Eye,Filter,Plus,X,Box,Settings,Hash,SectionHeader,buoyColors}from"@buoy-gg/shared-ui";import{IdentifierBadge,IDENTIFIER_CONFIG}from"./IdentifierBadge";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const getFilterConfig=e=>IDENTIFIER_CONFIG[e],FILTER_TYPES=["any","viewType","testID","nativeID","component","accessibilityLabel"];function TypePicker({onSelect:e,onCancel:t}){return _jsxs(View,{nativeID:"__rn_buoy__type-picker",style:styles.typePicker,children:[_jsx(View,{style:styles.typePickerRow,children:FILTER_TYPES.map(t=>{const o=getFilterConfig(t),s=o.icon;return _jsxs(TouchableOpacity,{style:[styles.typeOption,{backgroundColor:o.color+"15",borderColor:o.color+"40"}],onPress:()=>e(t),children:[_jsx(s,{size:14,color:o.color}),_jsx(Text,{style:[styles.typeOptionText,{color:o.color}],children:o.label})]},t)})}),_jsx(TouchableOpacity,{onPress:t,style:styles.typePickerCancel,children:_jsx(X,{size:16,color:buoyColors.textMuted})})]})}function PatternInput({type:e,onSubmit:t,onCancel:o}){const[s,n]=useState(""),l=getFilterConfig(e),r=()=>{s.trim()&&t(s.trim())};return _jsxs(View,{nativeID:"__rn_buoy__pattern-input",style:styles.patternInputContainer,children:[_jsx(IdentifierBadge,{type:e,value:"",badgeOnly:!0,compact:!0}),_jsx(TextInput,{value:s,onChangeText:n,onSubmitEditing:r,placeholder:"Enter pattern...",placeholderTextColor:buoyColors.textMuted,style:styles.patternInput,autoFocus:!0,returnKeyType:"done",autoCorrect:!1,autoCapitalize:"none"}),s.trim()&&_jsx(TouchableOpacity,{onPress:r,style:[styles.addPatternButton,{backgroundColor:l.color+"20"}],children:_jsx(Text,{style:[styles.addPatternButtonText,{color:l.color}],children:"Add"})}),_jsx(TouchableOpacity,{onPress:o,style:styles.cancelButton,children:_jsx(X,{size:16,color:buoyColors.textMuted})})]})}function PatternChip({pattern:e,onRemove:t}){const o=getFilterConfig(e.type);return _jsxs(TouchableOpacity,{style:[styles.patternChip,{borderColor:o.color+"40"}],onPress:t,activeOpacity:.7,children:[_jsx(View,{style:[styles.patternChipBadge,{backgroundColor:o.color+"20"}],children:_jsx(Text,{style:[styles.patternChipBadgeText,{color:o.color}],children:o.shortLabel})}),_jsx(Text,{style:styles.patternChipValue,numberOfLines:1,children:e.value}),_jsx(X,{size:12,color:buoyColors.textMuted,style:styles.patternChipX})]})}const ALL_CATEGORY_CONFIG={label:"All",shortLabel:"All",color:buoyColors.textSecondary,icon:Box};function DetectedCategoryBadge({filterType:e,count:t,isSelected:o,onPress:s}){const n="all"===e?ALL_CATEGORY_CONFIG:getFilterConfig(e);return _jsxs(TouchableOpacity,{style:[styles.categoryBadge,{backgroundColor:n.color+"15",borderColor:o?n.color:n.color+"40",borderWidth:o?2:1}],onPress:s,children:[_jsx(n.icon,{size:12,color:n.color}),_jsx(Text,{style:[styles.categoryBadgeText,{color:n.color}],children:n.label}),_jsx(View,{style:[styles.categoryBadgeCountBubble,{backgroundColor:n.color+"25"}],children:_jsx(Text,{style:[styles.categoryBadgeCount,{color:n.color}],children:t})})]})}const BATCH_SIZE_PRESETS=[{value:20,label:"20"},{value:50,label:"50"},{value:100,label:"100"},{value:150,label:"150"},{value:250,label:"250"},{value:500,label:"500"}],DEBUG_LOG_LEVEL_PRESETS=[{value:"off",label:"Off",description:"No debug logging"},{value:"minimal",label:"Minimal",description:"Only hook value changes"},{value:"verbose",label:"Verbose",description:"Component + cause + changes"},{value:"all",label:"All",description:"Full fiber dump"}];export function HighlightFilterView({filters:e,onFilterChange:t,settings:o,onSettingsChange:s,availableProps:n,activeTab:l}){const[r,i]=useState(!1),[a,c]=useState(!1),[d,u]=useState(null),[y,p]=useState(null),[g,x]=useState("all"),[b,h]=useState(null),C=(e=>{switch(e){case"viewType":return n.viewTypes.map(e=>({value:e,type:"viewType"}));case"testID":return n.testIDs.map(e=>({value:e,type:"testID"}));case"nativeID":return n.nativeIDs.map(e=>({value:e,type:"nativeID"}));case"component":return n.componentNames.map(e=>({value:e,type:"component"}));case"accessibilityLabel":return n.accessibilityLabels.map(e=>({value:e,type:"accessibilityLabel"}));default:return[...n.viewTypes.map(e=>({value:e,type:"viewType"})),...n.testIDs.map(e=>({value:e,type:"testID"})),...n.nativeIDs.map(e=>({value:e,type:"nativeID"})),...n.componentNames.map(e=>({value:e,type:"component"})),...n.accessibilityLabels.map(e=>({value:e,type:"accessibilityLabel"}))]}})(g),_=n.viewTypes.length+n.testIDs.length+n.nativeIDs.length+n.componentNames.length+n.accessibilityLabels.length,m=useCallback((o,s)=>{const n=[...e.includePatterns,{type:o,value:s}];t({includePatterns:n}),u(null)},[e.includePatterns,t]),T=useCallback((o,s)=>{const n=[...e.excludePatterns,{type:o,value:s}];t({excludePatterns:n}),p(null)},[e.excludePatterns,t]),j=useCallback(o=>{const s=e.includePatterns.filter((e,t)=>t!==o);t({includePatterns:s})},[e.includePatterns,t]),S=useCallback(o=>{const s=e.excludePatterns.filter((e,t)=>t!==o);t({excludePatterns:s})},[e.excludePatterns,t]),f=useCallback((e,t)=>{h({type:e,value:t})},[]),w=useCallback(()=>{b&&(m(b.type,b.value),h(null))},[b,m]),v=useCallback(()=>{b&&(T(b.type,b.value),h(null))},[b,T]);return _jsx(View,{style:styles.container,children:_jsx(ScrollView,{nativeID:"__rn_buoy__filter-view",style:styles.scrollView,contentContainerStyle:styles.scrollContent,showsVerticalScrollIndicator:!1,children:"filters"===l?_jsxs(_Fragment,{children:[_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Eye,color:buoyColors.success,size:12}),_jsx(SectionHeader.Title,{children:"INCLUDE ONLY"}),e.includePatterns.length>0&&_jsx(SectionHeader.Badge,{count:e.includePatterns.length,color:buoyColors.success})]}),_jsx(Text,{style:styles.sectionDescription,children:"Show only components matching these patterns. If any are set, components must match at least one."}),e.includePatterns.length>0&&_jsx(View,{style:styles.patternChips,children:e.includePatterns.map((e,t)=>_jsx(PatternChip,{pattern:e,onRemove:()=>j(t)},`${e.type}-${e.value}-${t}`))}),_jsx(View,{style:styles.addPatternRow,children:r?_jsx(TypePicker,{onSelect:e=>{i(!1),u(e)},onCancel:()=>i(!1)}):d?_jsx(PatternInput,{type:d,onSubmit:e=>m(d,e),onCancel:()=>u(null)}):_jsxs(TouchableOpacity,{style:[styles.addButton,{borderColor:buoyColors.success+"40"}],onPress:()=>i(!0),children:[_jsx(Plus,{size:14,color:buoyColors.success}),_jsx(Text,{style:[styles.addButtonText,{color:buoyColors.success}],children:"Add include pattern"})]})})]}),_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Filter,color:buoyColors.primary,size:12}),_jsx(SectionHeader.Title,{children:"EXCLUDE"}),e.excludePatterns.length>0&&_jsx(SectionHeader.Badge,{count:e.excludePatterns.length,color:buoyColors.primary})]}),_jsx(Text,{style:styles.sectionDescription,children:"Hide components matching these patterns from the list."}),e.excludePatterns.length>0&&_jsx(View,{style:styles.patternChips,children:e.excludePatterns.map((e,t)=>_jsx(PatternChip,{pattern:e,onRemove:()=>S(t)},`${e.type}-${e.value}-${t}`))}),_jsx(View,{style:styles.addPatternRow,children:a?_jsx(TypePicker,{onSelect:e=>{c(!1),p(e)},onCancel:()=>c(!1)}):y?_jsx(PatternInput,{type:y,onSubmit:e=>T(y,e),onCancel:()=>p(null)}):_jsxs(TouchableOpacity,{style:[styles.addButton,{borderColor:buoyColors.primary+"40"}],onPress:()=>c(!0),children:[_jsx(Plus,{size:14,color:buoyColors.primary}),_jsx(Text,{style:[styles.addButtonText,{color:buoyColors.primary}],children:"Add exclude pattern"})]})})]}),_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Hash,color:buoyColors.warning,size:12}),_jsx(SectionHeader.Title,{children:"RENDER COUNT RANGE"}),(void 0!==e.minRenderCount||void 0!==e.maxRenderCount)&&_jsx(SectionHeader.Badge,{count:1,color:buoyColors.warning})]}),_jsx(Text,{style:styles.sectionDescription,children:"Show only components with render count in a specific range."}),_jsxs(View,{nativeID:"__rn_buoy__render-count-range",style:styles.renderCountRangeContainer,children:[_jsxs(View,{style:styles.renderCountInputRow,children:[_jsxs(View,{style:styles.renderCountInputGroup,children:[_jsx(Text,{style:styles.renderCountLabel,children:"Min"}),_jsx(TextInput,{value:void 0!==e.minRenderCount?String(e.minRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);""===e||void 0===e?t({minRenderCount:void 0}):!isNaN(o)&&o>=0&&t({minRenderCount:o})},placeholder:"0",placeholderTextColor:buoyColors.textMuted,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]}),_jsx(Text,{style:styles.renderCountSeparator,children:"to"}),_jsxs(View,{style:styles.renderCountInputGroup,children:[_jsx(Text,{style:styles.renderCountLabel,children:"Max"}),_jsx(TextInput,{value:void 0!==e.maxRenderCount?String(e.maxRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);""===e||void 0===e?t({maxRenderCount:void 0}):!isNaN(o)&&o>=0&&t({maxRenderCount:o})},placeholder:"∞",placeholderTextColor:buoyColors.textMuted,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]})]}),(void 0!==e.minRenderCount||void 0!==e.maxRenderCount)&&_jsxs(TouchableOpacity,{style:styles.clearRangeButton,onPress:()=>t({minRenderCount:void 0,maxRenderCount:void 0}),children:[_jsx(X,{size:12,color:buoyColors.warning}),_jsx(Text,{style:styles.clearRangeButtonText,children:"Clear Range"})]})]})]}),_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Box,color:buoyColors.textSecondary,size:12}),_jsx(SectionHeader.Title,{children:"DETECTED ITEMS"})]}),_jsx(Text,{style:styles.sectionDescription,children:"Tap an item to quickly add it as an exclude pattern."}),_jsxs(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,style:styles.categoryBadgeScroll,contentContainerStyle:styles.categoryBadgeScrollContent,children:[_>0&&_jsx(DetectedCategoryBadge,{filterType:"all",count:_,isSelected:"all"===g,onPress:()=>x("all")}),n.viewTypes.length>0&&_jsx(DetectedCategoryBadge,{filterType:"viewType",count:n.viewTypes.length,isSelected:"viewType"===g,onPress:()=>x("viewType")}),n.testIDs.length>0&&_jsx(DetectedCategoryBadge,{filterType:"testID",count:n.testIDs.length,isSelected:"testID"===g,onPress:()=>x("testID")}),n.nativeIDs.length>0&&_jsx(DetectedCategoryBadge,{filterType:"nativeID",count:n.nativeIDs.length,isSelected:"nativeID"===g,onPress:()=>x("nativeID")}),n.componentNames.length>0&&_jsx(DetectedCategoryBadge,{filterType:"component",count:n.componentNames.length,isSelected:"component"===g,onPress:()=>x("component")}),n.accessibilityLabels.length>0&&_jsx(DetectedCategoryBadge,{filterType:"accessibilityLabel",count:n.accessibilityLabels.length,isSelected:"accessibilityLabel"===g,onPress:()=>x("accessibilityLabel")})]}),_jsx(View,{nativeID:"__rn_buoy__detected-items",style:styles.detectedItemsContainer,children:C.length>0?_jsx(ScrollView,{style:styles.detectedItemsScroll,contentContainerStyle:styles.detectedItems,nestedScrollEnabled:!0,showsVerticalScrollIndicator:!0,children:C.map(e=>{const t=getFilterConfig(e.type);return _jsx(TouchableOpacity,{style:[styles.detectedItem,{borderColor:t.color+"40"}],onPress:()=>f(e.type,e.value),children:"all"===g?_jsx(IdentifierBadge,{type:e.type,value:e.value,compact:!0,shortLabel:!0}):_jsx(Text,{style:styles.detectedItemText,numberOfLines:1,children:e.value})},`${e.type}-${e.value}`)})}):_jsx(Text,{style:styles.emptyText,children:"No items detected yet. Start tracking to see components here."})})]}),_jsx(Modal,{visible:null!==b,transparent:!0,animationType:"fade",onRequestClose:()=>h(null),children:_jsx(Pressable,{style:styles.modalOverlay,onPress:()=>h(null),children:_jsx(View,{style:styles.actionPopup,children:b&&_jsxs(_Fragment,{children:[_jsx(View,{style:styles.actionPopupHeader,children:_jsx(IdentifierBadge,{type:b.type,value:b.value,compact:!0,shortLabel:!0})}),_jsxs(View,{style:styles.actionPopupButtons,children:[_jsxs(TouchableOpacity,{style:[styles.actionPopupButton,styles.actionPopupInclude],onPress:w,children:[_jsx(Eye,{size:16,color:buoyColors.success}),_jsx(Text,{style:[styles.actionPopupButtonText,{color:buoyColors.success}],children:"Include Only"})]}),_jsxs(TouchableOpacity,{style:[styles.actionPopupButton,styles.actionPopupExclude],onPress:v,children:[_jsx(Filter,{size:16,color:buoyColors.primary}),_jsx(Text,{style:[styles.actionPopupButtonText,{color:buoyColors.primary}],children:"Exclude"})]})]}),_jsx(TouchableOpacity,{style:styles.actionPopupCancel,onPress:()=>h(null),children:_jsx(Text,{style:styles.actionPopupCancelText,children:"Cancel"})})]})})})}),_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Filter,color:buoyColors.textMuted,size:12}),_jsx(SectionHeader.Title,{children:"HOW FILTERS WORK"})]}),_jsx(View,{style:styles.howItWorks,children:_jsxs(Text,{style:styles.howItWorksText,children:[_jsx(Text,{style:styles.howItWorksBold,children:"Any:"})," Matches against all fields","\n",_jsx(Text,{style:styles.howItWorksBold,children:"ViewType:"})," Native component class (RCTView, RCTText)","\n",_jsx(Text,{style:styles.howItWorksBold,children:"testID:"})," Component testID prop","\n",_jsx(Text,{style:styles.howItWorksBold,children:"Component:"})," React component name from fiber"]})})]})]}):_jsx(_Fragment,{children:_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Settings,color:buoyColors.textMuted,size:12}),_jsx(SectionHeader.Title,{children:"SETTINGS"})]}),_jsxs(View,{style:styles.settingsSection,children:[_jsxs(View,{style:styles.settingItem,children:[_jsxs(View,{style:styles.settingHeader,children:[_jsx(Text,{style:styles.settingLabel,children:"Show Render Count"}),_jsx(Switch,{value:o.showRenderCount,onValueChange:e=>{s({showRenderCount:e}),!e&&o.trackRenderCauses&&s({trackRenderCauses:!1})},trackColor:{false:buoyColors.input,true:buoyColors.success+"80"},thumbColor:o.showRenderCount?buoyColors.success:buoyColors.textMuted})]}),_jsx(Text,{style:styles.settingDescription,children:"Display render count badge on highlights. Disabling improves performance by skipping count tracking."})]}),_jsxs(View,{style:[styles.settingItem,styles.settingItemSpaced],children:[_jsxs(View,{style:styles.settingHeader,children:[_jsx(Text,{style:[styles.settingLabel,!o.showRenderCount&&styles.settingLabelDisabled],children:"Track Render Causes"}),_jsx(Switch,{value:o.trackRenderCauses,onValueChange:e=>s({trackRenderCauses:e}),trackColor:{false:buoyColors.input,true:buoyColors.warning+"80"},thumbColor:o.trackRenderCauses?buoyColors.warning:buoyColors.textMuted,disabled:!o.showRenderCount})]}),_jsxs(Text,{style:styles.settingDescription,children:["Detect WHY components render (props, hooks, parent re-render).",!o.showRenderCount&&_jsxs(Text,{style:styles.settingWarning,children:["\n",'Requires "Show Render Count" to be enabled.']})]})]}),_jsxs(View,{style:[styles.settingItem,styles.settingItemSpaced],children:[_jsxs(View,{style:styles.settingHeader,children:[_jsx(Text,{style:[styles.settingLabel,!o.trackRenderCauses&&styles.settingLabelDisabled],children:"Enable Render History"}),_jsx(Switch,{value:o.enableRenderHistory,onValueChange:e=>s({enableRenderHistory:e}),trackColor:{false:buoyColors.input,true:buoyColors.primary+"80"},thumbColor:o.enableRenderHistory?buoyColors.primary:buoyColors.textMuted,disabled:!o.trackRenderCauses})]}),_jsxs(Text,{style:styles.settingDescription,children:["Store render events for each component to view in the History tab.",!o.trackRenderCauses&&_jsxs(Text,{style:styles.settingWarning,children:["\n",'Requires "Track Render Causes" to be enabled.']})]})]}),_jsxs(View,{style:[styles.settingItem,styles.settingItemSpaced],children:[_jsxs(View,{style:styles.settingHeader,children:[_jsx(Text,{style:styles.settingLabel,children:"Debug Log Level"}),_jsx(View,{style:styles.settingValue,children:_jsx(Text,{style:[styles.settingValueText,"off"!==o.debugLogLevel&&{color:buoyColors.warning}],children:DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===o.debugLogLevel)?.label||"Off"})})]}),_jsx(Text,{style:styles.settingDescription,children:"Control console logging verbosity for render cause detection."}),_jsx(View,{style:styles.batchSizePresets,children:DEBUG_LOG_LEVEL_PRESETS.map(e=>_jsx(TouchableOpacity,{style:[styles.batchSizePreset,o.debugLogLevel===e.value&&styles.batchSizePresetActive,"off"!==e.value&&o.debugLogLevel===e.value&&{backgroundColor:buoyColors.warning+"30",borderColor:buoyColors.warning}],onPress:()=>s({debugLogLevel:e.value}),children:_jsx(Text,{style:[styles.batchSizePresetText,o.debugLogLevel===e.value&&styles.batchSizePresetTextActive,"off"!==e.value&&o.debugLogLevel===e.value&&{color:buoyColors.warning}],children:e.label})},e.value))}),_jsxs(Text,{style:styles.settingDescriptionMuted,children:[DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===o.debugLogLevel)?.description,"off"!==o.debugLogLevel&&" • Check Metro console for logs"]})]}),_jsxs(View,{style:[styles.settingItem,styles.settingItemSpaced],children:[_jsxs(View,{style:styles.settingHeader,children:[_jsx(Text,{style:styles.settingLabel,children:"Batch Size"}),_jsx(View,{style:styles.settingValue,children:_jsx(Text,{style:styles.settingValueText,children:o.batchSize})})]}),_jsx(Text,{style:styles.settingDescription,children:"Maximum components to highlight per render update. Higher values capture more re-renders but may impact performance on complex screens."}),_jsx(View,{style:styles.batchSizePresets,children:BATCH_SIZE_PRESETS.map(e=>_jsx(TouchableOpacity,{style:[styles.batchSizePreset,o.batchSize===e.value&&styles.batchSizePresetActive],onPress:()=>s({batchSize:e.value}),children:_jsx(Text,{style:[styles.batchSizePresetText,o.batchSize===e.value&&styles.batchSizePresetTextActive],children:e.label})},e.value))})]})]})]})})})})}const styles=StyleSheet.create({container:{flex:1,backgroundColor:buoyColors.base},scrollView:{flex:1},scrollContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:32},section:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border+"50",marginBottom:12,overflow:"hidden"},sectionDescription:{fontSize:11,color:buoyColors.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:16},patternChips:{flexDirection:"row",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:12},patternChip:{flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:6,borderWidth:1,paddingVertical:4,paddingLeft:4,paddingRight:6,maxWidth:"100%",gap:4},patternChipBadge:{paddingVertical:2,paddingHorizontal:5,borderRadius:4},patternChipBadgeText:{fontSize:9,fontWeight:"700"},patternChipValue:{fontSize:11,color:buoyColors.text,fontFamily:"monospace",flexShrink:1},patternChipX:{marginLeft:2},addPatternRow:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},addButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1,borderStyle:"dashed",gap:6},addButtonText:{fontSize:12,fontWeight:"500"},typePicker:{flexDirection:"row",alignItems:"center",gap:8},typePickerRow:{flex:1,flexDirection:"row",flexWrap:"wrap",gap:8},typeOption:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,borderWidth:1,backgroundColor:buoyColors.input,gap:6},typeOptionText:{fontSize:11,fontWeight:"600"},typePickerCancel:{padding:8},patternInputContainer:{flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,paddingLeft:4,paddingRight:8,paddingVertical:4,gap:4},patternInput:{flex:1,fontSize:12,color:buoyColors.text,paddingVertical:6,paddingHorizontal:4},addPatternButton:{paddingVertical:6,paddingHorizontal:10,borderRadius:4},addPatternButtonText:{fontSize:11,fontWeight:"600"},cancelButton:{padding:4},categoryBadgeScroll:{marginTop:12},categoryBadgeScrollContent:{paddingHorizontal:16,gap:8},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,borderWidth:1,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCountBubble:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCount:{fontSize:10,fontWeight:"600"},detectedItemsContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},detectedItemsScroll:{maxHeight:200},detectedItems:{flexDirection:"row",flexWrap:"wrap",gap:8},detectedItem:{flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:6,borderWidth:1,paddingVertical:6,paddingHorizontal:10,gap:6},detectedItemText:{fontSize:11,color:buoyColors.text,fontFamily:"monospace"},emptyText:{fontSize:11,color:buoyColors.textMuted,fontStyle:"italic",textAlign:"center",paddingVertical:16,paddingHorizontal:16},howItWorks:{paddingHorizontal:16,paddingVertical:12},howItWorksText:{fontSize:11,color:buoyColors.textMuted,lineHeight:18,fontFamily:"monospace"},howItWorksBold:{fontWeight:"700",color:buoyColors.textSecondary},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:32},actionPopup:{backgroundColor:buoyColors.card,borderRadius:12,borderWidth:1,borderColor:buoyColors.border,width:"100%",maxWidth:300,overflow:"hidden"},actionPopupHeader:{padding:16,borderBottomWidth:1,borderBottomColor:buoyColors.border+"50",alignItems:"center"},actionPopupButtons:{flexDirection:"row",padding:12,gap:8},actionPopupButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:12,borderRadius:8,gap:8},actionPopupInclude:{backgroundColor:buoyColors.success+"15"},actionPopupExclude:{backgroundColor:buoyColors.primary+"15"},actionPopupButtonText:{fontSize:13,fontWeight:"600"},actionPopupCancel:{padding:12,borderTopWidth:1,borderTopColor:buoyColors.border+"50",alignItems:"center"},actionPopupCancelText:{fontSize:13,color:buoyColors.textMuted,fontWeight:"500"},settingsSection:{paddingHorizontal:16,paddingTop:8,paddingBottom:16},settingItem:{gap:8},settingItemSpaced:{marginTop:16,paddingTop:16,borderTopWidth:1,borderTopColor:buoyColors.border+"30"},settingHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},settingLabel:{fontSize:13,fontWeight:"600",color:buoyColors.text},settingValue:{backgroundColor:buoyColors.textMuted+"20",paddingHorizontal:10,paddingVertical:4,borderRadius:6},settingValueText:{fontSize:12,fontWeight:"700",color:buoyColors.textMuted,fontFamily:"monospace"},settingDescription:{fontSize:11,color:buoyColors.textSecondary,lineHeight:16},settingDescriptionMuted:{fontSize:10,color:buoyColors.textMuted,lineHeight:14,marginTop:4,fontStyle:"italic"},settingLabelDisabled:{color:buoyColors.textMuted},settingWarning:{color:buoyColors.warning,fontWeight:"500"},batchSizePresets:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:4},batchSizePreset:{paddingVertical:8,paddingHorizontal:14,borderRadius:6,backgroundColor:buoyColors.input,borderWidth:1,borderColor:buoyColors.border+"50"},batchSizePresetActive:{backgroundColor:buoyColors.textMuted+"20",borderColor:buoyColors.textMuted},batchSizePresetText:{fontSize:12,fontWeight:"500",color:buoyColors.textSecondary,fontFamily:"monospace"},batchSizePresetTextActive:{color:buoyColors.textMuted,fontWeight:"700"},renderCountRangeContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,gap:12},renderCountInputRow:{flexDirection:"row",alignItems:"center",gap:12},renderCountInputGroup:{flex:1,gap:4},renderCountLabel:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,textTransform:"uppercase",letterSpacing:.5},renderCountInput:{backgroundColor:buoyColors.input,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,paddingVertical:10,paddingHorizontal:12,fontSize:14,fontWeight:"600",color:buoyColors.text,fontFamily:"monospace",textAlign:"center"},renderCountSeparator:{fontSize:12,color:buoyColors.textMuted,marginTop:18},clearRangeButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,backgroundColor:buoyColors.warning+"15",borderWidth:1,borderColor:buoyColors.warning+"40",gap:6,alignSelf:"center"},clearRangeButtonText:{fontSize:11,fontWeight:"600",color:buoyColors.warning}});export default HighlightFilterView;

package/lib/module/highlight-updates/components/HighlightUpdatesModal.js

@@ -0,0 +1 @@
+"use strict";import React,{useState,useEffect,useRef,useCallback,useMemo}from"react";import{View,Text,StyleSheet}from"react-native";import{Power,JsModal,devToolsStorageKeys,safeGetItem,safeSetItem,buoyColors}from"@buoy-gg/shared-ui";let _useIsPro=null,_licenseLoadAttempted=!1;function loadLicenseModule(){if(!_licenseLoadAttempted){_licenseLoadAttempted=!0;try{const e=require("@buoy-gg/license");e&&(_useIsPro=e.useIsPro??null)}catch{}}}function getUseIsPro(){return loadLicenseModule(),_useIsPro??(()=>!1)}import HighlightUpdatesController from"../utils/HighlightUpdatesController";import{RenderTracker}from"../utils/RenderTracker";import{CAUSE_CONFIG,COMPONENT_CAUSE_CONFIG}from"./RenderCauseBadge";import{RenderDetailView}from"./RenderDetailView";import{EventStepperFooter}from"@buoy-gg/shared-ui";import{HighlightFilterView}from"./HighlightFilterView";import{IsolatedRenderList}from"./IsolatedRenderList";import{MainListHeader,FilterViewHeader,DetailViewHeader}from"./ModalHeaderContent";import{RenderHistoryViewer,RenderHistoryFooter}from"./RenderHistoryViewer";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const DisabledBanner=React.memo(function(){return _jsxs(View,{style:styles.disabledBanner,children:[_jsx(Power,{size:14,color:buoyColors.warning}),_jsx(Text,{style:styles.disabledText,children:"Render tracking is disabled"})]})});function formatRenderDataForClipboard(){const e=RenderTracker.getRenders(),t=RenderTracker.getStats(),r=RenderTracker.getSettings(),n=(new Date).toISOString(),s=[];s.push("=".repeat(60)),s.push("RENDER TRACKING DATA EXPORT"),s.push("=".repeat(60)),s.push(`Timestamp: ${n}`),s.push(`Total Components: ${t.totalComponents}`),s.push(`Total Renders: ${t.totalRenders}`),s.push(""),s.push("Settings:"),s.push(`  - Show Render Count: ${r.showRenderCount}`),s.push(`  - Track Render Causes: ${r.trackRenderCauses}`),s.push(`  - Batch Size: ${r.batchSize}`),s.push("");const a=[...e].sort((e,t)=>t.renderCount-e.renderCount);s.push("-".repeat(60)),s.push("COMPONENTS BY RENDER COUNT (descending)"),s.push("-".repeat(60)),s.push(""),a.forEach((e,t)=>{const r=e.lastRenderCause?.type,n=e.lastRenderCause?.componentCause,a=e.lastRenderCause&&r?`${CAUSE_CONFIG[r].label}${e.lastRenderCause.changedKeys?` [${e.lastRenderCause.changedKeys.join(", ")}]`:""}${e.lastRenderCause.hookIndices?` [Hook ${e.lastRenderCause.hookIndices.join(", ")}]`:""}`:"N/A",o=n?COMPONENT_CAUSE_CONFIG[n].label.toUpperCase():"N/A",i=e.lastRenderCause?.componentName||e.componentName;s.push(`${t+1}. ${e.displayName} (${e.viewType}) - ${e.renderCount} renders`),n&&r?s.push(`   Why: ${i||"Component"} (${o}) → Native (${a})`):s.push(`   Last Cause: ${a}`),e.testID&&s.push(`   testID: ${e.testID}`),e.nativeID&&s.push(`   nativeID: ${e.nativeID}`),i&&s.push(`   component: ${i}`),e.accessibilityLabel&&s.push(`   accessibilityLabel: ${e.accessibilityLabel}`),s.push(`   nativeTag: ${e.nativeTag}`);const l=e.lastRenderTime-e.firstRenderTime,c=l>0?(e.renderCount/(l/1e3)).toFixed(2):e.renderCount;s.push(`   Renders/sec: ${c}`),s.push("")}),s.push("-".repeat(60)),s.push("BY VIEW TYPE"),s.push("-".repeat(60));const o=new Map;e.forEach(e=>{const t=o.get(e.viewType)||{count:0,renders:0};t.count++,t.renders+=e.renderCount,o.set(e.viewType,t)}),[...o.entries()].sort((e,t)=>t[1].renders-e[1].renders).forEach(([e,t])=>{s.push(`${e}: ${t.count} components, ${t.renders} total renders`)}),s.push(""),s.push("-".repeat(60)),s.push("BY COMPONENT NAME"),s.push("-".repeat(60));const i=new Map;if(e.forEach(e=>{const t=e.componentName||"(unknown)",r=i.get(t)||{count:0,renders:0};r.count++,r.renders+=e.renderCount,i.set(t,r)}),[...i.entries()].sort((e,t)=>t[1].renders-e[1].renders).forEach(([e,t])=>{s.push(`${e}: ${t.count} instances, ${t.renders} total renders`)}),s.push(""),r.trackRenderCauses){s.push("-".repeat(60)),s.push("BY NATIVE CAUSE (what changed on the native view)"),s.push("-".repeat(60));const t=new Map;e.forEach(e=>{const r=e.lastRenderCause?.type||"unknown";t.set(r,(t.get(r)||0)+1)}),[...t.entries()].sort((e,t)=>t[1]-e[1]).forEach(([e,t])=>{const r=CAUSE_CONFIG[e];s.push(`${r?.label||e}: ${t} components`)}),s.push(""),s.push("-".repeat(60)),s.push("BY COMPONENT CAUSE (why the React component re-rendered)"),s.push("-".repeat(60));const r=new Map;e.forEach(e=>{const t=e.lastRenderCause?.componentCause||"unknown";r.set(t,(r.get(t)||0)+1)}),[...r.entries()].sort((e,t)=>t[1]-e[1]).forEach(([e,t])=>{const r=COMPONENT_CAUSE_CONFIG[e];s.push(`${r?.label?.toUpperCase()||e}: ${t} components`)}),s.push("");const n=e.filter(e=>"parent"===e.lastRenderCause?.componentCause);n.length>0&&(s.push("-".repeat(60)),s.push("💡 OPTIMIZATION OPPORTUNITIES"),s.push("-".repeat(60)),s.push(`${n.length} component(s) re-rendered due to parent:`),n.forEach(e=>{const t=e.lastRenderCause?.componentName||e.componentName||e.displayName;s.push(`  - ${t}: Consider wrapping with React.memo()`)}),s.push(""))}return s.push("=".repeat(60)),s.push("END OF EXPORT"),s.push("=".repeat(60)),s.join("\n")}export function HighlightUpdatesModal({visible:e,onClose:t,onBack:r,onMinimize:n,enableSharedModalDimensions:s=!1,initialNativeTag:a,onInitialNativeTagHandled:o}){const i=getUseIsPro()(),[l,c]=useState(!1),[u,d]=useState(()=>HighlightUpdatesController.getFrozen()),[h,p]=useState(()=>RenderTracker.getStats().totalComponents>0),[g,C]=useState(null),[m,f]=useState(0),[T,y]=useState(!1),[S,R]=useState("filters"),[b,I]=useState("details"),[w,x]=useState(0),[k,v]=useState(""),[E,N]=useState(!1),P=useRef(null),H=useRef([]),F=useRef(RenderTracker.getFilters()),[U,D]=useState(()=>{const e=RenderTracker.getFilters();return e.includePatterns.length+e.excludePatterns.length}),[_,$]=useState(()=>RenderTracker.getFilters()),[O,A]=useState(()=>RenderTracker.getSettings()),M=useRef(!1),V=useRef(!1),j=useRef(!1);useEffect(()=>{e&&!M.current&&(async()=>{try{const e=await safeGetItem(devToolsStorageKeys.highlightUpdates.isTracking());null!==e&&"true"===e&&!HighlightUpdatesController.isEnabled()&&(HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize(),HighlightUpdatesController.enable()),M.current=!0}catch(e){}})()},[e]),useEffect(()=>{M.current&&(async()=>{try{await safeSetItem(devToolsStorageKeys.highlightUpdates.isTracking(),l.toString())}catch(e){}})()},[l]),useEffect(()=>{e&&!V.current&&(async()=>{try{const e=await safeGetItem(devToolsStorageKeys.highlightUpdates.filters());if(e){const t=JSON.parse(e),r={includeTestID:new Set(t.includeTestID||[]),includeNativeID:new Set(t.includeNativeID||[]),includeViewType:new Set(t.includeViewType||[]),includeComponent:new Set(t.includeComponent||[]),excludeTestID:new Set(t.excludeTestID||[]),excludeNativeID:new Set(t.excludeNativeID||[]),excludeViewType:new Set(t.excludeViewType||[]),excludeComponent:new Set(t.excludeComponent||[]),includePatterns:t.includePatterns||[],excludePatterns:t.excludePatterns||[]};RenderTracker.setFilters(r);const n=RenderTracker.getFilters();F.current=n,$(n),D(n.includePatterns.length+n.excludePatterns.length)}V.current=!0}catch(e){}})()},[e]),useEffect(()=>{V.current&&(async()=>{try{const e={includeTestID:Array.from(_.includeTestID),includeNativeID:Array.from(_.includeNativeID),includeViewType:Array.from(_.includeViewType),includeComponent:Array.from(_.includeComponent),excludeTestID:Array.from(_.excludeTestID),excludeNativeID:Array.from(_.excludeNativeID),excludeViewType:Array.from(_.excludeViewType),excludeComponent:Array.from(_.excludeComponent),includePatterns:_.includePatterns,excludePatterns:_.excludePatterns};await safeSetItem(devToolsStorageKeys.highlightUpdates.filters(),JSON.stringify(e))}catch(e){}})()},[_]),useEffect(()=>{e&&!j.current&&(async()=>{try{const e=await safeGetItem(devToolsStorageKeys.highlightUpdates.settings());if(e){const t=JSON.parse(e),{performanceLogging:r,...n}=t;RenderTracker.setSettings(n),A(RenderTracker.getSettings())}j.current=!0}catch(e){j.current=!0}})()},[e]),useEffect(()=>{j.current&&(async()=>{try{const{performanceLogging:e,...t}=O;await safeSetItem(devToolsStorageKeys.highlightUpdates.settings(),JSON.stringify(t))}catch(e){}})()},[O]),useEffect(()=>{const e=RenderTracker.subscribeToState(e=>{c(e.isTracking)});return()=>{e()}},[]),useEffect(()=>{const e=HighlightUpdatesController.subscribeToFreeze(e=>{d(e)});return()=>{e()}},[]),useEffect(()=>{E&&requestAnimationFrame(()=>{P.current?.focus()})},[E]),useEffect(()=>{e||HighlightUpdatesController.setSpotlight(null)},[e]),useEffect(()=>{if(e&&null!=a){const e=RenderTracker.getRender(String(a));e&&(C(e),f(0),y(!1),HighlightUpdatesController.setSpotlight(e.nativeTag)),o?.()}},[e,a,o]);const L=useCallback(()=>{HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize(),HighlightUpdatesController.toggle()},[]),z=useCallback(()=>{HighlightUpdatesController.toggleFreeze()},[]),B=useCallback(()=>{HighlightUpdatesController.clearRenderCounts(),p(!1)},[]),K=useMemo(()=>h?formatRenderDataForClipboard():"",[h]),G=useCallback(e=>{v(e)},[]),J=useCallback((e,t,r)=>{C(e),f(t),I("details"),x(0),H.current=r,HighlightUpdatesController.setSpotlight(e.nativeTag)},[]),Y=useCallback(e=>{H.current=e},[]),W=useCallback(()=>{C(null),f(0),HighlightUpdatesController.setSpotlight(null)},[]),q=useCallback(()=>{const e=H.current;if(m>0){const t=m-1,r=e[t];r&&(C(r),f(t),HighlightUpdatesController.setSpotlight(r.nativeTag))}},[m]),X=useCallback(()=>{const e=H.current;if(m<e.length-1){const t=m+1,r=e[t];r&&(C(r),f(t),HighlightUpdatesController.setSpotlight(r.nativeTag))}},[m]),Z=useCallback(()=>{y(!1)},[]),Q=useCallback(()=>{y(!0)},[]),ee=useCallback(()=>{N(!0)},[]),te=useCallback(()=>{N(!1)},[]),re=useCallback(e=>{RenderTracker.setFilters(e);const t=RenderTracker.getFilters();F.current=t,$(t),D(t.includePatterns.length+t.excludePatterns.length)},[]),ne=useCallback((e,t)=>{const r=RenderTracker.getFilters(),n={};"include"===t?r.includePatterns.some(t=>t.type===e.type&&t.value===e.value)||(n.includePatterns=[...r.includePatterns,e]):r.excludePatterns.some(t=>t.type===e.type&&t.value===e.value)||(n.excludePatterns=[...r.excludePatterns,e]),Object.keys(n).length>0&&(re(n),C(null),f(0),HighlightUpdatesController.setSpotlight(null))},[re]),se=useCallback(e=>{RenderTracker.setSettings(e),A(RenderTracker.getSettings())},[]),ae=useCallback(e=>{p(e.totalComponents>0)},[]),oe=useCallback(()=>T?_jsx(FilterViewHeader,{onBack:Z,activeTab:S,onTabChange:R,activeFilterCount:U}):g?_jsx(DetailViewHeader,{onBack:W,activeTab:b,onTabChange:I,hasHistory:(g.renderHistory?.length??0)>0}):_jsx(MainListHeader,{onBack:r,isSearchActive:E,searchText:k,onSearchChange:G,onSearchToggle:ee,onSearchClose:te,onFilterToggle:Q,onToggleTracking:L,onToggleFreeze:z,onClear:B,copyData:K,isTracking:l,isFrozen:u,activeFilterCount:U,hasRenders:h,searchInputRef:P}),[T,g,r,E,k,l,u,U,h,S,b,Z,W,G,ee,te,Q,L,z,B,K]),ie=s?devToolsStorageKeys.modal.root():devToolsStorageKeys.highlightUpdates.modal();if(!e)return null;const le=H.current.length,ce=g?"details"===b?_jsx(EventStepperFooter,{currentIndex:m,totalItems:le,onPrevious:q,onNext:X,itemLabel:"Component",subtitle:g.componentName||g.displayName||g.viewType}):_jsx(RenderHistoryFooter,{render:g,selectedEventIndex:w,onEventIndexChange:x,isPro:i}):null;return _jsx(JsModal,{visible:e,onClose:t,onMinimize:n,persistenceKey:ie,header:{showToggleButton:!0,customContent:oe()},enablePersistence:!0,initialMode:"bottomSheet",enableGlitchEffects:!0,styles:{},footer:ce,footerHeight:g&&("details"===b||(g.renderHistory?.length??0)>1)?68:0,children:_jsx(View,{nativeID:"__rn_buoy__highlight-modal",style:styles.container,children:g?"details"===b?_jsx(RenderDetailView,{render:g,disableInternalFooter:!0,onAddFilter:ne,isPro:i}):_jsx(RenderHistoryViewer,{render:g,disableInternalFooter:!0,selectedEventIndex:w,onEventIndexChange:x,isPro:i}):T?_jsx(HighlightFilterView,{filters:_,onFilterChange:re,settings:O,onSettingsChange:se,availableProps:RenderTracker.getAvailableProps(),activeTab:S}):_jsxs(_Fragment,{children:[!l&&_jsx(DisabledBanner,{}),_jsx(IsolatedRenderList,{searchText:k,filters:_,onSelectRender:J,onStatsChange:ae,onRendersChange:Y,isTracking:l,isPro:i})]})})})}const styles=StyleSheet.create({container:{flex:1,backgroundColor:buoyColors.base},disabledBanner:{flexDirection:"row",alignItems:"center",gap:8,padding:10,marginHorizontal:12,marginTop:8,backgroundColor:buoyColors.warning+"15",borderRadius:8,borderWidth:1,borderColor:buoyColors.warning+"20"},disabledText:{color:buoyColors.warning,fontSize:11,flex:1}});export default HighlightUpdatesModal;

package/lib/module/highlight-updates/components/IdentifierBadge.js

@@ -0,0 +1 @@
+"use strict";import React from"react";import{View,Text,StyleSheet}from"react-native";import{Box,Hash,Layers,Eye,Search,FileCode,buoyColors}from"@buoy-gg/shared-ui";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const IDENTIFIER_CONFIG={viewType:{label:"ViewType",shortLabel:"View",color:buoyColors.primary,icon:Box},testID:{label:"testID",shortLabel:"test",color:buoyColors.success,icon:Hash},nativeID:{label:"nativeID",shortLabel:"native",color:"#f59e0b",icon:Hash},component:{label:"Component",shortLabel:"Comp",color:"#a855f7",icon:FileCode},accessibilityLabel:{label:"a11y",shortLabel:"a11y",color:"#ec4899",icon:Eye},nativeTag:{label:"tag",shortLabel:"tag",color:buoyColors.textMuted,icon:Layers},any:{label:"Any",shortLabel:"Any",color:buoyColors.warning,icon:Search}};export function IdentifierBadge({type:e,value:o,compact:t=!1,badgeOnly:l=!1,valueOnly:a=!1,shortLabel:r=!1,showIcon:n=!1}){const s=IDENTIFIER_CONFIG[e],i=s.icon,c=r?s.shortLabel:s.label;return a?_jsx(Text,{style:[styles.valueOnly,t&&styles.valueOnlyCompact,{color:s.color}],numberOfLines:1,children:o}):_jsxs(View,l?{style:[styles.badgeOnly,t&&styles.badgeOnlyCompact,{backgroundColor:s.color+"20",borderColor:s.color+"40"}],children:[n&&_jsx(i,{size:t?10:12,color:s.color}),_jsx(Text,{style:[styles.badgeOnlyText,t&&styles.badgeOnlyTextCompact,{color:s.color}],children:c})]}:{style:[styles.container,t&&styles.containerCompact],children:[_jsxs(View,{style:[styles.badge,t&&styles.badgeCompact,{backgroundColor:s.color+"20"}],children:[n&&_jsx(i,{size:t?8:10,color:s.color}),_jsx(Text,{style:[styles.badgeText,t&&styles.badgeTextCompact,{color:s.color}],children:c})]}),_jsx(Text,{style:[styles.value,t&&styles.valueCompact],numberOfLines:1,children:o})]})}export function CategoryBadge({type:e,count:o,isSelected:t=!1,showIcon:l=!0}){const a=IDENTIFIER_CONFIG[e],r=a.icon;return _jsxs(View,{style:[styles.categoryBadge,{backgroundColor:a.color+"15",borderColor:t?a.color:a.color+"40",borderWidth:t?2:1}],children:[l&&_jsx(r,{size:12,color:a.color}),_jsx(Text,{style:[styles.categoryBadgeText,{color:a.color}],children:a.label}),void 0!==o&&_jsx(View,{style:[styles.categoryBadgeCount,{backgroundColor:a.color+"25"}],children:_jsx(Text,{style:[styles.categoryBadgeCountText,{color:a.color}],children:o})})]})}const styles=StyleSheet.create({container:{flexDirection:"row",alignItems:"center",gap:6},containerCompact:{gap:4},badge:{flexDirection:"row",alignItems:"center",paddingVertical:3,paddingHorizontal:6,borderRadius:4,gap:4},badgeCompact:{paddingVertical:2,paddingHorizontal:5,gap:3},badgeText:{fontSize:10,fontWeight:"700"},badgeTextCompact:{fontSize:9},value:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",flex:1},valueCompact:{fontSize:11},badgeOnly:{flexDirection:"row",alignItems:"center",paddingVertical:4,paddingHorizontal:8,borderRadius:6,borderWidth:1,gap:5},badgeOnlyCompact:{paddingVertical:2,paddingHorizontal:6,borderRadius:4,gap:4},badgeOnlyText:{fontSize:11,fontWeight:"600"},badgeOnlyTextCompact:{fontSize:9,fontWeight:"700"},valueOnly:{fontSize:12,fontFamily:"monospace"},valueOnlyCompact:{fontSize:11},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCount:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCountText:{fontSize:10,fontWeight:"600"}});export default IdentifierBadge;

package/lib/module/highlight-updates/components/IsolatedRenderList.js

@@ -0,0 +1 @@
+"use strict";import React,{useState,useEffect,useRef,useCallback,memo,useMemo}from"react";import{View,Text,FlatList,StyleSheet}from"react-native";import{RenderTracker}from"../utils/RenderTracker";import{RenderListItem}from"./RenderListItem";import{Activity,Lock,buoyColors}from"@buoy-gg/shared-ui";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const FREE_TIER_COMPONENT_LIMIT=25;function IsolatedRenderListInner({searchText:e,filters:t,onSelectRender:r,onStatsChange:n,onRendersChange:o,isTracking:s,isPro:l=!1}){const[i,a]=useState(()=>RenderTracker.getFilteredRenders(e)),c=useRef(null);useEffect(()=>RenderTracker.subscribe(()=>{const t=RenderTracker.getFilteredRenders(e);a(t),n(RenderTracker.getStats()),o?.(t)}),[e,n,o]),useEffect(()=>{const t=RenderTracker.getFilteredRenders(e);a(t),o?.(t)},[e,t,o]);const d=useMemo(()=>l?i:i.slice(0,25),[i,l]),m=useMemo(()=>l?0:Math.max(0,i.length-25),[i.length,l]),u=useCallback(e=>e.id,[]),x=useCallback(({item:e,index:t})=>_jsx(RenderListItem,{render:e,onPress:()=>r(e,t,d)}),[r,d]),y=useCallback(()=>m<=0?null:_jsxs(View,{style:styles.lockedBanner,children:[_jsx(Lock,{size:14,color:buoyColors.warning}),_jsxs(Text,{style:styles.lockedBannerText,children:[m," more ",1===m?"component":"components"," locked"]}),_jsx(Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),[m]);return 0===i.length?_jsxs(View,{style:styles.emptyState,children:[_jsx(Activity,{size:32,color:buoyColors.textMuted}),_jsx(Text,{style:styles.emptyTitle,children:"No renders tracked"}),_jsx(Text,{style:styles.emptyText,children:s?"Component renders will appear here":"Enable tracking to start capturing"})]}):_jsx(FlatList,{ref:c,data:d,renderItem:x,keyExtractor:u,contentContainerStyle:styles.listContent,showsVerticalScrollIndicator:!0,initialNumToRender:10,maxToRenderPerBatch:10,windowSize:10,scrollEnabled:!1,ListFooterComponent:y})}export const IsolatedRenderList=memo(IsolatedRenderListInner);const styles=StyleSheet.create({listContent:{paddingTop:8},emptyState:{alignItems:"center",paddingVertical:40},emptyTitle:{color:buoyColors.text,fontSize:14,fontWeight:"600",marginTop:12,marginBottom:6},emptyText:{color:buoyColors.textMuted,fontSize:12,textAlign:"center"},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:16,marginTop:8,gap:8},lockedBannerText:{color:buoyColors.warning,fontSize:13,fontWeight:"500"},lockedBannerSubtext:{color:buoyColors.textMuted,fontSize:12}});export default IsolatedRenderList;

package/lib/module/highlight-updates/components/ModalHeaderContent.js

@@ -0,0 +1 @@
+"use strict";import React,{memo}from"react";import{View,TouchableOpacity,TextInput,StyleSheet}from"react-native";import{Trash2,Power,Search,Filter,X,Pause,ModalHeader,TabSelector,CopyButton,buoyColors}from"@buoy-gg/shared-ui";import{StatsDisplay}from"./StatsDisplay";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SearchSectionInner=memo(function({isActive:e,searchText:o,onSearchChange:r,onSearchClose:t}){return e?_jsxs(View,{nativeID:"__rn_buoy__search-container",style:styles.headerSearchContainer,children:[_jsx(Search,{size:14,color:buoyColors.textSecondary}),_jsx(TextInput,{style:styles.headerSearchInput,placeholder:"Search testID, nativeID, component...",placeholderTextColor:buoyColors.textMuted,value:o,onChangeText:r,onSubmitEditing:t,onBlur:t,accessibilityLabel:"Search renders",autoCapitalize:"none",autoCorrect:!1,returnKeyType:"search",autoFocus:!0}),o.length>0?_jsx(TouchableOpacity,{onPress:()=>{r(""),t()},style:styles.headerSearchClear,children:_jsx(X,{size:14,color:buoyColors.textSecondary})}):null]}):null});export const SearchSection=SearchSectionInner;const HeaderActionsInner=memo(function({onSearchToggle:e,onFilterToggle:o,onToggleTracking:r,onToggleFreeze:t,onClear:a,copyData:s,isTracking:n,isFrozen:l,activeFilterCount:i,hasRenders:c}){return _jsxs(ModalHeader.Actions,{children:[_jsx(TouchableOpacity,{onPress:e,style:styles.headerActionButton,children:_jsx(Search,{size:14,color:buoyColors.textSecondary})}),_jsx(TouchableOpacity,{onPress:o,style:[styles.headerActionButton,i>0&&styles.activeFilterButton],children:_jsx(Filter,{size:14,color:i>0?buoyColors.primary:buoyColors.textMuted})}),_jsx(CopyButton,{value:s,size:14,buttonStyle:c?styles.headerActionButton:styles.headerActionButtonCopyDisabled,disabled:!c,colors:{idle:c?buoyColors.textSecondary:buoyColors.textMuted}}),_jsx(TouchableOpacity,{onPress:t,style:[styles.headerActionButton,l&&styles.freezeButton,!n&&styles.headerActionButtonDisabled],disabled:!n,children:_jsx(Pause,{size:14,color:n&&l?buoyColors.primary:buoyColors.textMuted})}),_jsx(TouchableOpacity,{onPress:r,style:[styles.headerActionButton,n?styles.startButton:styles.stopButton],children:_jsx(Power,{size:14,color:n?buoyColors.success:buoyColors.error})}),_jsx(TouchableOpacity,{onPress:a,style:[styles.headerActionButton,!c&&styles.headerActionButtonDisabled],disabled:!c,children:_jsx(Trash2,{size:14,color:buoyColors.textMuted})})]})});export const HeaderActions=HeaderActionsInner;export const MainListHeader=memo(function({onBack:e,isSearchActive:o,searchText:r,onSearchChange:t,onSearchToggle:a,onSearchClose:s,onFilterToggle:n,onToggleTracking:l,onToggleFreeze:i,onClear:c,copyData:d,isTracking:u,isFrozen:h,activeFilterCount:y,hasRenders:b,searchInputRef:C}){return _jsxs(ModalHeader,{children:[e&&_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"",children:o?_jsx(SearchSection,{isActive:o,searchText:r,onSearchChange:t,onSearchClose:s,searchInputRef:C}):_jsx(StatsDisplay,{})}),_jsx(HeaderActions,{onSearchToggle:a,onFilterToggle:n,onToggleTracking:l,onToggleFreeze:i,onClear:c,copyData:d,isTracking:u,isFrozen:h,activeFilterCount:y,hasRenders:b})]})});export const FilterViewHeader=memo(function({onBack:e,activeTab:o,onTabChange:r,activeFilterCount:t=0}){const a=[{key:"filters",label:"Filters"+(t>0?` (${t})`:"")},{key:"settings",label:"Settings"}];return _jsxs(ModalHeader,{children:[_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"",noMargin:!0,children:_jsx(TabSelector,{tabs:a,activeTab:o,onTabChange:e=>r(e)})}),_jsx(ModalHeader.Actions,{})]})});export const DetailViewHeader=memo(function({onBack:e,activeTab:o,onTabChange:r,hasHistory:t=!0}){const a=[{key:"details",label:"Details"},{key:"history",label:"History",disabled:!t}];return _jsxs(ModalHeader,{children:[_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"",noMargin:!0,children:_jsx(TabSelector,{tabs:a,activeTab:o,onTabChange:e=>r(e)})}),_jsx(ModalHeader.Actions,{})]})});const styles=StyleSheet.create({headerSearchContainer:{flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:10,borderWidth:1,borderColor:buoyColors.border,paddingHorizontal:12,paddingVertical:5},headerSearchInput:{flex:1,color:buoyColors.text,fontSize:13,marginLeft:6,paddingVertical:2},headerSearchClear:{marginLeft:6,padding:4},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:buoyColors.hover,borderWidth:1,borderColor:buoyColors.border,alignItems:"center",justifyContent:"center"},headerActionButtonDisabled:{opacity:.55},headerActionButtonCopyDisabled:{width:32,height:32,borderRadius:8,backgroundColor:buoyColors.hover,borderWidth:1,borderColor:buoyColors.border,alignItems:"center",justifyContent:"center",opacity:.55},startButton:{backgroundColor:buoyColors.success+"15",borderColor:buoyColors.success+"40"},stopButton:{backgroundColor:buoyColors.error+"15",borderColor:buoyColors.error+"40"},activeFilterButton:{backgroundColor:buoyColors.primary+"15",borderColor:buoyColors.primary+"40"},freezeButton:{backgroundColor:buoyColors.primary+"15",borderColor:buoyColors.primary+"40"}});

package/lib/module/highlight-updates/components/RenderCauseBadge.js

@@ -0,0 +1 @@
+"use strict";import React from"react";import{View,Text,StyleSheet}from"react-native";import{buoyColors}from"@buoy-gg/shared-ui";import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";export const CAUSE_CONFIG={mount:{label:"MOUNT",color:buoyColors.success,tip:"First render of this component."},props:{label:"PROPS",color:buoyColors.warning,tip:"Native props changed. Consider React.memo() or useCallback for handlers."},state:{label:"STATE",color:"#a855f7",tip:"Component state changed via setState."},hooks:{label:"HOOKS",color:"#ec4899",tip:"Hook values changed (useState, useReducer, useMemo, etc.)."},context:{label:"CONTEXT",color:"#06b6d4",tip:"React context value changed."},parent:{label:"PARENT",color:buoyColors.textSecondary,tip:"Parent component re-rendered. Consider wrapping with React.memo()."},unknown:{label:"?",color:buoyColors.textMuted,tip:"Could not determine render cause."}};export const COMPONENT_CAUSE_CONFIG={mount:{label:"mount",color:buoyColors.success,tip:"First render of this component."},props:{label:"props",color:buoyColors.warning,tip:"Component received different props from parent."},state:{label:"state",color:"#a855f7",tip:"Component's own state changed (useState/useReducer)."},parent:{label:"parent",color:buoyColors.textSecondary,tip:"Parent re-rendered but this component's props/state didn't change. Consider React.memo()."},unknown:{label:"?",color:buoyColors.textMuted,tip:"Could not determine component render cause."}};export function RenderCauseBadge({cause:e,compact:t=!1,showKeys:o=!1,showTwoLevel:n=!1}){const s=CAUSE_CONFIG[e.type],l=e.componentCause?COMPONENT_CAUSE_CONFIG[e.componentCause]:null,a=n&&l&&e.componentCause!==e.type;return _jsxs(View,{nativeID:"__rn_buoy__cause-badge",style:[styles.container,t&&styles.containerCompact],children:[a&&_jsxs(_Fragment,{children:[_jsx(View,{style:[styles.badge,t&&styles.badgeCompact,styles.componentBadge,{backgroundColor:l.color+"15"}],children:_jsx(Text,{style:[styles.badgeText,t&&styles.badgeTextCompact,styles.componentBadgeText,{color:l.color}],children:l.label})}),_jsx(Text,{style:[styles.arrowText,t&&styles.arrowTextCompact],children:"→"})]}),_jsx(View,{style:[styles.badge,t&&styles.badgeCompact,{backgroundColor:s.color+"20"}],children:_jsx(Text,{style:[styles.badgeText,t&&styles.badgeTextCompact,{color:s.color}],children:s.label})}),o&&e.changedKeys&&e.changedKeys.length>0&&_jsx(Text,{style:[styles.keysText,t&&styles.keysTextCompact],numberOfLines:1,children:e.changedKeys.join(", ")}),o&&e.hookIndices&&e.hookIndices.length>0&&_jsxs(Text,{style:[styles.keysText,t&&styles.keysTextCompact],numberOfLines:1,children:["Hook ",e.hookIndices.join(", ")]})]})}export function TwoLevelCauseBadge({cause:e}){const t=CAUSE_CONFIG[e.type],o=e.componentCause?COMPONENT_CAUSE_CONFIG[e.componentCause]:null,n=e.componentName||"Component";return _jsxs(View,{nativeID:"__rn_buoy__two-level-cause",style:styles.twoLevelContainer,children:[o&&_jsxs(View,{style:styles.twoLevelRow,children:[_jsx(Text,{style:styles.twoLevelLabel,children:"Component:"}),_jsx(Text,{style:styles.twoLevelName,children:n}),_jsx(Text,{style:styles.twoLevelText,children:"re-rendered due to"}),_jsx(View,{style:[styles.badge,{backgroundColor:o.color+"20"}],children:_jsx(Text,{style:[styles.badgeText,{color:o.color}],children:o.label.toUpperCase()})})]}),_jsxs(View,{style:styles.twoLevelRow,children:[_jsx(Text,{style:styles.twoLevelLabel,children:"Native:"}),_jsx(View,{style:[styles.badge,{backgroundColor:t.color+"20"}],children:_jsx(Text,{style:[styles.badgeText,{color:t.color}],children:t.label})}),e.changedKeys&&e.changedKeys.length>0&&_jsxs(Text,{style:styles.twoLevelKeys,children:["[",e.changedKeys.join(", "),"]"]})]})]})}export function EnhancedCauseDisplay({cause:e,nativeType:t}){const o=CAUSE_CONFIG[e.type],n=e.componentCause?COMPONENT_CAUSE_CONFIG[e.componentCause]:null,s=e.componentName||"Unknown",l=e.hookChanges&&e.hookChanges.length>0,a=e.changedKeys&&e.changedKeys.length>0,r=e.changedKeys?.filter(e=>e.includes("(ref only)")||e.includes("(fn ref)"))||[],c=e.changedKeys?.filter(e=>!e.includes("(ref only)")&&!e.includes("(fn ref)"))||[];return _jsxs(View,{nativeID:"__rn_buoy__enhanced-cause",style:styles.enhancedContainer,children:[_jsxs(View,{style:styles.enhancedHeader,children:[_jsx(Text,{style:styles.enhancedComponentName,children:s}),t&&_jsx(View,{style:styles.enhancedNativeTag,children:_jsx(Text,{style:styles.enhancedNativeTagText,children:t})})]}),_jsxs(View,{style:styles.enhancedFlowContainer,children:[_jsx(Text,{style:styles.enhancedFlowLabel,children:"Cause:"}),n&&_jsx(View,{style:[styles.enhancedFlowBadge,{backgroundColor:n.color+"20"}],children:_jsx(Text,{style:[styles.enhancedFlowBadgeText,{color:n.color}],children:n.label.toUpperCase()})}),_jsx(Text,{style:styles.enhancedFlowArrow,children:"→"}),_jsx(View,{style:[styles.enhancedFlowBadge,{backgroundColor:o.color+"20"}],children:_jsx(Text,{style:[styles.enhancedFlowBadgeText,{color:o.color}],children:o.label})})]}),l&&_jsxs(View,{style:styles.enhancedSection,children:[_jsx(Text,{style:styles.enhancedSectionTitle,children:"Component State Changed:"}),e.hookChanges.map(e=>_jsxs(View,{style:styles.enhancedChangeRow,children:[_jsx(Text,{style:styles.enhancedChangeIcon,children:"⚡"}),_jsxs(Text,{style:styles.enhancedChangeText,children:["Hook[",e.index,"] (",e.type,"): ",e.description]})]},e.index))]}),c.length>0&&_jsxs(View,{style:styles.enhancedSection,children:[_jsx(Text,{style:styles.enhancedSectionTitle,children:"Native Props Changed:"}),c.map((e,t)=>_jsxs(View,{style:styles.enhancedChangeRow,children:[_jsx(Text,{style:styles.enhancedChangeIcon,children:"~"}),_jsx(Text,{style:styles.enhancedChangeText,children:e})]},t))]}),r.length>0&&_jsxs(View,{style:styles.enhancedSection,children:[_jsx(Text,{style:[styles.enhancedSectionTitle,{color:buoyColors.textMuted}],children:"Reference Changes (optimization opportunity):"}),r.map((e,t)=>_jsxs(View,{style:styles.enhancedChangeRow,children:[_jsx(Text,{style:[styles.enhancedChangeIcon,{color:buoyColors.textMuted}],children:"○"}),_jsx(Text,{style:[styles.enhancedChangeText,{color:buoyColors.textMuted}],children:e})]},t))]}),!l&&!a&&"mount"!==e.type&&_jsx(View,{style:styles.enhancedSection,children:_jsx(Text,{style:styles.enhancedNoChanges,children:"parent"===e.type?"Parent re-rendered (consider React.memo)":"No specific changes detected"})})]})}const styles=StyleSheet.create({container:{flexDirection:"row",alignItems:"center",gap:6},containerCompact:{gap:4},badge:{paddingVertical:3,paddingHorizontal:6,borderRadius:4},badgeCompact:{paddingVertical:2,paddingHorizontal:5},componentBadge:{borderStyle:"dashed",borderWidth:1,borderColor:buoyColors.border},badgeText:{fontSize:10,fontWeight:"700"},badgeTextCompact:{fontSize:9},componentBadgeText:{fontWeight:"500",textTransform:"lowercase"},arrowText:{fontSize:10,color:buoyColors.textMuted},arrowTextCompact:{fontSize:9},keysText:{fontSize:11,color:buoyColors.textSecondary,fontFamily:"monospace",flex:1},keysTextCompact:{fontSize:10},twoLevelContainer:{gap:8},twoLevelRow:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:6},twoLevelLabel:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,minWidth:70},twoLevelName:{fontSize:11,fontWeight:"600",color:buoyColors.text,fontFamily:"monospace"},twoLevelText:{fontSize:11,color:buoyColors.textSecondary},twoLevelKeys:{fontSize:10,color:buoyColors.textSecondary,fontFamily:"monospace"},enhancedContainer:{gap:12},enhancedHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:8},enhancedComponentName:{fontSize:14,fontWeight:"700",color:buoyColors.text,fontFamily:"monospace"},enhancedNativeTag:{backgroundColor:buoyColors.input,paddingVertical:2,paddingHorizontal:6,borderRadius:4},enhancedNativeTagText:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,fontFamily:"monospace"},enhancedFlowContainer:{flexDirection:"row",alignItems:"center",gap:8,paddingVertical:8,paddingHorizontal:12,backgroundColor:buoyColors.input,borderRadius:6},enhancedFlowLabel:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary},enhancedFlowBadge:{paddingVertical:3,paddingHorizontal:8,borderRadius:4},enhancedFlowBadgeText:{fontSize:10,fontWeight:"700"},enhancedFlowArrow:{fontSize:14,color:buoyColors.textMuted,fontWeight:"300"},enhancedSection:{gap:6},enhancedSectionTitle:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,letterSpacing:.3},enhancedChangeRow:{flexDirection:"row",alignItems:"flex-start",gap:6,paddingLeft:4},enhancedChangeIcon:{fontSize:12,color:buoyColors.warning,fontFamily:"monospace",width:16},enhancedChangeText:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",flex:1},enhancedNoChanges:{fontSize:12,color:buoyColors.textMuted,fontStyle:"italic",paddingLeft:4}});export default RenderCauseBadge;

package/lib/module/highlight-updates/components/RenderDetailView.js

@@ -0,0 +1 @@
+"use strict";import React,{useMemo,useState,useCallback}from"react";import{View,Text,TouchableOpacity,ScrollView,StyleSheet}from"react-native";import{CopyButton,formatRelativeTime,PlusIcon,MinusIcon,EventStepperFooter,Lock,buoyColors}from"@buoy-gg/shared-ui";import{TreeDiffViewer}from"@buoy-gg/shared-ui/dataViewer";import{CAUSE_CONFIG,COMPONENT_CAUSE_CONFIG}from"./RenderCauseBadge";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";function formatRenderDetailForClipboard(e){const t=[];if(t.push(`${e.componentName||e.displayName} (${e.viewType})`),t.push(`Renders: ${e.renderCount}`),e.lastRenderCause){const o=e.lastRenderCause;if(o.componentCause?t.push(`Cause: ${o.componentCause.toUpperCase()} → ${o.type.toUpperCase()}`):t.push(`Cause: ${o.type.toUpperCase()}`),o.hookChanges?.length)for(const e of o.hookChanges)t.push(`  ${e.type}[${e.index}]: ${e.previousValue} → ${e.currentValue}`)}if(e.renderHistory?.length){t.push(`\nHistory (${e.renderHistory.length} events):`);for(const o of e.renderHistory){const e=o.cause.componentCause?`${o.cause.componentCause.toUpperCase()} → ${o.cause.type.toUpperCase()}`:o.cause.type.toUpperCase();t.push(`  #${o.renderNumber}: ${e}`)}}return t.join("\n")}const FREE_TIER_EVENT_LIMIT=5;export function RenderDetailView({render:e,disableInternalFooter:t=!1,selectedEventIndex:o,onEventIndexChange:s,onAddFilter:r,isPro:l=!1}){const[n,i]=useState(0),a=o??n,d=s??i,c=useMemo(()=>e.renderHistory&&0!==e.renderHistory.length?[...e.renderHistory].sort((e,t)=>e.timestamp-t.timestamp):[],[e.renderHistory]),u=c.length,y=c[a],p=useMemo(()=>l?0:Math.max(0,u-5),[l,u]),b=y?.cause||e.lastRenderCause,x=useCallback(()=>{a>0&&d(a-1)},[a,d]),C=useCallback(()=>{const e=l?u-1:Math.min(4,u-1);a<e&&d(a+1)},[a,u,d,l]),h=useMemo(()=>formatRenderDetailForClipboard(e),[e]),m=e.componentName||e.displayName,g=e.viewType,f=e.lastRenderTime-e.firstRenderTime,j=f>0?(e.renderCount/(f/1e3)).toFixed(1):e.renderCount.toString(),_=!t&&u>1;return _jsxs(View,{style:styles.container,children:[_jsxs(View,{style:styles.header,children:[_jsxs(View,{style:styles.headerLeft,children:[_jsx(Text,{style:styles.componentName,numberOfLines:1,children:m}),_jsx(View,{style:styles.nativeTypeBadge,children:_jsx(Text,{style:styles.nativeTypeText,children:g})})]}),_jsx(CopyButton,{value:h,size:14})]}),_jsxs(ScrollView,{style:styles.scrollView,contentContainerStyle:[styles.scrollContent,_&&{paddingBottom:100}],showsVerticalScrollIndicator:!1,children:[b&&_jsx(AnswerCard,{cause:b,renderNumber:y?.renderNumber}),_jsx(DetailsSection,{render:e,rendersPerSec:j}),p>0&&_jsxs(View,{style:styles.lockedBanner,children:[_jsx(Lock,{size:14,color:buoyColors.warning}),_jsxs(Text,{style:styles.lockedBannerText,children:[p," ",1===p?"event":"events"," hidden"]}),_jsx(Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),r&&_jsx(QuickActionsSection,{render:e,onAddFilter:r})]}),_&&_jsx(EventStepperFooter,{currentIndex:a,totalItems:u,onPrevious:x,onNext:C,itemLabel:"Render",subtitle:y?.timestamp?formatRelativeTime(new Date(y.timestamp)):void 0,applySafeAreaInset:!1,absolute:!0})]})}function AnswerCard({cause:e,renderNumber:t}){const o=e.componentCause||e.type,s=e.componentCause?COMPONENT_CAUSE_CONFIG[e.componentCause]:CAUSE_CONFIG[e.type],r=e.hookChanges&&e.hookChanges.length>0,l=e.changedKeys&&e.changedKeys.length>0;return _jsxs(View,{style:styles.answerCard,children:[_jsxs(View,{style:styles.causeBadgeRow,children:[_jsx(Text,{style:styles.causeLabel,children:"mount"===e.type?"First render":"parent"===o?"Triggered by":"Changed:"}),_jsx(View,{style:[styles.causeBadgeLarge,{backgroundColor:s.color+"20"}],children:_jsx(Text,{style:[styles.causeBadgeLargeText,{color:s.color}],children:s.label.toUpperCase()})})]}),r&&_jsx(View,{style:styles.hookChangesContainer,children:e.hookChanges.map((e,t)=>{const o=`${e.type}[${e.index}]`,s={[o]:e.previousValue},r={[o]:e.currentValue};return _jsx(View,{style:styles.hookDiffContainer,children:_jsx(TreeDiffViewer,{oldValue:s,newValue:r,theme:"dark",showUnchanged:!1})},t)})}),!r&&l&&_jsx(View,{style:styles.propsChangesContainer,children:e.changedKeys.filter(e=>!e.includes("(ref only)")).slice(0,5).map((e,t)=>_jsx(View,{style:styles.propChangeChip,children:_jsx(Text,{style:styles.propChangeText,children:e})},t))})]})}function DetailsSection({render:e,rendersPerSec:t}){const o=e.testID||e.nativeID||e.accessibilityLabel,s=e.measurements;return _jsxs(View,{style:styles.detailsSection,children:[o&&_jsxs(View,{style:styles.detailsCard,children:[_jsx(Text,{style:styles.detailsCardTitle,children:"Identifiers"}),e.testID&&_jsx(DetailRow,{label:"testID",value:e.testID}),e.nativeID&&_jsx(DetailRow,{label:"nativeID",value:e.nativeID}),e.accessibilityLabel&&_jsx(DetailRow,{label:"a11y",value:e.accessibilityLabel})]}),_jsxs(View,{style:styles.statsRow,children:[_jsxs(View,{style:styles.statItem,children:[_jsx(Text,{style:[styles.statValue,{color:e.color}],children:e.renderCount}),_jsx(Text,{style:styles.statLabel,children:"renders"})]}),_jsx(View,{style:styles.statDivider}),_jsxs(View,{style:styles.statItem,children:[_jsx(Text,{style:styles.statValue,children:t}),_jsx(Text,{style:styles.statLabel,children:"/sec"})]}),_jsx(View,{style:styles.statDivider}),_jsxs(View,{style:styles.statItem,children:[_jsx(Text,{style:styles.statValue,children:e.nativeTag}),_jsx(Text,{style:styles.statLabel,children:"tag"})]})]}),s&&_jsxs(View,{style:styles.measurementsRow,children:[_jsxs(View,{style:styles.measurementItem,children:[_jsx(Text,{style:styles.measurementLabel,children:"x"}),_jsx(Text,{style:styles.measurementValue,children:Math.round(e.measurements.x)})]}),_jsxs(View,{style:styles.measurementItem,children:[_jsx(Text,{style:styles.measurementLabel,children:"y"}),_jsx(Text,{style:styles.measurementValue,children:Math.round(e.measurements.y)})]}),_jsxs(View,{style:styles.measurementItem,children:[_jsx(Text,{style:styles.measurementLabel,children:"w"}),_jsx(Text,{style:styles.measurementValue,children:Math.round(e.measurements.width)})]}),_jsxs(View,{style:styles.measurementItem,children:[_jsx(Text,{style:styles.measurementLabel,children:"h"}),_jsx(Text,{style:styles.measurementValue,children:Math.round(e.measurements.height)})]})]})]})}function DetailRow({label:e,value:t}){return _jsxs(View,{style:styles.detailRow,children:[_jsx(Text,{style:styles.detailLabel,children:e}),_jsx(Text,{style:styles.detailValue,numberOfLines:1,children:t})]})}function QuickActionsSection({render:e,onAddFilter:t}){const[o,s]=useState(null),r=useMemo(()=>{const t=[];return e.nativeID&&t.push({type:"nativeID",value:e.nativeID,label:"nativeID"}),e.testID&&t.push({type:"testID",value:e.testID,label:"testID"}),e.accessibilityLabel&&t.push({type:"accessibilityLabel",value:e.accessibilityLabel,label:"a11y"}),e.componentName&&t.push({type:"component",value:e.componentName,label:"component"}),t.push({type:"viewType",value:e.viewType,label:"viewType"}),t},[e]),l=null!==o?r[o]:null,n=useCallback(e=>{s(t=>t===e?null:e)},[]),i=useCallback(()=>{l&&(t({type:l.type,value:l.value},"include"),s(null))},[l,t]),a=useCallback(()=>{l&&(t({type:l.type,value:l.value},"exclude"),s(null))},[l,t]);return _jsxs(View,{style:styles.quickActionsSection,children:[_jsx(Text,{style:styles.quickActionsTitle,children:"Quick Filters"}),_jsx(View,{style:styles.filterOptionsList,children:r.map((e,t)=>_jsx(FilterOptionCard,{label:e.label,value:e.value,isSelected:o===t,onSelect:()=>n(t)},e.type))}),_jsxs(View,{style:styles.filterActionButtons,children:[_jsxs(TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonInclude,!l&&styles.filterActionButtonDisabled],onPress:i,disabled:!l,activeOpacity:.7,children:[_jsx(PlusIcon,{size:14,color:l?buoyColors.success:buoyColors.textMuted}),_jsx(Text,{style:[styles.filterActionButtonText,{color:l?buoyColors.success:buoyColors.textMuted}],children:"Only Show This"})]}),_jsxs(TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonExclude,!l&&styles.filterActionButtonDisabled],onPress:a,disabled:!l,activeOpacity:.7,children:[_jsx(MinusIcon,{size:14,color:l?buoyColors.error:buoyColors.textMuted}),_jsx(Text,{style:[styles.filterActionButtonText,{color:l?buoyColors.error:buoyColors.textMuted}],children:"Hide This"})]})]})]})}function FilterOptionCard({label:e,value:t,isSelected:o,onSelect:s}){return _jsxs(TouchableOpacity,{style:[styles.filterOptionCard,o&&styles.filterOptionCardSelected],onPress:s,activeOpacity:.7,children:[_jsx(Text,{style:[styles.filterOptionLabel,o&&styles.filterOptionLabelSelected],children:e}),_jsx(Text,{style:[styles.filterOptionValue,o&&styles.filterOptionValueSelected],numberOfLines:1,children:t})]})}const styles=StyleSheet.create({container:{flex:1,backgroundColor:buoyColors.base},header:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:12,padding:16,paddingBottom:0},scrollView:{flex:1},scrollContent:{padding:16,paddingTop:12,paddingBottom:80,gap:12},headerLeft:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:10},componentName:{fontSize:18,fontWeight:"700",color:buoyColors.text,flexShrink:1},nativeTypeBadge:{backgroundColor:buoyColors.input,paddingVertical:3,paddingHorizontal:8,borderRadius:4},nativeTypeText:{fontSize:11,fontWeight:"600",color:buoyColors.textMuted,fontFamily:"monospace"},answerCard:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:12,gap:6},causeBadgeRow:{flexDirection:"row",alignItems:"center",gap:8},causeBadgeLarge:{paddingVertical:4,paddingHorizontal:10,borderRadius:4},causeBadgeLargeText:{fontSize:11,fontWeight:"700",letterSpacing:.5},causeLabel:{fontSize:12,color:buoyColors.textSecondary,fontWeight:"500"},hookChangesContainer:{gap:6},hookDiffContainer:{backgroundColor:buoyColors.input,borderRadius:6,overflow:"hidden"},propsChangesContainer:{flexDirection:"row",flexWrap:"wrap",gap:4},propChangeChip:{backgroundColor:buoyColors.input,paddingVertical:2,paddingHorizontal:6,borderRadius:4},propChangeText:{fontSize:11,color:buoyColors.text,fontFamily:"monospace"},detailsSection:{gap:10},detailsCard:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:12,gap:6},detailsCardTitle:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:4},detailRow:{flexDirection:"row",alignItems:"center",gap:8},detailLabel:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,minWidth:55},detailValue:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",flex:1},statsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,paddingVertical:10,paddingHorizontal:16},statItem:{flex:1,alignItems:"center"},statValue:{fontSize:16,fontWeight:"700",color:buoyColors.text,fontFamily:"monospace"},statLabel:{fontSize:10,color:buoyColors.textMuted,marginTop:2},statDivider:{width:1,height:24,backgroundColor:buoyColors.border,marginHorizontal:12},measurementsRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-around",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,paddingVertical:8,paddingHorizontal:12},measurementItem:{flexDirection:"row",alignItems:"baseline",gap:4},measurementLabel:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,textTransform:"uppercase"},measurementValue:{fontSize:12,fontWeight:"600",color:buoyColors.text,fontFamily:"monospace"},quickActionsSection:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:12,gap:10},quickActionsTitle:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:2},filterOptionsList:{gap:6},filterOptionCard:{flexDirection:"row",alignItems:"center",backgroundColor:buoyColors.input,borderRadius:6,paddingVertical:10,paddingHorizontal:12,borderWidth:1,borderColor:"transparent",gap:10},filterOptionCardSelected:{borderColor:buoyColors.success,backgroundColor:buoyColors.success+"15"},filterOptionLabel:{fontSize:10,fontWeight:"600",color:buoyColors.textMuted,minWidth:70},filterOptionLabelSelected:{color:buoyColors.success},filterOptionValue:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",flex:1},filterOptionValueSelected:{color:buoyColors.text},filterActionButtons:{flexDirection:"row",gap:8,marginTop:12},filterActionButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:4,paddingVertical:8,paddingHorizontal:10,borderRadius:6,borderWidth:1},filterActionButtonInclude:{backgroundColor:buoyColors.success+"15",borderColor:buoyColors.success+"40"},filterActionButtonExclude:{backgroundColor:buoyColors.error+"15",borderColor:buoyColors.error+"40"},filterActionButtonDisabled:{backgroundColor:buoyColors.input,borderColor:buoyColors.border,opacity:.5},filterActionButtonText:{fontSize:11,fontWeight:"600"},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.warning+"40",paddingVertical:12,paddingHorizontal:16,gap:8},lockedBannerText:{color:buoyColors.warning,fontSize:13,fontWeight:"600"},lockedBannerSubtext:{color:buoyColors.textMuted,fontSize:12}});export default RenderDetailView;

package/lib/module/highlight-updates/components/RenderHistoryViewer.js

@@ -0,0 +1 @@
+"use strict";import React,{useState,useCallback,useMemo}from"react";import{View,Text,TouchableOpacity,ScrollView,StyleSheet}from"react-native";import{Clock,GitBranch,Database,Lock,formatRelativeTime,SectionHeader,EventStepperFooter,buoyColors}from"@buoy-gg/shared-ui";const FREE_TIER_EVENT_LIMIT=3;import{TreeDiffViewer}from"@buoy-gg/shared-ui/dataViewer";import{EnhancedCauseDisplay,CAUSE_CONFIG}from"./RenderCauseBadge";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";function formatTimeWithMs(e){const t=new Date(e);return t.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",second:"2-digit"})+`.${t.getMilliseconds().toString().padStart(3,"0")}`}export function RenderHistoryViewer({render:e,disableInternalFooter:t=!1,selectedEventIndex:o,onEventIndexChange:r,isPro:s=!1}){const[i,n]=useState(0),l=o??i,a=r??n,[d,c]=useState("current"),y=useMemo(()=>e.renderHistory&&0!==e.renderHistory.length?[...e.renderHistory].sort((e,t)=>e.timestamp-t.timestamp):[],[e.renderHistory]),u=useMemo(()=>s?y:y.slice(-3),[y,s]),x=useMemo(()=>s?0:Math.max(0,y.length-3),[y.length,s]),f=u.length,g=u[l],p=l>0?u[l-1]:null,b=useCallback(()=>{l>0&&a(l-1)},[l,a]),m=useCallback(()=>{l<f-1&&a(l+1)},[l,f,a]);return 0===f?_jsxs(View,{style:styles.emptyContainer,children:[_jsx(Clock,{size:32,color:buoyColors.textMuted}),_jsx(Text,{style:styles.emptyTitle,children:"No Render History"}),_jsx(Text,{style:styles.emptyText,children:"Enable render history tracking in settings to see render events here."})]}):_jsxs(_Fragment,{children:[_jsxs(View,{style:[styles.container,{paddingBottom:!t&&f>1?80:0}],children:[x>0&&_jsxs(View,{style:styles.lockedBanner,children:[_jsx(Lock,{size:14,color:buoyColors.warning}),_jsxs(Text,{style:styles.lockedBannerText,children:[x," older ",1===x?"render":"renders"," locked"]}),_jsx(Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),_jsxs(View,{style:styles.viewToggleContainer,children:[_jsxs(TouchableOpacity,{style:[styles.viewToggleCard,"current"===d&&styles.viewToggleCardActive],onPress:()=>c("current"),activeOpacity:.8,children:[_jsxs(View,{style:styles.viewToggleContent,children:[_jsx(Database,{size:16,color:"current"===d?buoyColors.primary:buoyColors.textSecondary}),_jsx(Text,{style:[styles.viewToggleLabel,"current"===d&&styles.viewToggleLabelActive],children:"CURRENT STATE"})]}),_jsxs(Text,{style:[styles.viewToggleDescription,"current"===d&&{color:buoyColors.text}],children:["View render #",g?.renderNumber??0," details"]})]}),_jsxs(View,{style:[styles.viewToggleCard,styles.viewToggleCardDisabled],children:[_jsxs(View,{style:styles.viewToggleContent,children:[_jsx(GitBranch,{size:16,color:buoyColors.textMuted}),_jsx(Text,{style:[styles.viewToggleLabel,styles.viewToggleLabelDisabled],children:"DIFF VIEW"}),_jsx(View,{style:styles.todoBadge,children:_jsx(Text,{style:styles.todoBadgeText,children:"TODO"})})]}),_jsx(Text,{style:[styles.viewToggleDescription,{color:buoyColors.textMuted}],children:"Compare renders side by side (coming soon)"})]})]}),_jsx(ScrollView,{style:styles.contentScroll,contentContainerStyle:styles.contentContainer,showsVerticalScrollIndicator:!1,children:"current"===d?_jsx(CurrentStateView,{event:g,render:e}):_jsx(DiffView,{previousEvent:p,currentEvent:g,render:e})})]}),!t&&_jsx(EventStepperFooter,{currentIndex:l,totalItems:f,onPrevious:b,onNext:m,itemLabel:"Render",subtitle:formatRelativeTime(new Date(g?.timestamp??Date.now()))})]})}function CurrentStateView({event:e,render:t}){if(!e)return _jsx(View,{style:styles.noEventContainer,children:_jsx(Text,{style:styles.noEventText,children:"No event selected"})});const o=CAUSE_CONFIG[e.cause.type];return _jsxs(View,{style:styles.currentStateContainer,children:[_jsxs(View,{style:styles.eventHeader,children:[_jsxs(View,{style:styles.eventHeaderLeft,children:[_jsxs(Text,{style:styles.eventTitle,children:["Render #",e.renderNumber]}),_jsx(Text,{style:styles.eventTime,children:formatTimeWithMs(e.timestamp)})]}),_jsxs(View,{style:[styles.eventBadge,{backgroundColor:t.color+"30"}],children:[_jsx(View,{style:[styles.eventBadgeDot,{backgroundColor:t.color}]}),_jsx(Text,{style:[styles.eventBadgeText,{color:t.color}],children:e.cause.type.toUpperCase()})]})]}),_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Clock,color:o.color,size:12}),_jsx(SectionHeader.Title,{children:"WHY DID THIS RENDER?"})]}),_jsx(View,{style:styles.sectionContent,children:_jsx(EnhancedCauseDisplay,{cause:e.cause,nativeType:t.viewType})})]}),e.capturedProps&&Object.keys(e.capturedProps).length>0&&_jsxs(View,{style:styles.section,children:[_jsxs(SectionHeader,{children:[_jsx(SectionHeader.Icon,{icon:Database,color:buoyColors.primary,size:12}),_jsx(SectionHeader.Title,{children:"CAPTURED PROPS"})]}),_jsx(View,{style:styles.sectionContent,children:_jsx(ScrollView,{horizontal:!0,showsHorizontalScrollIndicator:!1,style:styles.propsScrollView,children:_jsx(Text,{style:styles.propsJson,children:JSON.stringify(e.capturedProps,null,2)})})})]})]})}function DiffView({previousEvent:e,currentEvent:t,render:o}){const[r,s]=useState("props");if(!e||!t)return _jsx(View,{style:styles.noEventContainer,children:_jsx(Text,{style:styles.noEventText,children:"Select an event with a previous event to compare"})});const i=CAUSE_CONFIG[e.cause.type],n=CAUSE_CONFIG[t.cause.type],l=e.capturedProps&&t.capturedProps,a=e.capturedState&&t.capturedState;return _jsxs(View,{style:styles.diffContainer,children:[_jsxs(View,{style:styles.compareBar,children:[_jsxs(View,{style:styles.compareSide,children:[_jsxs(View,{style:styles.compareLabelRow,children:[_jsx(Text,{style:[styles.compareLabel,{color:buoyColors.warning}],children:"PREV"}),_jsx(View,{style:[styles.compareActionBadge,{backgroundColor:`${i.color}20`}],children:_jsx(Text,{style:[styles.compareActionText,{color:i.color}],children:e.cause.type.toUpperCase()})})]}),_jsxs(View,{style:styles.compareMeta,children:[_jsxs(Text,{style:styles.compareIndex,children:["#",e.renderNumber]}),_jsx(Text,{style:styles.compareTime,children:formatTimeWithMs(e.timestamp)})]})]}),_jsx(View,{style:styles.compareDivider,children:_jsx(Text,{style:styles.compareArrow,children:"→"})}),_jsxs(View,{style:styles.compareSide,children:[_jsxs(View,{style:styles.compareLabelRow,children:[_jsx(Text,{style:[styles.compareLabel,{color:buoyColors.success}],children:"CUR"}),_jsx(View,{style:[styles.compareActionBadge,{backgroundColor:`${n.color}20`}],children:_jsx(Text,{style:[styles.compareActionText,{color:n.color}],children:t.cause.type.toUpperCase()})})]}),_jsxs(View,{style:styles.compareMeta,children:[_jsxs(Text,{style:styles.compareIndex,children:["#",t.renderNumber]}),_jsx(Text,{style:styles.compareTime,children:formatTimeWithMs(t.timestamp)})]})]})]}),_jsxs(View,{style:styles.diffModeTabs,children:[_jsx(TouchableOpacity,{style:[styles.diffModeTab,"cause"===r&&styles.diffModeTabActive],onPress:()=>s("cause"),activeOpacity:.7,children:_jsx(Text,{style:[styles.diffModeTabText,"cause"===r&&styles.diffModeTabTextActive],children:"CAUSE"})}),_jsx(TouchableOpacity,{style:[styles.diffModeTab,"props"===r&&styles.diffModeTabActive,!l&&styles.diffModeTabDisabled],onPress:()=>l&&s("props"),activeOpacity:l?.7:1,children:_jsx(Text,{style:[styles.diffModeTabText,"props"===r&&styles.diffModeTabTextActive,!l&&styles.diffModeTabTextDisabled],children:"PROPS"})}),_jsx(TouchableOpacity,{style:[styles.diffModeTab,"state"===r&&styles.diffModeTabActive,!a&&styles.diffModeTabDisabled],onPress:()=>a&&s("state"),activeOpacity:a?.7:1,children:_jsx(Text,{style:[styles.diffModeTabText,"state"===r&&styles.diffModeTabTextActive,!a&&styles.diffModeTabTextDisabled],children:"STATE"})})]}),"cause"===r&&_jsx(View,{style:styles.diffSummary,children:_jsx(EnhancedCauseDisplay,{cause:t.cause,nativeType:o.viewType})}),"props"===r&&_jsx(View,{style:styles.treeDiffContainer,children:l?_jsx(TreeDiffViewer,{oldValue:e.capturedProps,newValue:t.capturedProps,theme:"dark",showUnchanged:!0}):_jsxs(View,{style:styles.noDiffData,children:[_jsx(Text,{style:styles.noDiffDataTitle,children:"Props Not Captured"}),_jsx(Text,{style:styles.noDiffDataText,children:'Enable "Capture Props on Render" in settings to see props diff.'})]})}),"state"===r&&_jsx(View,{style:styles.treeDiffContainer,children:a?_jsx(TreeDiffViewer,{oldValue:e.capturedState,newValue:t.capturedState,theme:"dark",showUnchanged:!0}):_jsxs(View,{style:styles.noDiffData,children:[_jsx(Text,{style:styles.noDiffDataTitle,children:"State Not Captured"}),_jsx(Text,{style:styles.noDiffDataText,children:'Enable "Capture State on Render" in settings to see state diff.'})]})})]})}export function RenderHistoryFooter({render:e,selectedEventIndex:t=0,onEventIndexChange:o=()=>{},isPro:r=!1}){const s=useMemo(()=>e.renderHistory&&0!==e.renderHistory.length?[...e.renderHistory].sort((e,t)=>e.timestamp-t.timestamp):[],[e.renderHistory]),i=useMemo(()=>r?s:s.slice(-3),[s,r]),n=i.length,l=i[t],a=useCallback(()=>{o(Math.max(0,t-1))},[t,o]),d=useCallback(()=>{o(Math.min(n-1,t+1))},[t,n,o]);return n<=1?null:_jsx(EventStepperFooter,{currentIndex:t,totalItems:n,onPrevious:a,onNext:d,itemLabel:"Render",subtitle:l?formatRelativeTime(new Date(l.timestamp)):void 0})}const styles=StyleSheet.create({container:{flex:1,backgroundColor:buoyColors.base},emptyContainer:{flex:1,alignItems:"center",justifyContent:"center",padding:32,gap:12},emptyTitle:{fontSize:16,fontWeight:"600",color:buoyColors.text},emptyText:{fontSize:13,color:buoyColors.textSecondary,textAlign:"center",lineHeight:18},viewToggleContainer:{flexDirection:"row",padding:12,gap:8},viewToggleCard:{flex:1,backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:10,gap:4},viewToggleCardActive:{borderColor:buoyColors.primary,backgroundColor:buoyColors.primary+"10"},viewToggleCardDisabled:{opacity:.5},todoBadge:{backgroundColor:buoyColors.textMuted+"30",paddingHorizontal:6,paddingVertical:2,borderRadius:4,marginLeft:4},todoBadgeText:{fontSize:9,fontWeight:"700",color:buoyColors.textMuted,letterSpacing:.3},viewToggleContent:{flexDirection:"row",alignItems:"center",gap:6},viewToggleLabel:{fontSize:10,fontWeight:"700",color:buoyColors.textSecondary,letterSpacing:.5},viewToggleLabelActive:{color:buoyColors.primary},viewToggleLabelDisabled:{color:buoyColors.textMuted},viewToggleDescription:{fontSize:11,color:buoyColors.textMuted,marginTop:2},contentScroll:{flex:1},contentContainer:{padding:12,paddingTop:0},noEventContainer:{padding:24,alignItems:"center"},noEventText:{fontSize:13,color:buoyColors.textMuted},currentStateContainer:{gap:12},eventHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:12},eventHeaderLeft:{gap:2},eventTitle:{fontSize:15,fontWeight:"700",color:buoyColors.text},eventTime:{fontSize:11,color:buoyColors.textMuted,fontFamily:"monospace"},eventBadge:{flexDirection:"row",alignItems:"center",paddingHorizontal:10,paddingVertical:4,borderRadius:12,gap:6},eventBadgeDot:{width:6,height:6,borderRadius:3},eventBadgeText:{fontSize:10,fontWeight:"700",fontFamily:"monospace"},section:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,overflow:"hidden"},sectionContent:{padding:12,paddingTop:8},causeContainer:{marginBottom:12},changedList:{marginBottom:12,paddingLeft:4},changedListTitle:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,marginBottom:6},changedItem:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",marginBottom:3,paddingLeft:8},propsScrollView:{maxHeight:150},propsJson:{fontSize:11,fontFamily:"monospace",color:buoyColors.text,backgroundColor:buoyColors.input,padding:10,borderRadius:6},diffContainer:{gap:12},compareBar:{flexDirection:"row",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:10},compareSide:{flex:1,gap:4},compareLabelRow:{flexDirection:"row",alignItems:"center",gap:8},compareLabel:{fontSize:10,fontWeight:"700",letterSpacing:.5},compareActionBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:4},compareActionText:{fontSize:9,fontWeight:"600"},compareMeta:{flexDirection:"row",alignItems:"center",gap:6},compareIndex:{fontSize:12,fontWeight:"600",color:buoyColors.text},compareTime:{fontSize:10,color:buoyColors.textMuted,fontFamily:"monospace"},compareDivider:{width:30,alignItems:"center",justifyContent:"center"},compareArrow:{fontSize:16,color:buoyColors.textMuted},diffSummary:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:12},diffSummaryTitle:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,marginBottom:8},diffChanges:{gap:4},diffChangeItem:{flexDirection:"row",alignItems:"center",gap:6},diffChangeIcon:{fontSize:12,fontWeight:"700",color:buoyColors.warning,fontFamily:"monospace"},diffChangeKey:{fontSize:12,color:buoyColors.text,fontFamily:"monospace"},diffNoChanges:{fontSize:12,color:buoyColors.textMuted,fontStyle:"italic"},diffPlaceholder:{fontSize:12,color:buoyColors.textMuted,fontStyle:"italic",textAlign:"center",padding:16},diffModeTabs:{flexDirection:"row",backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,padding:4,gap:4},diffModeTab:{flex:1,paddingVertical:8,paddingHorizontal:12,borderRadius:6,alignItems:"center"},diffModeTabActive:{backgroundColor:buoyColors.primary+"20"},diffModeTabDisabled:{opacity:.4},diffModeTabText:{fontSize:10,fontWeight:"600",color:buoyColors.textSecondary,letterSpacing:.5},diffModeTabTextActive:{color:buoyColors.primary},diffModeTabTextDisabled:{color:buoyColors.textMuted},causeDiffContainer:{gap:8,marginBottom:12},causeDiffRow:{flexDirection:"row",alignItems:"center",gap:8},causeDiffLabel:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,minWidth:80},causeDiffValue:{fontSize:12,color:buoyColors.text,fontFamily:"monospace",fontWeight:"500"},diffChangesTitle:{fontSize:11,fontWeight:"600",color:buoyColors.textSecondary,marginBottom:6},treeDiffContainer:{backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border,overflow:"hidden",minHeight:150},noDiffData:{padding:24,alignItems:"center",gap:8},noDiffDataTitle:{fontSize:13,fontWeight:"600",color:buoyColors.text},noDiffDataText:{fontSize:12,color:buoyColors.textMuted,textAlign:"center",lineHeight:18},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,marginHorizontal:12,marginTop:8,backgroundColor:buoyColors.warning+"15",borderRadius:8,borderWidth:1,borderColor:buoyColors.warning+"30",gap:8},lockedBannerText:{color:buoyColors.warning,fontSize:13,fontWeight:"500"},lockedBannerSubtext:{color:buoyColors.textMuted,fontSize:12}});export default RenderHistoryViewer;

package/lib/module/highlight-updates/components/RenderListItem.js

@@ -0,0 +1 @@
+"use strict";import React,{useMemo}from"react";import{View,Text,TouchableOpacity,StyleSheet}from"react-native";import{ChevronRight,buoyColors}from"@buoy-gg/shared-ui";import{IdentifierBadge}from"./IdentifierBadge";import{RenderCauseBadge}from"./RenderCauseBadge";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";function RenderListItemInner({render:e,onPress:t}){const o=useMemo(()=>e.testID?{type:"testID",value:e.testID}:e.nativeID?{type:"nativeID",value:e.nativeID}:e.componentName?{type:"component",value:e.componentName}:e.accessibilityLabel?{type:"accessibilityLabel",value:e.accessibilityLabel}:{type:"nativeTag",value:String(e.nativeTag)},[e.testID,e.nativeID,e.componentName,e.accessibilityLabel,e.nativeTag]),i=useMemo(()=>e.accessibilityLabel&&"accessibilityLabel"!==o.type?{type:"accessibilityLabel",value:e.accessibilityLabel}:null,[e.accessibilityLabel,o.type]),r=useMemo(()=>{const t=Date.now()-e.lastRenderTime;return t<1e3?"just now":t<6e4?`${Math.floor(t/1e3)}s ago`:t<36e5?`${Math.floor(t/6e4)}m ago`:`${Math.floor(t/36e5)}h ago`},[e.lastRenderTime]);return _jsxs(TouchableOpacity,{style:styles.container,onPress:()=>t(e),activeOpacity:.7,children:[_jsx(View,{style:[styles.colorIndicator,{backgroundColor:e.color}]}),_jsxs(View,{style:styles.content,children:[_jsxs(View,{style:styles.topRow,children:[_jsxs(View,{style:styles.viewTypeContainer,children:[_jsx(Text,{style:styles.viewType,numberOfLines:1,children:e.displayName}),i?_jsx(IdentifierBadge,{type:i.type,value:i.value,compact:!0,shortLabel:!0}):e.displayName!==e.viewType?_jsx(Text,{style:styles.nativeType,numberOfLines:1,children:e.viewType}):null]}),_jsx(View,{style:[styles.renderCountBadge,{backgroundColor:e.color+"30"}],children:_jsxs(Text,{style:[styles.renderCount,{color:e.color}],children:[e.renderCount,"x"]})})]}),e.lastRenderCause&&_jsx(View,{style:styles.causeRow,children:_jsx(RenderCauseBadge,{cause:e.lastRenderCause,compact:!0,showKeys:!0,showTwoLevel:!0})}),_jsxs(View,{style:styles.bottomRow,children:[_jsx(View,{style:styles.identifierContainer,children:_jsx(IdentifierBadge,{type:o.type,value:o.value,compact:!0,shortLabel:!0})}),_jsx(Text,{style:styles.timing,children:r})]})]}),_jsx(ChevronRight,{size:16,color:buoyColors.textMuted})]})}export const RenderListItem=React.memo(RenderListItemInner,(e,t)=>{const o=e.render,i=t.render;return o.id===i.id&&o.renderCount===i.renderCount&&o.color===i.color&&o.lastRenderTime===i.lastRenderTime&&o.lastRenderCause?.type===i.lastRenderCause?.type&&o.lastRenderCause?.componentCause===i.lastRenderCause?.componentCause&&e.onPress===t.onPress});const styles=StyleSheet.create({container:{flexDirection:"row",alignItems:"center",paddingVertical:10,paddingHorizontal:12,marginHorizontal:12,marginBottom:6,backgroundColor:buoyColors.card,borderRadius:8,borderWidth:1,borderColor:buoyColors.border},colorIndicator:{width:4,height:36,borderRadius:2,marginRight:10},content:{flex:1,marginRight:8},topRow:{flexDirection:"row",alignItems:"center",marginBottom:4},causeRow:{marginBottom:4},viewTypeContainer:{flex:1,marginRight:8},viewType:{fontSize:13,fontWeight:"600",color:buoyColors.text},nativeType:{fontSize:10,color:buoyColors.textMuted,fontFamily:"monospace",marginTop:1},accessibilityLabel:{fontSize:10,color:buoyColors.primary,fontStyle:"italic",marginTop:1},renderCountBadge:{paddingHorizontal:8,paddingVertical:2,borderRadius:10},renderCount:{fontSize:11,fontWeight:"700",fontFamily:"monospace"},bottomRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:8},identifierContainer:{flex:1,flexShrink:1,overflow:"hidden"},timing:{fontSize:10,color:buoyColors.textMuted,fontWeight:"500",flexShrink:0}});export default RenderListItem;

package/lib/module/highlight-updates/components/StatsDisplay.js

@@ -0,0 +1 @@
+"use strict";import React,{useState,useEffect,memo}from"react";import{View,Text,StyleSheet}from"react-native";import{Activity,buoyColors}from"@buoy-gg/shared-ui";import{RenderTracker}from"../utils/RenderTracker";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";function StatsDisplayInner(){const[e,t]=useState({totalComponents:0,totalRenders:0});return useEffect(()=>RenderTracker.subscribe(()=>{t(RenderTracker.getStats())}),[]),_jsxs(View,{nativeID:"__rn_buoy__stats-row",style:styles.headerChip,children:[_jsx(Activity,{size:12,color:buoyColors.primary}),_jsx(Text,{style:[styles.headerChipValue,{color:buoyColors.primary}],children:e.totalComponents})]})}export const StatsDisplay=memo(StatsDisplayInner);const styles=StyleSheet.create({headerChip:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:buoyColors.hover,paddingHorizontal:8,paddingVertical:5,borderRadius:12,borderWidth:1,borderColor:buoyColors.border},headerChipValue:{fontSize:12,fontWeight:"600",fontFamily:"monospace"}});export default StatsDisplay;

package/lib/module/highlight-updates/components/index.js

@@ -0,0 +1 @@
+"use strict";export{HighlightUpdatesModal}from"./HighlightUpdatesModal";export{RenderListItem}from"./RenderListItem";export{RenderDetailView}from"./RenderDetailView";export{HighlightFilterView}from"./HighlightFilterView";export{IdentifierBadge,CategoryBadge,IDENTIFIER_CONFIG}from"./IdentifierBadge";export{IsolatedRenderList}from"./IsolatedRenderList";export{StatsDisplay}from"./StatsDisplay";export{MainListHeader,FilterViewHeader,DetailViewHeader,HeaderActions,SearchSection}from"./ModalHeaderContent";

package/lib/module/highlight-updates/utils/HighlightUpdatesController.js

@@ -0,0 +1 @@
+"use strict";import{installProfilerInterceptor,uninstallProfilerInterceptor,setComparisonCallback}from"./ProfilerInterceptor";import{RenderTracker}from"./RenderTracker";import{PerformanceLogger,markEventReceived}from"./PerformanceLogger";import{detectRenderCause,clearRenderCauseState}from"./RenderCauseDetector";let globalEnabled=!1,initialized=!1,hook=null,highlightCallback=null,badgePressCallback=null,traceUpdatesUnsubscribe=null,isProcessing=!1,isFrozen=!1;const freezeListeners=new Set,stateListeners=new Set,nodeRenderCounts=new Map,COLORS=["#37afa9","#63b19e","#80b393","#97b488","#abb67d","#beb771","#cfb965","#dfba57","#efbb49","#febc38"],DEBUG=!1;function debugLog(e,t){}function getPublicInstance(e){if(!e)return null;const t=e;return t.canonical?.publicInstance?t.canonical.publicInstance:t.canonical&&"function"==typeof t.canonical.measure?t.canonical:"function"==typeof t.measure?t:null}function getNativeTag(e){const t=e;if(null!=t.__nativeTag)return t.__nativeTag;if(null!=t._nativeTag)return t._nativeTag;if(null!=t.nativeTag)return t.nativeTag;if(t.canonical){if(null!=t.canonical.__nativeTag)return t.canonical.__nativeTag;if(null!=t.canonical._nativeTag)return t.canonical._nativeTag}return null}function extractComponentInfo(e){const t=e,n={viewType:"Unknown"};t?.canonical?.viewConfig?.uiViewClassName?n.viewType=t.canonical.viewConfig.uiViewClassName:t?.viewConfig?.uiViewClassName&&(n.viewType=t.viewConfig.uiViewClassName);const i=t?.canonical?.internalInstanceHandle,o=t?.canonical?.currentProps,a=t?.canonical?.pendingProps,r=i?.pendingProps,s=i?.memoizedProps;return n.testID=o?.testID||a?.testID||r?.testID||s?.testID||void 0,n.nativeID=o?.nativeID||a?.nativeID||r?.nativeID||s?.nativeID||void 0,n.accessibilityLabel=o?.accessibilityLabel||a?.accessibilityLabel||r?.accessibilityLabel||s?.accessibilityLabel||void 0,n.componentName=getOwningComponentName(i)||void 0,n}function describeNodeForLog(e){const t=e,n=getPublicInstance(e),i={nativeTag:(getNativeTag(e)||getNativeTag(n))??"unknown",type:t?.canonical?"Fabric":"Legacy",hasMeasure:"function"==typeof n?.measure};if(t){if(i.stateNodeKeys=Object.keys(t).slice(0,20),t.node&&(i.nodeKeys=Object.keys(t.node).slice(0,20)),t.viewConfig&&(i.viewConfig={uiViewClassName:t.viewConfig.uiViewClassName,validAttributes:t.viewConfig.validAttributes?Object.keys(t.viewConfig.validAttributes).slice(0,10):void 0}),t.canonical){const e=t.canonical;if(i.canonicalKeys=Object.keys(e).slice(0,20),e.viewConfig&&(i.canonicalViewConfig={uiViewClassName:e.viewConfig.uiViewClassName}),null!=e.nativeTag&&(i.canonicalNativeTag=e.nativeTag),e.internalInstanceHandle){const t=e.internalInstanceHandle;if(i.fiberKeys=Object.keys(t).slice(0,30),t.type&&(i.fiberType="function"==typeof t.type?t.type.name||t.type.displayName||"function":t.type),t.elementType&&(i.fiberElementType="function"==typeof t.elementType?t.elementType.name||t.elementType.displayName||"function":t.elementType),t._debugOwner){const e=t._debugOwner;i.fiberDebugOwner=e.type?.name||e.type?.displayName||e.elementType?.name||"unknown"}t._debugSource&&(i.fiberDebugSource=t._debugSource),null!=t.tag&&(i.fiberTag=t.tag),t.pendingProps&&(t.pendingProps.nativeID&&(i.fiberPendingNativeID=t.pendingProps.nativeID),t.pendingProps.testID&&(i.fiberPendingTestID=t.pendingProps.testID)),t.memoizedProps&&(t.memoizedProps.nativeID&&(i.fiberMemoizedNativeID=t.memoizedProps.nativeID),t.memoizedProps.testID&&(i.fiberMemoizedTestID=t.memoizedProps.testID))}if(e.publicInstance){const t=e.publicInstance;i.publicInstanceKeys=Object.keys(t).slice(0,20),null!=t.nativeID&&(i.nativeID=t.nativeID),null!=t._nativeID&&(i._nativeID=t._nativeID),t.props&&(i.publicInstanceProps=Object.keys(t.props).slice(0,15),t.props.nativeID&&(i.propsNativeID=t.props.nativeID),t.props.testID&&(i.propsTestID=t.props.testID),t.props.accessibilityLabel&&(i.accessibilityLabel=t.props.accessibilityLabel))}e.currentProps&&(i.currentPropsKeys=Object.keys(e.currentProps).slice(0,15),null!=e.currentProps.nativeID&&(i.currentPropsNativeID=e.currentProps.nativeID),null!=e.currentProps.testID&&(i.currentPropsTestID=e.currentProps.testID),null!=e.currentProps.accessibilityLabel&&(i.currentPropsAccessLabel=e.currentProps.accessibilityLabel)),e.pendingProps&&(i.pendingPropsKeys=Object.keys(e.pendingProps).slice(0,15),null!=e.pendingProps.nativeID&&(i.pendingPropsNativeID=e.pendingProps.nativeID),null!=e.pendingProps.testID&&(i.pendingPropsTestID=e.pendingProps.testID))}if(t._debugOwner){const e=t._debugOwner;i.debugOwnerType=e.type?.name||e.type?.displayName||typeof e.type}t._debugSource&&(i.debugSource=t._debugSource)}return i}const DEBUG_LOGGING=!1;let renderingLock=!1,renderingLockTimeout=null;const RENDER_LOCK_DURATION=350,renderedOverlayTags=new Set;function isOurOverlayTag(e){return null!=e&&renderedOverlayTags.has(e)}const DEV_TOOLS_COMPONENT_NAMES=new Set(["JsModalComponent","JsModal","HighlightUpdatesModal","HighlightFilterView","RenderDetailView","RenderListItem","RenderListItemInner","TypePicker","PatternInput","PatternChip","DetectedItemsSection","DetectedCategoryBadge","IdentifierBadge","CategoryBadge","AppRenderer","AppOverlay","FloatingTools","DialDevTools","HighlightUpdatesOverlay","DevToolsVisibilityProvider","AppHostProvider","MinimizedToolsProvider","ModalHeader","TabSelector","SectionHeader","DraggableHeader","WindowControls","LogBox","LogBoxLog","LogBoxLogNotification","LogBoxNotificationContainer","_LogBoxNotificationContainer","LogBoxInspector","LogBoxInspectorContainer","LogBoxInspectorHeader","LogBoxInspectorBody","LogBoxInspectorFooter","LogBoxInspectorMessageHeader","LogBoxInspectorStackFrame","LogBoxInspectorSection","LogBoxButton","LogBoxMessage"]),DEV_TOOLS_COMPONENT_PREFIXES=["JsModal","HighlightUpdates","RenderList","RenderDetail"],DEV_TOOLS_NATIVE_IDS=new Set(["highlight-updates-overlay","jsmodal-root","__rn_buoy__highlight-modal","logbox_inspector","logbox"]),devToolsNodeCache=new Map,CACHE_MAX_SIZE=500;function isDevToolsNativeID(e){if(!e)return!1;if(DEV_TOOLS_NATIVE_IDS.has(e))return!0;const t=e.charCodeAt(0);return!(95!==t||!e.startsWith("__highlight_")&&!e.startsWith("__rn_buoy__"))||!(108!==t||!e.startsWith("logbox"))}function getComponentName(e){if(!e)return null;const t=e.type;if(t){if("string"==typeof t)return t;if(t.name)return t.name;if(t.displayName)return t.displayName}const n=e.elementType;if(n){if(n.name)return n.name;if(n.displayName)return n.displayName}return null}const INTERNAL_COMPONENT_NAMES=new Set(["View","Text","TextImpl","Image","ScrollView","FlatList","SectionList","TouchableOpacity","TouchableHighlight","TouchableWithoutFeedback","Pressable","TextInput","Switch","ActivityIndicator","Modal","StatusBar","KeyboardAvoidingView","AnimatedComponent","AnimatedComponentWrapper","ScreenContainer","ScreenStack","Screen","ScreenContentWrapper","Svg","G","Path","Rect","Circle","Line","Polygon","Polyline","Ellipse","Text as SVGText","TSpan","TextPath","Use","Symbol","Defs","ClipPath","LinearGradient","RadialGradient","Stop","Mask","Pattern","Image as SVGImage","SafeAreaProvider","SafeAreaView","SafeAreaListener","GestureHandlerRootView","GestureDetector","ReanimatedView","ReanimatedText","ReanimatedImage","ReanimatedScrollView","Fragment","Suspense","Provider","Consumer","Context","ForwardRef"]);function isInternalComponent(e){return!e||!!INTERNAL_COMPONENT_NAMES.has(e)||"Unknown"===e||"Component"===e||!!e.startsWith("Animated")}function getOwningComponentName(e){if(!e)return null;let t=e._debugOwner||e.return,n=0,i=null;for(;t&&n<30;){const e=getComponentName(t);if(e&&"string"!=typeof t.type&&(i||(i=e),!isInternalComponent(e)))return e;t=t.return,n++}return i}function isOurOverlayNode(e){const t=e,n=t?.canonical?.internalInstanceHandle,i=getNativeTag(e)||getNativeTag(t?.canonical?.publicInstance);if(null!=i){const e=devToolsNodeCache.get(i);if(void 0!==e)return e}let o=!1;if(isDevToolsNativeID(n?.pendingProps?.nativeID||n?.memoizedProps?.nativeID||t?.canonical?.currentProps?.nativeID||null))o=!0;else if(n){let e=n,t=0;for(;e&&t<30;){const n=getComponentName(e);if(n){if(DEV_TOOLS_COMPONENT_NAMES.has(n)){o=!0;break}for(const e of DEV_TOOLS_COMPONENT_PREFIXES)if(n.startsWith(e)){o=!0;break}if(o)break}if(isDevToolsNativeID(e.pendingProps?.nativeID||e.memoizedProps?.nativeID)){o=!0;break}e=e.return,t++}}if(o&&null!=i){if(devToolsNodeCache.size>=500){const e=Array.from(devToolsNodeCache.keys());for(let t=0;t<250;t++)devToolsNodeCache.delete(e[t])}devToolsNodeCache.set(i,o)}return o}function getColorForRenderCount(e){const t=Math.min(e-1,COLORS.length-1);return COLORS[Math.max(0,t)]}function handleTraceUpdates(e){if(0===e.size)return;if(!globalEnabled)return;if(RenderTracker.getState().isPaused)return;PerformanceLogger.isEnabled()&&markEventReceived();const t=RenderTracker.getBatchSize(),n=PerformanceLogger.startBatch(e.size,t),i=[];let o=0,a=0;const r=RenderTracker.hasActiveFilters();for(const t of e)if(t&&"object"==typeof t){if(isOurOverlayNode(t)){o++;continue}const e=getPublicInstance(t),n=getNativeTag(t)||getNativeTag(e);if(null==n)continue;const s=extractComponentInfo(t);if(r&&!RenderTracker.passesFilters(s)){a++;continue}let l,c;RenderTracker.getSettings().showRenderCount?(l=(nodeRenderCounts.get(n)||0)+1,nodeRenderCounts.set(n,l),c=getColorForRenderCount(l)):(l=0,c=COLORS[0]),i.push({node:t,color:c,count:l})}if(n.markFilteringComplete(o+a,i.length),0===i.length)return void n.finish();if(!highlightCallback)return void(isProcessing=!1);n.markMeasurementStart();const s=i.slice(0,t).map(({node:e,color:t,count:n})=>new Promise(i=>{const o=getPublicInstance(e);if(!o)return void i({rect:null,stateNode:e,color:t,count:n});const a=getNativeTag(e)||getNativeTag(o);if(null!=a)try{o.measure((o,r,s,l,c,d)=>{i(null!=c&&null!=d&&null!=s&&null!=l?{rect:{id:a,x:c,y:d,width:s,height:l,color:t,count:n},stateNode:e,color:t,count:n}:{rect:null,stateNode:e,color:t,count:n})})}catch(o){i({rect:null,stateNode:e,color:t,count:n})}else i({rect:null,stateNode:e,color:t,count:n})}));Promise.all(s).then(e=>{const t=e.filter(e=>null!==e.rect),i=t.map(e=>e.rect);n.markMeasurementComplete(t.length,e.length-t.length),RenderTracker.startBatch();const o=RenderTracker.getSettings(),a=o.trackRenderCauses&&o.showRenderCount;let r=null;if(a){r=new Set;for(const{rect:e}of t)e&&r.add(e.id)}for(const{rect:e,stateNode:n,color:i,count:s}of t)if(e){const t=extractComponentInfo(n);let l;if(a&&r){const t=n,i=t?.canonical?.internalInstanceHandle,a="off"!==o.debugLogLevel?o.debugLogLevel:o.debugRawFiberLogging?"all":"off";l=detectRenderCause(e.id,i,r,a)}RenderTracker.trackRender({nativeTag:e.id,viewType:t.viewType,testID:t.testID,nativeID:t.nativeID,accessibilityLabel:t.accessibilityLabel,componentName:t.componentName,measurements:{x:e.x,y:e.y,width:e.width,height:e.height},color:i,count:s,renderCause:l})}RenderTracker.endBatch(),n.markTrackingComplete(),i.length>0&&highlightCallback&&highlightCallback(i),n.markCallbackComplete(),n.finish()}).catch(e=>{console.error("[HighlightUpdates] Error in measurement pipeline:",e),n.finish()})}function setTraceUpdatesOnRenderers(e){if(!hook?.rendererInterfaces)return void debugLog("No rendererInterfaces available");let t=0;if(hook.rendererInterfaces.forEach((n,i)=>{if("function"==typeof n.setTraceUpdatesEnabled)try{n.setTraceUpdatesEnabled(e),t++,debugLog(`Renderer ${i}: setTraceUpdatesEnabled(${e})`)}catch(e){debugLog(`Renderer ${i}: error setting trace updates`,e)}else debugLog(`Renderer ${i}: no setTraceUpdatesEnabled method`)}),debugLog(`Set trace updates ${e?"enabled":"disabled"} on ${t} renderer(s)`),hook.reactDevtoolsAgent?.setTraceUpdatesEnabled)try{hook.reactDevtoolsAgent.setTraceUpdatesEnabled(e),debugLog("Also set trace updates on agent")}catch(e){debugLog("Error setting trace updates on agent",e)}}function subscribeToTraceUpdates(){hook&&(traceUpdatesUnsubscribe||(debugLog("Subscribing to traceUpdates event"),"function"==typeof hook.sub?(traceUpdatesUnsubscribe=hook.sub("traceUpdates",handleTraceUpdates),debugLog("Subscribed using hook.sub()")):debugLog("hook.sub not available, traceUpdates may not work"),setTraceUpdatesOnRenderers(!0)))}function unsubscribeFromTraceUpdates(){setTraceUpdatesOnRenderers(!1),traceUpdatesUnsubscribe&&(traceUpdatesUnsubscribe(),traceUpdatesUnsubscribe=null,debugLog("Unsubscribed from traceUpdates event"))}function setHighlightCallback(e){highlightCallback=e,debugLog("Highlight callback "+(e?"set":"cleared"))}function setBadgePressCallback(e){badgePressCallback=e,debugLog("Badge press callback "+(e?"set":"cleared"))}function getBadgePressCallback(){return badgePressCallback}function handleBadgePress(e){badgePressCallback&&badgePressCallback(e)}let spotlightCallback=null,currentSpotlightTag=null;function setSpotlightCallback(e){spotlightCallback=e,e&&null!==currentSpotlightTag&&e(currentSpotlightTag)}function setSpotlight(e){currentSpotlightTag=e,spotlightCallback&&spotlightCallback(e)}function getSpotlight(){return currentSpotlightTag}function notifyStateListeners(){stateListeners.forEach(e=>{try{e(globalEnabled)}catch(e){console.error("[HighlightUpdates] Error in state listener:",e)}})}function subscribe(e){return stateListeners.add(e),e(globalEnabled),()=>{stateListeners.delete(e)}}function initialize(){if("undefined"!=typeof __DEV__&&!__DEV__)return debugLog("Only available in development builds"),!1;if(initialized)return!0;if(hook=window?.__REACT_DEVTOOLS_GLOBAL_HOOK__||null,!hook)return debugLog("React DevTools hook not found"),!1;if(debugLog("Hook found"),debugLog(`Hook has sub: ${"function"==typeof hook.sub}`),debugLog(`Hook has on: ${"function"==typeof hook.on}`),debugLog(`Hook has emit: ${"function"==typeof hook.emit}`),installProfilerInterceptor(),hook.rendererInterfaces&&hook.rendererInterfaces.size>0)return initialized=!0,debugLog(`Initialized with ${hook.rendererInterfaces.size} renderer(s)`),exposeGlobally(),!0;const e=setInterval(()=>{hook?.rendererInterfaces&&hook.rendererInterfaces.size>0&&(clearInterval(e),initialized=!0,debugLog(`Initialized with ${hook.rendererInterfaces.size} renderer(s) (delayed)`),exposeGlobally())},100);return setTimeout(()=>clearInterval(e),1e4),!1}function exposeGlobally(){"undefined"!=typeof window&&(window.__HIGHLIGHT_UPDATES_CONTROLLER__={enable:enable,disable:disable,toggle:toggle,isEnabled:isEnabled,setEnabled:setEnabled,subscribe:subscribe,initialize:initialize,destroy:destroy,isInitialized:()=>initialized,setHighlightCallback:setHighlightCallback})}function enable(){("undefined"==typeof __DEV__||__DEV__)&&(initialized||initialize(),globalEnabled||(debugLog("Enabling highlights"),subscribeToTraceUpdates(),RenderTracker.start(),globalEnabled=!0,notifyStateListeners()))}function disable(){("undefined"==typeof __DEV__||__DEV__)&&globalEnabled&&(debugLog("Disabling highlights"),renderingLock=!1,isProcessing=!1,renderingLockTimeout&&(clearTimeout(renderingLockTimeout),renderingLockTimeout=null),renderedOverlayTags.clear(),devToolsNodeCache.clear(),clearRenderCauseState(),unsubscribeFromTraceUpdates(),RenderTracker.stop(),globalEnabled=!1,notifyStateListeners())}function toggle(){("undefined"==typeof __DEV__||__DEV__)&&(globalEnabled?disable():enable())}function clearRenderCounts(){nodeRenderCounts.clear(),RenderTracker.clear(),debugLog("Cleared render counts")}function isEnabled(){return globalEnabled}function setEnabled(e){e?enable():disable()}function isInitialized(){return initialized}function notifyFreezeListeners(){freezeListeners.forEach(e=>{try{e(isFrozen)}catch(e){console.error("[HighlightUpdates] Error in freeze listener:",e)}})}function subscribeToFreeze(e){return freezeListeners.add(e),e(isFrozen),()=>{freezeListeners.delete(e)}}function freeze(){("undefined"==typeof __DEV__||__DEV__)&&(isFrozen||(isFrozen=!0,debugLog("Freeze mode enabled"),notifyFreezeListeners()))}function unfreeze(){("undefined"==typeof __DEV__||__DEV__)&&isFrozen&&(isFrozen=!1,debugLog("Freeze mode disabled"),highlightCallback&&highlightCallback([]),notifyFreezeListeners())}function toggleFreeze(){isFrozen?unfreeze():freeze()}function getFrozen(){return isFrozen}function destroy(){initialized&&(unsubscribeFromTraceUpdates(),uninstallProfilerInterceptor(),setComparisonCallback(null),isFrozen=!1,freezeListeners.clear(),globalEnabled=!1,hook=null,highlightCallback=null,initialized=!1,"undefined"!=typeof window&&delete window.__HIGHLIGHT_UPDATES_CONTROLLER__,debugLog("Destroyed"))}const HighlightUpdatesController={subscribe:subscribe,enable:enable,disable:disable,toggle:toggle,isEnabled:isEnabled,setEnabled:setEnabled,initialize:initialize,destroy:destroy,isInitialized:isInitialized,setHighlightCallback:setHighlightCallback,clearRenderCounts:clearRenderCounts,freeze:freeze,unfreeze:unfreeze,toggleFreeze:toggleFreeze,getFrozen:getFrozen,subscribeToFreeze:subscribeToFreeze,setBadgePressCallback:setBadgePressCallback,getBadgePressCallback:getBadgePressCallback,handleBadgePress:handleBadgePress,setSpotlightCallback:setSpotlightCallback,setSpotlight:setSpotlight,getSpotlight:getSpotlight};export default HighlightUpdatesController;

package/lib/module/highlight-updates/utils/PerformanceLogger.js

@@ -0,0 +1 @@
+"use strict";let lastEventTimestamp=0,pendingBatchId=null;export function markEventReceived(){return lastEventTimestamp=performance.now(),lastEventTimestamp}export function markOverlayRendered(t,e){lastEventTimestamp>0&&t>0&&(lastEventTimestamp=0)}class PerformanceLoggerSingleton{enabled=!1;batchCounter=0;listeners=new Set;rollingStats={batchCount:0,totalNodes:0,totalFiltered:0,totalProcessed:0,totalTime:0,maxTime:0,minTime:1/0,avgMeasurementTime:0};recentBatches=[];MAX_HISTORY=100;summaryInterval=null;SUMMARY_INTERVAL_MS=1e4;setEnabled(t){const e=this.enabled;this.enabled=t,t&&!e?this.resetStats():!t&&e&&this.stopSummaryInterval()}isEnabled(){return this.enabled}startBatch(t,e){const a="batch_"+ ++this.batchCounter,n=performance.now();let r,i=null,s=null,o=null,l=null,m=null,c=0,h=0,d=0,g=0;return{markFilteringComplete:(t,e)=>{i=performance.now(),c=t,h=e},markMeasurementStart:()=>{s=performance.now()},markMeasurementComplete:(t,e)=>{o=performance.now(),d=t,g=e},markTrackingComplete:()=>{l=performance.now()},markCallbackComplete:()=>{m=performance.now()},setOverlayRenderTime:t=>{r=t},getBatchId:()=>a,finish:()=>{const u=performance.now(),T={batchId:a,timestamp:Date.now(),nodesReceived:t,nodesFiltered:c,nodesToProcess:h,batchSize:e,nodesInBatch:Math.min(h,e),filteringTime:i?i-n:0,measurementTime:s&&o?o-s:0,trackingTime:o&&l?l-o:0,callbackTime:l&&m?m-l:0,totalTime:u-n,measurementSuccessCount:d,measurementFailCount:g,overlayRenderTime:r};return this.enabled&&this.recordMetrics(T),T}}}recordMetrics(t){this.rollingStats.batchCount++,this.rollingStats.totalNodes+=t.nodesReceived,this.rollingStats.totalFiltered+=t.nodesFiltered,this.rollingStats.totalProcessed+=t.nodesInBatch,this.rollingStats.totalTime+=t.totalTime,this.rollingStats.maxTime=Math.max(this.rollingStats.maxTime,t.totalTime),this.rollingStats.minTime=Math.min(this.rollingStats.minTime,t.totalTime);const e=this.rollingStats.avgMeasurementTime,a=this.rollingStats.batchCount;this.rollingStats.avgMeasurementTime=e+(t.measurementTime-e)/a,this.recentBatches.push(t),this.recentBatches.length>this.MAX_HISTORY&&this.recentBatches.shift(),this.notifyListeners(t)}logBatch(t){const{batchId:e,nodesReceived:a,nodesFiltered:n,nodesInBatch:r,batchSize:i,filteringTime:s,measurementTime:o,trackingTime:l,callbackTime:m,totalTime:c,measurementSuccessCount:h,measurementFailCount:d,overlayRenderTime:g}=t;console.log(`[HighlightPerf] ${e} | In:${a} Filt:${n} Proc:${r}/${i} | Filter:${s.toFixed(1)}ms Measure:${o.toFixed(1)}ms Track:${l.toFixed(1)}ms Callback:${m.toFixed(1)}ms | Total:${c.toFixed(1)}ms`+(g?` Render:${g.toFixed(1)}ms`:"")+` | Success:${h} Fail:${d}`),c>100&&console.warn(`[HighlightPerf] ⚠️ SLOW BATCH: ${c.toFixed(1)}ms - Measurement phase: ${o.toFixed(1)}ms (${(o/c*100).toFixed(0)}%)`)}logSummary(){if(0===this.rollingStats.batchCount)return;const t=this.rollingStats,e=t.totalTime/t.batchCount,a=t.totalNodes/t.batchCount;console.log(`\n[HighlightPerf] ════════ SUMMARY (last ${this.SUMMARY_INTERVAL_MS/1e3}s) ════════\n  Batches: ${t.batchCount}\n  Avg nodes/batch: ${a.toFixed(1)} (filtered: ${(t.totalFiltered/t.batchCount).toFixed(1)})\n  Avg total time: ${e.toFixed(1)}ms\n  Avg measurement time: ${t.avgMeasurementTime.toFixed(1)}ms\n  Min/Max time: ${t.minTime.toFixed(1)}ms / ${t.maxTime.toFixed(1)}ms\n══════════════════════════════════════════════\n`),this.resetStats()}resetStats(){this.rollingStats={batchCount:0,totalNodes:0,totalFiltered:0,totalProcessed:0,totalTime:0,maxTime:0,minTime:1/0,avgMeasurementTime:0}}startSummaryInterval(){this.stopSummaryInterval(),this.summaryInterval=setInterval(()=>{this.logSummary()},this.SUMMARY_INTERVAL_MS)}stopSummaryInterval(){this.summaryInterval&&(clearInterval(this.summaryInterval),this.summaryInterval=null)}subscribe(t){return this.listeners.add(t),()=>{this.listeners.delete(t)}}notifyListeners(t){for(const e of this.listeners)try{e(t)}catch(t){console.error("[HighlightPerf] Error in metrics listener:",t)}}getRecentBatches(){return[...this.recentBatches]}getRollingStats(){return{...this.rollingStats}}clear(){this.recentBatches=[],this.resetStats(),this.batchCounter=0}generateReport(){const t=this.recentBatches;if(0===t.length)return"No performance data collected yet.";const e=t.reduce((t,e)=>t+e.totalTime,0)/t.length,a=t.reduce((t,e)=>t+e.measurementTime,0)/t.length,n=t.filter(t=>t.totalTime>100),r=t.filter(t=>t.totalTime<20);return`\n╔══════════════════════════════════════════════════════════════╗\n║              HIGHLIGHT UPDATES PERFORMANCE REPORT            ║\n╠══════════════════════════════════════════════════════════════╣\n║ Total batches analyzed: ${t.length.toString().padStart(5)}                              ║\n║ Average total time:     ${e.toFixed(1).padStart(5)}ms                             ║\n║ Average measure time:   ${a.toFixed(1).padStart(5)}ms (${(a/e*100).toFixed(0)}% of total)           ║\n╠══════════════════════════════════════════════════════════════╣\n║ Fast batches (<20ms):   ${r.length.toString().padStart(5)} (${(r.length/t.length*100).toFixed(0)}%)                          ║\n║ Slow batches (>100ms):  ${n.length.toString().padStart(5)} (${(n.length/t.length*100).toFixed(0)}%)                          ║\n╠══════════════════════════════════════════════════════════════╣\n║ Time breakdown (avg):                                        ║\n║   Filtering:    ${t.reduce((t,e)=>t+e.filteringTime,0/t.length).toFixed(1).padStart(6)}ms                                    ║\n║   Measurement:  ${a.toFixed(1).padStart(6)}ms  ← Primary bottleneck              ║\n║   Tracking:     ${(t.reduce((t,e)=>t+e.trackingTime,0)/t.length).toFixed(1).padStart(6)}ms                                    ║\n║   Callback:     ${(t.reduce((t,e)=>t+e.callbackTime,0)/t.length).toFixed(1).padStart(6)}ms                                    ║\n╚══════════════════════════════════════════════════════════════╝\n`}}export const PerformanceLogger=new PerformanceLoggerSingleton;export default PerformanceLogger;

package/lib/module/highlight-updates/utils/ProfilerInterceptor.js

@@ -0,0 +1 @@
+"use strict";let originalHookEmit=null,originalAgentEmit=null,isInstalled=!1,loggingEnabled=!1,comparisonCallback=null;function describeNode(e){if(!e)return{type:"null"};const n=e,t={};if(n.canonical){t.type="Fabric";const e=n.canonical;if(e.publicInstance){const n=e.publicInstance;t.hasMeasure="function"==typeof n.measure,t.nativeTag=n.__nativeTag??n._nativeTag??"unknown"}}else"function"==typeof n.measure?(t.type="Legacy",t.hasMeasure=!0,t.nativeTag=n.__nativeTag??n._nativeTag??n.nativeTag??"unknown"):(t.type="Unknown",t.keys=Object.keys(n).slice(0,10));return t}function swizzleHookEmit(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e&&"function"==typeof e.emit&&(originalHookEmit||(originalHookEmit=e.emit.bind(e),e.emit=function(e,...n){if("traceUpdates"===e&&loggingEnabled){const e=n[0];e.size>0&&console.log(`[PROFILER] traceUpdates: ${e.size} nodes`,Array.from(e).map((e,n)=>({index:n,...describeNode(e)}))),comparisonCallback&&comparisonCallback(e)}return originalHookEmit(e,...n)}))}function swizzleAgentEmit(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__,n=e?.reactDevtoolsAgent;n&&"function"==typeof n.emit&&(originalAgentEmit||(originalAgentEmit=n.emit.bind(n),n.emit=function(e,...n){if(loggingEnabled&&"drawTraceUpdates"===e){const e=n[0];e.length>0&&console.log(`[PROFILER] drawTraceUpdates: ${e.length} nodes`,e.map((e,n)=>({index:n,color:e.color,...describeNode(e.node)})))}return originalAgentEmit(e,...n)}))}export function logRendererInterfaces(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!e?.rendererInterfaces)return void console.log("[ProfilerInterceptor] No rendererInterfaces available");const n=[];e.rendererInterfaces.forEach((e,t)=>{const o=Object.keys(e).filter(n=>"function"==typeof e[n]);n.push({id:t,hasSetTraceUpdatesEnabled:"function"==typeof e.setTraceUpdatesEnabled,methods:o.slice(0,20)})}),console.log(`[ProfilerInterceptor] Found ${e.rendererInterfaces.size} renderer interface(s)`,n)}export function logHookStructure(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!e)return void console.log("[ProfilerInterceptor] No hook available");const n={};for(const t in e){const o=e[t];"function"==typeof o?n[t]="function":o instanceof Map?n[t]=`Map(${o.size})`:o instanceof Set?n[t]=`Set(${o.size})`:n[t]="object"==typeof o&&null!==o?"object":typeof o}console.log("[ProfilerInterceptor] Hook structure:",n)}function enableTracingOnAllRenderers(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e?.rendererInterfaces&&e.rendererInterfaces.forEach(e=>{if("function"==typeof e.setTraceUpdatesEnabled)try{e.setTraceUpdatesEnabled(!0)}catch{}})}function disableTracingOnAllRenderers(){const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;e?.rendererInterfaces&&e.rendererInterfaces.forEach(e=>{if("function"==typeof e.setTraceUpdatesEnabled)try{e.setTraceUpdatesEnabled(!1)}catch{}})}export function setComparisonCallback(e){comparisonCallback=e}export function installProfilerInterceptor(){("undefined"==typeof __DEV__||__DEV__)&&(isInstalled||(swizzleHookEmit(),swizzleAgentEmit(),isInstalled=!0))}export function uninstallProfilerInterceptor(){if(!isInstalled)return;const e=window.__REACT_DEVTOOLS_GLOBAL_HOOK__;originalHookEmit&&e&&(e.emit=originalHookEmit,originalHookEmit=null),originalAgentEmit&&e?.reactDevtoolsAgent&&(e.reactDevtoolsAgent.emit=originalAgentEmit,originalAgentEmit=null),disableTracingOnAllRenderers(),comparisonCallback=null,isInstalled=!1}export function isInterceptorInstalled(){return isInstalled}export function enableProfilerLogging(){loggingEnabled=!0}export function disableProfilerLogging(){loggingEnabled=!1}export function isLoggingEnabled(){return loggingEnabled}export default{install:installProfilerInterceptor,uninstall:uninstallProfilerInterceptor,isInstalled:isInterceptorInstalled,setComparisonCallback:setComparisonCallback,enableTracing:enableTracingOnAllRenderers,disableTracing:disableTracingOnAllRenderers,enableLogging:enableProfilerLogging,disableLogging:disableProfilerLogging,isLoggingEnabled:isLoggingEnabled};

package/lib/module/highlight-updates/utils/RenderCauseDetector.js

@@ -0,0 +1 @@
+"use strict";const COMPONENT_PROP_CONFIGS={RCTText:{alwaysTrack:["children"],skip:[],description:"Text component - children is the displayed content"},RCTVirtualText:{alwaysTrack:["children"],skip:[],description:"Virtual Text (nested) - children is the displayed content"},RCTView:{alwaysTrack:[],skip:["children"],description:"View container - children are React elements"},RCTImageView:{alwaysTrack:["source"],skip:["children"],description:"Image - source contains the image URL/require"},RCTTextInput:{alwaysTrack:["value","defaultValue"],skip:["children"],description:"TextInput - value is the input content"},RCTSwitch:{alwaysTrack:["value"],skip:["children"],description:"Switch - value is the toggle state"},default:{alwaysTrack:[],skip:["children"],description:"Unknown component type"}};function getComponentPropConfig(e){return e&&COMPONENT_PROP_CONFIGS[e]||COMPONENT_PROP_CONFIGS.default}const componentFiberStates=new WeakMap;function getComponentFiberPrevState(e){if(!e)return;let o=componentFiberStates.get(e);return o||(e.alternate&&(o=componentFiberStates.get(e.alternate),o)?o:void 0)}function setComponentFiberState(e,o){e&&(componentFiberStates.set(e,o),e.alternate&&componentFiberStates.set(e.alternate,o))}const previousStates=new Map,MAX_STORED_STATES=500,MAX_CHANGED_KEYS=10,MAX_HOOK_DEPTH=50,MAX_PARENT_DEPTH=50,INTERNAL_COMPONENT_NAMES=new Set(["View","Text","TextImpl","Image","ScrollView","FlatList","SectionList","TouchableOpacity","TouchableHighlight","TouchableWithoutFeedback","Pressable","TextInput","Switch","ActivityIndicator","Modal","StatusBar","KeyboardAvoidingView","AnimatedComponent","AnimatedComponentWrapper","Fragment","Suspense","Provider","Consumer","Context","ForwardRef","Unknown","Component"]);function isInternalComponentName(e){return!e||!!INTERNAL_COMPONENT_NAMES.has(e)||!!e.startsWith("Animated")}function getOwningComponentFiber(e){if(!e)return null;let o=e._debugOwner||e.return,t=0,n=null;for(;o&&t<30;){const e=o.tag;if((0===e||1===e||11===e||15===e)&&(n||(n=o),!isInternalComponentName(getComponentNameFromFiber(o))))return o;o=o.return,t++}return n}function getComponentNameFromFiber(e){if(!e)return null;const o=e.type;if(o){if("string"==typeof o)return o;if(o.name)return o.name;if(o.displayName)return o.displayName}return null}function detectHookType(e){if(!e||"object"!=typeof e)return"unknown";if(null!==e.queue&&void 0!==e.queue)return"useState";const o=e.memoizedState;if(null!==o&&"object"==typeof o&&!Array.isArray(o)&&"current"in o&&1===Object.keys(o).length)return"useRef";if(Array.isArray(o)&&2===o.length){const[,e]=o;if(Array.isArray(e)||null===e)return"function"==typeof o[0]?"useCallback":"useMemo"}return null!==o&&"object"==typeof o&&!Array.isArray(o)&&("tag"in o||"create"in o||"destroy"in o)?"useEffect":"unknown"}function extractHookValue(e,o){const t=e?.memoizedState;switch(o){case"useState":case"useReducer":default:return t;case"useRef":return t?.current;case"useMemo":case"useCallback":return Array.isArray(t)?t[0]:t;case"useEffect":return"[effect]"}}function extractHookStates(e){if(!e?.memoizedState)return null;const o=e.memoizedState;if("object"!=typeof o||null===o)return null;if(!("next"in o)&&!("queue"in o)&&!("memoizedState"in o))return null;const t=[];let n=o,r=0;for(;null!==n&&r<50;){const e=detectHookType(n),o=extractHookValue(n,e);t.push({index:r,type:e,value:o,rawState:n.memoizedState}),n=n.next,r++}return t.length>0?t:null}function compareHookStates(e,o){if(!e||!o)return null;const t=[],n=Math.max(e.length,o.length);for(let r=0;r<n;r++){const n=e[r],a=o[r];if(n||!a)if(!n||a){if(n&&a){if(n.rawState===a.rawState)continue;if("useEffect"===a.type)continue;if("useMemo"===a.type||"useCallback"===a.type)continue;if("useState"===a.type||"useReducer"===a.type||"useRef"===a.type){const e=formatHookValue(n.value,n.type),o=formatHookValue(a.value,a.type);t.push({index:r,type:a.type,previousValue:e,currentValue:o,description:`${e} → ${o}`})}}}else t.push({index:r,type:n.type,previousValue:formatHookValue(n.value,n.type),description:`Hook[${r}] removed`});else t.push({index:r,type:a.type,currentValue:formatHookValue(a.value,a.type),description:`Hook[${r}] added`})}return t.length>0?t:null}function formatHookValue(e,o){return formatDisplayValue(e)}function formatDisplayValue(e){return null===e?null:void 0!==e?"boolean"==typeof e||"number"==typeof e?e:"string"==typeof e?e.length>30?e.slice(0,30)+"...":e:"function"==typeof e?`[Function: ${e.name||"anonymous"}]`:Array.isArray(e)?`[Array: ${e.length} items]`:"object"==typeof e?`{Object: ${Object.keys(e).length} keys}`:String(e):void 0}function detectComponentCause(e){if(!e)return{cause:"unknown",hookChanges:null};let o=e,t=e.alternate;const n=getComponentFiberPrevState(e);if(n&&t){const r=extractHookStates(e),a=extractHookStates(t),s=n.extractedHooks;if(r&&a&&s&&s.length>0){const n=s.find(e=>"useState"===e.type);if(n){const s=r.find(e=>e.index===n.index),i=a.find(e=>e.index===n.index);if(s&&i){const r=s.value===n.value,a=i.value===n.value;r&&!a&&(o=t,t=e)}}}}const r=extractHookStates(o);let a=null,s=null,i=null;return t?(a=t.memoizedProps,s=t.memoizedState,i=extractHookStates(t)):n&&(a=n.memoizedProps,s=n.memoizedState,i=n.extractedHooks),setComponentFiberState(o,{memoizedProps:o.memoizedProps,memoizedState:o.memoizedState,extractedHooks:r}),null===a?{cause:"mount",hookChanges:null}:shallowEqual(a,o.memoizedProps)?s!==o.memoizedState?{cause:"state",hookChanges:compareHookStates(i,r)}:{cause:"parent",hookChanges:null}:{cause:"props",hookChanges:null}}function shallowEqual(e,o){if(e===o)return!0;if(!e||!o)return!1;if("object"!=typeof e||"object"!=typeof o)return!1;const t=Object.keys(e),n=Object.keys(o);if(t.length!==n.length)return!1;for(const n of t)if(e[n]!==o[n])return!1;return!0}function safeStringify(e,o=3){const t=new WeakSet;return function e(n,r){if(r>o)return"[MAX_DEPTH]";if(null===n)return null;if(void 0===n)return;if("function"==typeof n)return`[Function: ${n.name||"anonymous"}]`;if("symbol"==typeof n)return`[Symbol: ${n.toString()}]`;if("object"!=typeof n)return n;if(t.has(n))return"[Circular]";if(t.add(n),Array.isArray(n))return n.slice(0,10).map(o=>e(o,r+1));const a={},s=Object.keys(n).slice(0,20);for(const o of s)try{a[o]=e(n[o],r+1)}catch{a[o]="[Error accessing]"}return a}(e,0)}function logRawFiberData(e,o,t,n,r,a){const s=getComponentNameFromFiber(t)||"Unknown";if(console.log("\n========================================"),console.log("[RN-BUOY DEBUG] RENDER EVENT"),console.log("========================================"),console.log(`Native Tag: ${e}`),console.log(`Component Name: ${s}`),console.log(`Is First Render: ${!n}`),console.log(`Component Cause Detected: ${a}`),console.log("----------------------------------------"),console.log("\n--- NATIVE FIBER (Host Component) ---"),console.log("fiber.type:",o?.type),console.log("fiber.tag:",o?.tag),console.log("fiber.memoizedProps (CURRENT):",safeStringify(o?.memoizedProps)),console.log("fiber.memoizedState:",safeStringify(o?.memoizedState)),n&&(console.log("PREVIOUS memoizedProps:",safeStringify(n.memoizedProps)),console.log("PREVIOUS memoizedState:",safeStringify(n.memoizedState))),console.log("\n--- COMPONENT FIBER (React Component) ---"),t){console.log("componentFiber.type:",t?.type?.name||t?.type),console.log("componentFiber.tag:",t?.tag),console.log("componentFiber.memoizedProps:",safeStringify(t?.memoizedProps)),console.log("componentFiber.memoizedState:",safeStringify(t?.memoizedState)),console.log("\n--- HOOKS STATE (linked list walk) ---");let e=t?.memoizedState,o=0;for(;e&&o<10;)console.log(`Hook[${o}]:`,safeStringify({memoizedState:e.memoizedState,baseState:e.baseState,queue:e.queue?"[Queue object]":null})),e=e.next,o++;console.log("\n--- EXTRACTED HOOKS (Phase 3) ---");const n=extractHookStates(t);if(n)for(const e of n)console.log(`Hook[${e.index}] (${e.type}):`,formatDisplayValue(e.value));else console.log("(No hooks extracted)")}else console.log("(No component fiber found)");console.log("\n--- CHILDREN/TEXT CONTENT ---");const i=o?.memoizedProps?.children;console.log("children type:",typeof i),console.log("children value:",safeStringify(i)),console.log("\n========================================\n")}function getTagName(e){return void 0===e?"undefined":{0:"FunctionComponent",1:"ClassComponent",2:"IndeterminateComponent",3:"HostRoot",4:"HostPortal",5:"HostComponent",6:"HostText",7:"Fragment",8:"Mode",9:"ContextConsumer",10:"ContextProvider",11:"ForwardRef",12:"Profiler",13:"SuspenseComponent",14:"MemoComponent",15:"SimpleMemoComponent"}[e]||`Unknown(${e})`}function logMinimal(e,o){if(o.hookChanges&&0!==o.hookChanges.length)for(const t of o.hookChanges)console.log(`[${e||"Unknown"}] ${t.type}[${t.index}]: ${t.previousValue} → ${t.currentValue}`)}function logVerbose(e,o,t,n,r){const a=getComponentNameFromFiber(t)||"Unknown",s="string"==typeof o?.type?o.type:"Unknown",{cause:i,hookChanges:l}=n;if(console.log(`[RENDER] ${a} (${s}:${e}) | Cause: ${i.toUpperCase()}`+(r&&r.length>0?` | Props: [${r.join(", ")}]`:"")),l&&l.length>0)for(const e of l)console.log(`  └─ ${e.type}[${e.index}]: ${e.previousValue} → ${e.currentValue}`)}function logComprehensiveRenderData(e,o,t,n,r,a,s){const i=getComponentNameFromFiber(t)||"Unknown",l="string"==typeof o?.type?o.type:"Unknown";console.log("\n[RN-BUOY RENDER DEBUG] ═══════════════════════════════════════"),console.log(`Render #${s} for ${l} (nativeTag: ${e})`),console.log(`Timestamp: ${(new Date).toISOString()}`),console.log("═══════════════════════════════════════════════════════════════\n"),console.log(`NATIVE FIBER (${l}):`),console.log(`  type: "${o?.type}"`),console.log(`  tag: ${o?.tag} (${getTagName(o?.tag)})`);const c=o?.alternate,u=c?"alternate":n?"storage":"none";console.log(`  Previous values source: ${u}`);const m=o?.memoizedProps?.children,p=c?.memoizedProps?.children,f=void 0!==p?p:n?.memoizedProps?.children,g=void 0!==f&&m!==f;console.log(`  memoizedProps.children: ${formatDisplayValue(m)}${g?` (was: ${formatDisplayValue(f)})`:void 0!==f?" (unchanged)":" (first render)"}`);const d=o?.memoizedProps?.style,y=c?.memoizedProps?.style,S=void 0!==y?y:n?.memoizedProps?.style,h=void 0!==S&&d!==S;if(d&&(console.log(`  memoizedProps.style: ${JSON.stringify(safeStringify(d,2))}${h?" (REFERENCE CHANGED)":""}`),h&&S)){const e=deepEqual(d,S);console.log(`    └─ Values actually changed: ${!e}`)}console.log(`  All memoizedProps keys: [${Object.keys(o?.memoizedProps||{}).join(", ")}]`);const C=o?.memoizedProps?.testID,b=o?.memoizedProps?.nativeID,k=o?.memoizedProps?.accessibilityLabel;if(C&&console.log(`  testID: "${C}"`),b&&console.log(`  nativeID: "${b}"`),k&&console.log(`  accessibilityLabel: "${k}"`),console.log("  alternate: "+(c?"YES":"NO")),c&&console.log(`    alternate.memoizedProps.children: ${formatDisplayValue(p)}`),console.log("  Tree structure:"),console.log(`    return (parent): ${o?.return?getTagName(o.return.tag):"null"}`),console.log(`    child: ${o?.child?getTagName(o.child.tag):"null"}`),console.log(`    sibling: ${o?.sibling?getTagName(o.sibling.tag):"null"}`),console.log(""),console.log(`COMPONENT FIBER (${i}):`),t){if(console.log(`  name: "${i}"`),console.log(`  type: ${typeof t.type} (${t.type?.name||t.type?.displayName||"anonymous"})`),console.log(`  tag: ${t.tag} (${getTagName(t.tag)})`),console.log(`  memoizedProps: ${JSON.stringify(safeStringify(t.memoizedProps,2))}`),console.log("  alternate: "+(t.alternate?"YES":"NO")),t.alternate){console.log(`  ALTERNATE memoizedProps: ${JSON.stringify(safeStringify(t.alternate.memoizedProps,2))}`);const e=!shallowEqual(t.alternate.memoizedProps,t.memoizedProps);console.log("  Props changed (vs alternate): "+(e?"YES":"NO")),console.log("  ALTERNATE memoizedState: "+(t.alternate.memoizedState===t.memoizedState?"SAME":"DIFFERENT"))}const e=getComponentFiberPrevState(t);if(e){console.log(`  WeakMap PREVIOUS memoizedProps: ${JSON.stringify(safeStringify(e.memoizedProps,2))}`);const o=!shallowEqual(e.memoizedProps,t.memoizedProps);console.log("  Props changed (vs WeakMap): "+(o?"YES":"NO"))}else console.log("  WeakMap PREVIOUS state: (not found - first render or WeakMap cleared)");if(t._debugOwner){const e=getComponentNameFromFiber(t._debugOwner);console.log(`  _debugOwner: "${e}"`);let o=t._debugOwner,n=1;for(;o&&n<5;){const e=getComponentNameFromFiber(o);console.log(`    └─[${n}] ${e||"unknown"} (tag: ${o.tag})`),o=o._debugOwner,n++}}let n=0,r=o._debugOwner||o.return;for(;r&&r!==t&&n<30;)r=r.return,n++;console.log(`  Depth from native fiber: ${n}`)}else console.log("  (No component fiber found - could not walk up tree)");if(console.log(""),console.log("HOOKS:"),t?.memoizedState){const e=extractHookStates(t),o=t.alternate?extractHookStates(t.alternate):null,n=getComponentFiberPrevState(t),r=o||n?.extractedHooks,a=o?"alternate":n?"WeakMap":"none";e&&e.length>0?(console.log(`  Total hooks: ${e.length}`),console.log(`  Previous values source: ${a}`),e.forEach((e,o)=>{const t=r?.[o],n=!!t&&t.rawState!==e.rawState,a=t?formatDisplayValue(t.value):"N/A",s=n?" ← CHANGED":"";console.log(`  [${o}] ${e.type}: ${formatDisplayValue(e.value)}${t?` (was: ${a})`:" (first render)"}${s}`)})):(console.log("  (Could not extract hooks - memoizedState structure not recognized)"),console.log("  Raw memoizedState type: "+typeof t.memoizedState),console.log(`  Has 'next' property: ${"next"in(t.memoizedState||{})}`),console.log(`  Has 'queue' property: ${"queue"in(t.memoizedState||{})}`))}else console.log("  (No memoizedState - class component, no hooks, or not a function component)");if(console.log(""),console.log("RAW HOOKS DATA:"),t?.memoizedState&&"object"==typeof t.memoizedState){let e=t.memoizedState,o=0;for(;e&&o<10;)console.log(`  Hook[${o}]:`),console.log(`    memoizedState: ${safeStringify(e.memoizedState,2)}`),console.log(`    baseState: ${safeStringify(e.baseState,2)}`),console.log("    queue: "+(e.queue?"[Queue present]":"null")),console.log("    next: "+(e.next?"[Next hook]":"null")),e=e.next,o++;0===o&&console.log("  (memoizedState is not a hooks linked list)")}console.log(""),console.log("DETECTION RESULTS:"),console.log(`  Component Cause: ${r.cause.toUpperCase()}`),r.hookChanges&&r.hookChanges.length>0&&(console.log("  Hook Changes Detected:"),r.hookChanges.forEach(e=>{console.log(`    [${e.index}] ${e.type}: ${e.previousValue} → ${e.currentValue}`),e.description&&console.log(`         ${e.description}`)}));const z="string"==typeof o?.type?o.type:void 0,$=getChangedKeys(n?.memoizedProps,o?.memoizedProps,z);$&&$.length>0?console.log(`  Native Props Changed: [${$.join(", ")}]`):n&&console.log("  Native Props Changed: (none detected)"),console.log(""),console.log("BATCH CONTEXT:"),console.log(`  Batch size: ${a.size}`),console.log(`  All tags in batch: [${Array.from(a).slice(0,20).join(", ")}${a.size>20?"...":""}]`);const N=getParentNativeTag(o),P=null!==N&&a.has(N);if(console.log(`  Parent nativeTag: ${N??"not found"}`),console.log("  Parent in batch: "+(P?"YES":"NO")),a.size>1){console.log("  Components in same batch:");let e=o?.return,t=0;for(;e&&t<10;){const o=getNativeTagFromStateNode(e.stateNode);if(null!==o&&a.has(o)){const n=getComponentNameFromFiber(e)||e.type;console.log(`    [depth ${t}] ${n} (tag: ${o})`)}e=e.return,t++}}console.log("\n═══════════════════════════════════════════════════════════════\n")}export function detectRenderCause(e,o,t,n="off"){const r=Date.now();if(!o)return{type:"unknown",timestamp:r};let a=o,s=o.alternate;const i=previousStates.get(e);if(i&&s){const e=i.memoizedProps?.children,t=o.memoizedProps?.children,r=s.memoizedProps?.children,l=o.memoizedProps===i.memoizedProps||void 0!==e&&t===e,c=s.memoizedProps===i.memoizedProps||void 0!==e&&r===e;l&&!c&&(a=s,s=o,"all"===n&&console.log("[RenderCause] Detected fiber swap - using alternate as current"))}let l=null,c=null;s?(l=s.memoizedProps,c=s.memoizedState):i&&(l=i.memoizedProps,c=i.memoizedState);const u=null!==l?{memoizedProps:l,memoizedState:c,timestamp:r}:void 0,m={memoizedProps:a.memoizedProps,memoizedState:a.memoizedState,timestamp:r};updateStoredState(e,m);const p=getOwningComponentFiber(a),f=getComponentNameFromFiber(p)||void 0,g=detectComponentCause(p),d=g.cause,y=g.hookChanges;if(!u){if("off"!==n)if("minimal"===n)console.log(`[${f||"Unknown"}] MOUNT`);else if("verbose"===n){const o="string"==typeof a?.type?a.type:"Unknown";console.log(`[RENDER] ${f||"Unknown"} (${o}:${e}) | Cause: MOUNT`)}else"all"===n&&logComprehensiveRenderData(e,a,p,u,g,t,previousStates.has(e)?previousStates.size:1);return{type:"mount",timestamp:r,componentCause:"mount",componentName:f}}const S="string"==typeof a.type?a.type:void 0,h=getChangedKeys(u.memoizedProps,m.memoizedProps,S);if("off"!==n&&("minimal"===n?logMinimal(f,g):"verbose"===n?logVerbose(e,a,p,g,h):"all"===n&&logComprehensiveRenderData(e,a,p,u,g,t,previousStates.has(e)?previousStates.size:1)),h&&h.length>0)return{type:"props",changedKeys:h.slice(0,10),timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0};const C=detectHookChanges(u.memoizedState,m.memoizedState);if(C&&C.length>0)return{type:"hooks",hookIndices:C,timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0};const b=getParentNativeTag(a);return b&&t.has(b)?{type:"parent",timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0}:"state"===d?{type:"state",timestamp:r,componentCause:d,componentName:f,hookChanges:y||void 0}:"props"===d?{type:"props",timestamp:r,componentCause:d,componentName:f}:"parent"===d?{type:"parent",timestamp:r,componentCause:d,componentName:f}:{type:"unknown",timestamp:r,componentCause:d,componentName:f}}function getChangedKeys(e,o,t){if(e===o)return null;if(!e||!o)return null;if("object"!=typeof e||"object"!=typeof o)return null;if(Array.isArray(e)||Array.isArray(o))return null;const n=getComponentPropConfig(t),r=new Set([...Object.keys(e),...Object.keys(o)]),a=[];for(const t of r)if(!t.startsWith("__")&&!n.skip.includes(t)){if("children"===t){if(!n.alwaysTrack.includes("children"))continue;const r=e[t],s=o[t];r!==s&&(isPrimitive(r)&&isPrimitive(s)?a.push(`children: ${formatValue(r)} → ${formatValue(s)}`):a.push("children (content)"));continue}if(e[t]!==o[t]){const n=e[t],r=o[t];"style"===t?deepEqual(n,r)?a.push(`${t} (ref only)`):a.push(t):"function"==typeof n&&"function"==typeof r?a.push(`${t} (fn ref)`):a.push(t)}}return a.length>0?a:null}function isPlainObject(e){if(null===e||"object"!=typeof e)return!1;if(Array.isArray(e))return!1;const o=Object.getPrototypeOf(e);return o===Object.prototype||null===o}function deepEqual(e,o,t=0){if(t>5)return!1;if(e===o)return!0;if(typeof e!=typeof o)return!1;if("object"!=typeof e||null===e||null===o)return e===o;if(Array.isArray(e)!==Array.isArray(o))return!1;if(Array.isArray(e)){if(e.length!==o.length)return!1;for(let n=0;n<e.length;n++)if(!deepEqual(e[n],o[n],t+1))return!1;return!0}const n=Object.keys(e),r=Object.keys(o);if(n.length!==r.length)return!1;for(const a of n){if(!r.includes(a))return!1;if(!deepEqual(e[a],o[a],t+1))return!1}return!0}function isPrimitive(e){return null==e||"string"==typeof e||"number"==typeof e||"boolean"==typeof e}function formatValue(e){return null===e?"null":void 0===e?"undefined":"string"==typeof e?e.length>20?`"${e.slice(0,20)}..."`:`"${e}"`:"number"==typeof e||"boolean"==typeof e?String(e):"[object]"}function detectHookChanges(e,o){if(e===o)return null;if(null==e||null==o)return null;if("object"!=typeof e||"object"!=typeof o)return null;const t=[];let n=e,r=o,a=0;for(;null!==r&&a<50;)(null===n||didHookChange(n,r))&&t.push(a),r=r?.next??null,n=n?.next??null,a++;return t.length>0?t:null}function didHookChange(e,o){return e!==o&&(e.memoizedState!==o.memoizedState||void 0!==e.baseState&&e.baseState!==o.baseState)}function getParentNativeTag(e){let o=e?.return,t=0;for(;o&&t<50;){if(o.stateNode){const e=getNativeTagFromStateNode(o.stateNode);if(null!=e)return e}o=o.return,t++}return null}function getNativeTagFromStateNode(e){return e?"number"==typeof e.__nativeTag?e.__nativeTag:"number"==typeof e._nativeTag?e._nativeTag:"number"==typeof e.canonical?.__nativeTag?e.canonical.__nativeTag:"number"==typeof e.canonical?.publicInstance?.__nativeTag?e.canonical.publicInstance.__nativeTag:null:null}function updateStoredState(e,o){if(previousStates.size>=500){const e=Array.from(previousStates.entries());e.sort((e,o)=>e[1].timestamp-o[1].timestamp);const o=Math.floor(125);for(let t=0;t<o;t++)previousStates.delete(e[t][0])}previousStates.set(e,o)}export function clearRenderCauseState(){previousStates.clear()}export function removeRenderCauseState(e){previousStates.delete(e)}export function getRenderCauseStats(){return{storedStates:previousStates.size,maxStates:500}}const MAX_CLONE_DEPTH=5,MAX_STRING_LENGTH=200,MAX_ARRAY_ITEMS=20,MAX_OBJECT_KEYS=30;export function safeCloneForHistory(e,o=0,t=new WeakSet){if(null==e)return e;if("boolean"==typeof e||"number"==typeof e)return e;if("string"==typeof e)return e.length>200?e.slice(0,200)+"...":e;if("function"==typeof e)return`[Function: ${e.name||"anonymous"}]`;if("symbol"==typeof e)return`[Symbol: ${e.description||""}]`;if(o>=5)return Array.isArray(e)?`[Array: ${e.length} items]`:"object"==typeof e?`[Object: ${Object.keys(e).length} keys]`:"[...]";if("object"==typeof e){if(t.has(e))return"[Circular]";t.add(e)}if(Array.isArray(e)){const n=e.slice(0,20).map(e=>safeCloneForHistory(e,o+1,t));return e.length>20&&n.push(`[...${e.length-20} more]`),n}if(e instanceof Date)return e.toISOString();if(e instanceof Error)return`[Error: ${e.message}]`;if(e instanceof RegExp)return e.toString();if(e instanceof Map){const n={__type:"Map",__size:e.size};let r=0;for(const[a,s]of e){if(r>=30){n[`...${e.size-r} more`]=!0;break}n["string"==typeof a?a:String(a)]=safeCloneForHistory(s,o+1,t),r++}return n}if(e instanceof Set)return{__type:"Set",__size:e.size,values:Array.from(e).slice(0,20).map(e=>safeCloneForHistory(e,o+1,t))};if("object"==typeof e){const n={},r=Object.keys(e),a=r.slice(0,30);for(const r of a)if(!r.startsWith("__")&&"children"!==r)try{n[r]=safeCloneForHistory(e[r],o+1,t)}catch{n[r]="[Error accessing property]"}return r.length>30&&(n[`...${r.length-30} more keys`]=!0),n}return"[Unknown type]"}export function capturePropsSnapshot(e){if(e?.memoizedProps)return safeCloneForHistory(e.memoizedProps)}export function captureStateSnapshot(e){if(!e?.memoizedState)return;const o=e.memoizedState;if("object"==typeof o&&null!==o&&"next"in o){const e=[];let t=o,n=0;for(;t&&n<50;)e.push({index:n,memoizedState:safeCloneForHistory(t.memoizedState)}),t=t.next,n++;return{__type:"Hooks",hooks:e}}return safeCloneForHistory(o)}