@buoy-gg/highlight-updates 2.1.14 → 2.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/highlight-updates/components/HighlightUpdatesModal.js +1 -1
- package/lib/commonjs/highlight-updates/components/ModalHeaderContent.js +1 -1
- package/lib/commonjs/highlight-updates/components/RenderDetailView.js +1 -1
- package/lib/commonjs/highlight-updates/components/RendersCopySettingsView.js +1 -0
- package/lib/commonjs/highlight-updates/types/copySettings.js +1 -0
- package/lib/commonjs/highlight-updates/utils/copySettingsStorage.js +1 -0
- package/lib/commonjs/highlight-updates/utils/rendersExportFormatter.js +1 -0
- package/lib/module/highlight-updates/components/HighlightUpdatesModal.js +1 -1
- package/lib/module/highlight-updates/components/ModalHeaderContent.js +1 -1
- package/lib/module/highlight-updates/components/RenderDetailView.js +1 -1
- package/lib/module/highlight-updates/components/RendersCopySettingsView.js +1 -0
- package/lib/module/highlight-updates/types/copySettings.js +1 -0
- package/lib/module/highlight-updates/utils/copySettingsStorage.js +1 -0
- package/lib/module/highlight-updates/utils/rendersExportFormatter.js +1 -0
- package/lib/typescript/highlight-updates/components/ModalHeaderContent.d.ts +6 -2
- package/lib/typescript/highlight-updates/components/RendersCopySettingsView.d.ts +13 -0
- package/lib/typescript/highlight-updates/types/copySettings.d.ts +79 -0
- package/lib/typescript/highlight-updates/utils/copySettingsStorage.d.ts +10 -0
- package/lib/typescript/highlight-updates/utils/rendersExportFormatter.d.ts +20 -0
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HighlightUpdatesModal=HighlightUpdatesModal,exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_license=require("@buoy-gg/license"),_HighlightUpdatesController=_interopRequireDefault(require("../utils/HighlightUpdatesController")),_RenderTracker=require("../utils/RenderTracker"),_RenderDetailView=require("./RenderDetailView"),_HighlightFilterView=require("./HighlightFilterView"),_IsolatedRenderList=require("./IsolatedRenderList"),_ModalHeaderContent=require("./ModalHeaderContent"),_RenderHistoryViewer=require("./RenderHistoryViewer"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,i,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(n=t?a:r){if(n.has(e))return n.get(e);n.set(e,s)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?n(s,t,i):s[t]=e[t]);return s})(e,t)}const DisabledBanner=_react.default.memo(function(){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.disabledBanner,children:[(0,_jsxRuntime.jsx)(_sharedUi.Power,{size:14,color:_sharedUi.buoyColors.warning}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.disabledText,children:"Render tracking is disabled"})]})});function formatRenderDataForClipboard(){const e=_RenderTracker.RenderTracker.getRenders(),t={exportedAt:(new Date).toISOString(),totalComponents:e.length,totalRenders:e.reduce((e,t)=>e+t.renderCount,0),components:e.map(e=>({componentName:e.componentName||e.displayName,viewType:e.viewType,nativeTag:e.nativeTag,testID:e.testID,nativeID:e.nativeID,accessibilityLabel:e.accessibilityLabel,renderCount:e.renderCount,firstRenderTime:e.firstRenderTime,lastRenderTime:e.lastRenderTime,lastRenderCause:e.lastRenderCause?{type:e.lastRenderCause.type,componentCause:e.lastRenderCause.componentCause,changedKeys:e.lastRenderCause.changedKeys,hookChanges:e.lastRenderCause.hookChanges?.map(e=>({type:e.type,index:e.index,description:e.description}))}:null,renderHistory:e.renderHistory?.map(e=>({renderNumber:e.renderNumber,timestamp:e.timestamp,cause:{type:e.cause.type,componentCause:e.cause.componentCause,changedKeys:e.cause.changedKeys}}))}))};return JSON.stringify(t,null,2)}function HighlightUpdatesModal({visible:e,onClose:t,onBack:r,onMinimize:a,enableSharedModalDimensions:n=!1,initialNativeTag:i,onInitialNativeTagHandled:s}){const l=(0,_license.useIsPro)(),[o,c]=(0,_react.useState)(!1),[d,u]=(0,_react.useState)(()=>_HighlightUpdatesController.default.getFrozen()),[g,_]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getStats().totalComponents>0),[h,p]=(0,_react.useState)(null),[f,R]=(0,_react.useState)(0),[T,m]=(0,_react.useState)(!1),[C,y]=(0,_react.useState)("filters"),[x,k]=(0,_react.useState)("details"),[b,S]=(0,_react.useState)(0),[v,w]=(0,_react.useState)(""),[H,U]=(0,_react.useState)(!1),I=(0,_react.useRef)(null),j=(0,_react.useRef)([]),D=(0,_react.useRef)(_RenderTracker.RenderTracker.getFilters()),[P,F]=(0,_react.useState)(()=>{const e=_RenderTracker.RenderTracker.getFilters();return e.includePatterns.length+e.excludePatterns.length}),[N,V]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getFilters()),[M,q]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getSettings()),E=(0,_react.useRef)(!1),A=(0,_react.useRef)(!1),z=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{e&&!E.current&&(E.current=!0)},[e]),(0,_react.useEffect)(()=>{e&&!A.current&&(async()=>{try{const e=await _sharedUi.persistentStorage.getItem(_sharedUi.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.RenderTracker.setFilters(r);const a=_RenderTracker.RenderTracker.getFilters();D.current=a,V(a),F(a.includePatterns.length+a.excludePatterns.length)}A.current=!0}catch(e){}})()},[e]),(0,_react.useEffect)(()=>{A.current&&(async()=>{try{const e={includeTestID:Array.from(N.includeTestID),includeNativeID:Array.from(N.includeNativeID),includeViewType:Array.from(N.includeViewType),includeComponent:Array.from(N.includeComponent),excludeTestID:Array.from(N.excludeTestID),excludeNativeID:Array.from(N.excludeNativeID),excludeViewType:Array.from(N.excludeViewType),excludeComponent:Array.from(N.excludeComponent),includePatterns:N.includePatterns,excludePatterns:N.excludePatterns};await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.highlightUpdates.filters(),JSON.stringify(e))}catch(e){}})()},[N]),(0,_react.useEffect)(()=>{e&&!z.current&&(async()=>{try{const e=await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.highlightUpdates.settings());if(e){const t=JSON.parse(e),{performanceLogging:r,excludeDevTools:a,...n}=t;_RenderTracker.RenderTracker.setSettings(n),q(_RenderTracker.RenderTracker.getSettings())}z.current=!0}catch(e){z.current=!0}})()},[e]),(0,_react.useEffect)(()=>{z.current&&(async()=>{try{const{performanceLogging:e,excludeDevTools:t,...r}=M;await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.highlightUpdates.settings(),JSON.stringify(r))}catch(e){}})()},[M]),(0,_react.useEffect)(()=>{const e=_RenderTracker.RenderTracker.subscribeToState(e=>{c(e.isTracking)});return()=>{e()}},[]),(0,_react.useEffect)(()=>{const e=_HighlightUpdatesController.default.subscribeToFreeze(e=>{u(e)});return()=>{e()}},[]),(0,_react.useEffect)(()=>{H&&requestAnimationFrame(()=>{I.current?.focus()})},[H]),(0,_react.useEffect)(()=>{e||_HighlightUpdatesController.default.setSpotlight(null)},[e]),(0,_react.useEffect)(()=>{if(e&&null!=i){const e=_RenderTracker.RenderTracker.getRender(String(i));e&&(p(e),R(0),m(!1),_HighlightUpdatesController.default.setSpotlight(e.nativeTag)),s?.()}},[e,i,s]);const O=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.isInitialized()||_HighlightUpdatesController.default.initialize(),_HighlightUpdatesController.default.toggle()},[]),K=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.toggleFreeze()},[]),L=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.clearRenderCounts(),_(!1)},[]),B=g?formatRenderDataForClipboard:"",W=(0,_react.useCallback)(e=>{w(e)},[]),J=(0,_react.useCallback)((e,t,r)=>{p(e),R(t),k("details"),S(0),j.current=r,_HighlightUpdatesController.default.setSpotlight(e.nativeTag)},[]),G=(0,_react.useCallback)(e=>{j.current=e},[]),Q=(0,_react.useCallback)(()=>{p(null),R(0),_HighlightUpdatesController.default.setSpotlight(null)},[]),X=(0,_react.useCallback)(()=>{const e=j.current;if(f>0){const t=f-1,r=e[t];r&&(p(r),R(t),_HighlightUpdatesController.default.setSpotlight(r.nativeTag))}},[f]),Y=(0,_react.useCallback)(()=>{const e=j.current;if(f<e.length-1){const t=f+1,r=e[t];r&&(p(r),R(t),_HighlightUpdatesController.default.setSpotlight(r.nativeTag))}},[f]),Z=(0,_react.useCallback)(()=>{m(!1)},[]),$=(0,_react.useCallback)(()=>{m(!0)},[]),ee=(0,_react.useCallback)(()=>{U(!0)},[]),te=(0,_react.useCallback)(()=>{U(!1)},[]),re=(0,_react.useCallback)(e=>{_RenderTracker.RenderTracker.setFilters(e);const t=_RenderTracker.RenderTracker.getFilters();D.current=t,V(t),F(t.includePatterns.length+t.excludePatterns.length)},[]),ae=(0,_react.useCallback)((e,t)=>{const r=_RenderTracker.RenderTracker.getFilters(),a={};"include"===t?r.includePatterns.some(t=>t.type===e.type&&t.value===e.value)||(a.includePatterns=[...r.includePatterns,e]):r.excludePatterns.some(t=>t.type===e.type&&t.value===e.value)||(a.excludePatterns=[...r.excludePatterns,e]),Object.keys(a).length>0&&(re(a),p(null),R(0),_HighlightUpdatesController.default.setSpotlight(null))},[re]),ne=(0,_react.useCallback)(e=>{_RenderTracker.RenderTracker.setSettings(e),q(_RenderTracker.RenderTracker.getSettings())},[]),ie=(0,_react.useCallback)(e=>{_(e.totalComponents>0)},[]),se=(0,_react.useCallback)(()=>T?(0,_jsxRuntime.jsx)(_ModalHeaderContent.FilterViewHeader,{onBack:Z,activeTab:C,onTabChange:y,activeFilterCount:P}):h?(0,_jsxRuntime.jsx)(_ModalHeaderContent.DetailViewHeader,{onBack:Q,activeTab:x,onTabChange:k,hasHistory:(h.renderHistory?.length??0)>0}):(0,_jsxRuntime.jsx)(_ModalHeaderContent.MainListHeader,{onBack:r,isSearchActive:H,searchText:v,onSearchChange:W,onSearchToggle:ee,onSearchClose:te,onFilterToggle:$,onToggleTracking:O,onToggleFreeze:K,onClear:L,copyData:B,isTracking:o,isFrozen:d,activeFilterCount:P,hasRenders:g,searchInputRef:I}),[T,h,r,H,v,o,d,P,g,C,x,Z,Q,W,ee,te,$,O,K,L,B]),le=n?_sharedUi.devToolsStorageKeys.modal.root():_sharedUi.devToolsStorageKeys.highlightUpdates.modal();if(!e)return null;const oe=j.current.length,ce=h?"details"===x?(0,_jsxRuntime.jsx)(_sharedUi.EventStepperFooter,{currentIndex:f,totalItems:oe,onPrevious:X,onNext:Y,itemLabel:"Component",subtitle:h.componentName||h.displayName||h.viewType}):(0,_jsxRuntime.jsx)(_RenderHistoryViewer.RenderHistoryFooter,{render:h,selectedEventIndex:b,onEventIndexChange:S,isPro:l}):null;return(0,_jsxRuntime.jsx)(_sharedUi.TickProvider,{children:(0,_jsxRuntime.jsx)(_sharedUi.JsModal,{visible:e,onClose:t,onMinimize:a,persistenceKey:le,header:{showToggleButton:!0,customContent:se()},enablePersistence:!0,initialMode:"bottomSheet",enableGlitchEffects:!0,styles:{},footer:ce,footerHeight:h&&("details"===x||(h.renderHistory?.length??0)>1)?68:0,children:(0,_jsxRuntime.jsx)(_reactNative.View,{nativeID:"__rn_buoy__highlight-modal",style:styles.container,children:h?"details"===x?(0,_jsxRuntime.jsx)(_RenderDetailView.RenderDetailView,{render:h,disableInternalFooter:!0,onAddFilter:ae,isPro:l}):(0,_jsxRuntime.jsx)(_RenderHistoryViewer.RenderHistoryViewer,{render:h,disableInternalFooter:!0,selectedEventIndex:b,onEventIndexChange:S,isPro:l}):T?(0,_jsxRuntime.jsx)(_HighlightFilterView.HighlightFilterView,{filters:N,onFilterChange:re,settings:M,onSettingsChange:ne,availableProps:_RenderTracker.RenderTracker.getAvailableProps(),activeTab:C}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[!o&&(0,_jsxRuntime.jsx)(DisabledBanner,{}),(0,_jsxRuntime.jsx)(_IsolatedRenderList.IsolatedRenderList,{searchText:v,filters:N,onSelectRender:J,onStatsChange:ie,onRendersChange:G,isTracking:o,isPro:l})]})})})})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:_sharedUi.buoyColors.base},disabledBanner:{flexDirection:"row",alignItems:"center",gap:8,padding:10,marginHorizontal:12,marginTop:8,backgroundColor:_sharedUi.buoyColors.warning+"15",borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.warning+"20"},disabledText:{color:_sharedUi.buoyColors.warning,fontSize:11,flex:1}});var _default=exports.default=HighlightUpdatesModal;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HighlightUpdatesModal=HighlightUpdatesModal,exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_license=require("@buoy-gg/license"),_HighlightUpdatesController=_interopRequireDefault(require("../utils/HighlightUpdatesController")),_RenderTracker=require("../utils/RenderTracker"),_RenderDetailView=require("./RenderDetailView"),_HighlightFilterView=require("./HighlightFilterView"),_IsolatedRenderList=require("./IsolatedRenderList"),_ModalHeaderContent=require("./ModalHeaderContent"),_RenderHistoryViewer=require("./RenderHistoryViewer"),_RendersCopySettingsView=require("./RendersCopySettingsView"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,i,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(n=t?a:r){if(n.has(e))return n.get(e);n.set(e,s)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?n(s,t,i):s[t]=e[t]);return s})(e,t)}const DisabledBanner=_react.default.memo(function(){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.disabledBanner,children:[(0,_jsxRuntime.jsx)(_sharedUi.Power,{size:14,color:_sharedUi.buoyColors.warning}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.disabledText,children:"Render tracking is disabled"})]})});function HighlightUpdatesModal({visible:e,onClose:t,onBack:r,onMinimize:a,enableSharedModalDimensions:n=!1,initialNativeTag:i,onInitialNativeTagHandled:s}){const l=(0,_license.useIsPro)(),[o,c]=(0,_react.useState)(!1),[d,u]=(0,_react.useState)(()=>_HighlightUpdatesController.default.getFrozen()),[g,_]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getStats().totalComponents>0),[h,p]=(0,_react.useState)(null),[f,R]=(0,_react.useState)(0),[T,x]=(0,_react.useState)(!1),[C,y]=(0,_react.useState)(!1),[k,S]=(0,_react.useState)([]),[m,b]=(0,_react.useState)("filters"),[v,w]=(0,_react.useState)("details"),[j,H]=(0,_react.useState)(0),[U,I]=(0,_react.useState)(""),[P,D]=(0,_react.useState)(!1),F=(0,_react.useRef)(null),V=(0,_react.useRef)([]),M=(0,_react.useRef)(_RenderTracker.RenderTracker.getFilters()),[N,q]=(0,_react.useState)(()=>{const e=_RenderTracker.RenderTracker.getFilters();return e.includePatterns.length+e.excludePatterns.length}),[E,z]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getFilters()),[A,O]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getSettings()),B=(0,_react.useRef)(!1),L=(0,_react.useRef)(!1),K=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{e&&!B.current&&(B.current=!0)},[e]),(0,_react.useEffect)(()=>{e&&!L.current&&(async()=>{try{const e=await _sharedUi.persistentStorage.getItem(_sharedUi.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.RenderTracker.setFilters(r);const a=_RenderTracker.RenderTracker.getFilters();M.current=a,z(a),q(a.includePatterns.length+a.excludePatterns.length)}L.current=!0}catch(e){}})()},[e]),(0,_react.useEffect)(()=>{L.current&&(async()=>{try{const e={includeTestID:Array.from(E.includeTestID),includeNativeID:Array.from(E.includeNativeID),includeViewType:Array.from(E.includeViewType),includeComponent:Array.from(E.includeComponent),excludeTestID:Array.from(E.excludeTestID),excludeNativeID:Array.from(E.excludeNativeID),excludeViewType:Array.from(E.excludeViewType),excludeComponent:Array.from(E.excludeComponent),includePatterns:E.includePatterns,excludePatterns:E.excludePatterns};await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.highlightUpdates.filters(),JSON.stringify(e))}catch(e){}})()},[E]),(0,_react.useEffect)(()=>{e&&!K.current&&(async()=>{try{const e=await _sharedUi.persistentStorage.getItem(_sharedUi.devToolsStorageKeys.highlightUpdates.settings());if(e){const t=JSON.parse(e),{performanceLogging:r,excludeDevTools:a,...n}=t;_RenderTracker.RenderTracker.setSettings(n),O(_RenderTracker.RenderTracker.getSettings())}K.current=!0}catch(e){K.current=!0}})()},[e]),(0,_react.useEffect)(()=>{K.current&&(async()=>{try{const{performanceLogging:e,excludeDevTools:t,...r}=A;await _sharedUi.persistentStorage.setItem(_sharedUi.devToolsStorageKeys.highlightUpdates.settings(),JSON.stringify(r))}catch(e){}})()},[A]),(0,_react.useEffect)(()=>{const e=_RenderTracker.RenderTracker.subscribeToState(e=>{c(e.isTracking)});return()=>{e()}},[]),(0,_react.useEffect)(()=>{const e=_HighlightUpdatesController.default.subscribeToFreeze(e=>{u(e)});return()=>{e()}},[]),(0,_react.useEffect)(()=>{P&&requestAnimationFrame(()=>{F.current?.focus()})},[P]),(0,_react.useEffect)(()=>{e||_HighlightUpdatesController.default.setSpotlight(null)},[e]),(0,_react.useEffect)(()=>{if(e&&null!=i){const e=_RenderTracker.RenderTracker.getRender(String(i));e&&(p(e),R(0),x(!1),_HighlightUpdatesController.default.setSpotlight(e.nativeTag)),s?.()}},[e,i,s]);const W=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.isInitialized()||_HighlightUpdatesController.default.initialize(),_HighlightUpdatesController.default.toggle()},[]),J=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.toggleFreeze()},[]),G=(0,_react.useCallback)(()=>{_HighlightUpdatesController.default.clearRenderCounts(),_(!1)},[]),Q=(0,_react.useCallback)(()=>{S(_RenderTracker.RenderTracker.getFilteredRenders(U)),y(!0)},[U]),X=(0,_react.useCallback)(()=>{y(!1)},[]),Y=(0,_react.useCallback)(e=>{I(e)},[]),Z=(0,_react.useCallback)((e,t,r)=>{p(e),R(t),w("details"),H(0),V.current=r,_HighlightUpdatesController.default.setSpotlight(e.nativeTag)},[]),$=(0,_react.useCallback)(e=>{V.current=e},[]),ee=(0,_react.useCallback)(()=>{p(null),R(0),_HighlightUpdatesController.default.setSpotlight(null)},[]),te=(0,_react.useCallback)(()=>{const e=V.current;if(f>0){const t=f-1,r=e[t];r&&(p(r),R(t),_HighlightUpdatesController.default.setSpotlight(r.nativeTag))}},[f]),re=(0,_react.useCallback)(()=>{const e=V.current;if(f<e.length-1){const t=f+1,r=e[t];r&&(p(r),R(t),_HighlightUpdatesController.default.setSpotlight(r.nativeTag))}},[f]),ae=(0,_react.useCallback)(()=>{x(!1)},[]),ne=(0,_react.useCallback)(()=>{x(!0)},[]),ie=(0,_react.useCallback)(()=>{D(!0)},[]),se=(0,_react.useCallback)(()=>{D(!1)},[]),le=(0,_react.useCallback)(e=>{_RenderTracker.RenderTracker.setFilters(e);const t=_RenderTracker.RenderTracker.getFilters();M.current=t,z(t),q(t.includePatterns.length+t.excludePatterns.length)},[]),oe=(0,_react.useCallback)((e,t)=>{const r=_RenderTracker.RenderTracker.getFilters(),a={};"include"===t?r.includePatterns.some(t=>t.type===e.type&&t.value===e.value)||(a.includePatterns=[...r.includePatterns,e]):r.excludePatterns.some(t=>t.type===e.type&&t.value===e.value)||(a.excludePatterns=[...r.excludePatterns,e]),Object.keys(a).length>0&&(le(a),p(null),R(0),_HighlightUpdatesController.default.setSpotlight(null))},[le]),ce=(0,_react.useCallback)(e=>{_RenderTracker.RenderTracker.setSettings(e),O(_RenderTracker.RenderTracker.getSettings())},[]),de=(0,_react.useCallback)(e=>{_(e.totalComponents>0)},[]),ue=(0,_react.useCallback)(()=>C?(0,_jsxRuntime.jsx)(_ModalHeaderContent.CopySettingsViewHeader,{onBack:X}):T?(0,_jsxRuntime.jsx)(_ModalHeaderContent.FilterViewHeader,{onBack:ae,activeTab:m,onTabChange:b,activeFilterCount:N}):h?(0,_jsxRuntime.jsx)(_ModalHeaderContent.DetailViewHeader,{onBack:ee,activeTab:v,onTabChange:w,hasHistory:(h.renderHistory?.length??0)>0}):(0,_jsxRuntime.jsx)(_ModalHeaderContent.MainListHeader,{onBack:r,isSearchActive:P,searchText:U,onSearchChange:Y,onSearchToggle:ie,onSearchClose:se,onFilterToggle:ne,onToggleTracking:W,onToggleFreeze:J,onClear:G,onOpenCopySettings:Q,isTracking:o,isFrozen:d,activeFilterCount:N,hasRenders:g,searchInputRef:F}),[C,T,h,r,P,U,o,d,N,g,m,v,ae,ee,X,Y,ie,se,ne,W,J,G,Q]),ge=n?_sharedUi.devToolsStorageKeys.modal.root():_sharedUi.devToolsStorageKeys.highlightUpdates.modal();if(!e)return null;const _e=V.current.length,he=h?"details"===v?(0,_jsxRuntime.jsx)(_sharedUi.EventStepperFooter,{currentIndex:f,totalItems:_e,onPrevious:te,onNext:re,itemLabel:"Component",subtitle:h.componentName||h.displayName||h.viewType}):(0,_jsxRuntime.jsx)(_RenderHistoryViewer.RenderHistoryFooter,{render:h,selectedEventIndex:j,onEventIndexChange:H,isPro:l}):null;return(0,_jsxRuntime.jsx)(_sharedUi.TickProvider,{children:(0,_jsxRuntime.jsx)(_sharedUi.JsModal,{visible:e,onClose:t,onMinimize:a,persistenceKey:ge,header:{showToggleButton:!0,customContent:ue()},enablePersistence:!0,initialMode:"bottomSheet",enableGlitchEffects:!0,styles:{},footer:he,footerHeight:h&&("details"===v||(h.renderHistory?.length??0)>1)?68:0,children:(0,_jsxRuntime.jsx)(_reactNative.View,{nativeID:"__rn_buoy__highlight-modal",style:styles.container,children:C?(0,_jsxRuntime.jsx)(_RendersCopySettingsView.RendersCopySettingsView,{renders:k}):h?"details"===v?(0,_jsxRuntime.jsx)(_RenderDetailView.RenderDetailView,{render:h,disableInternalFooter:!0,onAddFilter:oe,isPro:l}):(0,_jsxRuntime.jsx)(_RenderHistoryViewer.RenderHistoryViewer,{render:h,disableInternalFooter:!0,selectedEventIndex:j,onEventIndexChange:H,isPro:l}):T?(0,_jsxRuntime.jsx)(_HighlightFilterView.HighlightFilterView,{filters:E,onFilterChange:le,settings:A,onSettingsChange:ce,availableProps:_RenderTracker.RenderTracker.getAvailableProps(),activeTab:m}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[!o&&(0,_jsxRuntime.jsx)(DisabledBanner,{}),(0,_jsxRuntime.jsx)(_IsolatedRenderList.IsolatedRenderList,{searchText:U,filters:E,onSelectRender:Z,onStatsChange:de,onRendersChange:$,isTracking:o,isPro:l})]})})})})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:_sharedUi.buoyColors.base},disabledBanner:{flexDirection:"row",alignItems:"center",gap:8,padding:10,marginHorizontal:12,marginTop:8,backgroundColor:_sharedUi.buoyColors.warning+"15",borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.warning+"20"},disabledText:{color:_sharedUi.buoyColors.warning,fontSize:11,flex:1}});var _default=exports.default=HighlightUpdatesModal;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SearchSection=exports.MainListHeader=exports.HeaderActions=exports.FilterViewHeader=exports.DetailViewHeader=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_StatsDisplay=require("./StatsDisplay"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SearchSection=exports.MainListHeader=exports.HeaderActions=exports.FilterViewHeader=exports.DetailViewHeader=exports.CopySettingsViewHeader=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_StatsDisplay=require("./StatsDisplay"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var o,i,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(o=r?a:t){if(o.has(e))return o.get(e);o.set(e,s)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(i.get||i.set)?o(s,r,i):s[r]=e[r]);return s})(e,r)}const SearchSectionInner=(0,_react.memo)(function({isActive:e,searchText:r,onSearchChange:t,onSearchClose:a}){return e?(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__search-container",style:styles.headerSearchContainer,children:[(0,_jsxRuntime.jsx)(_sharedUi.Search,{size:14,color:_sharedUi.buoyColors.textSecondary}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{style:styles.headerSearchInput,placeholder:"Search testID, nativeID, component...",placeholderTextColor:_sharedUi.buoyColors.textMuted,value:r,onChangeText:t,onSubmitEditing:a,onBlur:a,accessibilityLabel:"Search renders",autoCapitalize:"none",autoCorrect:!1,returnKeyType:"search",autoFocus:!0}),r.length>0?(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:()=>{t(""),a()},style:styles.headerSearchClear,children:(0,_jsxRuntime.jsx)(_sharedUi.X,{size:14,color:_sharedUi.buoyColors.textSecondary})}):null]}):null}),SearchSection=exports.SearchSection=SearchSectionInner,HeaderActionsInner=(0,_react.memo)(function({onSearchToggle:e,onFilterToggle:r,onToggleTracking:t,onToggleFreeze:a,onClear:o,onOpenCopySettings:i,isTracking:s,isFrozen:n,activeFilterCount:l,hasRenders:d}){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader.Actions,{children:[(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:e,style:styles.headerActionButton,children:(0,_jsxRuntime.jsx)(_sharedUi.Search,{size:14,color:_sharedUi.buoyColors.textSecondary})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:r,style:[styles.headerActionButton,l>0&&styles.activeFilterButton],children:(0,_jsxRuntime.jsx)(_sharedUi.Filter,{size:14,color:l>0?_sharedUi.buoyColors.primary:_sharedUi.buoyColors.textMuted})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:i,style:[styles.headerActionButton,!d&&styles.headerActionButtonDisabled],disabled:!d,accessibilityLabel:"Open copy settings",children:(0,_jsxRuntime.jsx)(_sharedUi.Copy,{size:14,color:d?_sharedUi.buoyColors.textSecondary:_sharedUi.buoyColors.textMuted})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:a,style:[styles.headerActionButton,n&&styles.freezeButton,!s&&styles.headerActionButtonDisabled],disabled:!s,children:(0,_jsxRuntime.jsx)(_sharedUi.Pause,{size:14,color:s&&n?_sharedUi.buoyColors.primary:_sharedUi.buoyColors.textMuted})}),(0,_jsxRuntime.jsx)(_sharedUi.PowerToggleButton,{isEnabled:s,onToggle:t,accessibilityLabel:"Toggle render tracking"}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{onPress:o,style:[styles.headerActionButton,!d&&styles.headerActionButtonDisabled],disabled:!d,children:(0,_jsxRuntime.jsx)(_sharedUi.Trash2,{size:14,color:_sharedUi.buoyColors.textMuted})})]})}),HeaderActions=exports.HeaderActions=HeaderActionsInner,MainListHeader=exports.MainListHeader=(0,_react.memo)(function({onBack:e,isSearchActive:r,searchText:t,onSearchChange:a,onSearchToggle:o,onSearchClose:i,onFilterToggle:s,onToggleTracking:n,onToggleFreeze:l,onClear:d,onOpenCopySettings:c,isTracking:u,isFrozen:h,activeFilterCount:_,hasRenders:x,searchInputRef:y}){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[e&&(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:e}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",children:r?(0,_jsxRuntime.jsx)(SearchSection,{isActive:r,searchText:t,onSearchChange:a,onSearchClose:i,searchInputRef:y}):(0,_jsxRuntime.jsx)(_StatsDisplay.StatsDisplay,{})}),(0,_jsxRuntime.jsx)(HeaderActions,{onSearchToggle:o,onFilterToggle:s,onToggleTracking:n,onToggleFreeze:l,onClear:d,onOpenCopySettings:c,isTracking:u,isFrozen:h,activeFilterCount:_,hasRenders:x})]})}),FilterViewHeader=exports.FilterViewHeader=(0,_react.memo)(function({onBack:e,activeTab:r,onTabChange:t,activeFilterCount:a=0}){const o=[{key:"filters",label:"Filters"+(a>0?` (${a})`:"")},{key:"settings",label:"Settings"}];return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:e}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",noMargin:!0,children:(0,_jsxRuntime.jsx)(_sharedUi.TabSelector,{tabs:o,activeTab:r,onTabChange:e=>t(e)})}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Actions,{})]})}),DetailViewHeader=exports.DetailViewHeader=(0,_react.memo)(function({onBack:e,activeTab:r,onTabChange:t,hasHistory:a=!0}){const o=[{key:"details",label:"Details"},{key:"history",label:"History",disabled:!a}];return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:e}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"",noMargin:!0,children:(0,_jsxRuntime.jsx)(_sharedUi.TabSelector,{tabs:o,activeTab:r,onTabChange:e=>t(e)})}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Actions,{})]})}),CopySettingsViewHeader=exports.CopySettingsViewHeader=(0,_react.memo)(function({onBack:e}){return(0,_jsxRuntime.jsxs)(_sharedUi.ModalHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Navigation,{onBack:e}),(0,_jsxRuntime.jsx)(_sharedUi.ModalHeader.Content,{title:"Copy Settings"})]})}),styles=_reactNative.StyleSheet.create({headerSearchContainer:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.buoyColors.input,borderRadius:10,borderWidth:1,borderColor:_sharedUi.buoyColors.border,paddingHorizontal:12,paddingVertical:5},headerSearchInput:{flex:1,color:_sharedUi.buoyColors.text,fontSize:13,marginLeft:6,paddingVertical:2},headerSearchClear:{marginLeft:6,padding:4},headerActionButton:{width:32,height:32,borderRadius:8,backgroundColor:_sharedUi.buoyColors.hover,borderWidth:1,borderColor:_sharedUi.buoyColors.border,alignItems:"center",justifyContent:"center"},headerActionButtonDisabled:{opacity:.55},activeFilterButton:{backgroundColor:_sharedUi.buoyColors.primary+"15",borderColor:_sharedUi.buoyColors.primary+"40"},freezeButton:{backgroundColor:_sharedUi.buoyColors.primary+"15",borderColor:_sharedUi.buoyColors.primary+"40"}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RenderDetailView=RenderDetailView,exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_dataViewer=require("@buoy-gg/shared-ui/dataViewer"),_RenderCauseBadge=require("./RenderCauseBadge"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,s=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var i,o,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(i=t?s:r){if(i.has(e))return i.get(e);i.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((o=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?i(a,t,o):a[t]=e[t]);return a})(e,t)}function formatRenderDetailForClipboard(e){const t=[];if(t.push(`${e.componentName||e.displayName} (${e.viewType})`),t.push(`Renders: ${e.renderCount}`),e.lastRenderCause){const r=e.lastRenderCause;if(r.componentCause?t.push(`Cause: ${r.componentCause.toUpperCase()} → ${r.type.toUpperCase()}`):t.push(`Cause: ${r.type.toUpperCase()}`),r.hookChanges?.length)for(const e of r.hookChanges)t.push(` ${e.type}[${e.index}]: ${e.previousValue} → ${e.currentValue}`)}if(e.renderHistory?.length){t.push(`\nHistory (${e.renderHistory.length} events):`);for(const r of e.renderHistory){const e=r.cause.componentCause?`${r.cause.componentCause.toUpperCase()} → ${r.cause.type.toUpperCase()}`:r.cause.type.toUpperCase();t.push(` #${r.renderNumber}: ${e}`)}}return t.join("\n")}const FREE_TIER_EVENT_LIMIT=5;function RenderDetailView({render:e,disableInternalFooter:t=!1,selectedEventIndex:r,onEventIndexChange:s,onAddFilter:i,isPro:o=!1}){const[a,n]=(0,_react.useState)(0),l=r??a,d=s??n,c=(0,_react.useMemo)(()=>e.renderHistory&&0!==e.renderHistory.length?[...e.renderHistory].sort((e,t)=>e.timestamp-t.timestamp):[],[e.renderHistory]),u=c.length,y=c[l],x=(0,_react.useMemo)(()=>o?0:Math.max(0,u-FREE_TIER_EVENT_LIMIT),[o,u]),_=y?.cause||e.lastRenderCause,h=(0,_react.useCallback)(()=>{l>0&&d(l-1)},[l,d]),m=(0,_react.useCallback)(()=>{const e=o?u-1:Math.min(FREE_TIER_EVENT_LIMIT-1,u-1);l<e&&d(l+1)},[l,u,d,o]),p=(0,_react.useMemo)(()=>formatRenderDetailForClipboard(e),[e]),b=e.componentName||e.displayName,C=e.viewType,j=e.lastRenderTime-e.firstRenderTime,g=j>0?(e.renderCount/(j/1e3)).toFixed(1):e.renderCount.toString(),f=!t&&u>1;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.container,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.header,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.headerLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.componentName,numberOfLines:1,children:b}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.nativeTypeBadge,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.nativeTypeText,children:C})})]}),(0,_jsxRuntime.jsx)(_sharedUi.CopyButton,{value:p,size:14})]}),(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{style:styles.scrollView,contentContainerStyle:[styles.scrollContent,f&&{paddingBottom:100}],showsVerticalScrollIndicator:!1,children:[_&&(0,_jsxRuntime.jsx)(AnswerCard,{cause:_,renderNumber:y?.renderNumber}),(0,_jsxRuntime.jsx)(DetailsSection,{render:e,rendersPerSec:g}),x>0&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.lockedBanner,children:[(0,_jsxRuntime.jsx)(_sharedUi.Lock,{size:14,color:_sharedUi.buoyColors.warning}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.lockedBannerText,children:[x," ",1===x?"event":"events"," hidden"]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),i&&(0,_jsxRuntime.jsx)(QuickActionsSection,{render:e,onAddFilter:i})]}),f&&(0,_jsxRuntime.jsx)(_sharedUi.EventStepperFooter,{currentIndex:l,totalItems:u,onPrevious:h,onNext:m,itemLabel:"Render",subtitle:y?.timestamp?(0,_sharedUi.formatRelativeTime)(new Date(y.timestamp)):void 0,applySafeAreaInset:!1,absolute:!0})]})}function AnswerCard({cause:e,renderNumber:t}){const r=e.componentCause||e.type,s=e.componentCause?_RenderCauseBadge.COMPONENT_CAUSE_CONFIG[e.componentCause]:_RenderCauseBadge.CAUSE_CONFIG[e.type],i=e.hookChanges&&e.hookChanges.length>0,o=e.changedKeys&&e.changedKeys.length>0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.answerCard,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.causeBadgeRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.causeLabel,children:"mount"===e.type?"First render":"parent"===r?"Triggered by":"Changed:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.causeBadgeLarge,{backgroundColor:s.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.causeBadgeLargeText,{color:s.color}],children:s.label.toUpperCase()})})]}),i&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.hookChangesContainer,children:e.hookChanges.map((e,t)=>{const r=`${e.type}[${e.index}]`,s={[r]:e.previousValue},i={[r]:e.currentValue};return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.hookDiffContainer,children:(0,_jsxRuntime.jsx)(_dataViewer.TreeDiffViewer,{oldValue:s,newValue:i,theme:"dark",showUnchanged:!1})},t)})}),!i&&o&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.propsChangesContainer,children:e.changedKeys.filter(e=>!e.includes("(ref only)")).slice(0,5).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.propChangeChip,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.propChangeText,children:e})},t))})]})}function DetailsSection({render:e,rendersPerSec:t}){const r=e.testID||e.nativeID||e.accessibilityLabel,s=e.measurements;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailsSection,children:[r&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailsCard,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailsCardTitle,children:"Identifiers"}),e.testID&&(0,_jsxRuntime.jsx)(DetailRow,{label:"testID",value:e.testID}),e.nativeID&&(0,_jsxRuntime.jsx)(DetailRow,{label:"nativeID",value:e.nativeID}),e.accessibilityLabel&&(0,_jsxRuntime.jsx)(DetailRow,{label:"a11y",value:e.accessibilityLabel})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statsRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.statValue,{color:e.color}],children:e.renderCount}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"renders"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.statDivider}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statValue,children:t}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"/sec"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.statDivider}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statValue,children:e.nativeTag}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"tag"})]})]}),s&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementsRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"x"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.x)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"y"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.y)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"w"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.width)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"h"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.height)})]})]})]})}function DetailRow({label:e,value:t}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailLabel,children:e}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailValue,numberOfLines:1,children:t})]})}function QuickActionsSection({render:e,onAddFilter:t}){const[r,s]=(0,_react.useState)(null),i=(0,_react.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]),o=null!==r?i[r]:null,a=(0,_react.useCallback)(e=>{s(t=>t===e?null:e)},[]),n=(0,_react.useCallback)(()=>{o&&(t({type:o.type,value:o.value},"include"),s(null))},[o,t]),l=(0,_react.useCallback)(()=>{o&&(t({type:o.type,value:o.value},"exclude"),s(null))},[o,t]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.quickActionsSection,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.quickActionsTitle,children:"Quick Filters"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.filterOptionsList,children:i.map((e,t)=>(0,_jsxRuntime.jsx)(FilterOptionCard,{label:e.label,value:e.value,isSelected:r===t,onSelect:()=>a(t)},e.type))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.filterActionButtons,children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonInclude,!o&&styles.filterActionButtonDisabled],onPress:n,disabled:!o,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_sharedUi.PlusIcon,{size:14,color:o?_sharedUi.buoyColors.success:_sharedUi.buoyColors.textMuted}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterActionButtonText,{color:o?_sharedUi.buoyColors.success:_sharedUi.buoyColors.textMuted}],children:"Only Show This"})]}),(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonExclude,!o&&styles.filterActionButtonDisabled],onPress:l,disabled:!o,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_sharedUi.MinusIcon,{size:14,color:o?_sharedUi.buoyColors.error:_sharedUi.buoyColors.textMuted}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterActionButtonText,{color:o?_sharedUi.buoyColors.error:_sharedUi.buoyColors.textMuted}],children:"Hide This"})]})]})]})}function FilterOptionCard({label:e,value:t,isSelected:r,onSelect:s}){return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterOptionCard,r&&styles.filterOptionCardSelected],onPress:s,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterOptionLabel,r&&styles.filterOptionLabelSelected],children:e}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterOptionValue,r&&styles.filterOptionValueSelected],numberOfLines:1,children:t})]})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:_sharedUi.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:_sharedUi.buoyColors.text,flexShrink:1},nativeTypeBadge:{backgroundColor:_sharedUi.buoyColors.input,paddingVertical:3,paddingHorizontal:8,borderRadius:4},nativeTypeText:{fontSize:11,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,fontFamily:"monospace"},answerCard:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.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:_sharedUi.buoyColors.textSecondary,fontWeight:"500"},hookChangesContainer:{gap:6},hookDiffContainer:{backgroundColor:_sharedUi.buoyColors.input,borderRadius:6,overflow:"hidden"},propsChangesContainer:{flexDirection:"row",flexWrap:"wrap",gap:4},propChangeChip:{backgroundColor:_sharedUi.buoyColors.input,paddingVertical:2,paddingHorizontal:6,borderRadius:4},propChangeText:{fontSize:11,color:_sharedUi.buoyColors.text,fontFamily:"monospace"},detailsSection:{gap:10},detailsCard:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,padding:12,gap:6},detailsCardTitle:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:4},detailRow:{flexDirection:"row",alignItems:"center",gap:8},detailLabel:{fontSize:11,fontWeight:"600",color:_sharedUi.buoyColors.textSecondary,minWidth:55},detailValue:{fontSize:12,color:_sharedUi.buoyColors.text,fontFamily:"monospace",flex:1},statsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,paddingVertical:10,paddingHorizontal:16},statItem:{flex:1,alignItems:"center"},statValue:{fontSize:16,fontWeight:"700",color:_sharedUi.buoyColors.text,fontFamily:"monospace"},statLabel:{fontSize:10,color:_sharedUi.buoyColors.textMuted,marginTop:2},statDivider:{width:1,height:24,backgroundColor:_sharedUi.buoyColors.border,marginHorizontal:12},measurementsRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-around",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,paddingVertical:8,paddingHorizontal:12},measurementItem:{flexDirection:"row",alignItems:"baseline",gap:4},measurementLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,textTransform:"uppercase"},measurementValue:{fontSize:12,fontWeight:"600",color:_sharedUi.buoyColors.text,fontFamily:"monospace"},quickActionsSection:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,padding:12,gap:10},quickActionsTitle:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:2},filterOptionsList:{gap:6},filterOptionCard:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.buoyColors.input,borderRadius:6,paddingVertical:10,paddingHorizontal:12,borderWidth:1,borderColor:"transparent",gap:10},filterOptionCardSelected:{borderColor:_sharedUi.buoyColors.success,backgroundColor:_sharedUi.buoyColors.success+"15"},filterOptionLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,minWidth:70},filterOptionLabelSelected:{color:_sharedUi.buoyColors.success},filterOptionValue:{fontSize:12,color:_sharedUi.buoyColors.text,fontFamily:"monospace",flex:1},filterOptionValueSelected:{color:_sharedUi.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:_sharedUi.buoyColors.success+"15",borderColor:_sharedUi.buoyColors.success+"40"},filterActionButtonExclude:{backgroundColor:_sharedUi.buoyColors.error+"15",borderColor:_sharedUi.buoyColors.error+"40"},filterActionButtonDisabled:{backgroundColor:_sharedUi.buoyColors.input,borderColor:_sharedUi.buoyColors.border,opacity:.5},filterActionButtonText:{fontSize:11,fontWeight:"600"},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.warning+"40",paddingVertical:12,paddingHorizontal:16,gap:8},lockedBannerText:{color:_sharedUi.buoyColors.warning,fontSize:13,fontWeight:"600"},lockedBannerSubtext:{color:_sharedUi.buoyColors.textMuted,fontSize:12}});var _default=exports.default=RenderDetailView;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RenderDetailView=RenderDetailView,exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_dataViewer=require("@buoy-gg/shared-ui/dataViewer"),_RenderCauseBadge=require("./RenderCauseBadge"),_rendersExportFormatter=require("../utils/rendersExportFormatter"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,s=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var i,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(i=t?s:r){if(i.has(e))return i.get(e);i.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?i(o,t,a):o[t]=e[t]);return o})(e,t)}const FREE_TIER_EVENT_LIMIT=5;function RenderDetailView({render:e,disableInternalFooter:t=!1,selectedEventIndex:r,onEventIndexChange:s,onAddFilter:i,isPro:a=!1}){const[o,n]=(0,_react.useState)(0),l=r??o,d=s??n,c=(0,_react.useMemo)(()=>e.renderHistory&&0!==e.renderHistory.length?[...e.renderHistory].sort((e,t)=>e.timestamp-t.timestamp):[],[e.renderHistory]),u=c.length,y=c[l],x=(0,_react.useMemo)(()=>a?0:Math.max(0,u-FREE_TIER_EVENT_LIMIT),[a,u]),_=y?.cause||e.lastRenderCause,m=(0,_react.useCallback)(()=>{l>0&&d(l-1)},[l,d]),h=(0,_react.useCallback)(()=>{const e=a?u-1:Math.min(FREE_TIER_EVENT_LIMIT-1,u-1);l<e&&d(l+1)},[l,u,d,a]),p=(0,_react.useMemo)(()=>(0,_rendersExportFormatter.generateSingleComponentExport)(e),[e]),b=e.componentName||e.displayName,j=e.viewType,C=e.lastRenderTime-e.firstRenderTime,g=C>0?(e.renderCount/(C/1e3)).toFixed(1):e.renderCount.toString(),f=!t&&u>1;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.container,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.header,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.headerLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.componentName,numberOfLines:1,children:b}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.nativeTypeBadge,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.nativeTypeText,children:j})})]}),(0,_jsxRuntime.jsx)(_sharedUi.CopyButton,{value:p,size:14})]}),(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{style:styles.scrollView,contentContainerStyle:[styles.scrollContent,f&&{paddingBottom:100}],showsVerticalScrollIndicator:!1,children:[_&&(0,_jsxRuntime.jsx)(AnswerCard,{cause:_,renderNumber:y?.renderNumber}),(0,_jsxRuntime.jsx)(DetailsSection,{render:e,rendersPerSec:g}),x>0&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.lockedBanner,children:[(0,_jsxRuntime.jsx)(_sharedUi.Lock,{size:14,color:_sharedUi.buoyColors.warning}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.lockedBannerText,children:[x," ",1===x?"event":"events"," hidden"]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),i&&(0,_jsxRuntime.jsx)(QuickActionsSection,{render:e,onAddFilter:i})]}),f&&(0,_jsxRuntime.jsx)(_sharedUi.EventStepperFooter,{currentIndex:l,totalItems:u,onPrevious:m,onNext:h,itemLabel:"Render",subtitle:y?.timestamp?(0,_sharedUi.formatRelativeTime)(new Date(y.timestamp)):void 0,applySafeAreaInset:!1,absolute:!0})]})}function AnswerCard({cause:e,renderNumber:t}){const r=e.componentCause||e.type,s=e.componentCause?_RenderCauseBadge.COMPONENT_CAUSE_CONFIG[e.componentCause]:_RenderCauseBadge.CAUSE_CONFIG[e.type],i=e.hookChanges&&e.hookChanges.length>0,a=e.changedKeys&&e.changedKeys.length>0;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.answerCard,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.causeBadgeRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.causeLabel,children:"mount"===e.type?"First render":"parent"===r?"Triggered by":"Changed:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.causeBadgeLarge,{backgroundColor:s.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.causeBadgeLargeText,{color:s.color}],children:s.label.toUpperCase()})})]}),i&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.hookChangesContainer,children:e.hookChanges.map((e,t)=>{const r=`${e.type}[${e.index}]`,s={[r]:e.previousValue},i={[r]:e.currentValue};return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.hookDiffContainer,children:(0,_jsxRuntime.jsx)(_dataViewer.TreeDiffViewer,{oldValue:s,newValue:i,theme:"dark",showUnchanged:!1})},t)})}),!i&&a&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.propsChangesContainer,children:e.changedKeys.filter(e=>!e.includes("(ref only)")).slice(0,5).map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.propChangeChip,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.propChangeText,children:e})},t))})]})}function DetailsSection({render:e,rendersPerSec:t}){const r=e.testID||e.nativeID||e.accessibilityLabel,s=e.measurements;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailsSection,children:[r&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailsCard,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailsCardTitle,children:"Identifiers"}),e.testID&&(0,_jsxRuntime.jsx)(DetailRow,{label:"testID",value:e.testID}),e.nativeID&&(0,_jsxRuntime.jsx)(DetailRow,{label:"nativeID",value:e.nativeID}),e.accessibilityLabel&&(0,_jsxRuntime.jsx)(DetailRow,{label:"a11y",value:e.accessibilityLabel})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statsRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.statValue,{color:e.color}],children:e.renderCount}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"renders"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.statDivider}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statValue,children:t}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"/sec"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.statDivider}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statValue,children:e.nativeTag}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"tag"})]})]}),s&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementsRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"x"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.x)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"y"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.y)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"w"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.width)})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.measurementItem,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementLabel,children:"h"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.measurementValue,children:Math.round(e.measurements.height)})]})]})]})}function DetailRow({label:e,value:t}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.detailRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailLabel,children:e}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detailValue,numberOfLines:1,children:t})]})}function QuickActionsSection({render:e,onAddFilter:t}){const[r,s]=(0,_react.useState)(null),i=(0,_react.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]),a=null!==r?i[r]:null,o=(0,_react.useCallback)(e=>{s(t=>t===e?null:e)},[]),n=(0,_react.useCallback)(()=>{a&&(t({type:a.type,value:a.value},"include"),s(null))},[a,t]),l=(0,_react.useCallback)(()=>{a&&(t({type:a.type,value:a.value},"exclude"),s(null))},[a,t]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.quickActionsSection,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.quickActionsTitle,children:"Quick Filters"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.filterOptionsList,children:i.map((e,t)=>(0,_jsxRuntime.jsx)(FilterOptionCard,{label:e.label,value:e.value,isSelected:r===t,onSelect:()=>o(t)},e.type))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.filterActionButtons,children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonInclude,!a&&styles.filterActionButtonDisabled],onPress:n,disabled:!a,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_sharedUi.PlusIcon,{size:14,color:a?_sharedUi.buoyColors.success:_sharedUi.buoyColors.textMuted}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterActionButtonText,{color:a?_sharedUi.buoyColors.success:_sharedUi.buoyColors.textMuted}],children:"Only Show This"})]}),(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterActionButton,styles.filterActionButtonExclude,!a&&styles.filterActionButtonDisabled],onPress:l,disabled:!a,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_sharedUi.MinusIcon,{size:14,color:a?_sharedUi.buoyColors.error:_sharedUi.buoyColors.textMuted}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterActionButtonText,{color:a?_sharedUi.buoyColors.error:_sharedUi.buoyColors.textMuted}],children:"Hide This"})]})]})]})}function FilterOptionCard({label:e,value:t,isSelected:r,onSelect:s}){return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.filterOptionCard,r&&styles.filterOptionCardSelected],onPress:s,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterOptionLabel,r&&styles.filterOptionLabelSelected],children:e}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.filterOptionValue,r&&styles.filterOptionValueSelected],numberOfLines:1,children:t})]})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:_sharedUi.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:_sharedUi.buoyColors.text,flexShrink:1},nativeTypeBadge:{backgroundColor:_sharedUi.buoyColors.input,paddingVertical:3,paddingHorizontal:8,borderRadius:4},nativeTypeText:{fontSize:11,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,fontFamily:"monospace"},answerCard:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.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:_sharedUi.buoyColors.textSecondary,fontWeight:"500"},hookChangesContainer:{gap:6},hookDiffContainer:{backgroundColor:_sharedUi.buoyColors.input,borderRadius:6,overflow:"hidden"},propsChangesContainer:{flexDirection:"row",flexWrap:"wrap",gap:4},propChangeChip:{backgroundColor:_sharedUi.buoyColors.input,paddingVertical:2,paddingHorizontal:6,borderRadius:4},propChangeText:{fontSize:11,color:_sharedUi.buoyColors.text,fontFamily:"monospace"},detailsSection:{gap:10},detailsCard:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,padding:12,gap:6},detailsCardTitle:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:4},detailRow:{flexDirection:"row",alignItems:"center",gap:8},detailLabel:{fontSize:11,fontWeight:"600",color:_sharedUi.buoyColors.textSecondary,minWidth:55},detailValue:{fontSize:12,color:_sharedUi.buoyColors.text,fontFamily:"monospace",flex:1},statsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,paddingVertical:10,paddingHorizontal:16},statItem:{flex:1,alignItems:"center"},statValue:{fontSize:16,fontWeight:"700",color:_sharedUi.buoyColors.text,fontFamily:"monospace"},statLabel:{fontSize:10,color:_sharedUi.buoyColors.textMuted,marginTop:2},statDivider:{width:1,height:24,backgroundColor:_sharedUi.buoyColors.border,marginHorizontal:12},measurementsRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-around",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,paddingVertical:8,paddingHorizontal:12},measurementItem:{flexDirection:"row",alignItems:"baseline",gap:4},measurementLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,textTransform:"uppercase"},measurementValue:{fontSize:12,fontWeight:"600",color:_sharedUi.buoyColors.text,fontFamily:"monospace"},quickActionsSection:{backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.border,padding:12,gap:10},quickActionsTitle:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,letterSpacing:.5,textTransform:"uppercase",marginBottom:2},filterOptionsList:{gap:6},filterOptionCard:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.buoyColors.input,borderRadius:6,paddingVertical:10,paddingHorizontal:12,borderWidth:1,borderColor:"transparent",gap:10},filterOptionCardSelected:{borderColor:_sharedUi.buoyColors.success,backgroundColor:_sharedUi.buoyColors.success+"15"},filterOptionLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.buoyColors.textMuted,minWidth:70},filterOptionLabelSelected:{color:_sharedUi.buoyColors.success},filterOptionValue:{fontSize:12,color:_sharedUi.buoyColors.text,fontFamily:"monospace",flex:1},filterOptionValueSelected:{color:_sharedUi.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:_sharedUi.buoyColors.success+"15",borderColor:_sharedUi.buoyColors.success+"40"},filterActionButtonExclude:{backgroundColor:_sharedUi.buoyColors.error+"15",borderColor:_sharedUi.buoyColors.error+"40"},filterActionButtonDisabled:{backgroundColor:_sharedUi.buoyColors.input,borderColor:_sharedUi.buoyColors.border,opacity:.5},filterActionButtonText:{fontSize:11,fontWeight:"600"},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",backgroundColor:_sharedUi.buoyColors.card,borderRadius:8,borderWidth:1,borderColor:_sharedUi.buoyColors.warning+"40",paddingVertical:12,paddingHorizontal:16,gap:8},lockedBannerText:{color:_sharedUi.buoyColors.warning,fontSize:13,fontWeight:"600"},lockedBannerSubtext:{color:_sharedUi.buoyColors.textMuted,fontSize:12}});var _default=exports.default=RenderDetailView;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RendersCopySettingsView=RendersCopySettingsView;var _react=require("react"),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_copySettings=require("../types/copySettings"),_rendersExportFormatter=require("../utils/rendersExportFormatter"),_copySettingsStorage=require("../utils/copySettingsStorage"),_jsxRuntime=require("react/jsx-runtime");const SIZE_WARNING_THRESHOLD=51200,SIZE_DANGER_THRESHOLD=204800,CAUSE_OPTIONS=[{value:"mount",label:"Mount"},{value:"props",label:"Props"},{value:"hooks",label:"Hooks"},{value:"state",label:"State"},{value:"parent",label:"Parent"},{value:"context",label:"Context"},{value:"unknown",label:"Unknown"}];function formatBytes(e){return e<1024?`${e} B`:e<1048576?`${(e/1024).toFixed(1)} KB`:`${(e/1048576).toFixed(1)} MB`}function createMockRenders(){const e=Date.now();return[{id:"1",nativeTag:1,viewType:"RCTView",displayName:"View",componentName:"PokemonListItem",renderCount:30,firstRenderTime:e-5e3,lastRenderTime:e,color:"#10B981",lastRenderCause:{type:"parent",timestamp:e,componentCause:"parent"}},{id:"2",nativeTag:2,viewType:"RCTView",displayName:"View",componentName:"CartHeader",renderCount:12,firstRenderTime:e-4e3,lastRenderTime:e,color:"#3B82F6",lastRenderCause:{type:"hooks",timestamp:e,componentCause:"state",hookChanges:[{type:"useState",index:2,previousValue:4,currentValue:5}]}},{id:"3",nativeTag:3,viewType:"RCTView",displayName:"View",componentName:"SearchBar",renderCount:8,firstRenderTime:e-3e3,lastRenderTime:e,color:"#F59E0B",lastRenderCause:{type:"props",timestamp:e,componentCause:"props",changedKeys:["query","onChange"]}}]}function RendersCopySettingsView({renders:e}){const[t,r]=(0,_react.useState)(_copySettings.DEFAULT_COPY_SETTINGS),[s,a]=(0,_react.useState)(!1);(0,_react.useEffect)(()=>{let e=!0;return(0,_copySettingsStorage.loadCopySettings)().then(t=>{e&&t&&r(t)}),()=>{e=!1}},[]);const i=(0,_react.useCallback)(e=>{r(e),(0,_copySettingsStorage.saveCopySettings)(e)},[]),o=e.length>0,n=o?e:createMockRenders(),l=(0,_react.useMemo)(()=>(0,_copySettings.detectActivePreset)(t),[t]),c=(0,_react.useMemo)(()=>(0,_rendersExportFormatter.estimateExportSize)(n,t),[n,t]),d=(0,_react.useMemo)(()=>c>=SIZE_DANGER_THRESHOLD?"danger":c>=SIZE_WARNING_THRESHOLD?"warning":"none",[c]),u=(0,_react.useCallback)(()=>(0,_rendersExportFormatter.generateExport)(n,t),[n,t]),m=(0,_react.useCallback)(e=>{const t=_copySettings.COPY_PRESETS[e];i({...t,filterCauses:[...t.filterCauses]})},[i]),p=(0,_react.useCallback)((e,r)=>{const[s,a]=e.split("::");if("preset"!==s)if("format"!==s)if("sort"!==s)if("topN"!==s)if("minRenders"!==s){if("cause"===s){const e=r,s=t.filterCauses.includes(e);return void i({...t,filterCauses:s?t.filterCauses.filter(t=>t!==e):[...t.filterCauses,e]})}if("signal"===s){const e=a;return void i({...t,[e]:!t[e]})}}else i({...t,minRenders:r});else i({...t,topN:r});else i({...t,sortBy:r});else i({...t,format:r});else m(a)},[t,i,m]),_=(0,_react.useCallback)(()=>{const{totalComponents:e,totalRenders:t}=(0,_rendersExportFormatter.getExportSummary)(n);if(!s){const r="danger"===d?_sharedUi.macOSColors.semantic.error:"warning"===d?_sharedUi.macOSColors.semantic.warning:_sharedUi.macOSColors.text.secondary;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.collapsedPreview,children:[(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:styles.expandButton,onPress:()=>a(!0),children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.expandButtonContent,children:[(0,_jsxRuntime.jsx)(_sharedUi.Eye,{size:16,color:_sharedUi.macOSColors.semantic.info}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.expandButtonTextContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.expandButtonTitle,children:"Show Preview"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.expandButtonSubtitle,children:[e," component",1!==e?"s":""," · ",t," renders · ~",formatBytes(c),o?"":" (mock data)"]})]}),(0,_jsxRuntime.jsx)(_sharedUi.ChevronDown,{size:16,color:_sharedUi.macOSColors.text.muted})]})}),"none"!==d&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.sizeWarning,"danger"===d&&styles.sizeWarningDanger],children:[(0,_jsxRuntime.jsx)(_sharedUi.AlertTriangle,{size:12,color:r}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.sizeWarningText,{color:r}],children:"danger"===d?"Very large payload — try a smaller topN or turn off history":"Large payload — preview may be slow"})]})]})}const r=u();return(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:styles.collapseButton,onPress:()=>a(!1),children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.collapseButtonText,children:"Hide Preview"}),(0,_jsxRuntime.jsx)(_sharedUi.ChevronUp,{size:14,color:_sharedUi.macOSColors.text.secondary})]}),(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:styles.previewScroll,nestedScrollEnabled:!0,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.previewText,selectable:!0,children:r})})]})},[s,n,c,d,o,u]),y=(0,_react.useCallback)(()=>{const{totalComponents:e}=(0,_rendersExportFormatter.getExportSummary)(n),t=o?`${e} components`:"Mock data (no renders captured)";return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statusLabel,children:t}),(0,_jsxRuntime.jsx)(_sharedUi.ToolbarCopyButton,{value:u})]})},[o,n,u]),g=(0,_react.useMemo)(()=>({sections:[{id:"presets",title:"Presets",type:"custom",data:[{id:"preset::llm",label:_copySettings.PRESET_METADATA.llm.label,icon:_sharedUi.Zap,color:_copySettings.PRESET_METADATA.llm.color,value:"llm",isActive:"llm"===l,description:_copySettings.PRESET_METADATA.llm.description},{id:"preset::table",label:_copySettings.PRESET_METADATA.table.label,icon:_sharedUi.FileText,color:_copySettings.PRESET_METADATA.table.color,value:"table",isActive:"table"===l,description:_copySettings.PRESET_METADATA.table.description},{id:"preset::json",label:_copySettings.PRESET_METADATA.json.label,icon:_sharedUi.FileCode,color:_copySettings.PRESET_METADATA.json.color,value:"json",isActive:"json"===l,description:_copySettings.PRESET_METADATA.json.description},{id:"preset::full",label:_copySettings.PRESET_METADATA.full.label,icon:_sharedUi.Layers,color:_copySettings.PRESET_METADATA.full.color,value:"full",isActive:"full"===l,description:_copySettings.PRESET_METADATA.full.description},{id:"preset::custom",label:"Custom",icon:_sharedUi.Settings,color:_sharedUi.macOSColors.text.secondary,value:"custom",isActive:null===l,description:"User-configured"}]},{id:"format",title:"Format",type:"custom",data:[{id:"format::summary",label:"Summary",icon:_sharedUi.Zap,color:_sharedUi.macOSColors.semantic.success,value:"summary",isActive:"summary"===t.format,description:"Compact, LLM-ready"},{id:"format::markdown-table",label:"Table",icon:_sharedUi.FileText,color:_sharedUi.macOSColors.semantic.info,value:"markdown-table",isActive:"markdown-table"===t.format,description:"Markdown table"},{id:"format::json",label:"JSON",icon:_sharedUi.FileCode,color:_sharedUi.macOSColors.semantic.warning,value:"json",isActive:"json"===t.format,description:"Structured data"}]},{id:"sort",title:"Sort By",type:"custom",data:[{id:"sort::renderCount",label:"Count",value:"renderCount",isActive:"renderCount"===t.sortBy,description:"Total renders"},{id:"sort::rate",label:"Rate",value:"rate",isActive:"rate"===t.sortBy,description:"Renders / sec"},{id:"sort::name",label:"Name",value:"name",isActive:"name"===t.sortBy,description:"Alphabetical"}]},{id:"topN",title:"Top N",type:"custom",data:[{id:"topN::10",label:"10",value:10,isActive:10===t.topN},{id:"topN::25",label:"25",value:25,isActive:25===t.topN},{id:"topN::50",label:"50",value:50,isActive:50===t.topN},{id:"topN::100",label:"100",value:100,isActive:100===t.topN},{id:"topN::-1",label:"All",value:-1,isActive:-1===t.topN}]},{id:"minRenders",title:"Min Renders",type:"custom",data:[{id:"minRenders::1",label:"1",value:1,isActive:1===t.minRenders},{id:"minRenders::2",label:"2",value:2,isActive:2===t.minRenders},{id:"minRenders::3",label:"3",value:3,isActive:3===t.minRenders},{id:"minRenders::5",label:"5",value:5,isActive:5===t.minRenders},{id:"minRenders::10",label:"10",value:10,isActive:10===t.minRenders}]},{id:"causes",title:"Filter Causes",type:"custom",description:0===t.filterCauses.length?"All causes shown":"Only the selected causes shown",data:CAUSE_OPTIONS.map(e=>({id:`cause::${e.value}`,label:e.label,value:e.value,isActive:t.filterCauses.includes(e.value)}))},{id:"signal",title:"Signal Extraction",type:"custom",data:[{id:"signal::groupByName",label:"Group by name",value:"groupByName",isActive:t.groupByName,description:"Collapse list items"},{id:"signal::aggregateCauses",label:"Aggregate causes",value:"aggregateCauses",isActive:t.aggregateCauses,description:"Hook x N"},{id:"signal::includeHistory",label:"Include history",value:"includeHistory",isActive:t.includeHistory,description:"JSON only — large"}]}],previewSection:{enabled:!0,title:"PREVIEW",icon:_sharedUi.Eye,content:_,headerActions:y},onFilterChange:p}),[t,l,p,_,y]);return(0,_jsxRuntime.jsx)(_sharedUi.DynamicFilterView,{...g})}const styles=_reactNative.StyleSheet.create({collapsedPreview:{gap:8},expandButton:{backgroundColor:_sharedUi.macOSColors.background.input,borderRadius:8,borderWidth:1,borderColor:_sharedUi.macOSColors.border.default,padding:12},expandButtonContent:{flexDirection:"row",alignItems:"center",gap:10},expandButtonTextContainer:{flex:1},expandButtonTitle:{fontSize:13,fontWeight:"600",color:_sharedUi.macOSColors.text.primary},expandButtonSubtitle:{fontSize:11,color:_sharedUi.macOSColors.text.secondary,marginTop:2},collapseButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:8,marginBottom:8,backgroundColor:_sharedUi.macOSColors.background.hover,borderRadius:6,borderWidth:1,borderColor:_sharedUi.macOSColors.border.default},collapseButtonText:{fontSize:12,fontWeight:"500",color:_sharedUi.macOSColors.text.secondary},sizeWarning:{flexDirection:"row",alignItems:"center",gap:6,paddingHorizontal:10,paddingVertical:6,backgroundColor:_sharedUi.macOSColors.semantic.warningBackground,borderRadius:6,borderWidth:1,borderColor:_sharedUi.macOSColors.semantic.warning+"30"},sizeWarningDanger:{backgroundColor:_sharedUi.macOSColors.semantic.errorBackground,borderColor:_sharedUi.macOSColors.semantic.error+"30"},sizeWarningText:{fontSize:11,fontWeight:"500",flex:1},previewScroll:{maxHeight:360},previewText:{fontFamily:"monospace",fontSize:11,color:_sharedUi.macOSColors.text.primary,lineHeight:18},statusLabel:{fontSize:11,fontWeight:"600",color:_sharedUi.macOSColors.text.muted,marginRight:8}});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PRESET_METADATA=exports.DEFAULT_COPY_SETTINGS=exports.COPY_PRESETS=void 0,exports.detectActivePreset=detectActivePreset;const DEFAULT_COPY_SETTINGS=exports.DEFAULT_COPY_SETTINGS={format:"summary",topN:25,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},COPY_PRESETS=exports.COPY_PRESETS={llm:{format:"summary",topN:25,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},table:{format:"markdown-table",topN:50,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},json:{format:"json",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},full:{format:"json",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!1,sortBy:"renderCount",includeHistory:!0}};function detectActivePreset(e){for(const[r,t]of Object.entries(COPY_PRESETS))if(Object.keys(t).every(r=>{const o=e[r],s=t[r];return Array.isArray(o)&&Array.isArray(s)?o.length===s.length&&o.every((e,r)=>e===s[r]):o===s}))return r;return null}const PRESET_METADATA=exports.PRESET_METADATA={llm:{label:"LLM",description:"Compact summary for AI",color:"#10B981"},table:{label:"Table",description:"Markdown table",color:"#3B82F6"},json:{label:"JSON",description:"Structured data",color:"#F59E0B"},full:{label:"Full",description:"Everything incl. history",color:"#6B7280"}};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.clearCopySettings=clearCopySettings,exports.loadCopySettings=loadCopySettings,exports.saveCopySettings=saveCopySettings;var _sharedUi=require("@buoy-gg/shared-ui"),_copySettings=require("../types/copySettings");async function saveCopySettings(t){try{const e=_sharedUi.devToolsStorageKeys.highlightUpdates.copySettings();await _sharedUi.persistentStorage.setItem(e,JSON.stringify(t))}catch{}}async function loadCopySettings(){try{const t=_sharedUi.devToolsStorageKeys.highlightUpdates.copySettings(),e=await _sharedUi.persistentStorage.getItem(t);if(e&&""!==e){const t=JSON.parse(e);return{..._copySettings.DEFAULT_COPY_SETTINGS,...t,filterCauses:t.filterCauses??_copySettings.DEFAULT_COPY_SETTINGS.filterCauses}}return null}catch{return null}}async function clearCopySettings(){try{const t=_sharedUi.devToolsStorageKeys.highlightUpdates.copySettings();await _sharedUi.persistentStorage.removeItem(t)}catch{}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";function buildReport(e,n){let t=e.filter(e=>e.renderCount>=n.minRenders);if(n.filterCauses.length>0){const e=new Set(n.filterCauses);t=t.filter(n=>e.has(n.lastRenderCause?.type??"unknown"))}const o=e.flatMap(e=>[e.firstRenderTime,e.lastRenderTime]).filter(e=>Number.isFinite(e)),r=o.length>0?Math.max(...o)-Math.min(...o):0,a=Math.max(.001,r/1e3),s=(n.groupByName?groupByComponentName(t):t.map(e=>[e])).map(e=>processGroup(e,n,a));sortRows(s,n.sortBy);const u=-1===n.topN?0:Math.max(0,s.length-n.topN),p=-1===n.topN?s:s.slice(0,n.topN),i=e.reduce((e,n)=>e+n.renderCount,0),c=aggregateCauseBreakdown(e);let d=0,m=!1;for(const n of e)n.lastRenderCause||(d+=n.renderCount),n.renderHistory&&n.renderHistory.length>0&&(m=!0);return{totalUniqueComponents:t.length,totalRenders:i,windowMs:r,causeBreakdown:c,rows:p,truncated:u,dataGaps:{historyOff:!m,propsCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedProps)),stateCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedState)),rendersWithoutCause:d}}}function groupByComponentName(e){const n=new Map;for(const t of e){const e=t.componentName||t.displayName||t.viewType,o=n.get(e);o?o.push(t):n.set(e,[t])}return Array.from(n.values())}function processGroup(e,n,t){const o=e[0],r=o.componentName||o.displayName||o.viewType;let a=0;const s={},u=new Map,p=new Map,i=new Map;let c=0,d=0,m=0;for(const t of e){a+=t.renderCount;const e=t.lastRenderCause;if(!e)continue;const o=e.type;s[o]=(s[o]??0)+t.renderCount;const r=(e.hookChanges?.length??0)>0,h=(e.changedKeys?.length??0)>0;if("parent"===o&&("state"===e.componentCause||"props"===e.componentCause||r||h?d+=t.renderCount:m+=t.renderCount),"props"!==o||h||(c+=t.renderCount),e.parentComponentName&&i.set(e.parentComponentName,(i.get(e.parentComponentName)??0)+1),n.aggregateCauses&&e.hookChanges)for(const n of e.hookChanges){const e=`${n.type}[${n.index}]`,t=u.get(e);t?t.count+=1:u.set(e,{count:1,sample:formatHookSample(n)})}if(e.changedKeys)for(const n of e.changedKeys)n.includes("(ref only)")||p.set(n,(p.get(n)??0)+1)}const h=Array.from(u.entries()).sort((e,n)=>n[1].count-e[1].count).slice(0,3).map(([e,n])=>({hook:e,count:n.count,sample:n.sample})),l=Array.from(p.entries()).sort((e,n)=>n[1]-e[1]).slice(0,5).map(([e])=>e);let f,g="unknown",C=-1;for(const[e,n]of Object.entries(s))(n??0)>C&&(C=n??0,g=e);let y=0;for(const[e,n]of i)n>y&&(y=n,f=e);const w=e.map(e=>e.renderCount).sort((e,n)=>n-e),$=a/t;return{name:r,viewType:o.viewType,instances:e.length,renders:a,causeMix:s,dominantCause:g,hookCauses:h,changedKeys:l,unknownPropsCount:c,parentWithOwnChange:d,parentNoChange:m,parentName:f,instanceCounts:w,rate:$,source:e}}function aggregateCauseBreakdown(e){const n={};for(const t of e){const e=t.lastRenderCause?.type??"unknown";n[e]=(n[e]??0)+t.renderCount}return n}function sortRows(e,n){switch(n){case"renderCount":e.sort((e,n)=>n.renders-e.renders);break;case"rate":e.sort((e,n)=>n.rate-e.rate);break;case"name":e.sort((e,n)=>e.name.localeCompare(n.name))}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.estimateExportSize=estimateExportSize,exports.generateExport=generateExport,exports.generateSingleComponentExport=generateSingleComponentExport,exports.getExportSummary=getExportSummary;const VALUE_MAX_LEN=32;function truncateValue(e){if(null===e)return"null";if(void 0===e)return"undefined";if("function"==typeof e)return"[Fn]";if("object"==typeof e)return Array.isArray(e)?`[Array(${e.length})]`:"[Obj]";const n=String(e);return n.length>32?n.slice(0,31)+"…":n}function formatHookSample(e){return void 0===e.previousValue&&void 0===e.currentValue?e.description:`${truncateValue(e.previousValue)} → ${truncateValue(e.currentValue)}`}function formatWindow(e){return e<1e3?`${e}ms`:`${(e/1e3).toFixed(1)}s`}function formatRate(e){return e>=100?`${e.toFixed(0)}/s`:e>=10?`${e.toFixed(1)}/s`:`${e.toFixed(2)}/s`}function causeBreakdownLine(e){const n=Object.entries(e).sort((e,n)=>(n[1]??0)-(e[1]??0));return 0===n.length?"(no causes recorded)":n.map(([e,n])=>`${e} ${n}`).join(" · ")}function describeCause(e){const n=[],t=Object.entries(e.causeMix).filter(([,e])=>(e??0)>0).sort((e,n)=>(n[1]??0)-(e[1]??0)),o=t.length>=2&&(t[1]?.[1]??0)>=.1*e.renders;if("hooks"===e.dominantCause&&e.hookCauses.length>0){const t=e.hookCauses[0];t.sample?n.push(`hooks ×${t.count} ${t.hook}: ${t.sample}`):n.push(`hooks ×${t.count} ${t.hook}`)}else if("props"===e.dominantCause){if(e.changedKeys.length>0){const t=e.changedKeys.slice(0,3).join(", ");n.push(`props (${t})`)}else n.push("props (keys not captured)");e.unknownPropsCount>0&&e.changedKeys.length>0&&n.push(`[${e.unknownPropsCount} unidentified]`)}else if("parent"===e.dominantCause){let t="parent cascade";e.parentNoChange>0&&0===e.parentWithOwnChange&&(t="parent cascade, no own change"),e.parentName&&(t+=` ← ${e.parentName}`),n.push(t)}else"mount"===e.dominantCause?n.push("mount"):"state"===e.dominantCause?n.push("state"):"context"===e.dominantCause?n.push("context"):n.push("unknown");if(o){const e=t.map(([e,n])=>`${e}:${n}`).join(" + ");n.push(`(${e})`)}return n.join(" ")}function describeInstances(e){if(e.instances<=1)return e.name;const n=e.instanceCounts,t=n[0]??0;if(t-(n[n.length-1]??0)<=1)return`${e.name} ×${e.instances} (${t} each)`;const o=n.slice(1),r=o.reduce((e,n)=>e+n,0),a=o.length>0?r/o.length:0;return`${e.name} ×${e.instances} (top ${t}, others ~${Math.round(a)})`}const LLM_PREAMBLE="React Native render report — review the data and identify why components are re-rendering.";function generateSummary(e,n){const t=[];t.push(LLM_PREAMBLE),t.push(""),t.push(`Window: ${formatWindow(e.windowMs)} · ${e.totalUniqueComponents} components · ${e.totalRenders} renders`),t.push(`Cause mix: ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("Top offenders (count · rate · component · cause):"),t.push("");const o=e.rows.map(describeInstances),r=Math.min(36,Math.max(8,...o.map(e=>e.length))),a=Math.max(3,...e.rows.map(e=>`×${e.renders}`.length)),s=Math.max(5,...e.rows.map(e=>formatRate(e.rate).length));for(let n=0;n<e.rows.length;n++){const u=e.rows[n],p=(o[n]??u.name).padEnd(r),i=`×${u.renders}`.padStart(a),c=formatRate(u.rate).padStart(s),d=describeCause(u);t.push(` ${i} ${c} ${p} ${d}`)}e.truncated>0&&(t.push(""),t.push(`... ${e.truncated} more (set topN=-1 to expand)`));const u=buildDataFooter(e);if(u.length>0){t.push(""),t.push("Data availability:");for(const e of u)t.push(` · ${e}`)}return t.join("\n")}function buildDataFooter(e){const n=[];return e.dataGaps.rendersWithoutCause>0&&n.push(`${e.dataGaps.rendersWithoutCause} renders had no cause info (enable trackRenderCauses for more detail)`),e.dataGaps.propsCaptureOff&&n.push("prop snapshots not captured (enable capturePropsOnRender to see prop diffs for 'props (keys not captured)' rows)"),e.dataGaps.stateCaptureOff&&n.push("state snapshots not captured (enable captureStateOnRender)"),e.dataGaps.historyOff&&n.push("render history off (enable enableRenderHistory for per-render timeline)"),n}function generateMarkdownTable(e,n){const t=[];t.push("# React Render Report"),t.push(""),t.push(`**Window:** ${formatWindow(e.windowMs)} · **Components:** ${e.totalUniqueComponents} · **Renders:** ${e.totalRenders}`),t.push(`**Cause mix:** ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("| Component | Renders | Rate | Cause |"),t.push("|---|---:|---:|---|");for(const n of e.rows){const e=describeInstances(n),o=describeCause(n).replace(/\|/g,"\\|");t.push(`| ${e} | ${n.renders} | ${formatRate(n.rate)} | ${o} |`)}e.truncated>0&&(t.push(""),t.push(`_... ${e.truncated} more rows_`));const o=buildDataFooter(e);if(o.length>0){t.push(""),t.push("**Data availability:**");for(const e of o)t.push(`- ${e}`)}return t.join("\n")}function generateJson(e,n,t){const o={exportedAt:(new Date).toISOString(),summary:{windowMs:n.windowMs,totalComponents:n.totalUniqueComponents,totalRenders:n.totalRenders,causeBreakdown:n.causeBreakdown,truncated:n.truncated,dataGaps:n.dataGaps},components:n.rows.map(e=>({name:e.name,viewType:e.viewType,instances:e.instances,instanceCounts:e.instances>1?e.instanceCounts:void 0,renders:e.renders,ratePerSec:Number(e.rate.toFixed(3)),dominantCause:e.dominantCause,causeMix:e.causeMix,hookCauses:e.hookCauses,changedKeys:e.changedKeys,unknownPropsCount:e.unknownPropsCount||void 0,parentName:e.parentName,parentWithOwnChange:e.parentWithOwnChange||void 0,parentNoChange:e.parentNoChange||void 0,...t.includeHistory?{history:extractHistory(e.source)}:{}}))};return t.includeHistory?JSON.stringify(o,null,2):JSON.stringify(o)}function extractHistory(e){return e.map(e=>({name:e.componentName||e.displayName,nativeTag:e.nativeTag,renderCount:e.renderCount,history:e.renderHistory?.map(e=>({n:e.renderNumber,t:e.timestamp,cause:{type:e.cause.type,componentCause:e.cause.componentCause,changedKeys:e.cause.changedKeys,parentComponentName:e.cause.parentComponentName,hookChanges:e.cause.hookChanges?.map(e=>({type:e.type,index:e.index,desc:e.description}))}}))}))}function generateExport(e,n){const t=buildReport(e,n);switch(n.format){case"summary":default:return generateSummary(t,n);case"markdown-table":return generateMarkdownTable(t,n);case"json":return generateJson(e,t,n)}}function estimateExportSize(e,n){return generateExport(e,n).length}function getExportSummary(e){return{totalComponents:e.length,totalRenders:e.reduce((e,n)=>e+n.renderCount,0)}}function generateSingleComponentExport(e){return generateExport([e],{format:"summary",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{useState,useEffect,useRef,useCallback}from"react";import{View,Text,StyleSheet}from"react-native";import{Power,JsModal,devToolsStorageKeys,persistentStorage,buoyColors,TickProvider}from"@buoy-gg/shared-ui";import{useIsPro}from"@buoy-gg/license";import HighlightUpdatesController from"../utils/HighlightUpdatesController";import{RenderTracker}from"../utils/RenderTracker";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"})]})});
|
|
1
|
+
"use strict";import React,{useState,useEffect,useRef,useCallback}from"react";import{View,Text,StyleSheet}from"react-native";import{Power,JsModal,devToolsStorageKeys,persistentStorage,buoyColors,TickProvider}from"@buoy-gg/shared-ui";import{useIsPro}from"@buoy-gg/license";import HighlightUpdatesController from"../utils/HighlightUpdatesController";import{RenderTracker}from"../utils/RenderTracker";import{RenderDetailView}from"./RenderDetailView";import{EventStepperFooter}from"@buoy-gg/shared-ui";import{HighlightFilterView}from"./HighlightFilterView";import{IsolatedRenderList}from"./IsolatedRenderList";import{MainListHeader,FilterViewHeader,DetailViewHeader,CopySettingsViewHeader}from"./ModalHeaderContent";import{RenderHistoryViewer,RenderHistoryFooter}from"./RenderHistoryViewer";import{RendersCopySettingsView}from"./RendersCopySettingsView";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"})]})});export function HighlightUpdatesModal({visible:e,onClose:t,onBack:r,onMinimize:n,enableSharedModalDimensions:s=!1,initialNativeTag:i,onInitialNativeTagHandled:l}){const a=useIsPro(),[o,c]=useState(!1),[d,u]=useState(()=>HighlightUpdatesController.getFrozen()),[g,h]=useState(()=>RenderTracker.getStats().totalComponents>0),[p,C]=useState(null),[f,m]=useState(0),[S,T]=useState(!1),[y,x]=useState(!1),[b,k]=useState([]),[R,w]=useState("filters"),[v,H]=useState("details"),[I,F]=useState(0),[P,V]=useState(""),[D,_]=useState(!1),j=useRef(null),U=useRef([]),E=useRef(RenderTracker.getFilters()),[N,z]=useState(()=>{const e=RenderTracker.getFilters();return e.includePatterns.length+e.excludePatterns.length}),[A,M]=useState(()=>RenderTracker.getFilters()),[B,K]=useState(()=>RenderTracker.getSettings()),L=useRef(!1),J=useRef(!1),O=useRef(!1);useEffect(()=>{e&&!L.current&&(L.current=!0)},[e]),useEffect(()=>{e&&!J.current&&(async()=>{try{const e=await persistentStorage.getItem(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();E.current=n,M(n),z(n.includePatterns.length+n.excludePatterns.length)}J.current=!0}catch(e){}})()},[e]),useEffect(()=>{J.current&&(async()=>{try{const e={includeTestID:Array.from(A.includeTestID),includeNativeID:Array.from(A.includeNativeID),includeViewType:Array.from(A.includeViewType),includeComponent:Array.from(A.includeComponent),excludeTestID:Array.from(A.excludeTestID),excludeNativeID:Array.from(A.excludeNativeID),excludeViewType:Array.from(A.excludeViewType),excludeComponent:Array.from(A.excludeComponent),includePatterns:A.includePatterns,excludePatterns:A.excludePatterns};await persistentStorage.setItem(devToolsStorageKeys.highlightUpdates.filters(),JSON.stringify(e))}catch(e){}})()},[A]),useEffect(()=>{e&&!O.current&&(async()=>{try{const e=await persistentStorage.getItem(devToolsStorageKeys.highlightUpdates.settings());if(e){const t=JSON.parse(e),{performanceLogging:r,excludeDevTools:n,...s}=t;RenderTracker.setSettings(s),K(RenderTracker.getSettings())}O.current=!0}catch(e){O.current=!0}})()},[e]),useEffect(()=>{O.current&&(async()=>{try{const{performanceLogging:e,excludeDevTools:t,...r}=B;await persistentStorage.setItem(devToolsStorageKeys.highlightUpdates.settings(),JSON.stringify(r))}catch(e){}})()},[B]),useEffect(()=>{const e=RenderTracker.subscribeToState(e=>{c(e.isTracking)});return()=>{e()}},[]),useEffect(()=>{const e=HighlightUpdatesController.subscribeToFreeze(e=>{u(e)});return()=>{e()}},[]),useEffect(()=>{D&&requestAnimationFrame(()=>{j.current?.focus()})},[D]),useEffect(()=>{e||HighlightUpdatesController.setSpotlight(null)},[e]),useEffect(()=>{if(e&&null!=i){const e=RenderTracker.getRender(String(i));e&&(C(e),m(0),T(!1),HighlightUpdatesController.setSpotlight(e.nativeTag)),l?.()}},[e,i,l]);const q=useCallback(()=>{HighlightUpdatesController.isInitialized()||HighlightUpdatesController.initialize(),HighlightUpdatesController.toggle()},[]),G=useCallback(()=>{HighlightUpdatesController.toggleFreeze()},[]),W=useCallback(()=>{HighlightUpdatesController.clearRenderCounts(),h(!1)},[]),Q=useCallback(()=>{k(RenderTracker.getFilteredRenders(P)),x(!0)},[P]),X=useCallback(()=>{x(!1)},[]),Y=useCallback(e=>{V(e)},[]),Z=useCallback((e,t,r)=>{C(e),m(t),H("details"),F(0),U.current=r,HighlightUpdatesController.setSpotlight(e.nativeTag)},[]),$=useCallback(e=>{U.current=e},[]),ee=useCallback(()=>{C(null),m(0),HighlightUpdatesController.setSpotlight(null)},[]),te=useCallback(()=>{const e=U.current;if(f>0){const t=f-1,r=e[t];r&&(C(r),m(t),HighlightUpdatesController.setSpotlight(r.nativeTag))}},[f]),re=useCallback(()=>{const e=U.current;if(f<e.length-1){const t=f+1,r=e[t];r&&(C(r),m(t),HighlightUpdatesController.setSpotlight(r.nativeTag))}},[f]),ne=useCallback(()=>{T(!1)},[]),se=useCallback(()=>{T(!0)},[]),ie=useCallback(()=>{_(!0)},[]),le=useCallback(()=>{_(!1)},[]),ae=useCallback(e=>{RenderTracker.setFilters(e);const t=RenderTracker.getFilters();E.current=t,M(t),z(t.includePatterns.length+t.excludePatterns.length)},[]),oe=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&&(ae(n),C(null),m(0),HighlightUpdatesController.setSpotlight(null))},[ae]),ce=useCallback(e=>{RenderTracker.setSettings(e),K(RenderTracker.getSettings())},[]),de=useCallback(e=>{h(e.totalComponents>0)},[]),ue=useCallback(()=>y?_jsx(CopySettingsViewHeader,{onBack:X}):S?_jsx(FilterViewHeader,{onBack:ne,activeTab:R,onTabChange:w,activeFilterCount:N}):p?_jsx(DetailViewHeader,{onBack:ee,activeTab:v,onTabChange:H,hasHistory:(p.renderHistory?.length??0)>0}):_jsx(MainListHeader,{onBack:r,isSearchActive:D,searchText:P,onSearchChange:Y,onSearchToggle:ie,onSearchClose:le,onFilterToggle:se,onToggleTracking:q,onToggleFreeze:G,onClear:W,onOpenCopySettings:Q,isTracking:o,isFrozen:d,activeFilterCount:N,hasRenders:g,searchInputRef:j}),[y,S,p,r,D,P,o,d,N,g,R,v,ne,ee,X,Y,ie,le,se,q,G,W,Q]),ge=s?devToolsStorageKeys.modal.root():devToolsStorageKeys.highlightUpdates.modal();if(!e)return null;const he=U.current.length,pe=p?"details"===v?_jsx(EventStepperFooter,{currentIndex:f,totalItems:he,onPrevious:te,onNext:re,itemLabel:"Component",subtitle:p.componentName||p.displayName||p.viewType}):_jsx(RenderHistoryFooter,{render:p,selectedEventIndex:I,onEventIndexChange:F,isPro:a}):null;return _jsx(TickProvider,{children:_jsx(JsModal,{visible:e,onClose:t,onMinimize:n,persistenceKey:ge,header:{showToggleButton:!0,customContent:ue()},enablePersistence:!0,initialMode:"bottomSheet",enableGlitchEffects:!0,styles:{},footer:pe,footerHeight:p&&("details"===v||(p.renderHistory?.length??0)>1)?68:0,children:_jsx(View,{nativeID:"__rn_buoy__highlight-modal",style:styles.container,children:y?_jsx(RendersCopySettingsView,{renders:b}):p?"details"===v?_jsx(RenderDetailView,{render:p,disableInternalFooter:!0,onAddFilter:oe,isPro:a}):_jsx(RenderHistoryViewer,{render:p,disableInternalFooter:!0,selectedEventIndex:I,onEventIndexChange:F,isPro:a}):S?_jsx(HighlightFilterView,{filters:A,onFilterChange:ae,settings:B,onSettingsChange:ce,availableProps:RenderTracker.getAvailableProps(),activeTab:R}):_jsxs(_Fragment,{children:[!o&&_jsx(DisabledBanner,{}),_jsx(IsolatedRenderList,{searchText:P,filters:A,onSelectRender:Z,onStatsChange:de,onRendersChange:$,isTracking:o,isPro:a})]})})})})}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;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import React,{memo}from"react";import{View,TouchableOpacity,TextInput,StyleSheet}from"react-native";import{Trash2,Search,Filter,X,Pause,ModalHeader,TabSelector,
|
|
1
|
+
"use strict";import React,{memo}from"react";import{View,TouchableOpacity,TextInput,StyleSheet}from"react-native";import{Trash2,Search,Filter,X,Pause,Copy,ModalHeader,TabSelector,buoyColors,PowerToggleButton}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:t,onSearchClose:r}){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:t,onSubmitEditing:r,onBlur:r,accessibilityLabel:"Search renders",autoCapitalize:"none",autoCorrect:!1,returnKeyType:"search",autoFocus:!0}),o.length>0?_jsx(TouchableOpacity,{onPress:()=>{t(""),r()},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:t,onToggleFreeze:r,onClear:a,onOpenCopySettings:n,isTracking:s,isFrozen:i,activeFilterCount:l,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,l>0&&styles.activeFilterButton],children:_jsx(Filter,{size:14,color:l>0?buoyColors.primary:buoyColors.textMuted})}),_jsx(TouchableOpacity,{onPress:n,style:[styles.headerActionButton,!c&&styles.headerActionButtonDisabled],disabled:!c,accessibilityLabel:"Open copy settings",children:_jsx(Copy,{size:14,color:c?buoyColors.textSecondary:buoyColors.textMuted})}),_jsx(TouchableOpacity,{onPress:r,style:[styles.headerActionButton,i&&styles.freezeButton,!s&&styles.headerActionButtonDisabled],disabled:!s,children:_jsx(Pause,{size:14,color:s&&i?buoyColors.primary:buoyColors.textMuted})}),_jsx(PowerToggleButton,{isEnabled:s,onToggle:t,accessibilityLabel:"Toggle render tracking"}),_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:t,onSearchChange:r,onSearchToggle:a,onSearchClose:n,onFilterToggle:s,onToggleTracking:i,onToggleFreeze:l,onClear:c,onOpenCopySettings:d,isTracking:h,isFrozen:u,activeFilterCount:y,hasRenders:g,searchInputRef:b}){return _jsxs(ModalHeader,{children:[e&&_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"",children:o?_jsx(SearchSection,{isActive:o,searchText:t,onSearchChange:r,onSearchClose:n,searchInputRef:b}):_jsx(StatsDisplay,{})}),_jsx(HeaderActions,{onSearchToggle:a,onFilterToggle:s,onToggleTracking:i,onToggleFreeze:l,onClear:c,onOpenCopySettings:d,isTracking:h,isFrozen:u,activeFilterCount:y,hasRenders:g})]})});export const FilterViewHeader=memo(function({onBack:e,activeTab:o,onTabChange:t,activeFilterCount:r=0}){const a=[{key:"filters",label:"Filters"+(r>0?` (${r})`:"")},{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=>t(e)})}),_jsx(ModalHeader.Actions,{})]})});export const DetailViewHeader=memo(function({onBack:e,activeTab:o,onTabChange:t,hasHistory:r=!0}){const a=[{key:"details",label:"Details"},{key:"history",label:"History",disabled:!r}];return _jsxs(ModalHeader,{children:[_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"",noMargin:!0,children:_jsx(TabSelector,{tabs:a,activeTab:o,onTabChange:e=>t(e)})}),_jsx(ModalHeader.Actions,{})]})});export const CopySettingsViewHeader=memo(function({onBack:e}){return _jsxs(ModalHeader,{children:[_jsx(ModalHeader.Navigation,{onBack:e}),_jsx(ModalHeader.Content,{title:"Copy Settings"})]})});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},activeFilterButton:{backgroundColor:buoyColors.primary+"15",borderColor:buoyColors.primary+"40"},freezeButton:{backgroundColor:buoyColors.primary+"15",borderColor:buoyColors.primary+"40"}});
|
|
@@ -1 +1 @@
|
|
|
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;
|
|
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{generateSingleComponentExport}from"../utils/rendersExportFormatter";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";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],b=useMemo(()=>l?0:Math.max(0,u-5),[l,u]),x=y?.cause||e.lastRenderCause,p=useCallback(()=>{a>0&&d(a-1)},[a,d]),m=useCallback(()=>{const e=l?u-1:Math.min(4,u-1);a<e&&d(a+1)},[a,u,d,l]),C=useMemo(()=>generateSingleComponentExport(e),[e]),h=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:h}),_jsx(View,{style:styles.nativeTypeBadge,children:_jsx(Text,{style:styles.nativeTypeText,children:g})})]}),_jsx(CopyButton,{value:C,size:14})]}),_jsxs(ScrollView,{style:styles.scrollView,contentContainerStyle:[styles.scrollContent,_&&{paddingBottom:100}],showsVerticalScrollIndicator:!1,children:[x&&_jsx(AnswerCard,{cause:x,renderNumber:y?.renderNumber}),_jsx(DetailsSection,{render:e,rendersPerSec:j}),b>0&&_jsxs(View,{style:styles.lockedBanner,children:[_jsx(Lock,{size:14,color:buoyColors.warning}),_jsxs(Text,{style:styles.lockedBannerText,children:[b," ",1===b?"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:p,onNext:m,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;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useState}from"react";import{Text,StyleSheet,ScrollView,View,TouchableOpacity}from"react-native";import{DynamicFilterView,macOSColors,FileText,FileCode,Zap,Settings,Eye,ChevronDown,ChevronUp,AlertTriangle,Layers,ToolbarCopyButton}from"@buoy-gg/shared-ui";import{DEFAULT_COPY_SETTINGS,COPY_PRESETS,PRESET_METADATA,detectActivePreset}from"../types/copySettings";import{generateExport,estimateExportSize,getExportSummary}from"../utils/rendersExportFormatter";import{loadCopySettings,saveCopySettings}from"../utils/copySettingsStorage";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";const SIZE_WARNING_THRESHOLD=51200,SIZE_DANGER_THRESHOLD=204800,CAUSE_OPTIONS=[{value:"mount",label:"Mount"},{value:"props",label:"Props"},{value:"hooks",label:"Hooks"},{value:"state",label:"State"},{value:"parent",label:"Parent"},{value:"context",label:"Context"},{value:"unknown",label:"Unknown"}];function formatBytes(e){return e<1024?`${e} B`:e<1048576?`${(e/1024).toFixed(1)} KB`:`${(e/1048576).toFixed(1)} MB`}function createMockRenders(){const e=Date.now();return[{id:"1",nativeTag:1,viewType:"RCTView",displayName:"View",componentName:"PokemonListItem",renderCount:30,firstRenderTime:e-5e3,lastRenderTime:e,color:"#10B981",lastRenderCause:{type:"parent",timestamp:e,componentCause:"parent"}},{id:"2",nativeTag:2,viewType:"RCTView",displayName:"View",componentName:"CartHeader",renderCount:12,firstRenderTime:e-4e3,lastRenderTime:e,color:"#3B82F6",lastRenderCause:{type:"hooks",timestamp:e,componentCause:"state",hookChanges:[{type:"useState",index:2,previousValue:4,currentValue:5}]}},{id:"3",nativeTag:3,viewType:"RCTView",displayName:"View",componentName:"SearchBar",renderCount:8,firstRenderTime:e-3e3,lastRenderTime:e,color:"#F59E0B",lastRenderCause:{type:"props",timestamp:e,componentCause:"props",changedKeys:["query","onChange"]}}]}export function RendersCopySettingsView({renders:e}){const[t,o]=useState(DEFAULT_COPY_SETTINGS),[s,r]=useState(!1);useEffect(()=>{let e=!0;return loadCopySettings().then(t=>{e&&t&&o(t)}),()=>{e=!1}},[]);const a=useCallback(e=>{o(e),saveCopySettings(e)},[]),l=e.length>0,i=l?e:createMockRenders(),n=useMemo(()=>detectActivePreset(t),[t]),c=useMemo(()=>estimateExportSize(i,t),[i,t]),d=useMemo(()=>c>=204800?"danger":c>=51200?"warning":"none",[c]),u=useCallback(()=>generateExport(i,t),[i,t]),m=useCallback(e=>{const t=COPY_PRESETS[e];a({...t,filterCauses:[...t.filterCauses]})},[a]),p=useCallback((e,o)=>{const[s,r]=e.split("::");if("preset"!==s)if("format"!==s)if("sort"!==s)if("topN"!==s)if("minRenders"!==s){if("cause"===s){const e=o,s=t.filterCauses.includes(e);return void a({...t,filterCauses:s?t.filterCauses.filter(t=>t!==e):[...t.filterCauses,e]})}if("signal"===s){const e=r;return void a({...t,[e]:!t[e]})}}else a({...t,minRenders:o});else a({...t,topN:o});else a({...t,sortBy:o});else a({...t,format:o});else m(r)},[t,a,m]),y=useCallback(()=>{const{totalComponents:e,totalRenders:t}=getExportSummary(i);if(!s){const o="danger"===d?macOSColors.semantic.error:"warning"===d?macOSColors.semantic.warning:macOSColors.text.secondary;return _jsxs(View,{style:styles.collapsedPreview,children:[_jsx(TouchableOpacity,{style:styles.expandButton,onPress:()=>r(!0),children:_jsxs(View,{style:styles.expandButtonContent,children:[_jsx(Eye,{size:16,color:macOSColors.semantic.info}),_jsxs(View,{style:styles.expandButtonTextContainer,children:[_jsx(Text,{style:styles.expandButtonTitle,children:"Show Preview"}),_jsxs(Text,{style:styles.expandButtonSubtitle,children:[e," component",1!==e?"s":""," · ",t," renders · ~",formatBytes(c),l?"":" (mock data)"]})]}),_jsx(ChevronDown,{size:16,color:macOSColors.text.muted})]})}),"none"!==d&&_jsxs(View,{style:[styles.sizeWarning,"danger"===d&&styles.sizeWarningDanger],children:[_jsx(AlertTriangle,{size:12,color:o}),_jsx(Text,{style:[styles.sizeWarningText,{color:o}],children:"danger"===d?"Very large payload — try a smaller topN or turn off history":"Large payload — preview may be slow"})]})]})}const o=u();return _jsxs(View,{children:[_jsxs(TouchableOpacity,{style:styles.collapseButton,onPress:()=>r(!1),children:[_jsx(Text,{style:styles.collapseButtonText,children:"Hide Preview"}),_jsx(ChevronUp,{size:14,color:macOSColors.text.secondary})]}),_jsx(ScrollView,{style:styles.previewScroll,nestedScrollEnabled:!0,children:_jsx(Text,{style:styles.previewText,selectable:!0,children:o})})]})},[s,i,c,d,l,u]),g=useCallback(()=>{const{totalComponents:e}=getExportSummary(i),t=l?`${e} components`:"Mock data (no renders captured)";return _jsxs(_Fragment,{children:[_jsx(Text,{style:styles.statusLabel,children:t}),_jsx(ToolbarCopyButton,{value:u})]})},[l,i,u]),C=useMemo(()=>({sections:[{id:"presets",title:"Presets",type:"custom",data:[{id:"preset::llm",label:PRESET_METADATA.llm.label,icon:Zap,color:PRESET_METADATA.llm.color,value:"llm",isActive:"llm"===n,description:PRESET_METADATA.llm.description},{id:"preset::table",label:PRESET_METADATA.table.label,icon:FileText,color:PRESET_METADATA.table.color,value:"table",isActive:"table"===n,description:PRESET_METADATA.table.description},{id:"preset::json",label:PRESET_METADATA.json.label,icon:FileCode,color:PRESET_METADATA.json.color,value:"json",isActive:"json"===n,description:PRESET_METADATA.json.description},{id:"preset::full",label:PRESET_METADATA.full.label,icon:Layers,color:PRESET_METADATA.full.color,value:"full",isActive:"full"===n,description:PRESET_METADATA.full.description},{id:"preset::custom",label:"Custom",icon:Settings,color:macOSColors.text.secondary,value:"custom",isActive:null===n,description:"User-configured"}]},{id:"format",title:"Format",type:"custom",data:[{id:"format::summary",label:"Summary",icon:Zap,color:macOSColors.semantic.success,value:"summary",isActive:"summary"===t.format,description:"Compact, LLM-ready"},{id:"format::markdown-table",label:"Table",icon:FileText,color:macOSColors.semantic.info,value:"markdown-table",isActive:"markdown-table"===t.format,description:"Markdown table"},{id:"format::json",label:"JSON",icon:FileCode,color:macOSColors.semantic.warning,value:"json",isActive:"json"===t.format,description:"Structured data"}]},{id:"sort",title:"Sort By",type:"custom",data:[{id:"sort::renderCount",label:"Count",value:"renderCount",isActive:"renderCount"===t.sortBy,description:"Total renders"},{id:"sort::rate",label:"Rate",value:"rate",isActive:"rate"===t.sortBy,description:"Renders / sec"},{id:"sort::name",label:"Name",value:"name",isActive:"name"===t.sortBy,description:"Alphabetical"}]},{id:"topN",title:"Top N",type:"custom",data:[{id:"topN::10",label:"10",value:10,isActive:10===t.topN},{id:"topN::25",label:"25",value:25,isActive:25===t.topN},{id:"topN::50",label:"50",value:50,isActive:50===t.topN},{id:"topN::100",label:"100",value:100,isActive:100===t.topN},{id:"topN::-1",label:"All",value:-1,isActive:-1===t.topN}]},{id:"minRenders",title:"Min Renders",type:"custom",data:[{id:"minRenders::1",label:"1",value:1,isActive:1===t.minRenders},{id:"minRenders::2",label:"2",value:2,isActive:2===t.minRenders},{id:"minRenders::3",label:"3",value:3,isActive:3===t.minRenders},{id:"minRenders::5",label:"5",value:5,isActive:5===t.minRenders},{id:"minRenders::10",label:"10",value:10,isActive:10===t.minRenders}]},{id:"causes",title:"Filter Causes",type:"custom",description:0===t.filterCauses.length?"All causes shown":"Only the selected causes shown",data:CAUSE_OPTIONS.map(e=>({id:`cause::${e.value}`,label:e.label,value:e.value,isActive:t.filterCauses.includes(e.value)}))},{id:"signal",title:"Signal Extraction",type:"custom",data:[{id:"signal::groupByName",label:"Group by name",value:"groupByName",isActive:t.groupByName,description:"Collapse list items"},{id:"signal::aggregateCauses",label:"Aggregate causes",value:"aggregateCauses",isActive:t.aggregateCauses,description:"Hook x N"},{id:"signal::includeHistory",label:"Include history",value:"includeHistory",isActive:t.includeHistory,description:"JSON only — large"}]}],previewSection:{enabled:!0,title:"PREVIEW",icon:Eye,content:y,headerActions:g},onFilterChange:p}),[t,n,p,y,g]);return _jsx(DynamicFilterView,{...C})}const styles=StyleSheet.create({collapsedPreview:{gap:8},expandButton:{backgroundColor:macOSColors.background.input,borderRadius:8,borderWidth:1,borderColor:macOSColors.border.default,padding:12},expandButtonContent:{flexDirection:"row",alignItems:"center",gap:10},expandButtonTextContainer:{flex:1},expandButtonTitle:{fontSize:13,fontWeight:"600",color:macOSColors.text.primary},expandButtonSubtitle:{fontSize:11,color:macOSColors.text.secondary,marginTop:2},collapseButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:8,marginBottom:8,backgroundColor:macOSColors.background.hover,borderRadius:6,borderWidth:1,borderColor:macOSColors.border.default},collapseButtonText:{fontSize:12,fontWeight:"500",color:macOSColors.text.secondary},sizeWarning:{flexDirection:"row",alignItems:"center",gap:6,paddingHorizontal:10,paddingVertical:6,backgroundColor:macOSColors.semantic.warningBackground,borderRadius:6,borderWidth:1,borderColor:macOSColors.semantic.warning+"30"},sizeWarningDanger:{backgroundColor:macOSColors.semantic.errorBackground,borderColor:macOSColors.semantic.error+"30"},sizeWarningText:{fontSize:11,fontWeight:"500",flex:1},previewScroll:{maxHeight:360},previewText:{fontFamily:"monospace",fontSize:11,color:macOSColors.text.primary,lineHeight:18},statusLabel:{fontSize:11,fontWeight:"600",color:macOSColors.text.muted,marginRight:8}});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";export const DEFAULT_COPY_SETTINGS={format:"summary",topN:25,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1};export const COPY_PRESETS={llm:{format:"summary",topN:25,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},table:{format:"markdown-table",topN:50,minRenders:2,filterCauses:[],groupByName:!0,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},json:{format:"json",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1},full:{format:"json",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!1,sortBy:"renderCount",includeHistory:!0}};export function detectActivePreset(e){for(const[r,t]of Object.entries(COPY_PRESETS))if(Object.keys(t).every(r=>{const o=e[r],s=t[r];return Array.isArray(o)&&Array.isArray(s)?o.length===s.length&&o.every((e,r)=>e===s[r]):o===s}))return r;return null}export const PRESET_METADATA={llm:{label:"LLM",description:"Compact summary for AI",color:"#10B981"},table:{label:"Table",description:"Markdown table",color:"#3B82F6"},json:{label:"JSON",description:"Structured data",color:"#F59E0B"},full:{label:"Full",description:"Everything incl. history",color:"#6B7280"}};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";import{persistentStorage,devToolsStorageKeys}from"@buoy-gg/shared-ui";import{DEFAULT_COPY_SETTINGS}from"../types/copySettings";export async function saveCopySettings(t){try{const e=devToolsStorageKeys.highlightUpdates.copySettings();await persistentStorage.setItem(e,JSON.stringify(t))}catch{}}export async function loadCopySettings(){try{const t=devToolsStorageKeys.highlightUpdates.copySettings(),e=await persistentStorage.getItem(t);if(e&&""!==e){const t=JSON.parse(e);return{...DEFAULT_COPY_SETTINGS,...t,filterCauses:t.filterCauses??DEFAULT_COPY_SETTINGS.filterCauses}}return null}catch{return null}}export async function clearCopySettings(){try{const t=devToolsStorageKeys.highlightUpdates.copySettings();await persistentStorage.removeItem(t)}catch{}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";function buildReport(e,n){let t=e.filter(e=>e.renderCount>=n.minRenders);if(n.filterCauses.length>0){const e=new Set(n.filterCauses);t=t.filter(n=>e.has(n.lastRenderCause?.type??"unknown"))}const o=e.flatMap(e=>[e.firstRenderTime,e.lastRenderTime]).filter(e=>Number.isFinite(e)),r=o.length>0?Math.max(...o)-Math.min(...o):0,a=Math.max(.001,r/1e3),s=(n.groupByName?groupByComponentName(t):t.map(e=>[e])).map(e=>processGroup(e,n,a));sortRows(s,n.sortBy);const u=-1===n.topN?0:Math.max(0,s.length-n.topN),p=-1===n.topN?s:s.slice(0,n.topN),i=e.reduce((e,n)=>e+n.renderCount,0),c=aggregateCauseBreakdown(e);let d=0,m=!1;for(const n of e)n.lastRenderCause||(d+=n.renderCount),n.renderHistory&&n.renderHistory.length>0&&(m=!0);return{totalUniqueComponents:t.length,totalRenders:i,windowMs:r,causeBreakdown:c,rows:p,truncated:u,dataGaps:{historyOff:!m,propsCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedProps)),stateCaptureOff:!e.some(e=>e.renderHistory?.some(e=>void 0!==e.capturedState)),rendersWithoutCause:d}}}function groupByComponentName(e){const n=new Map;for(const t of e){const e=t.componentName||t.displayName||t.viewType,o=n.get(e);o?o.push(t):n.set(e,[t])}return Array.from(n.values())}function processGroup(e,n,t){const o=e[0],r=o.componentName||o.displayName||o.viewType;let a=0;const s={},u=new Map,p=new Map,i=new Map;let c=0,d=0,m=0;for(const t of e){a+=t.renderCount;const e=t.lastRenderCause;if(!e)continue;const o=e.type;s[o]=(s[o]??0)+t.renderCount;const r=(e.hookChanges?.length??0)>0,h=(e.changedKeys?.length??0)>0;if("parent"===o&&("state"===e.componentCause||"props"===e.componentCause||r||h?d+=t.renderCount:m+=t.renderCount),"props"!==o||h||(c+=t.renderCount),e.parentComponentName&&i.set(e.parentComponentName,(i.get(e.parentComponentName)??0)+1),n.aggregateCauses&&e.hookChanges)for(const n of e.hookChanges){const e=`${n.type}[${n.index}]`,t=u.get(e);t?t.count+=1:u.set(e,{count:1,sample:formatHookSample(n)})}if(e.changedKeys)for(const n of e.changedKeys)n.includes("(ref only)")||p.set(n,(p.get(n)??0)+1)}const h=Array.from(u.entries()).sort((e,n)=>n[1].count-e[1].count).slice(0,3).map(([e,n])=>({hook:e,count:n.count,sample:n.sample})),l=Array.from(p.entries()).sort((e,n)=>n[1]-e[1]).slice(0,5).map(([e])=>e);let f,C="unknown",g=-1;for(const[e,n]of Object.entries(s))(n??0)>g&&(g=n??0,C=e);let y=0;for(const[e,n]of i)n>y&&(y=n,f=e);const w=e.map(e=>e.renderCount).sort((e,n)=>n-e),$=a/t;return{name:r,viewType:o.viewType,instances:e.length,renders:a,causeMix:s,dominantCause:C,hookCauses:h,changedKeys:l,unknownPropsCount:c,parentWithOwnChange:d,parentNoChange:m,parentName:f,instanceCounts:w,rate:$,source:e}}function aggregateCauseBreakdown(e){const n={};for(const t of e){const e=t.lastRenderCause?.type??"unknown";n[e]=(n[e]??0)+t.renderCount}return n}function sortRows(e,n){switch(n){case"renderCount":e.sort((e,n)=>n.renders-e.renders);break;case"rate":e.sort((e,n)=>n.rate-e.rate);break;case"name":e.sort((e,n)=>e.name.localeCompare(n.name))}}const VALUE_MAX_LEN=32;function truncateValue(e){if(null===e)return"null";if(void 0===e)return"undefined";if("function"==typeof e)return"[Fn]";if("object"==typeof e)return Array.isArray(e)?`[Array(${e.length})]`:"[Obj]";const n=String(e);return n.length>32?n.slice(0,31)+"…":n}function formatHookSample(e){return void 0===e.previousValue&&void 0===e.currentValue?e.description:`${truncateValue(e.previousValue)} → ${truncateValue(e.currentValue)}`}function formatWindow(e){return e<1e3?`${e}ms`:`${(e/1e3).toFixed(1)}s`}function formatRate(e){return e>=100?`${e.toFixed(0)}/s`:e>=10?`${e.toFixed(1)}/s`:`${e.toFixed(2)}/s`}function causeBreakdownLine(e){const n=Object.entries(e).sort((e,n)=>(n[1]??0)-(e[1]??0));return 0===n.length?"(no causes recorded)":n.map(([e,n])=>`${e} ${n}`).join(" · ")}function describeCause(e){const n=[],t=Object.entries(e.causeMix).filter(([,e])=>(e??0)>0).sort((e,n)=>(n[1]??0)-(e[1]??0)),o=t.length>=2&&(t[1]?.[1]??0)>=.1*e.renders;if("hooks"===e.dominantCause&&e.hookCauses.length>0){const t=e.hookCauses[0];t.sample?n.push(`hooks ×${t.count} ${t.hook}: ${t.sample}`):n.push(`hooks ×${t.count} ${t.hook}`)}else if("props"===e.dominantCause){if(e.changedKeys.length>0){const t=e.changedKeys.slice(0,3).join(", ");n.push(`props (${t})`)}else n.push("props (keys not captured)");e.unknownPropsCount>0&&e.changedKeys.length>0&&n.push(`[${e.unknownPropsCount} unidentified]`)}else if("parent"===e.dominantCause){let t="parent cascade";e.parentNoChange>0&&0===e.parentWithOwnChange&&(t="parent cascade, no own change"),e.parentName&&(t+=` ← ${e.parentName}`),n.push(t)}else"mount"===e.dominantCause?n.push("mount"):"state"===e.dominantCause?n.push("state"):"context"===e.dominantCause?n.push("context"):n.push("unknown");if(o){const e=t.map(([e,n])=>`${e}:${n}`).join(" + ");n.push(`(${e})`)}return n.join(" ")}function describeInstances(e){if(e.instances<=1)return e.name;const n=e.instanceCounts,t=n[0]??0;if(t-(n[n.length-1]??0)<=1)return`${e.name} ×${e.instances} (${t} each)`;const o=n.slice(1),r=o.reduce((e,n)=>e+n,0),a=o.length>0?r/o.length:0;return`${e.name} ×${e.instances} (top ${t}, others ~${Math.round(a)})`}const LLM_PREAMBLE="React Native render report — review the data and identify why components are re-rendering.";function generateSummary(e,n){const t=[];t.push(LLM_PREAMBLE),t.push(""),t.push(`Window: ${formatWindow(e.windowMs)} · ${e.totalUniqueComponents} components · ${e.totalRenders} renders`),t.push(`Cause mix: ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("Top offenders (count · rate · component · cause):"),t.push("");const o=e.rows.map(describeInstances),r=Math.min(36,Math.max(8,...o.map(e=>e.length))),a=Math.max(3,...e.rows.map(e=>`×${e.renders}`.length)),s=Math.max(5,...e.rows.map(e=>formatRate(e.rate).length));for(let n=0;n<e.rows.length;n++){const u=e.rows[n],p=(o[n]??u.name).padEnd(r),i=`×${u.renders}`.padStart(a),c=formatRate(u.rate).padStart(s),d=describeCause(u);t.push(` ${i} ${c} ${p} ${d}`)}e.truncated>0&&(t.push(""),t.push(`... ${e.truncated} more (set topN=-1 to expand)`));const u=buildDataFooter(e);if(u.length>0){t.push(""),t.push("Data availability:");for(const e of u)t.push(` · ${e}`)}return t.join("\n")}function buildDataFooter(e){const n=[];return e.dataGaps.rendersWithoutCause>0&&n.push(`${e.dataGaps.rendersWithoutCause} renders had no cause info (enable trackRenderCauses for more detail)`),e.dataGaps.propsCaptureOff&&n.push("prop snapshots not captured (enable capturePropsOnRender to see prop diffs for 'props (keys not captured)' rows)"),e.dataGaps.stateCaptureOff&&n.push("state snapshots not captured (enable captureStateOnRender)"),e.dataGaps.historyOff&&n.push("render history off (enable enableRenderHistory for per-render timeline)"),n}function generateMarkdownTable(e,n){const t=[];t.push("# React Render Report"),t.push(""),t.push(`**Window:** ${formatWindow(e.windowMs)} · **Components:** ${e.totalUniqueComponents} · **Renders:** ${e.totalRenders}`),t.push(`**Cause mix:** ${causeBreakdownLine(e.causeBreakdown)}`),t.push(""),t.push("| Component | Renders | Rate | Cause |"),t.push("|---|---:|---:|---|");for(const n of e.rows){const e=describeInstances(n),o=describeCause(n).replace(/\|/g,"\\|");t.push(`| ${e} | ${n.renders} | ${formatRate(n.rate)} | ${o} |`)}e.truncated>0&&(t.push(""),t.push(`_... ${e.truncated} more rows_`));const o=buildDataFooter(e);if(o.length>0){t.push(""),t.push("**Data availability:**");for(const e of o)t.push(`- ${e}`)}return t.join("\n")}function generateJson(e,n,t){const o={exportedAt:(new Date).toISOString(),summary:{windowMs:n.windowMs,totalComponents:n.totalUniqueComponents,totalRenders:n.totalRenders,causeBreakdown:n.causeBreakdown,truncated:n.truncated,dataGaps:n.dataGaps},components:n.rows.map(e=>({name:e.name,viewType:e.viewType,instances:e.instances,instanceCounts:e.instances>1?e.instanceCounts:void 0,renders:e.renders,ratePerSec:Number(e.rate.toFixed(3)),dominantCause:e.dominantCause,causeMix:e.causeMix,hookCauses:e.hookCauses,changedKeys:e.changedKeys,unknownPropsCount:e.unknownPropsCount||void 0,parentName:e.parentName,parentWithOwnChange:e.parentWithOwnChange||void 0,parentNoChange:e.parentNoChange||void 0,...t.includeHistory?{history:extractHistory(e.source)}:{}}))};return t.includeHistory?JSON.stringify(o,null,2):JSON.stringify(o)}function extractHistory(e){return e.map(e=>({name:e.componentName||e.displayName,nativeTag:e.nativeTag,renderCount:e.renderCount,history:e.renderHistory?.map(e=>({n:e.renderNumber,t:e.timestamp,cause:{type:e.cause.type,componentCause:e.cause.componentCause,changedKeys:e.cause.changedKeys,parentComponentName:e.cause.parentComponentName,hookChanges:e.cause.hookChanges?.map(e=>({type:e.type,index:e.index,desc:e.description}))}}))}))}export function generateExport(e,n){const t=buildReport(e,n);switch(n.format){case"summary":default:return generateSummary(t,n);case"markdown-table":return generateMarkdownTable(t,n);case"json":return generateJson(e,t,n)}}export function estimateExportSize(e,n){return generateExport(e,n).length}export function getExportSummary(e){return{totalComponents:e.length,totalRenders:e.reduce((e,n)=>e+n.renderCount,0)}}export function generateSingleComponentExport(e){return generateExport([e],{format:"summary",topN:-1,minRenders:1,filterCauses:[],groupByName:!1,aggregateCauses:!0,sortBy:"renderCount",includeHistory:!1})}
|
|
@@ -22,7 +22,7 @@ interface HeaderActionsProps {
|
|
|
22
22
|
onToggleTracking: () => void;
|
|
23
23
|
onToggleFreeze: () => void;
|
|
24
24
|
onClear: () => void;
|
|
25
|
-
|
|
25
|
+
onOpenCopySettings: () => void;
|
|
26
26
|
isTracking: boolean;
|
|
27
27
|
isFrozen: boolean;
|
|
28
28
|
activeFilterCount: number;
|
|
@@ -40,7 +40,7 @@ interface MainListHeaderProps {
|
|
|
40
40
|
onToggleTracking: () => void;
|
|
41
41
|
onToggleFreeze: () => void;
|
|
42
42
|
onClear: () => void;
|
|
43
|
-
|
|
43
|
+
onOpenCopySettings: () => void;
|
|
44
44
|
isTracking: boolean;
|
|
45
45
|
isFrozen: boolean;
|
|
46
46
|
activeFilterCount: number;
|
|
@@ -64,5 +64,9 @@ interface DetailViewHeaderProps {
|
|
|
64
64
|
hasHistory?: boolean;
|
|
65
65
|
}
|
|
66
66
|
export declare const DetailViewHeader: React.NamedExoticComponent<DetailViewHeaderProps>;
|
|
67
|
+
interface CopySettingsViewHeaderProps {
|
|
68
|
+
onBack: () => void;
|
|
69
|
+
}
|
|
70
|
+
export declare const CopySettingsViewHeader: React.NamedExoticComponent<CopySettingsViewHeaderProps>;
|
|
67
71
|
export {};
|
|
68
72
|
//# sourceMappingURL=ModalHeaderContent.d.ts.map
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* RendersCopySettingsView
|
|
3
|
+
*
|
|
4
|
+
* Settings UI for configuring render report export.
|
|
5
|
+
* Mirrors EventsCopySettingsView but with renders-specific options.
|
|
6
|
+
*/
|
|
7
|
+
import type { TrackedRender } from "../utils/RenderTracker";
|
|
8
|
+
interface RendersCopySettingsViewProps {
|
|
9
|
+
renders: TrackedRender[];
|
|
10
|
+
}
|
|
11
|
+
export declare function RendersCopySettingsView({ renders, }: RendersCopySettingsViewProps): import("react").JSX.Element;
|
|
12
|
+
export {};
|
|
13
|
+
//# sourceMappingURL=RendersCopySettingsView.d.ts.map
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Highlight Updates Copy Settings
|
|
3
|
+
*
|
|
4
|
+
* Configuration for exporting render reports as compact debug-focused output.
|
|
5
|
+
*/
|
|
6
|
+
import type { RenderCauseType } from "../utils/RenderTracker";
|
|
7
|
+
export type RendersFormat = "summary" | "markdown-table" | "json";
|
|
8
|
+
export type RendersSortBy = "renderCount" | "rate" | "name";
|
|
9
|
+
export type RendersTopN = 10 | 25 | 50 | 100 | -1;
|
|
10
|
+
export type RendersMinRenders = 1 | 2 | 3 | 5 | 10;
|
|
11
|
+
export interface RendersCopySettings {
|
|
12
|
+
format: RendersFormat;
|
|
13
|
+
topN: RendersTopN;
|
|
14
|
+
minRenders: RendersMinRenders;
|
|
15
|
+
/** Empty array = all causes; otherwise restrict to listed causes */
|
|
16
|
+
filterCauses: RenderCauseType[];
|
|
17
|
+
/** Group identical-named components into one row with x N */
|
|
18
|
+
groupByName: boolean;
|
|
19
|
+
/** Aggregate hook causes ("useState[2] fired 30x") instead of raw events */
|
|
20
|
+
aggregateCauses: boolean;
|
|
21
|
+
sortBy: RendersSortBy;
|
|
22
|
+
/** Include per-render history events (huge — off by default) */
|
|
23
|
+
includeHistory: boolean;
|
|
24
|
+
}
|
|
25
|
+
export declare const DEFAULT_COPY_SETTINGS: RendersCopySettings;
|
|
26
|
+
export declare const COPY_PRESETS: {
|
|
27
|
+
/** LLM-pasteable summary — the default */
|
|
28
|
+
readonly llm: {
|
|
29
|
+
readonly format: "summary";
|
|
30
|
+
readonly topN: 25;
|
|
31
|
+
readonly minRenders: 2;
|
|
32
|
+
readonly filterCauses: RenderCauseType[];
|
|
33
|
+
readonly groupByName: true;
|
|
34
|
+
readonly aggregateCauses: true;
|
|
35
|
+
readonly sortBy: "renderCount";
|
|
36
|
+
readonly includeHistory: false;
|
|
37
|
+
};
|
|
38
|
+
/** Markdown table for PR descriptions */
|
|
39
|
+
readonly table: {
|
|
40
|
+
readonly format: "markdown-table";
|
|
41
|
+
readonly topN: 50;
|
|
42
|
+
readonly minRenders: 2;
|
|
43
|
+
readonly filterCauses: RenderCauseType[];
|
|
44
|
+
readonly groupByName: true;
|
|
45
|
+
readonly aggregateCauses: true;
|
|
46
|
+
readonly sortBy: "renderCount";
|
|
47
|
+
readonly includeHistory: false;
|
|
48
|
+
};
|
|
49
|
+
/** Compact JSON, no history */
|
|
50
|
+
readonly json: {
|
|
51
|
+
readonly format: "json";
|
|
52
|
+
readonly topN: -1;
|
|
53
|
+
readonly minRenders: 1;
|
|
54
|
+
readonly filterCauses: RenderCauseType[];
|
|
55
|
+
readonly groupByName: false;
|
|
56
|
+
readonly aggregateCauses: true;
|
|
57
|
+
readonly sortBy: "renderCount";
|
|
58
|
+
readonly includeHistory: false;
|
|
59
|
+
};
|
|
60
|
+
/** Full JSON dump including history (escape hatch) */
|
|
61
|
+
readonly full: {
|
|
62
|
+
readonly format: "json";
|
|
63
|
+
readonly topN: -1;
|
|
64
|
+
readonly minRenders: 1;
|
|
65
|
+
readonly filterCauses: RenderCauseType[];
|
|
66
|
+
readonly groupByName: false;
|
|
67
|
+
readonly aggregateCauses: false;
|
|
68
|
+
readonly sortBy: "renderCount";
|
|
69
|
+
readonly includeHistory: true;
|
|
70
|
+
};
|
|
71
|
+
};
|
|
72
|
+
export type CopyPresetName = keyof typeof COPY_PRESETS;
|
|
73
|
+
export declare function detectActivePreset(settings: RendersCopySettings): CopyPresetName | null;
|
|
74
|
+
export declare const PRESET_METADATA: Record<CopyPresetName, {
|
|
75
|
+
label: string;
|
|
76
|
+
description: string;
|
|
77
|
+
color: string;
|
|
78
|
+
}>;
|
|
79
|
+
//# sourceMappingURL=copySettings.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copy Settings Storage
|
|
3
|
+
*
|
|
4
|
+
* Persists the highlight-updates copy/export settings.
|
|
5
|
+
*/
|
|
6
|
+
import type { RendersCopySettings } from "../types/copySettings";
|
|
7
|
+
export declare function saveCopySettings(settings: RendersCopySettings): Promise<void>;
|
|
8
|
+
export declare function loadCopySettings(): Promise<RendersCopySettings | null>;
|
|
9
|
+
export declare function clearCopySettings(): Promise<void>;
|
|
10
|
+
//# sourceMappingURL=copySettingsStorage.d.ts.map
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Renders Export Formatter
|
|
3
|
+
*
|
|
4
|
+
* Pipeline: TrackedRender[] -> filter -> group -> aggregate -> sort -> format.
|
|
5
|
+
* Goal: compact, debug-focused output. Reports facts, not opinions.
|
|
6
|
+
*/
|
|
7
|
+
import type { TrackedRender } from "./RenderTracker";
|
|
8
|
+
import type { RendersCopySettings } from "../types/copySettings";
|
|
9
|
+
export declare function generateExport(renders: TrackedRender[], settings: RendersCopySettings): string;
|
|
10
|
+
export declare function estimateExportSize(renders: TrackedRender[], settings: RendersCopySettings): number;
|
|
11
|
+
export declare function getExportSummary(renders: TrackedRender[]): {
|
|
12
|
+
totalComponents: number;
|
|
13
|
+
totalRenders: number;
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* Export a single component's detail (used by RenderDetailView copy button).
|
|
17
|
+
* Always uses the summary format since detail copies are inherently small.
|
|
18
|
+
*/
|
|
19
|
+
export declare function generateSingleComponentExport(render: TrackedRender): string;
|
|
20
|
+
//# sourceMappingURL=rendersExportFormatter.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@buoy-gg/highlight-updates",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.15",
|
|
4
4
|
"description": "Control React DevTools highlight updates feature from your app",
|
|
5
5
|
"main": "lib/commonjs/index",
|
|
6
6
|
"module": "lib/module/index",
|
|
@@ -26,14 +26,14 @@
|
|
|
26
26
|
],
|
|
27
27
|
"sideEffects": false,
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@buoy-gg/
|
|
30
|
-
"@buoy-gg/
|
|
29
|
+
"@buoy-gg/floating-tools-core": "2.1.15",
|
|
30
|
+
"@buoy-gg/shared-ui": "2.1.15"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
|
-
"@buoy-gg/license": "2.1.
|
|
33
|
+
"@buoy-gg/license": "2.1.15",
|
|
34
34
|
"react": "*",
|
|
35
35
|
"react-native": "*",
|
|
36
|
-
"@buoy-gg/core": "2.1.
|
|
36
|
+
"@buoy-gg/core": "2.1.15"
|
|
37
37
|
},
|
|
38
38
|
"peerDependenciesMeta": {
|
|
39
39
|
"@buoy-gg/core": {
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
"@types/react": "^19.1.0",
|
|
45
45
|
"@types/react-native": "^0.73.0",
|
|
46
46
|
"typescript": "~5.8.3",
|
|
47
|
-
"@buoy-gg/core": "2.1.
|
|
48
|
-
"@buoy-gg/license": "2.1.
|
|
47
|
+
"@buoy-gg/core": "2.1.15",
|
|
48
|
+
"@buoy-gg/license": "2.1.15"
|
|
49
49
|
},
|
|
50
50
|
"react-native-builder-bob": {
|
|
51
51
|
"source": "src",
|