@buoy-gg/highlight-updates 2.1.12 → 2.1.13

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.
Files changed (64) hide show
  1. package/lib/commonjs/highlight-updates/HighlightUpdatesOverlay.js +1 -285
  2. package/lib/commonjs/highlight-updates/components/HighlightFilterView.js +1 -1371
  3. package/lib/commonjs/highlight-updates/components/HighlightUpdatesModal.js +1 -591
  4. package/lib/commonjs/highlight-updates/components/IdentifierBadge.js +1 -267
  5. package/lib/commonjs/highlight-updates/components/IsolatedRenderList.js +1 -178
  6. package/lib/commonjs/highlight-updates/components/ModalHeaderContent.js +1 -303
  7. package/lib/commonjs/highlight-updates/components/RenderCauseBadge.js +1 -500
  8. package/lib/commonjs/highlight-updates/components/RenderDetailView.js +1 -830
  9. package/lib/commonjs/highlight-updates/components/RenderHistoryViewer.js +1 -894
  10. package/lib/commonjs/highlight-updates/components/RenderListItem.js +1 -220
  11. package/lib/commonjs/highlight-updates/components/StatsDisplay.js +1 -70
  12. package/lib/commonjs/highlight-updates/components/index.js +1 -97
  13. package/lib/commonjs/highlight-updates/utils/HighlightUpdatesController.js +1 -1435
  14. package/lib/commonjs/highlight-updates/utils/PerformanceLogger.js +1 -359
  15. package/lib/commonjs/highlight-updates/utils/ProfilerInterceptor.js +1 -371
  16. package/lib/commonjs/highlight-updates/utils/RenderCauseDetector.js +1 -1828
  17. package/lib/commonjs/highlight-updates/utils/RenderTracker.js +1 -903
  18. package/lib/commonjs/highlight-updates/utils/ViewTypeMapper.js +1 -264
  19. package/lib/commonjs/highlight-updates/utils/renderExportFormatter.js +1 -58
  20. package/lib/commonjs/index.js +1 -311
  21. package/lib/commonjs/preset.js +1 -278
  22. package/lib/module/highlight-updates/HighlightUpdatesOverlay.js +1 -278
  23. package/lib/module/highlight-updates/components/HighlightFilterView.js +1 -1365
  24. package/lib/module/highlight-updates/components/HighlightUpdatesModal.js +1 -585
  25. package/lib/module/highlight-updates/components/IdentifierBadge.js +1 -259
  26. package/lib/module/highlight-updates/components/IsolatedRenderList.js +1 -174
  27. package/lib/module/highlight-updates/components/ModalHeaderContent.js +1 -298
  28. package/lib/module/highlight-updates/components/RenderCauseBadge.js +1 -491
  29. package/lib/module/highlight-updates/components/RenderDetailView.js +1 -826
  30. package/lib/module/highlight-updates/components/RenderHistoryViewer.js +1 -888
  31. package/lib/module/highlight-updates/components/RenderListItem.js +1 -215
  32. package/lib/module/highlight-updates/components/StatsDisplay.js +1 -67
  33. package/lib/module/highlight-updates/components/index.js +1 -16
  34. package/lib/module/highlight-updates/utils/HighlightUpdatesController.js +1 -1431
  35. package/lib/module/highlight-updates/utils/PerformanceLogger.js +1 -353
  36. package/lib/module/highlight-updates/utils/ProfilerInterceptor.js +1 -358
  37. package/lib/module/highlight-updates/utils/RenderCauseDetector.js +1 -1818
  38. package/lib/module/highlight-updates/utils/RenderTracker.js +1 -900
  39. package/lib/module/highlight-updates/utils/ViewTypeMapper.js +1 -255
  40. package/lib/module/highlight-updates/utils/renderExportFormatter.js +1 -54
  41. package/lib/module/index.js +1 -71
  42. package/lib/module/preset.js +1 -272
  43. package/package.json +7 -7
  44. package/lib/typescript/highlight-updates/HighlightUpdatesOverlay.d.ts.map +0 -1
  45. package/lib/typescript/highlight-updates/components/HighlightFilterView.d.ts.map +0 -1
  46. package/lib/typescript/highlight-updates/components/HighlightUpdatesModal.d.ts.map +0 -1
  47. package/lib/typescript/highlight-updates/components/IdentifierBadge.d.ts.map +0 -1
  48. package/lib/typescript/highlight-updates/components/IsolatedRenderList.d.ts.map +0 -1
  49. package/lib/typescript/highlight-updates/components/ModalHeaderContent.d.ts.map +0 -1
  50. package/lib/typescript/highlight-updates/components/RenderCauseBadge.d.ts.map +0 -1
  51. package/lib/typescript/highlight-updates/components/RenderDetailView.d.ts.map +0 -1
  52. package/lib/typescript/highlight-updates/components/RenderHistoryViewer.d.ts.map +0 -1
  53. package/lib/typescript/highlight-updates/components/RenderListItem.d.ts.map +0 -1
  54. package/lib/typescript/highlight-updates/components/StatsDisplay.d.ts.map +0 -1
  55. package/lib/typescript/highlight-updates/components/index.d.ts.map +0 -1
  56. package/lib/typescript/highlight-updates/utils/HighlightUpdatesController.d.ts.map +0 -1
  57. package/lib/typescript/highlight-updates/utils/PerformanceLogger.d.ts.map +0 -1
  58. package/lib/typescript/highlight-updates/utils/ProfilerInterceptor.d.ts.map +0 -1
  59. package/lib/typescript/highlight-updates/utils/RenderCauseDetector.d.ts.map +0 -1
  60. package/lib/typescript/highlight-updates/utils/RenderTracker.d.ts.map +0 -1
  61. package/lib/typescript/highlight-updates/utils/ViewTypeMapper.d.ts.map +0 -1
  62. package/lib/typescript/highlight-updates/utils/renderExportFormatter.d.ts.map +0 -1
  63. package/lib/typescript/index.d.ts.map +0 -1
  64. package/lib/typescript/preset.d.ts.map +0 -1
@@ -1,267 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.CategoryBadge = CategoryBadge;
7
- exports.IDENTIFIER_CONFIG = void 0;
8
- exports.IdentifierBadge = IdentifierBadge;
9
- exports.default = void 0;
10
- var _react = _interopRequireDefault(require("react"));
11
- var _reactNative = require("react-native");
12
- var _sharedUi = require("@buoy-gg/shared-ui");
13
- var _jsxRuntime = require("react/jsx-runtime");
14
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
- /**
16
- * IdentifierBadge
17
- *
18
- * Shared badge component for displaying component identifiers.
19
- * Used throughout the highlight-updates package for consistent styling.
20
- */
21
-
22
- // All possible identifier types
23
-
24
- // Badge configuration for each identifier type
25
- const IDENTIFIER_CONFIG = exports.IDENTIFIER_CONFIG = {
26
- viewType: {
27
- label: "ViewType",
28
- shortLabel: "View",
29
- color: _sharedUi.buoyColors.primary,
30
- icon: _sharedUi.Box
31
- },
32
- testID: {
33
- label: "testID",
34
- shortLabel: "test",
35
- color: _sharedUi.buoyColors.success,
36
- icon: _sharedUi.Hash
37
- },
38
- nativeID: {
39
- label: "nativeID",
40
- shortLabel: "native",
41
- color: "#f59e0b",
42
- // amber
43
- icon: _sharedUi.Hash
44
- },
45
- component: {
46
- label: "Component",
47
- shortLabel: "Comp",
48
- color: "#a855f7",
49
- // purple
50
- icon: _sharedUi.FileCode
51
- },
52
- accessibilityLabel: {
53
- label: "a11y",
54
- shortLabel: "a11y",
55
- color: "#ec4899",
56
- // pink
57
- icon: _sharedUi.Eye
58
- },
59
- nativeTag: {
60
- label: "tag",
61
- shortLabel: "tag",
62
- color: _sharedUi.buoyColors.textMuted,
63
- icon: _sharedUi.Layers
64
- },
65
- any: {
66
- label: "Any",
67
- shortLabel: "Any",
68
- color: _sharedUi.buoyColors.warning,
69
- icon: _sharedUi.Search
70
- }
71
- };
72
- function IdentifierBadge({
73
- type,
74
- value,
75
- compact = false,
76
- badgeOnly = false,
77
- valueOnly = false,
78
- shortLabel = false,
79
- showIcon = false
80
- }) {
81
- const config = IDENTIFIER_CONFIG[type];
82
- const IconComponent = config.icon;
83
- const label = shortLabel ? config.shortLabel : config.label;
84
- if (valueOnly) {
85
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
86
- style: [styles.valueOnly, compact && styles.valueOnlyCompact, {
87
- color: config.color
88
- }],
89
- numberOfLines: 1,
90
- children: value
91
- });
92
- }
93
- if (badgeOnly) {
94
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
95
- style: [styles.badgeOnly, compact && styles.badgeOnlyCompact, {
96
- backgroundColor: config.color + "20",
97
- borderColor: config.color + "40"
98
- }],
99
- children: [showIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
100
- size: compact ? 10 : 12,
101
- color: config.color
102
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
103
- style: [styles.badgeOnlyText, compact && styles.badgeOnlyTextCompact, {
104
- color: config.color
105
- }],
106
- children: label
107
- })]
108
- });
109
- }
110
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
111
- style: [styles.container, compact && styles.containerCompact],
112
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
113
- style: [styles.badge, compact && styles.badgeCompact, {
114
- backgroundColor: config.color + "20"
115
- }],
116
- children: [showIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
117
- size: compact ? 8 : 10,
118
- color: config.color
119
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
120
- style: [styles.badgeText, compact && styles.badgeTextCompact, {
121
- color: config.color
122
- }],
123
- children: label
124
- })]
125
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
126
- style: [styles.value, compact && styles.valueCompact],
127
- numberOfLines: 1,
128
- children: value
129
- })]
130
- });
131
- }
132
-
133
- // Standalone badge (no value) for category selection
134
-
135
- function CategoryBadge({
136
- type,
137
- count,
138
- isSelected = false,
139
- showIcon = true
140
- }) {
141
- const config = IDENTIFIER_CONFIG[type];
142
- const IconComponent = config.icon;
143
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
144
- style: [styles.categoryBadge, {
145
- backgroundColor: config.color + "15",
146
- borderColor: isSelected ? config.color : config.color + "40",
147
- borderWidth: isSelected ? 2 : 1
148
- }],
149
- children: [showIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
150
- size: 12,
151
- color: config.color
152
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
153
- style: [styles.categoryBadgeText, {
154
- color: config.color
155
- }],
156
- children: config.label
157
- }), count !== undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
158
- style: [styles.categoryBadgeCount, {
159
- backgroundColor: config.color + "25"
160
- }],
161
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
162
- style: [styles.categoryBadgeCountText, {
163
- color: config.color
164
- }],
165
- children: count
166
- })
167
- })]
168
- });
169
- }
170
- const styles = _reactNative.StyleSheet.create({
171
- // Full badge with value
172
- container: {
173
- flexDirection: "row",
174
- alignItems: "center",
175
- gap: 6
176
- },
177
- containerCompact: {
178
- gap: 4
179
- },
180
- badge: {
181
- flexDirection: "row",
182
- alignItems: "center",
183
- paddingVertical: 3,
184
- paddingHorizontal: 6,
185
- borderRadius: 4,
186
- gap: 4
187
- },
188
- badgeCompact: {
189
- paddingVertical: 2,
190
- paddingHorizontal: 5,
191
- gap: 3
192
- },
193
- badgeText: {
194
- fontSize: 10,
195
- fontWeight: "700"
196
- },
197
- badgeTextCompact: {
198
- fontSize: 9
199
- },
200
- value: {
201
- fontSize: 12,
202
- color: _sharedUi.buoyColors.text,
203
- fontFamily: "monospace",
204
- flex: 1
205
- },
206
- valueCompact: {
207
- fontSize: 11
208
- },
209
- // Badge only (no value)
210
- badgeOnly: {
211
- flexDirection: "row",
212
- alignItems: "center",
213
- paddingVertical: 4,
214
- paddingHorizontal: 8,
215
- borderRadius: 6,
216
- borderWidth: 1,
217
- gap: 5
218
- },
219
- badgeOnlyCompact: {
220
- paddingVertical: 2,
221
- paddingHorizontal: 6,
222
- borderRadius: 4,
223
- gap: 4
224
- },
225
- badgeOnlyText: {
226
- fontSize: 11,
227
- fontWeight: "600"
228
- },
229
- badgeOnlyTextCompact: {
230
- fontSize: 9,
231
- fontWeight: "700"
232
- },
233
- // Value only
234
- valueOnly: {
235
- fontSize: 12,
236
- fontFamily: "monospace"
237
- },
238
- valueOnlyCompact: {
239
- fontSize: 11
240
- },
241
- // Category badge (for filter selection)
242
- categoryBadge: {
243
- flexDirection: "row",
244
- alignItems: "center",
245
- paddingVertical: 8,
246
- paddingLeft: 10,
247
- paddingRight: 6,
248
- borderRadius: 8,
249
- gap: 6
250
- },
251
- categoryBadgeText: {
252
- fontSize: 11,
253
- fontWeight: "600"
254
- },
255
- categoryBadgeCount: {
256
- paddingHorizontal: 6,
257
- paddingVertical: 2,
258
- borderRadius: 10,
259
- minWidth: 20,
260
- alignItems: "center"
261
- },
262
- categoryBadgeCountText: {
263
- fontSize: 10,
264
- fontWeight: "600"
265
- }
266
- });
267
- var _default = exports.default = IdentifierBadge;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.CategoryBadge=CategoryBadge,exports.IDENTIFIER_CONFIG=void 0,exports.IdentifierBadge=IdentifierBadge,exports.default=void 0;var _react=_interopRequireDefault(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const IDENTIFIER_CONFIG=exports.IDENTIFIER_CONFIG={viewType:{label:"ViewType",shortLabel:"View",color:_sharedUi.buoyColors.primary,icon:_sharedUi.Box},testID:{label:"testID",shortLabel:"test",color:_sharedUi.buoyColors.success,icon:_sharedUi.Hash},nativeID:{label:"nativeID",shortLabel:"native",color:"#f59e0b",icon:_sharedUi.Hash},component:{label:"Component",shortLabel:"Comp",color:"#a855f7",icon:_sharedUi.FileCode},accessibilityLabel:{label:"a11y",shortLabel:"a11y",color:"#ec4899",icon:_sharedUi.Eye},nativeTag:{label:"tag",shortLabel:"tag",color:_sharedUi.buoyColors.textMuted,icon:_sharedUi.Layers},any:{label:"Any",shortLabel:"Any",color:_sharedUi.buoyColors.warning,icon:_sharedUi.Search}};function IdentifierBadge({type:e,value:t,compact:o=!1,badgeOnly:a=!1,valueOnly:r=!1,shortLabel:i=!1,showIcon:l=!1}){const n=IDENTIFIER_CONFIG[e],s=n.icon,c=i?n.shortLabel:n.label;return r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.valueOnly,o&&styles.valueOnlyCompact,{color:n.color}],numberOfLines:1,children:t}):a?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.badgeOnly,o&&styles.badgeOnlyCompact,{backgroundColor:n.color+"20",borderColor:n.color+"40"}],children:[l&&(0,_jsxRuntime.jsx)(s,{size:o?10:12,color:n.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.badgeOnlyText,o&&styles.badgeOnlyTextCompact,{color:n.color}],children:c})]}):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.container,o&&styles.containerCompact],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.badge,o&&styles.badgeCompact,{backgroundColor:n.color+"20"}],children:[l&&(0,_jsxRuntime.jsx)(s,{size:o?8:10,color:n.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.badgeText,o&&styles.badgeTextCompact,{color:n.color}],children:c})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.value,o&&styles.valueCompact],numberOfLines:1,children:t})]})}function CategoryBadge({type:e,count:t,isSelected:o=!1,showIcon:a=!0}){const r=IDENTIFIER_CONFIG[e],i=r.icon;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.categoryBadge,{backgroundColor:r.color+"15",borderColor:o?r.color:r.color+"40",borderWidth:o?2:1}],children:[a&&(0,_jsxRuntime.jsx)(i,{size:12,color:r.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.categoryBadgeText,{color:r.color}],children:r.label}),void 0!==t&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.categoryBadgeCount,{backgroundColor:r.color+"25"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.categoryBadgeCountText,{color:r.color}],children:t})})]})}const styles=_reactNative.StyleSheet.create({container:{flexDirection:"row",alignItems:"center",gap:6},containerCompact:{gap:4},badge:{flexDirection:"row",alignItems:"center",paddingVertical:3,paddingHorizontal:6,borderRadius:4,gap:4},badgeCompact:{paddingVertical:2,paddingHorizontal:5,gap:3},badgeText:{fontSize:10,fontWeight:"700"},badgeTextCompact:{fontSize:9},value:{fontSize:12,color:_sharedUi.buoyColors.text,fontFamily:"monospace",flex:1},valueCompact:{fontSize:11},badgeOnly:{flexDirection:"row",alignItems:"center",paddingVertical:4,paddingHorizontal:8,borderRadius:6,borderWidth:1,gap:5},badgeOnlyCompact:{paddingVertical:2,paddingHorizontal:6,borderRadius:4,gap:4},badgeOnlyText:{fontSize:11,fontWeight:"600"},badgeOnlyTextCompact:{fontSize:9,fontWeight:"700"},valueOnly:{fontSize:12,fontFamily:"monospace"},valueOnlyCompact:{fontSize:11},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCount:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCountText:{fontSize:10,fontWeight:"600"}});var _default=exports.default=IdentifierBadge;
@@ -1,178 +1 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.IsolatedRenderList = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _reactNative = require("react-native");
9
- var _RenderTracker = require("../utils/RenderTracker");
10
- var _RenderListItem = require("./RenderListItem");
11
- var _sharedUi = require("@buoy-gg/shared-ui");
12
- var _jsxRuntime = require("react/jsx-runtime");
13
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
14
- /**
15
- * IsolatedRenderList
16
- *
17
- * Performance-optimized component that isolates the render tracking subscription
18
- * to prevent parent re-renders. Only this component re-renders when new renders
19
- * are tracked, keeping the modal UI stable.
20
- *
21
- * Following the optimization guide: move subscriptions to child components to
22
- * prevent parent re-renders.
23
- */
24
-
25
- // Free tier limit for tracked components
26
- const FREE_TIER_COMPONENT_LIMIT = 25;
27
- /**
28
- * Isolated list component that owns the render subscription.
29
- * Parent component does NOT re-render when renders change.
30
- */
31
- function IsolatedRenderListInner({
32
- searchText,
33
- filters,
34
- onSelectRender,
35
- onStatsChange,
36
- onRendersChange,
37
- isTracking,
38
- isPro = false
39
- }) {
40
- // Initialize with current data to avoid flash of empty state
41
- const [renders, setRenders] = (0, _react.useState)(() => _RenderTracker.RenderTracker.getFilteredRenders(searchText));
42
- const flatListRef = (0, _react.useRef)(null);
43
-
44
- // Subscribe to RenderTracker updates - ONLY this component re-renders
45
- (0, _react.useEffect)(() => {
46
- const unsubscribe = _RenderTracker.RenderTracker.subscribe(() => {
47
- const newRenders = _RenderTracker.RenderTracker.getFilteredRenders(searchText);
48
- setRenders(newRenders);
49
- // Notify parent of stats via callback (parent uses ref, no re-render)
50
- onStatsChange(_RenderTracker.RenderTracker.getStats());
51
- // Notify parent of renders list for navigation
52
- onRendersChange?.(newRenders);
53
- });
54
- return unsubscribe;
55
- }, [searchText, onStatsChange, onRendersChange]);
56
-
57
- // Update filtered renders when search or filters change
58
- (0, _react.useEffect)(() => {
59
- const newRenders = _RenderTracker.RenderTracker.getFilteredRenders(searchText);
60
- setRenders(newRenders);
61
- onRendersChange?.(newRenders);
62
- }, [searchText, filters, onRendersChange]);
63
-
64
- // Limit visible components for free tier
65
- const visibleRenders = (0, _react.useMemo)(() => {
66
- if (isPro) return renders;
67
- return renders.slice(0, FREE_TIER_COMPONENT_LIMIT);
68
- }, [renders, isPro]);
69
-
70
- // Calculate locked component count
71
- const lockedComponentCount = (0, _react.useMemo)(() => {
72
- if (isPro) return 0;
73
- return Math.max(0, renders.length - FREE_TIER_COMPONENT_LIMIT);
74
- }, [renders.length, isPro]);
75
-
76
- // Stable keyExtractor - moved outside to avoid recreation
77
- const keyExtractor = (0, _react.useCallback)(item => item.id, []);
78
-
79
- // Stable renderItem - uses stable onSelectRender callback
80
- const renderItem = (0, _react.useCallback)(({
81
- item,
82
- index
83
- }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_RenderListItem.RenderListItem, {
84
- render: item,
85
- onPress: () => onSelectRender(item, index, visibleRenders)
86
- }), [onSelectRender, visibleRenders]);
87
-
88
- // Locked banner footer
89
- const renderFooter = (0, _react.useCallback)(() => {
90
- if (lockedComponentCount <= 0) return null;
91
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
92
- style: styles.lockedBanner,
93
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Lock, {
94
- size: 14,
95
- color: _sharedUi.buoyColors.warning
96
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
97
- style: styles.lockedBannerText,
98
- children: [lockedComponentCount, " more ", lockedComponentCount === 1 ? 'component' : 'components', " locked"]
99
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
100
- style: styles.lockedBannerSubtext,
101
- children: "Upgrade to Pro"
102
- })]
103
- });
104
- }, [lockedComponentCount]);
105
-
106
- // Show empty state when no renders
107
- if (renders.length === 0) {
108
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
109
- style: styles.emptyState,
110
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Activity, {
111
- size: 32,
112
- color: _sharedUi.buoyColors.textMuted
113
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
114
- style: styles.emptyTitle,
115
- children: "No renders tracked"
116
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
117
- style: styles.emptyText,
118
- children: isTracking ? "Component renders will appear here" : "Enable tracking to start capturing"
119
- })]
120
- });
121
- }
122
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.FlatList, {
123
- ref: flatListRef,
124
- data: visibleRenders,
125
- renderItem: renderItem,
126
- keyExtractor: keyExtractor,
127
- contentContainerStyle: styles.listContent,
128
- showsVerticalScrollIndicator: true,
129
- initialNumToRender: 10,
130
- maxToRenderPerBatch: 10,
131
- windowSize: 10,
132
- scrollEnabled: false,
133
- ListFooterComponent: renderFooter
134
- });
135
- }
136
-
137
- // Memoize to prevent re-renders from parent state changes
138
- const IsolatedRenderList = exports.IsolatedRenderList = /*#__PURE__*/(0, _react.memo)(IsolatedRenderListInner);
139
- const styles = _reactNative.StyleSheet.create({
140
- listContent: {
141
- paddingTop: 8
142
- },
143
- emptyState: {
144
- alignItems: "center",
145
- paddingVertical: 40
146
- },
147
- emptyTitle: {
148
- color: _sharedUi.buoyColors.text,
149
- fontSize: 14,
150
- fontWeight: "600",
151
- marginTop: 12,
152
- marginBottom: 6
153
- },
154
- emptyText: {
155
- color: _sharedUi.buoyColors.textMuted,
156
- fontSize: 12,
157
- textAlign: "center"
158
- },
159
- lockedBanner: {
160
- flexDirection: "row",
161
- alignItems: "center",
162
- justifyContent: "center",
163
- paddingVertical: 12,
164
- paddingHorizontal: 16,
165
- marginTop: 8,
166
- gap: 8
167
- },
168
- lockedBannerText: {
169
- color: _sharedUi.buoyColors.warning,
170
- fontSize: 13,
171
- fontWeight: "500"
172
- },
173
- lockedBannerSubtext: {
174
- color: _sharedUi.buoyColors.textMuted,
175
- fontSize: 12
176
- }
177
- });
178
- var _default = exports.default = IsolatedRenderList;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.IsolatedRenderList=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_RenderTracker=require("../utils/RenderTracker"),_RenderListItem=require("./RenderListItem"),_sharedUi=require("@buoy-gg/shared-ui"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,s,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(a=t?n:r){if(a.has(e))return a.get(e);a.set(e,i)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?a(i,t,s):i[t]=e[t]);return i})(e,t)}const FREE_TIER_COMPONENT_LIMIT=25;function IsolatedRenderListInner({searchText:e,filters:t,onSelectRender:r,onStatsChange:n,onRendersChange:a,isTracking:s,isPro:i=!1}){const[o,c]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getFilteredRenders(e)),l=(0,_react.useRef)(null);(0,_react.useEffect)(()=>_RenderTracker.RenderTracker.subscribe(()=>{const t=_RenderTracker.RenderTracker.getFilteredRenders(e);c(t),n(_RenderTracker.RenderTracker.getStats()),a?.(t)}),[e,n,a]),(0,_react.useEffect)(()=>{const t=_RenderTracker.RenderTracker.getFilteredRenders(e);c(t),a?.(t)},[e,t,a]);const d=(0,_react.useMemo)(()=>i?o:o.slice(0,25),[o,i]),u=(0,_react.useMemo)(()=>i?0:Math.max(0,o.length-25),[o.length,i]),_=(0,_react.useCallback)(e=>e.id,[]),x=(0,_react.useCallback)(({item:e,index:t})=>(0,_jsxRuntime.jsx)(_RenderListItem.RenderListItem,{render:e,onPress:()=>r(e,t,d)}),[r,d]),R=(0,_react.useCallback)(()=>u<=0?null:(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:[u," more ",1===u?"component":"components"," locked"]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]}),[u]);return 0===o.length?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.emptyState,children:[(0,_jsxRuntime.jsx)(_sharedUi.Activity,{size:32,color:_sharedUi.buoyColors.textMuted}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyTitle,children:"No renders tracked"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyText,children:s?"Component renders will appear here":"Enable tracking to start capturing"})]}):(0,_jsxRuntime.jsx)(_reactNative.FlatList,{ref:l,data:d,renderItem:x,keyExtractor:_,contentContainerStyle:styles.listContent,showsVerticalScrollIndicator:!0,initialNumToRender:10,maxToRenderPerBatch:10,windowSize:10,scrollEnabled:!1,ListFooterComponent:R})}const IsolatedRenderList=exports.IsolatedRenderList=(0,_react.memo)(IsolatedRenderListInner),styles=_reactNative.StyleSheet.create({listContent:{paddingTop:8},emptyState:{alignItems:"center",paddingVertical:40},emptyTitle:{color:_sharedUi.buoyColors.text,fontSize:14,fontWeight:"600",marginTop:12,marginBottom:6},emptyText:{color:_sharedUi.buoyColors.textMuted,fontSize:12,textAlign:"center"},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:16,marginTop:8,gap:8},lockedBannerText:{color:_sharedUi.buoyColors.warning,fontSize:13,fontWeight:"500"},lockedBannerSubtext:{color:_sharedUi.buoyColors.textMuted,fontSize:12}});var _default=exports.default=IsolatedRenderList;