@buoy-gg/highlight-updates 7.0.78 → 7.0.79
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/HighlightFilterView.js +1 -1
- package/lib/commonjs/highlight-updates/components/IsolatedRenderList.js +1 -1
- package/lib/commonjs/highlight-updates/utils/domScreenElements.js +1 -1
- package/lib/module/highlight-updates/components/HighlightFilterView.js +1 -1
- package/lib/module/highlight-updates/components/IsolatedRenderList.js +1 -1
- package/lib/module/highlight-updates/utils/domScreenElements.js +1 -1
- package/lib/web/index.mjs +14 -14
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.HighlightFilterView=HighlightFilterView;exports.default=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _IdentifierBadge=require("./IdentifierBadge");var _testIDs=require("../utils/testIDs");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(n,l){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(t,a){if(!a&&t&&t.__esModule)return t;var s,d,g={__proto__:null,default:t};if(null===t||"object"!=typeof t&&"function"!=typeof t)return g;if(s=a?r:i){if(s.has(t))return s.get(t);s.set(t,g)}for(const u in t)"default"!==u&&{}.hasOwnProperty.call(t,u)&&((d=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(t,u))&&(d.get||d.set)?s(g,u,d):g[u]=t[u]);return g})(n,l)}const getFilterConfig=n=>_IdentifierBadge.IDENTIFIER_CONFIG[n];const FILTER_TYPES=["any","viewType","testID","nativeID","component","accessibilityLabel"];function TypePicker({mode:n,onSelect:l,onCancel:i}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__type-picker",testID:`buoy-highlight-${n}-types`,style:styles.typePicker,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.typePickerRow,children:FILTER_TYPES.map(r=>{const t=getFilterConfig(r);const a=t.icon;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-type-${r.toLowerCase()}`,accessibilityRole:"button",accessibilityLabel:t.label,style:[styles.typeOption,{backgroundColor:t.color+"15",borderColor:t.color+"40"}],onPress:()=>l(r),children:[(0,_jsxRuntime.jsx)(a,{size:14,color:t.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.typeOptionText,{color:t.color}],children:t.label})]},r)})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-types-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:i,style:styles.typePickerCancel,children:(0,_jsxRuntime.jsx)(_sharedUi.X,{size:16,color:_sharedUi.night.color.textTertiary})})]})}function PatternInput({mode:n,type:l,onSubmit:i,onCancel:r}){const[t,a]=(0,_react.useState)("");const s=getFilterConfig(l);const d=()=>{if(t.trim()){i(t.trim())}};return(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__pattern-input",testID:`buoy-highlight-${n}-input-row`,style:styles.patternInputContainer,children:[(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:l,value:"",badgeOnly:true,compact:true}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{testID:`buoy-highlight-${n}-input`,value:t,onChangeText:a,onSubmitEditing:d,placeholder:"Enter pattern...",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.patternInput,autoFocus:true,returnKeyType:"done",autoCorrect:false,autoCapitalize:"none"}),t.trim()&&(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-submit`,accessibilityRole:"button",accessibilityLabel:"Add pattern",onPress:d,style:[styles.addPatternButton,{backgroundColor:s.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addPatternButtonText,{color:s.color}],children:"Add"})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-input-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:r,style:styles.cancelButton,children:(0,_jsxRuntime.jsx)(_sharedUi.X,{size:16,color:_sharedUi.night.color.textTertiary})})]})}function PatternChip({mode:n,pattern:l,onRemove:i}){const r=getFilterConfig(l.type);return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:(0,_testIDs.patternChipTestID)(n,l.type,l.value),accessibilityRole:"button",accessibilityLabel:`${r.label} ${l.value}, tap to remove`,style:[styles.patternChip,{borderColor:r.color+"40"}],onPress:i,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.patternChipBadge,{backgroundColor:r.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.patternChipBadgeText,{color:r.color}],children:r.shortLabel})}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.patternChipValue,numberOfLines:1,children:l.value}),(0,_jsxRuntime.jsx)(_sharedUi.X,{size:12,color:_sharedUi.night.color.textTertiary,style:styles.patternChipX})]})}const ALL_CATEGORY_CONFIG={label:"All",shortLabel:"All",color:_sharedUi.night.color.textSecondary,icon:_sharedUi.Box};function DetectedCategoryBadge({filterType:n,count:l,isSelected:i,onPress:r}){const t=n==="all"?ALL_CATEGORY_CONFIG:getFilterConfig(n);const a=`buoy-highlight-detected-cat-${String(n).toLowerCase()}`;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:a,accessibilityRole:"button",accessibilityLabel:`${t.label}, ${l}`,style:[styles.categoryBadge,{backgroundColor:t.color+"15",borderColor:i?t.color:t.color+"40",borderWidth:i?2:1}],onPress:r,children:[(0,_jsxRuntime.jsx)(t.icon,{size:12,color:t.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.categoryBadgeText,{color:t.color}],children:t.label}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.categoryBadgeCountBubble,{backgroundColor:t.color+"25"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:`${a}-count`,style:[styles.categoryBadgeCount,{color:t.color}],children:l})})]})}const BATCH_SIZE_PRESETS=[{value:20,label:"20"},{value:50,label:"50"},{value:100,label:"100"},{value:150,label:"150"},{value:250,label:"250"},{value:500,label:"500"}];const DEBUG_LOG_LEVEL_PRESETS=[{value:"off",label:"Off",description:"No debug logging"},{value:"minimal",label:"Minimal",description:"Only hook value changes"},{value:"verbose",label:"Verbose",description:"Component + cause + changes"},{value:"all",label:"All",description:"Full fiber dump"}];function HighlightFilterView({filters:n,onFilterChange:l,settings:i,onSettingsChange:r,availableProps:t,activeTab:a}){const[s,d]=(0,_react.useState)(false);const[g,u]=(0,_react.useState)(false);const[b,T]=(0,_react.useState)(null);const[f,m]=(0,_react.useState)(null);const[h,p]=(0,_react.useState)("all");const[c,y]=(0,_react.useState)(null);const v=e=>{switch(e){case"viewType":return t.viewTypes.map(o=>({value:o,type:"viewType"}));case"testID":return t.testIDs.map(o=>({value:o,type:"testID"}));case"nativeID":return t.nativeIDs.map(o=>({value:o,type:"nativeID"}));case"component":return t.componentNames.map(o=>({value:o,type:"component"}));case"accessibilityLabel":return t.accessibilityLabels.map(o=>({value:o,type:"accessibilityLabel"}));case"all":default:return[...t.viewTypes.map(o=>({value:o,type:"viewType"})),...t.testIDs.map(o=>({value:o,type:"testID"})),...t.nativeIDs.map(o=>({value:o,type:"nativeID"})),...t.componentNames.map(o=>({value:o,type:"component"})),...t.accessibilityLabels.map(o=>({value:o,type:"accessibilityLabel"}))]}};const w=v(h);const S=t.viewTypes.length+t.testIDs.length+t.nativeIDs.length+t.componentNames.length+t.accessibilityLabels.length;const I=(0,_react.useCallback)((e,o)=>{const x=[...n.includePatterns,{type:e,value:o}];l({includePatterns:x});T(null)},[n.includePatterns,l]);const j=(0,_react.useCallback)((e,o)=>{const x=[...n.excludePatterns,{type:e,value:o}];l({excludePatterns:x});m(null)},[n.excludePatterns,l]);const D=(0,_react.useCallback)(e=>{const o=n.includePatterns.filter((x,C)=>C!==e);l({includePatterns:o})},[n.includePatterns,l]);const R=(0,_react.useCallback)(e=>{const o=n.excludePatterns.filter((x,C)=>C!==e);l({excludePatterns:o})},[n.excludePatterns,l]);const P=(0,_react.useCallback)((e,o)=>{y({type:e,value:o})},[]);const V=(0,_react.useCallback)(()=>{if(c){I(c.type,c.value);y(null)}},[c,I]);const z=(0,_react.useCallback)(()=>{if(c){j(c.type,c.value);y(null)}},[c,j]);return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.container,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{keyboardShouldPersistTaps:"handled",nativeID:"__rn_buoy__filter-view",testID:"buoy-highlight-filter-scroll",style:styles.scrollView,contentContainerStyle:styles.scrollContent,showsVerticalScrollIndicator:false,children:a==="filters"?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Eye,color:_sharedUi.night.color.accent,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"INCLUDE ONLY"}),n.includePatterns.length>0&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{testID:"buoy-highlight-include-count",count:n.includePatterns.length,color:_sharedUi.night.color.accent})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Show only components matching these patterns. If any are set, components must match at least one."}),n.includePatterns.length>0&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.patternChips,children:n.includePatterns.map((e,o)=>(0,_jsxRuntime.jsx)(PatternChip,{mode:"include",pattern:e,onRemove:()=>D(o)},`${e.type}-${e.value}-${o}`))}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.addPatternRow,children:s?(0,_jsxRuntime.jsx)(TypePicker,{mode:"include",onSelect:e=>{d(false);T(e)},onCancel:()=>d(false)}):b?(0,_jsxRuntime.jsx)(PatternInput,{mode:"include",type:b,onSubmit:e=>I(b,e),onCancel:()=>T(null)}):(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-include-add",accessibilityRole:"button",accessibilityLabel:"Add include pattern",style:[styles.addButton,{borderColor:_sharedUi.night.color.accentBorderStrong}],onPress:()=>d(true),children:[(0,_jsxRuntime.jsx)(_sharedUi.Plus,{size:14,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addButtonText,{color:_sharedUi.night.color.accent}],children:"Add include pattern"})]})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Filter,color:_sharedUi.night.color.accent,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"EXCLUDE"}),n.excludePatterns.length>0&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{testID:"buoy-highlight-exclude-count",count:n.excludePatterns.length,color:_sharedUi.night.color.accent})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Hide components matching these patterns from the list."}),n.excludePatterns.length>0&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.patternChips,children:n.excludePatterns.map((e,o)=>(0,_jsxRuntime.jsx)(PatternChip,{mode:"exclude",pattern:e,onRemove:()=>R(o)},`${e.type}-${e.value}-${o}`))}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.addPatternRow,children:g?(0,_jsxRuntime.jsx)(TypePicker,{mode:"exclude",onSelect:e=>{u(false);m(e)},onCancel:()=>u(false)}):f?(0,_jsxRuntime.jsx)(PatternInput,{mode:"exclude",type:f,onSubmit:e=>j(f,e),onCancel:()=>m(null)}):(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-exclude-add",accessibilityRole:"button",accessibilityLabel:"Add exclude pattern",style:[styles.addButton,{borderColor:_sharedUi.night.color.accentBorderStrong}],onPress:()=>u(true),children:[(0,_jsxRuntime.jsx)(_sharedUi.Plus,{size:14,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addButtonText,{color:_sharedUi.night.color.accent}],children:"Add exclude pattern"})]})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Hash,color:_sharedUi.night.color.warning,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"RENDER COUNT RANGE"}),(n.minRenderCount!==void 0||n.maxRenderCount!==void 0)&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{count:1,color:_sharedUi.night.color.warning})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Show only components with render count in a specific range."}),(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__render-count-range",testID:"buoy-highlight-range",style:styles.renderCountRangeContainer,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputGroup,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountLabel,children:"Min"}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:n.minRenderCount!==void 0?String(n.minRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);if(e===""||e===void 0){l({minRenderCount:void 0})}else if(!isNaN(o)&&o>=0){l({minRenderCount:o})}},testID:"buoy-highlight-range-min",placeholder:"0",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountSeparator,children:"to"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputGroup,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountLabel,children:"Max"}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:n.maxRenderCount!==void 0?String(n.maxRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);if(e===""||e===void 0){l({maxRenderCount:void 0})}else if(!isNaN(o)&&o>=0){l({maxRenderCount:o})}},testID:"buoy-highlight-range-max",placeholder:"\u221E",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]})]}),(n.minRenderCount!==void 0||n.maxRenderCount!==void 0)&&(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-range-clear",accessibilityRole:"button",accessibilityLabel:"Clear range",style:styles.clearRangeButton,onPress:()=>l({minRenderCount:void 0,maxRenderCount:void 0}),children:[(0,_jsxRuntime.jsx)(_sharedUi.X,{size:12,color:_sharedUi.night.color.warning}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.clearRangeButtonText,children:"Clear Range"})]})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Box,color:_sharedUi.night.color.textSecondary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"DETECTED ITEMS"})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Tap an item to quickly add it as an exclude pattern."}),(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{horizontal:true,showsHorizontalScrollIndicator:false,style:styles.categoryBadgeScroll,contentContainerStyle:styles.categoryBadgeScrollContent,children:[S>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"all",count:S,isSelected:h==="all",onPress:()=>p("all")}),t.viewTypes.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"viewType",count:t.viewTypes.length,isSelected:h==="viewType",onPress:()=>p("viewType")}),t.testIDs.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"testID",count:t.testIDs.length,isSelected:h==="testID",onPress:()=>p("testID")}),t.nativeIDs.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"nativeID",count:t.nativeIDs.length,isSelected:h==="nativeID",onPress:()=>p("nativeID")}),t.componentNames.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"component",count:t.componentNames.length,isSelected:h==="component",onPress:()=>p("component")}),t.accessibilityLabels.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"accessibilityLabel",count:t.accessibilityLabels.length,isSelected:h==="accessibilityLabel",onPress:()=>p("accessibilityLabel")})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{nativeID:"__rn_buoy__detected-items",testID:"buoy-highlight-detected",style:styles.detectedItemsContainer,children:w.length>0?(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{keyboardShouldPersistTaps:"handled",testID:"buoy-highlight-detected-scroll",style:styles.detectedItemsScroll,contentContainerStyle:styles.detectedItems,nestedScrollEnabled:true,showsVerticalScrollIndicator:true,children:w.map(e=>{const o=getFilterConfig(e.type);return(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:(0,_testIDs.detectedItemTestID)(e.type,e.value),accessibilityRole:"button",accessibilityLabel:`${o.label} ${e.value}`,style:[styles.detectedItem,{borderColor:o.color+"40"}],onPress:()=>P(e.type,e.value),children:h==="all"?(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:e.type,value:e.value,compact:true,shortLabel:true}):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detectedItemText,numberOfLines:1,children:e.value})},`${e.type}-${e.value}`)})}):(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-detected-empty",style:styles.emptyText,children:"No items detected yet. Start tracking to see components here."})})]}),(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:c!==null,transparent:true,animationType:"fade",onRequestClose:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessible:false,testID:"buoy-highlight-detected-popup-backdrop",style:styles.modalOverlay,onPress:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.View,{accessible:false,testID:"buoy-highlight-detected-popup",style:styles.actionPopup,children:c&&(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.actionPopupHeader,children:(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:c.type,value:c.value,compact:true,shortLabel:true})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.actionPopupButtons,children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-include",accessibilityRole:"button",accessibilityLabel:"Include only",style:[styles.actionPopupButton,styles.actionPopupInclude],onPress:V,children:[(0,_jsxRuntime.jsx)(_sharedUi.Eye,{size:16,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionPopupButtonText,{color:_sharedUi.night.color.accent}],children:"Include Only"})]}),(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-exclude",accessibilityRole:"button",accessibilityLabel:"Exclude",style:[styles.actionPopupButton,styles.actionPopupExclude],onPress:z,children:[(0,_jsxRuntime.jsx)(_sharedUi.Filter,{size:16,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionPopupButtonText,{color:_sharedUi.night.color.accent}],children:"Exclude"})]})]}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-cancel",accessibilityRole:"button",accessibilityLabel:"Cancel",style:styles.actionPopupCancel,onPress:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.actionPopupCancelText,children:"Cancel"})})]})})})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Filter,color:_sharedUi.night.color.textTertiary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"HOW FILTERS WORK"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.howItWorks,children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.howItWorksText,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"Any:"})," Matches against all fields","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"ViewType:"})," Native component class (RCTView, RCTText)","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"testID:"})," Component testID prop","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"Component:"})," React component name from fiber"]})})]})]}):(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Settings,color:_sharedUi.night.color.textTertiary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"SETTINGS"})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingsSection,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingItem,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Show Render Count"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("showRenderCount"),value:i.showRenderCount,onValueChange:e=>{r({showRenderCount:e});if(!e&&i.trackRenderCauses){r({trackRenderCauses:false})}},trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.showRenderCount?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Display render count badge on highlights. Disabling improves performance by skipping count tracking."})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.settingLabel,!i.showRenderCount&&styles.settingLabelDisabled],children:"Track Render Causes"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("trackRenderCauses"),value:i.trackRenderCauses,onValueChange:e=>r({trackRenderCauses:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.warning+"80"},thumbColor:i.trackRenderCauses?_sharedUi.night.color.warning:_sharedUi.night.color.knob,disabled:!i.showRenderCount})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Detect WHY components render (props, hooks, parent re-render).",!i.showRenderCount&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n",'Requires "Show Render Count" to be enabled.']})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.settingLabel,!i.trackRenderCauses&&styles.settingLabelDisabled],children:"Enable Render History"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("enableRenderHistory"),value:i.enableRenderHistory,onValueChange:e=>r({enableRenderHistory:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.enableRenderHistory?_sharedUi.night.color.accent:_sharedUi.night.color.knob,disabled:!i.trackRenderCauses})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Store render events for each component to view in the History tab.",!i.trackRenderCauses&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n",'Requires "Track Render Causes" to be enabled.']})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Debug Log Level"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.settingValue,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-setting-debugLogLevel-value",style:[styles.settingValueText,i.debugLogLevel!=="off"&&{color:_sharedUi.night.color.warning}],children:DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===i.debugLogLevel)?.label||"Off"})})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Control console logging verbosity for render cause detection."}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.batchSizePresets,children:DEBUG_LOG_LEVEL_PRESETS.map(e=>(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:[styles.batchSizePreset,i.debugLogLevel===e.value&&styles.batchSizePresetActive,e.value!=="off"&&i.debugLogLevel===e.value&&{backgroundColor:_sharedUi.night.color.warningSoft,borderColor:_sharedUi.night.color.warning}],onPress:()=>r({debugLogLevel:e.value}),testID:`buoy-highlight-preset-log-${e.value}`,accessibilityRole:"button",accessibilityLabel:`Debug log level ${e.label}`,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.batchSizePresetText,i.debugLogLevel===e.value&&styles.batchSizePresetTextActive,e.value!=="off"&&i.debugLogLevel===e.value&&{color:_sharedUi.night.color.warning}],children:e.label})},e.value))}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescriptionMuted,children:[DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===i.debugLogLevel)?.description,i.debugLogLevel!=="off"&&" \u2022 Check Metro console for logs"]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Batch Size"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.settingValue,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-setting-batchSize-value",style:styles.settingValueText,children:i.batchSize})})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Maximum components to highlight per render update. Higher values capture more re-renders but may impact performance on complex screens."}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.batchSizePresets,children:BATCH_SIZE_PRESETS.map(e=>(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:[styles.batchSizePreset,i.batchSize===e.value&&styles.batchSizePresetActive],onPress:()=>r({batchSize:e.value}),testID:`buoy-highlight-preset-batch-${e.value}`,accessibilityRole:"button",accessibilityLabel:`Batch size ${e.label}`,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.batchSizePresetText,i.batchSize===e.value&&styles.batchSizePresetTextActive],children:e.label})},e.value))})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Show host views"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("showHostViews"),value:!!i.showHostViews,onValueChange:e=>r({showHostViews:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.showHostViews?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Include anonymous View / RCTView / Text hosts. Off by default so the list is named composites (what actually re-rendered)."})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Highlight Dev Tools"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("excludeDevTools"),value:!i.excludeDevTools,onValueChange:e=>r({excludeDevTools:!e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:!i.excludeDevTools?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Show re-render highlights on Buoy dev tools (floating menu, modals, etc.). Useful for optimizing the dev tools themselves.",!i.excludeDevTools&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n","The highlight overlay is always excluded to prevent infinite loops."]})]})]})]})]})})})})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:"transparent"},scrollView:{flex:1},scrollContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:32},section:{backgroundColor:_sharedUi.night.color.surface,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,marginBottom:12,overflow:"hidden"},sectionDescription:{fontSize:11,color:_sharedUi.night.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:16},patternChips:{flexDirection:"row",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:12},patternChip:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:4,paddingLeft:4,paddingRight:6,maxWidth:"100%",gap:4},patternChipBadge:{paddingVertical:2,paddingHorizontal:5,borderRadius:4},patternChipBadgeText:{fontSize:9,fontWeight:"700"},patternChipValue:{fontSize:11,color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont,flexShrink:1},patternChipX:{marginLeft:2},addPatternRow:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},addButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1,borderStyle:"dashed",gap:6},addButtonText:{fontSize:12,fontWeight:"500"},typePicker:{flexDirection:"row",alignItems:"center",gap:8},typePickerRow:{flex:1,flexDirection:"row",flexWrap:"wrap",gap:8},typeOption:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,borderWidth:1,backgroundColor:_sharedUi.night.color.surfaceElevated,gap:6},typeOptionText:{fontSize:11,fontWeight:"600"},typePickerCancel:{padding:8},patternInputContainer:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,paddingLeft:4,paddingRight:8,paddingVertical:4,gap:4},patternInput:{flex:1,fontSize:12,color:_sharedUi.night.color.text,paddingVertical:6,paddingHorizontal:4},addPatternButton:{paddingVertical:6,paddingHorizontal:10,borderRadius:4},addPatternButtonText:{fontSize:11,fontWeight:"600"},cancelButton:{padding:4},categoryBadgeScroll:{marginTop:12},categoryBadgeScrollContent:{paddingHorizontal:16,gap:8},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,borderWidth:1,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCountBubble:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCount:{fontSize:10,fontWeight:"600"},detectedItemsContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},detectedItemsScroll:{maxHeight:200},detectedItems:{flexDirection:"row",flexWrap:"wrap",gap:8},detectedItem:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:6,paddingHorizontal:10,gap:6},detectedItemText:{fontSize:11,color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont},emptyText:{fontSize:11,color:_sharedUi.night.color.textTertiary,fontStyle:"italic",textAlign:"center",paddingVertical:16,paddingHorizontal:16},howItWorks:{paddingHorizontal:16,paddingVertical:12},howItWorksText:{fontSize:11,color:_sharedUi.night.color.textTertiary,lineHeight:18,fontFamily:_sharedUi.monoFont},howItWorksBold:{fontWeight:"700",color:_sharedUi.night.color.textSecondary},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:32},actionPopup:{backgroundColor:_sharedUi.night.color.surface,borderRadius:12,borderWidth:1,borderColor:_sharedUi.night.color.border,width:"100%",maxWidth:300,overflow:"hidden"},actionPopupHeader:{padding:16,borderBottomWidth:1,borderBottomColor:_sharedUi.night.color.separator,alignItems:"center"},actionPopupButtons:{flexDirection:"row",padding:12,gap:8},actionPopupButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:12,borderRadius:8,gap:8},actionPopupInclude:{backgroundColor:_sharedUi.night.color.accentSoft},actionPopupExclude:{backgroundColor:_sharedUi.night.color.accentSoft},actionPopupButtonText:{fontSize:13,fontWeight:"600"},actionPopupCancel:{padding:12,borderTopWidth:1,borderTopColor:_sharedUi.night.color.separator,alignItems:"center"},actionPopupCancelText:{fontSize:13,color:_sharedUi.night.color.textTertiary,fontWeight:"500"},settingsSection:{paddingHorizontal:16,paddingTop:8,paddingBottom:16},settingItem:{gap:8},settingItemSpaced:{marginTop:16,paddingTop:16,borderTopWidth:1,borderTopColor:_sharedUi.night.color.separator},settingHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},settingLabel:{fontSize:13,fontWeight:"600",color:_sharedUi.night.color.text},settingValue:{backgroundColor:_sharedUi.night.color.fillSecondary,paddingHorizontal:10,paddingVertical:4,borderRadius:6},settingValueText:{fontSize:12,fontWeight:"700",color:_sharedUi.night.color.textTertiary,fontFamily:_sharedUi.monoFont},settingDescription:{fontSize:11,color:_sharedUi.night.color.textSecondary,lineHeight:16},settingDescriptionMuted:{fontSize:10,color:_sharedUi.night.color.textTertiary,lineHeight:14,marginTop:4,fontStyle:"italic"},settingLabelDisabled:{color:_sharedUi.night.color.textTertiary},settingWarning:{color:_sharedUi.night.color.warning,fontWeight:"500"},batchSizePresets:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:4},batchSizePreset:{paddingVertical:8,paddingHorizontal:14,borderRadius:6,backgroundColor:_sharedUi.night.color.surfaceElevated,borderWidth:1,borderColor:_sharedUi.night.color.border},batchSizePresetActive:{backgroundColor:_sharedUi.night.color.fillSecondary,borderColor:_sharedUi.night.color.fillTertiary},batchSizePresetText:{fontSize:12,fontWeight:"500",color:_sharedUi.night.color.textSecondary,fontFamily:_sharedUi.monoFont},batchSizePresetTextActive:{color:_sharedUi.night.color.textTertiary,fontWeight:"700"},renderCountRangeContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,gap:12},renderCountInputRow:{flexDirection:"row",alignItems:"center",gap:12},renderCountInputGroup:{flex:1,gap:4},renderCountLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.night.color.textTertiary,textTransform:"uppercase",letterSpacing:.5},renderCountInput:{backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,paddingVertical:10,paddingHorizontal:12,fontSize:14,fontWeight:"600",color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont,textAlign:"center"},renderCountSeparator:{fontSize:12,color:_sharedUi.night.color.textTertiary,marginTop:18},clearRangeButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,backgroundColor:_sharedUi.night.color.warningSoft,borderWidth:1,borderColor:_sharedUi.night.color.warning+"40",gap:6,alignSelf:"center"},clearRangeButtonText:{fontSize:11,fontWeight:"600",color:_sharedUi.night.color.warning}});var _default=exports.default=HighlightFilterView;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.HighlightFilterView=HighlightFilterView;exports.default=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _IdentifierBadge=require("./IdentifierBadge");var _testIDs=require("../utils/testIDs");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(n,l){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(t,a){if(!a&&t&&t.__esModule)return t;var s,d,g={__proto__:null,default:t};if(null===t||"object"!=typeof t&&"function"!=typeof t)return g;if(s=a?r:i){if(s.has(t))return s.get(t);s.set(t,g)}for(const u in t)"default"!==u&&{}.hasOwnProperty.call(t,u)&&((d=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(t,u))&&(d.get||d.set)?s(g,u,d):g[u]=t[u]);return g})(n,l)}const getFilterConfig=n=>_IdentifierBadge.IDENTIFIER_CONFIG[n];const FILTER_TYPES=["any","viewType","testID","nativeID","component","accessibilityLabel"];function TypePicker({mode:n,onSelect:l,onCancel:i}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__type-picker",testID:`buoy-highlight-${n}-types`,style:styles.typePicker,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.typePickerRow,children:FILTER_TYPES.map(r=>{const t=getFilterConfig(r);const a=t.icon;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-type-${r.toLowerCase()}`,accessibilityRole:"button",accessibilityLabel:t.label,style:[styles.typeOption,{backgroundColor:t.color+"15",borderColor:t.color+"40"}],onPress:()=>l(r),children:[(0,_jsxRuntime.jsx)(a,{size:14,color:t.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.typeOptionText,{color:t.color}],children:t.label})]},r)})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-types-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:i,style:styles.typePickerCancel,children:(0,_jsxRuntime.jsx)(_sharedUi.X,{size:16,color:_sharedUi.night.color.textTertiary})})]})}function PatternInput({mode:n,type:l,onSubmit:i,onCancel:r}){const[t,a]=(0,_react.useState)("");const s=getFilterConfig(l);const d=()=>{if(t.trim()){i(t.trim())}};return(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__pattern-input",testID:`buoy-highlight-${n}-input-row`,style:styles.patternInputContainer,children:[(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:l,value:"",badgeOnly:true,compact:true}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{testID:`buoy-highlight-${n}-input`,value:t,onChangeText:a,onSubmitEditing:d,placeholder:"Enter pattern...",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.patternInput,autoFocus:true,returnKeyType:"done",autoCorrect:false,autoCapitalize:"none"}),t.trim()&&(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-submit`,accessibilityRole:"button",accessibilityLabel:"Add pattern",onPress:d,style:[styles.addPatternButton,{backgroundColor:s.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addPatternButtonText,{color:s.color}],children:"Add"})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:`buoy-highlight-${n}-input-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:r,style:styles.cancelButton,children:(0,_jsxRuntime.jsx)(_sharedUi.X,{size:16,color:_sharedUi.night.color.textTertiary})})]})}function PatternChip({mode:n,pattern:l,onRemove:i}){const r=getFilterConfig(l.type);return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:(0,_testIDs.patternChipTestID)(n,l.type,l.value),accessibilityRole:"button",accessibilityLabel:`${r.label} ${l.value}, tap to remove`,style:[styles.patternChip,{borderColor:r.color+"40"}],onPress:i,activeOpacity:.7,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.patternChipBadge,{backgroundColor:r.color+"20"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.patternChipBadgeText,{color:r.color}],children:r.shortLabel})}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.patternChipValue,numberOfLines:1,children:l.value}),(0,_jsxRuntime.jsx)(_sharedUi.X,{size:12,color:_sharedUi.night.color.textTertiary,style:styles.patternChipX})]})}const ALL_CATEGORY_CONFIG={label:"All",shortLabel:"All",color:_sharedUi.night.color.textSecondary,icon:_sharedUi.Box};function DetectedCategoryBadge({filterType:n,count:l,isSelected:i,onPress:r}){const t=n==="all"?ALL_CATEGORY_CONFIG:getFilterConfig(n);const a=`buoy-highlight-detected-cat-${String(n).toLowerCase()}`;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:a,accessibilityRole:"button",accessibilityLabel:`${t.label}, ${l}`,style:[styles.categoryBadge,{backgroundColor:t.color+"15",borderColor:i?t.color:t.color+"40",borderWidth:i?2:1}],onPress:r,children:[(0,_jsxRuntime.jsx)(t.icon,{size:12,color:t.color}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.categoryBadgeText,{color:t.color}],children:t.label}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.categoryBadgeCountBubble,{backgroundColor:t.color+"25"}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:`${a}-count`,style:[styles.categoryBadgeCount,{color:t.color}],children:l})})]})}const BATCH_SIZE_PRESETS=[{value:20,label:"20"},{value:50,label:"50"},{value:100,label:"100"},{value:150,label:"150"},{value:250,label:"250"},{value:500,label:"500"}];const DEBUG_LOG_LEVEL_PRESETS=[{value:"off",label:"Off",description:"No debug logging"},{value:"minimal",label:"Minimal",description:"Only hook value changes"},{value:"verbose",label:"Verbose",description:"Component + cause + changes"},{value:"all",label:"All",description:"Full fiber dump"}];function HighlightFilterView({filters:n,onFilterChange:l,settings:i,onSettingsChange:r,availableProps:t,activeTab:a}){const[s,d]=(0,_react.useState)(false);const[g,u]=(0,_react.useState)(false);const[b,T]=(0,_react.useState)(null);const[f,m]=(0,_react.useState)(null);const[h,p]=(0,_react.useState)("all");const[c,y]=(0,_react.useState)(null);const v=e=>{switch(e){case"viewType":return t.viewTypes.map(o=>({value:o,type:"viewType"}));case"testID":return t.testIDs.map(o=>({value:o,type:"testID"}));case"nativeID":return t.nativeIDs.map(o=>({value:o,type:"nativeID"}));case"component":return t.componentNames.map(o=>({value:o,type:"component"}));case"accessibilityLabel":return t.accessibilityLabels.map(o=>({value:o,type:"accessibilityLabel"}));case"all":default:return[...t.viewTypes.map(o=>({value:o,type:"viewType"})),...t.testIDs.map(o=>({value:o,type:"testID"})),...t.nativeIDs.map(o=>({value:o,type:"nativeID"})),...t.componentNames.map(o=>({value:o,type:"component"})),...t.accessibilityLabels.map(o=>({value:o,type:"accessibilityLabel"}))]}};const w=v(h);const S=t.viewTypes.length+t.testIDs.length+t.nativeIDs.length+t.componentNames.length+t.accessibilityLabels.length;const I=(0,_react.useCallback)((e,o)=>{const x=[...n.includePatterns,{type:e,value:o}];l({includePatterns:x});T(null)},[n.includePatterns,l]);const j=(0,_react.useCallback)((e,o)=>{const x=[...n.excludePatterns,{type:e,value:o}];l({excludePatterns:x});m(null)},[n.excludePatterns,l]);const D=(0,_react.useCallback)(e=>{const o=n.includePatterns.filter((x,C)=>C!==e);l({includePatterns:o})},[n.includePatterns,l]);const R=(0,_react.useCallback)(e=>{const o=n.excludePatterns.filter((x,C)=>C!==e);l({excludePatterns:o})},[n.excludePatterns,l]);const P=(0,_react.useCallback)((e,o)=>{y({type:e,value:o})},[]);const V=(0,_react.useCallback)(()=>{if(c){I(c.type,c.value);y(null)}},[c,I]);const k=(0,_react.useCallback)(()=>{if(c){j(c.type,c.value);y(null)}},[c,j]);return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.container,children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{keyboardShouldPersistTaps:"handled",nativeID:"__rn_buoy__filter-view",testID:"buoy-highlight-filter-scroll",style:styles.scrollView,contentContainerStyle:styles.scrollContent,showsVerticalScrollIndicator:false,children:a==="filters"?(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Eye,color:_sharedUi.night.color.accent,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"INCLUDE ONLY"}),n.includePatterns.length>0&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{testID:"buoy-highlight-include-count",count:n.includePatterns.length,color:_sharedUi.night.color.accent})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Show only components matching these patterns. If any are set, components must match at least one."}),n.includePatterns.length>0&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.patternChips,children:n.includePatterns.map((e,o)=>(0,_jsxRuntime.jsx)(PatternChip,{mode:"include",pattern:e,onRemove:()=>D(o)},`${e.type}-${e.value}-${o}`))}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.addPatternRow,children:s?(0,_jsxRuntime.jsx)(TypePicker,{mode:"include",onSelect:e=>{d(false);T(e)},onCancel:()=>d(false)}):b?(0,_jsxRuntime.jsx)(PatternInput,{mode:"include",type:b,onSubmit:e=>I(b,e),onCancel:()=>T(null)}):(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-include-add",accessibilityRole:"button",accessibilityLabel:"Add include pattern",style:[styles.addButton,{borderColor:_sharedUi.night.color.accentBorderStrong}],onPress:()=>d(true),children:[(0,_jsxRuntime.jsx)(_sharedUi.Plus,{size:14,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addButtonText,{color:_sharedUi.night.color.accent}],children:"Add include pattern"})]})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Filter,color:_sharedUi.night.color.accent,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"EXCLUDE"}),n.excludePatterns.length>0&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{testID:"buoy-highlight-exclude-count",count:n.excludePatterns.length,color:_sharedUi.night.color.accent})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Hide components matching these patterns from the list."}),n.excludePatterns.length>0&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.patternChips,children:n.excludePatterns.map((e,o)=>(0,_jsxRuntime.jsx)(PatternChip,{mode:"exclude",pattern:e,onRemove:()=>R(o)},`${e.type}-${e.value}-${o}`))}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.addPatternRow,children:g?(0,_jsxRuntime.jsx)(TypePicker,{mode:"exclude",onSelect:e=>{u(false);m(e)},onCancel:()=>u(false)}):f?(0,_jsxRuntime.jsx)(PatternInput,{mode:"exclude",type:f,onSubmit:e=>j(f,e),onCancel:()=>m(null)}):(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-exclude-add",accessibilityRole:"button",accessibilityLabel:"Add exclude pattern",style:[styles.addButton,{borderColor:_sharedUi.night.color.accentBorderStrong}],onPress:()=>u(true),children:[(0,_jsxRuntime.jsx)(_sharedUi.Plus,{size:14,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addButtonText,{color:_sharedUi.night.color.accent}],children:"Add exclude pattern"})]})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Hash,color:_sharedUi.night.color.warning,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"RENDER COUNT RANGE"}),(n.minRenderCount!==void 0||n.maxRenderCount!==void 0)&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{count:1,color:_sharedUi.night.color.warning})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Show only components with render count in a specific range."}),(0,_jsxRuntime.jsxs)(_reactNative.View,{nativeID:"__rn_buoy__render-count-range",testID:"buoy-highlight-range",style:styles.renderCountRangeContainer,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputGroup,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountLabel,children:"Min"}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:n.minRenderCount!==void 0?String(n.minRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);if(e===""||e===void 0){l({minRenderCount:void 0})}else if(!isNaN(o)&&o>=0){l({minRenderCount:o})}},testID:"buoy-highlight-range-min",placeholder:"0",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountSeparator,children:"to"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.renderCountInputGroup,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.renderCountLabel,children:"Max"}),(0,_jsxRuntime.jsx)(_reactNative.TextInput,{value:n.maxRenderCount!==void 0?String(n.maxRenderCount):"",onChangeText:e=>{const o=parseInt(e,10);if(e===""||e===void 0){l({maxRenderCount:void 0})}else if(!isNaN(o)&&o>=0){l({maxRenderCount:o})}},testID:"buoy-highlight-range-max",placeholder:"\u221E",placeholderTextColor:_sharedUi.night.color.placeholder,style:styles.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]})]}),(n.minRenderCount!==void 0||n.maxRenderCount!==void 0)&&(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-range-clear",accessibilityRole:"button",accessibilityLabel:"Clear range",style:styles.clearRangeButton,onPress:()=>l({minRenderCount:void 0,maxRenderCount:void 0}),children:[(0,_jsxRuntime.jsx)(_sharedUi.X,{size:12,color:_sharedUi.night.color.warning}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.clearRangeButtonText,children:"Clear Range"})]})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Box,color:_sharedUi.night.color.textSecondary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"DETECTED ITEMS"})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionDescription,children:"Tap an item to quickly add it as an exclude pattern."}),(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{keyboardShouldPersistTaps:"handled",horizontal:true,showsHorizontalScrollIndicator:false,style:styles.categoryBadgeScroll,contentContainerStyle:styles.categoryBadgeScrollContent,children:[S>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"all",count:S,isSelected:h==="all",onPress:()=>p("all")}),t.viewTypes.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"viewType",count:t.viewTypes.length,isSelected:h==="viewType",onPress:()=>p("viewType")}),t.testIDs.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"testID",count:t.testIDs.length,isSelected:h==="testID",onPress:()=>p("testID")}),t.nativeIDs.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"nativeID",count:t.nativeIDs.length,isSelected:h==="nativeID",onPress:()=>p("nativeID")}),t.componentNames.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"component",count:t.componentNames.length,isSelected:h==="component",onPress:()=>p("component")}),t.accessibilityLabels.length>0&&(0,_jsxRuntime.jsx)(DetectedCategoryBadge,{filterType:"accessibilityLabel",count:t.accessibilityLabels.length,isSelected:h==="accessibilityLabel",onPress:()=>p("accessibilityLabel")})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{nativeID:"__rn_buoy__detected-items",testID:"buoy-highlight-detected",style:styles.detectedItemsContainer,children:w.length>0?(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{keyboardShouldPersistTaps:"handled",testID:"buoy-highlight-detected-scroll",style:styles.detectedItemsScroll,contentContainerStyle:styles.detectedItems,nestedScrollEnabled:true,showsVerticalScrollIndicator:true,children:w.map(e=>{const o=getFilterConfig(e.type);return(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:(0,_testIDs.detectedItemTestID)(e.type,e.value),accessibilityRole:"button",accessibilityLabel:`${o.label} ${e.value}`,style:[styles.detectedItem,{borderColor:o.color+"40"}],onPress:()=>P(e.type,e.value),children:h==="all"?(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:e.type,value:e.value,compact:true,shortLabel:true}):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.detectedItemText,numberOfLines:1,children:e.value})},`${e.type}-${e.value}`)})}):(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-detected-empty",style:styles.emptyText,children:"No items detected yet. Start tracking to see components here."})})]}),(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:c!==null,transparent:true,animationType:"fade",onRequestClose:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessible:false,testID:"buoy-highlight-detected-popup-backdrop",style:styles.modalOverlay,onPress:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.View,{accessible:false,testID:"buoy-highlight-detected-popup",style:styles.actionPopup,children:c&&(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.actionPopupHeader,children:(0,_jsxRuntime.jsx)(_IdentifierBadge.IdentifierBadge,{type:c.type,value:c.value,compact:true,shortLabel:true})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.actionPopupButtons,children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-include",accessibilityRole:"button",accessibilityLabel:"Include only",style:[styles.actionPopupButton,styles.actionPopupInclude],onPress:V,children:[(0,_jsxRuntime.jsx)(_sharedUi.Eye,{size:16,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionPopupButtonText,{color:_sharedUi.night.color.accent}],children:"Include Only"})]}),(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-exclude",accessibilityRole:"button",accessibilityLabel:"Exclude",style:[styles.actionPopupButton,styles.actionPopupExclude],onPress:k,children:[(0,_jsxRuntime.jsx)(_sharedUi.Filter,{size:16,color:_sharedUi.night.color.accent}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionPopupButtonText,{color:_sharedUi.night.color.accent}],children:"Exclude"})]})]}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:"buoy-highlight-detected-popup-cancel",accessibilityRole:"button",accessibilityLabel:"Cancel",style:styles.actionPopupCancel,onPress:()=>y(null),children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.actionPopupCancelText,children:"Cancel"})})]})})})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Filter,color:_sharedUi.night.color.textTertiary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"HOW FILTERS WORK"})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.howItWorks,children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.howItWorksText,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"Any:"})," Matches against all fields","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"ViewType:"})," Native component class (RCTView, RCTText)","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"testID:"})," Component testID prop","\n",(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksBold,children:"Component:"})," React component name from fiber"]})})]})]}):(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Icon,{icon:_sharedUi.Settings,color:_sharedUi.night.color.textTertiary,size:12}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:"SETTINGS"})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingsSection,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingItem,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Show Render Count"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("showRenderCount"),value:i.showRenderCount,onValueChange:e=>{r({showRenderCount:e});if(!e&&i.trackRenderCauses){r({trackRenderCauses:false})}},trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.showRenderCount?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Display render count badge on highlights. Disabling improves performance by skipping count tracking."})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.settingLabel,!i.showRenderCount&&styles.settingLabelDisabled],children:"Track Render Causes"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("trackRenderCauses"),value:i.trackRenderCauses,onValueChange:e=>r({trackRenderCauses:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.warning+"80"},thumbColor:i.trackRenderCauses?_sharedUi.night.color.warning:_sharedUi.night.color.knob,disabled:!i.showRenderCount})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Detect WHY components render (props, hooks, parent re-render).",!i.showRenderCount&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n",'Requires "Show Render Count" to be enabled.']})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.settingLabel,!i.trackRenderCauses&&styles.settingLabelDisabled],children:"Enable Render History"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("enableRenderHistory"),value:i.enableRenderHistory,onValueChange:e=>r({enableRenderHistory:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.enableRenderHistory?_sharedUi.night.color.accent:_sharedUi.night.color.knob,disabled:!i.trackRenderCauses})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Store render events for each component to view in the History tab.",!i.trackRenderCauses&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n",'Requires "Track Render Causes" to be enabled.']})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Debug Log Level"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.settingValue,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-setting-debugLogLevel-value",style:[styles.settingValueText,i.debugLogLevel!=="off"&&{color:_sharedUi.night.color.warning}],children:DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===i.debugLogLevel)?.label||"Off"})})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Control console logging verbosity for render cause detection."}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.batchSizePresets,children:DEBUG_LOG_LEVEL_PRESETS.map(e=>(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:[styles.batchSizePreset,i.debugLogLevel===e.value&&styles.batchSizePresetActive,e.value!=="off"&&i.debugLogLevel===e.value&&{backgroundColor:_sharedUi.night.color.warningSoft,borderColor:_sharedUi.night.color.warning}],onPress:()=>r({debugLogLevel:e.value}),testID:`buoy-highlight-preset-log-${e.value}`,accessibilityRole:"button",accessibilityLabel:`Debug log level ${e.label}`,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.batchSizePresetText,i.debugLogLevel===e.value&&styles.batchSizePresetTextActive,e.value!=="off"&&i.debugLogLevel===e.value&&{color:_sharedUi.night.color.warning}],children:e.label})},e.value))}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescriptionMuted,children:[DEBUG_LOG_LEVEL_PRESETS.find(e=>e.value===i.debugLogLevel)?.description,i.debugLogLevel!=="off"&&" \u2022 Check Metro console for logs"]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Batch Size"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.settingValue,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:"buoy-highlight-setting-batchSize-value",style:styles.settingValueText,children:i.batchSize})})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Maximum components to highlight per render update. Higher values capture more re-renders but may impact performance on complex screens."}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.batchSizePresets,children:BATCH_SIZE_PRESETS.map(e=>(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:[styles.batchSizePreset,i.batchSize===e.value&&styles.batchSizePresetActive],onPress:()=>r({batchSize:e.value}),testID:`buoy-highlight-preset-batch-${e.value}`,accessibilityRole:"button",accessibilityLabel:`Batch size ${e.label}`,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.batchSizePresetText,i.batchSize===e.value&&styles.batchSizePresetTextActive],children:e.label})},e.value))})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Show host views"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("showHostViews"),value:!!i.showHostViews,onValueChange:e=>r({showHostViews:e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:i.showHostViews?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingDescription,children:"Include anonymous View / RCTView / Text hosts. Off by default so the list is named composites (what actually re-rendered)."})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.settingItem,styles.settingItemSpaced],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.settingHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.settingLabel,children:"Highlight Dev Tools"}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{testID:(0,_testIDs.settingTestID)("excludeDevTools"),value:!i.excludeDevTools,onValueChange:e=>r({excludeDevTools:!e}),trackColor:{false:_sharedUi.night.color.surfaceElevated,true:_sharedUi.night.color.accent+"80"},thumbColor:!i.excludeDevTools?_sharedUi.night.color.accent:_sharedUi.night.color.knob})]}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingDescription,children:["Show re-render highlights on Buoy dev tools (floating menu, modals, etc.). Useful for optimizing the dev tools themselves.",!i.excludeDevTools&&(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.settingWarning,children:["\n","The highlight overlay is always excluded to prevent infinite loops."]})]})]})]})]})})})})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:"transparent"},scrollView:{flex:1},scrollContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:32},section:{backgroundColor:_sharedUi.night.color.surface,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,marginBottom:12,overflow:"hidden"},sectionDescription:{fontSize:11,color:_sharedUi.night.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:16},patternChips:{flexDirection:"row",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:12},patternChip:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:4,paddingLeft:4,paddingRight:6,maxWidth:"100%",gap:4},patternChipBadge:{paddingVertical:2,paddingHorizontal:5,borderRadius:4},patternChipBadgeText:{fontSize:9,fontWeight:"700"},patternChipValue:{fontSize:11,color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont,flexShrink:1},patternChipX:{marginLeft:2},addPatternRow:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},addButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1,borderStyle:"dashed",gap:6},addButtonText:{fontSize:12,fontWeight:"500"},typePicker:{flexDirection:"row",alignItems:"center",gap:8},typePickerRow:{flex:1,flexDirection:"row",flexWrap:"wrap",gap:8},typeOption:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,borderWidth:1,backgroundColor:_sharedUi.night.color.surfaceElevated,gap:6},typeOptionText:{fontSize:11,fontWeight:"600"},typePickerCancel:{padding:8},patternInputContainer:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,paddingLeft:4,paddingRight:8,paddingVertical:4,gap:4},patternInput:{flex:1,fontSize:12,color:_sharedUi.night.color.text,paddingVertical:6,paddingHorizontal:4},addPatternButton:{paddingVertical:6,paddingHorizontal:10,borderRadius:4},addPatternButtonText:{fontSize:11,fontWeight:"600"},cancelButton:{padding:4},categoryBadgeScroll:{marginTop:12},categoryBadgeScrollContent:{paddingHorizontal:16,gap:8},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,borderWidth:1,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCountBubble:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCount:{fontSize:10,fontWeight:"600"},detectedItemsContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},detectedItemsScroll:{maxHeight:200},detectedItems:{flexDirection:"row",flexWrap:"wrap",gap:8},detectedItem:{flexDirection:"row",alignItems:"center",backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:6,paddingHorizontal:10,gap:6},detectedItemText:{fontSize:11,color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont},emptyText:{fontSize:11,color:_sharedUi.night.color.textTertiary,fontStyle:"italic",textAlign:"center",paddingVertical:16,paddingHorizontal:16},howItWorks:{paddingHorizontal:16,paddingVertical:12},howItWorksText:{fontSize:11,color:_sharedUi.night.color.textTertiary,lineHeight:18,fontFamily:_sharedUi.monoFont},howItWorksBold:{fontWeight:"700",color:_sharedUi.night.color.textSecondary},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:32},actionPopup:{backgroundColor:_sharedUi.night.color.surface,borderRadius:12,borderWidth:1,borderColor:_sharedUi.night.color.border,width:"100%",maxWidth:300,overflow:"hidden"},actionPopupHeader:{padding:16,borderBottomWidth:1,borderBottomColor:_sharedUi.night.color.separator,alignItems:"center"},actionPopupButtons:{flexDirection:"row",padding:12,gap:8},actionPopupButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:12,borderRadius:8,gap:8},actionPopupInclude:{backgroundColor:_sharedUi.night.color.accentSoft},actionPopupExclude:{backgroundColor:_sharedUi.night.color.accentSoft},actionPopupButtonText:{fontSize:13,fontWeight:"600"},actionPopupCancel:{padding:12,borderTopWidth:1,borderTopColor:_sharedUi.night.color.separator,alignItems:"center"},actionPopupCancelText:{fontSize:13,color:_sharedUi.night.color.textTertiary,fontWeight:"500"},settingsSection:{paddingHorizontal:16,paddingTop:8,paddingBottom:16},settingItem:{gap:8},settingItemSpaced:{marginTop:16,paddingTop:16,borderTopWidth:1,borderTopColor:_sharedUi.night.color.separator},settingHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},settingLabel:{fontSize:13,fontWeight:"600",color:_sharedUi.night.color.text},settingValue:{backgroundColor:_sharedUi.night.color.fillSecondary,paddingHorizontal:10,paddingVertical:4,borderRadius:6},settingValueText:{fontSize:12,fontWeight:"700",color:_sharedUi.night.color.textTertiary,fontFamily:_sharedUi.monoFont},settingDescription:{fontSize:11,color:_sharedUi.night.color.textSecondary,lineHeight:16},settingDescriptionMuted:{fontSize:10,color:_sharedUi.night.color.textTertiary,lineHeight:14,marginTop:4,fontStyle:"italic"},settingLabelDisabled:{color:_sharedUi.night.color.textTertiary},settingWarning:{color:_sharedUi.night.color.warning,fontWeight:"500"},batchSizePresets:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:4},batchSizePreset:{paddingVertical:8,paddingHorizontal:14,borderRadius:6,backgroundColor:_sharedUi.night.color.surfaceElevated,borderWidth:1,borderColor:_sharedUi.night.color.border},batchSizePresetActive:{backgroundColor:_sharedUi.night.color.fillSecondary,borderColor:_sharedUi.night.color.fillTertiary},batchSizePresetText:{fontSize:12,fontWeight:"500",color:_sharedUi.night.color.textSecondary,fontFamily:_sharedUi.monoFont},batchSizePresetTextActive:{color:_sharedUi.night.color.textTertiary,fontWeight:"700"},renderCountRangeContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,gap:12},renderCountInputRow:{flexDirection:"row",alignItems:"center",gap:12},renderCountInputGroup:{flex:1,gap:4},renderCountLabel:{fontSize:10,fontWeight:"600",color:_sharedUi.night.color.textTertiary,textTransform:"uppercase",letterSpacing:.5},renderCountInput:{backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border,paddingVertical:10,paddingHorizontal:12,fontSize:14,fontWeight:"600",color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont,textAlign:"center"},renderCountSeparator:{fontSize:12,color:_sharedUi.night.color.textTertiary,marginTop:18},clearRangeButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,backgroundColor:_sharedUi.night.color.warningSoft,borderWidth:1,borderColor:_sharedUi.night.color.warning+"40",gap:6,alignSelf:"center"},clearRangeButtonText:{fontSize:11,fontWeight:"600",color:_sharedUi.night.color.warning}});var _default=exports.default=HighlightFilterView;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.IsolatedRenderList=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _RenderTracker=require("../utils/RenderTracker");var _RenderListItem=require("./RenderListItem");var _sharedUi=require("@buoy-gg/shared-ui");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(n,f){if("function"==typeof WeakMap)var l=new WeakMap,c=new WeakMap;return(_interopRequireWildcard=function(e,d){if(!d&&e&&e.__esModule)return e;var o,r,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(o=d?c:l){if(o.has(e))return o.get(e);o.set(e,s)}for(const i in e)"default"!==i&&{}.hasOwnProperty.call(e,i)&&((r=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,i))&&(r.get||r.set)?o(s,i,r):s[i]=e[i]);return s})(n,f)}function IsolatedRenderListInner({searchText:n,filters:f,onSelectRender:l,onStatsChange:c,onRendersChange:e,isTracking:d,isPro:o=false}){const[r,s]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getFilteredRenders(n));const i=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const t=_RenderTracker.RenderTracker.subscribe(()=>{const a=_RenderTracker.RenderTracker.getFilteredRenders(n);s(a);c(_RenderTracker.RenderTracker.getStats());e?.(a)});return t},[n,c,e]);(0,_react.useEffect)(()=>{const t=_RenderTracker.RenderTracker.getFilteredRenders(n);s(t);e?.(t)},[n,f,e]);const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.IsolatedRenderList=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _RenderTracker=require("../utils/RenderTracker");var _RenderListItem=require("./RenderListItem");var _sharedUi=require("@buoy-gg/shared-ui");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(n,f){if("function"==typeof WeakMap)var l=new WeakMap,c=new WeakMap;return(_interopRequireWildcard=function(e,d){if(!d&&e&&e.__esModule)return e;var o,r,s={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return s;if(o=d?c:l){if(o.has(e))return o.get(e);o.set(e,s)}for(const i in e)"default"!==i&&{}.hasOwnProperty.call(e,i)&&((r=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,i))&&(r.get||r.set)?o(s,i,r):s[i]=e[i]);return s})(n,f)}function IsolatedRenderListInner({searchText:n,filters:f,onSelectRender:l,onStatsChange:c,onRendersChange:e,isTracking:d,isPro:o=false}){const[r,s]=(0,_react.useState)(()=>_RenderTracker.RenderTracker.getFilteredRenders(n));const i=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const t=_RenderTracker.RenderTracker.subscribe(()=>{const a=_RenderTracker.RenderTracker.getFilteredRenders(n);s(a);c(_RenderTracker.RenderTracker.getStats());e?.(a)});return t},[n,c,e]);(0,_react.useEffect)(()=>{const t=_RenderTracker.RenderTracker.getFilteredRenders(n);s(t);e?.(t)},[n,f,e]);const m=(0,_sharedUi.useLimit)("highlightUpdates.components");const u=o?Infinity:m;const g=(0,_react.useMemo)(()=>{return r.slice(0,u)},[r,u]);const p=(0,_react.useMemo)(()=>{return Math.max(0,r.length-u)},[r.length,u]);const h=(0,_react.useCallback)(t=>t.id,[]);const y=(0,_react.useCallback)(({item:t,index:a})=>(0,_jsxRuntime.jsx)(_RenderListItem.RenderListItem,{render:t,onPress:()=>{_reactNative.Keyboard.dismiss();l(t,a,g)}}),[l,g]);const b=(0,_react.useCallback)(()=>{if(p<=0)return null;return(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:"buoy-highlight-locked",style:styles.lockedBanner,children:[(0,_jsxRuntime.jsx)(_sharedUi.Lock,{size:14,color:_sharedUi.night.color.warning}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{testID:"buoy-highlight-locked-text",style:styles.lockedBannerText,children:[p," more ",p===1?"component":"components"," locked"]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.lockedBannerSubtext,children:"Upgrade to Pro"})]})},[p]);if(r.length===0){const t=n.trim();const a=_RenderTracker.RenderTracker.getStats().totalComponents;const k=t?_RenderTracker.RenderTracker.getFilteredRenders("").length:0;const R=(0,_sharedUi.resolveListEmptyState)({subject:"components",verb:"tracked",search:n,total:t?k:a,capturing:d,blocked:t&&k===0&&a>0?"The active filters hide everything tracked, so there is nothing to search.":void 0,waiting:{otto:"stare",title:"No renders tracked",message:"Component renders will appear here"},paused:{title:"No renders tracked",message:"Enable tracking to start capturing"}});return(0,_jsxRuntime.jsx)(_sharedUi.ToolEmptyState,{...R,testID:"buoy-highlight-empty"})}return(0,_jsxRuntime.jsx)(_reactNative.FlatList,{testID:"buoy-highlight-list",ref:i,keyboardShouldPersistTaps:"handled",data:g,renderItem:y,keyExtractor:h,contentContainerStyle:styles.listContent,showsVerticalScrollIndicator:true,initialNumToRender:10,maxToRenderPerBatch:10,windowSize:10,scrollEnabled:false,ListFooterComponent:b})}const IsolatedRenderList=exports.IsolatedRenderList=(0,_react.memo)(IsolatedRenderListInner);const styles=_reactNative.StyleSheet.create({listContent:{paddingTop:8},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:16,marginTop:8,gap:8},lockedBannerText:{color:_sharedUi.night.color.warning,fontSize:13,fontWeight:"500"},lockedBannerSubtext:{color:_sharedUi.night.color.textTertiary,fontSize:12}});var _default=exports.default=IsolatedRenderList;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.collectDOMElements=collectDOMElements;exports.domElementName=domElementName;exports.labeledField=labeledField;exports.watchDOMChanges=watchDOMChanges;var _utils=require("@buoy-gg/shared-ui/utils");const INTERACTIVE_ROLES=new Set(["button","link","menuitem","tab","switch","checkbox","radio","option","textbox","slider"]);const SKIP_TAGS=new Set(["SCRIPT","STYLE","NOSCRIPT","TEMPLATE","SVG","PATH","HEAD","META","LINK"]);const MAX_TEXT=80;function isReactContainer(
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.collectDOMElements=collectDOMElements;exports.domElementName=domElementName;exports.labeledField=labeledField;exports.watchDOMChanges=watchDOMChanges;var _utils=require("@buoy-gg/shared-ui/utils");const INTERACTIVE_ROLES=new Set(["button","link","menuitem","tab","switch","checkbox","radio","option","textbox","slider"]);const SKIP_TAGS=new Set(["SCRIPT","STYLE","NOSCRIPT","TEMPLATE","SVG","PATH","HEAD","META","LINK"]);const MAX_TEXT=80;function isReactContainer(t){for(const r in t){if(r.startsWith("__reactContainer$")||r==="_reactRootContainer")return true}return false}function isHidden(t){if(t.getAttribute("aria-hidden")==="true")return true;const r=getComputedStyle(t);return r.display==="none"||r.visibility==="hidden"}function hasClick(t){const r=t;return typeof r.$$click==="function"||typeof r.onclick==="function"||t.tabIndex>=0&&t.hasAttribute("tabindex")}const INLINE_TAGS=new Set(["B","STRONG","EM","I","U","S","SPAN","SMALL","MARK","CODE","SUB","SUP","ABBR","CITE","Q","TIME","BR"]);function hasOwnText(t){return Array.from(t.childNodes).some(r=>r.nodeType===3&&(r.textContent??"").trim()!=="")}function isPlainInline(t){return INLINE_TAGS.has(t.tagName.toUpperCase())&&!t.hasAttribute("data-testid")&&!t.hasAttribute("aria-label")&&!t.hasAttribute("role")&&!hasClick(t)&&!t.querySelector(`${CONTROLS}, [role], [data-testid], [aria-label]`)}function ownText(t){let r="";const n=hasOwnText(t);const e=o=>{if(o.nodeType===3)r+=o.textContent??"";else if(n&&o.nodeType===1){const i=o;if(i.tagName==="BR")r+=" ";else if(isPlainInline(i)&&!isHidden(i))i.childNodes.forEach(e)}};t.childNodes.forEach(e);r=r.replace(/\s+/g," ").trim();return r||void 0}function clip(t,r){if(!t)return void 0;return r||t.length<=MAX_TEXT?t:`${t.slice(0,MAX_TEXT)}\u2026`}function allText(t,r){return clip((t.innerText??t.textContent??"").replace(/\s+/g," ").trim(),r)}const FIELDS="input, textarea, select";const CONTROLS=`${FIELDS}, button, a[href]`;function readText(t){let r="";const n=e=>{if(e.nodeType===3)r+=e.textContent??"";else if(e.nodeType===1&&!e.matches(FIELDS))e.childNodes.forEach(n)};n(t);return r.replace(/\s+/g," ").trim()}function nearbyLabel(t){let r=t;for(let n=0;n<3;n++){const e=r.previousElementSibling;if(e){const i=readText(e);return i&&i.length<=MAX_TEXT&&!e.matches(CONTROLS)&&!e.querySelector(CONTROLS)?e:null}const o=r.parentElement;if(!o||o.querySelectorAll(FIELDS).length>1)return null;r=o}return null}function accessibleName(t){const r=(t.getAttribute("aria-labelledby")??"").split(/\s+/).map(o=>o&&document.getElementById(o)?readText(document.getElementById(o)):"").filter(Boolean).join(" ");const n=Array.from(t.labels??[]).map(readText).filter(Boolean).join(" ");const e=t.matches(FIELDS)?nearbyLabel(t):null;return r||t.getAttribute("aria-label")||n||t.getAttribute("title")||t.getAttribute("placeholder")||(e?readText(e):"")}function labeledField(t){const r=t.closest("label")?.control;if(r instanceof HTMLElement)return r;const n=t.closest("[id]")?.id;if(n){for(const e of Array.from(document.querySelectorAll("[aria-labelledby]"))){if(e.matches(`${FIELDS}, [role=textbox]`)&&e.getAttribute("aria-labelledby").split(/\s+/).includes(n))return e}}for(let e=t,o=0;e&&o<3;e=e.parentElement,o++){const i=e.nextElementSibling;const s=i?.matches(FIELDS)?i:i?.querySelector(FIELDS);if(s instanceof HTMLElement&&nearbyLabel(s)===e)return s}return null}function collectDOMElements(t={}){if(typeof document==="undefined"||!document.body)return[];const r=[];const n=(e,o,i)=>{if(SKIP_TAGS.has(e.tagName.toUpperCase())||isReactContainer(e)||isHidden(e))return;const s=i||e.hasAttribute("data-buoy-root")||e.hasAttribute("data-buoy-portal-host");const a=e.tagName.toLowerCase();const l=e.getAttribute("role")??void 0;const c=a==="button"||a==="a"&&e.hasAttribute("href")||a==="input"||a==="textarea"||a==="select"||l!==void 0&&INTERACTIVE_ROLES.has(l)||hasClick(e);const f=e.getAttribute("data-testid")??void 0;const b=c?clip(accessibleName(e),!!t.fullText):e.getAttribute("aria-label")??void 0;const h=c?allText(e,!!t.fullText):o?void 0:ownText(e);if(c||f||b||h){const u={"data-testid":f,"aria-label":b,role:l,id:e.id||void 0};if(c&&a!=="input"&&a!=="textarea"&&a!=="select")u.onClick=()=>e.click();const d=(0,_utils.getDOMControlProps)(e,u);if(l==="switch"||l==="checkbox"){const y=e.getAttribute("aria-checked")==="true";d.value=y;d.onValueChange=A=>{if(Boolean(A)!==(e.getAttribute("aria-checked")==="true"))e.click()};delete d.onPress}if(e.disabled)delete d.onPress;r.push({element:e,props:d,text:h,buoy:s})}const p=!c&&!o&&hasOwnText(e);for(const u of Array.from(e.children)){if(p&&isPlainInline(u))continue;if(u instanceof HTMLElement)n(u,o||c,s)}};n(document.body,false,false);return r}function domElementName(t){const r=globalThis[Symbol.for("buoy.dom.componentName")];try{const n=r?.(t);if(n)return n}catch{}return t.tagName.toLowerCase()}function watchDOMChanges(){if(typeof MutationObserver==="undefined"||typeof document==="undefined")return()=>0;let t=0;const r=new MutationObserver(()=>{t+=1});r.observe(document.body,{subtree:true,childList:true,characterData:true,attributes:true});return()=>{r.disconnect();return t}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import fe,{useState as f,useCallback as I}from"react";import{View as a,Text as i,TouchableOpacity as g,TextInput as A,StyleSheet as ie,ScrollView as O,Modal as ce,Pressable as ae,Switch as w}from"react-native";import{Eye as q,Filter as N,Plus as K,X as L,Box as X,Settings as de,Hash as se,SectionHeader as p,night as o,monoFont as v}from"@buoy-gg/shared-ui";import{IdentifierBadge as G,IDENTIFIER_CONFIG as ue}from"./IdentifierBadge";import{detectedItemTestID as he,patternChipTestID as pe,settingTestID as R}from"../utils/testIDs";import{jsx as t,jsxs as l,Fragment as M}from"react/jsx-runtime";const P=d=>ue[d];const ge=["any","viewType","testID","nativeID","component","accessibilityLabel"];function Y({mode:d,onSelect:u,onCancel:s}){return l(a,{nativeID:"__rn_buoy__type-picker",testID:`buoy-highlight-${d}-types`,style:e.typePicker,children:[t(a,{style:e.typePickerRow,children:ge.map(h=>{const r=P(h);const b=r.icon;return l(g,{testID:`buoy-highlight-${d}-type-${h.toLowerCase()}`,accessibilityRole:"button",accessibilityLabel:r.label,style:[e.typeOption,{backgroundColor:r.color+"15",borderColor:r.color+"40"}],onPress:()=>u(h),children:[t(b,{size:14,color:r.color}),t(i,{style:[e.typeOptionText,{color:r.color}],children:r.label})]},h)})}),t(g,{testID:`buoy-highlight-${d}-types-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:s,style:e.typePickerCancel,children:t(L,{size:16,color:o.color.textTertiary})})]})}function Z({mode:d,type:u,onSubmit:s,onCancel:h}){const[r,b]=f("");const z=P(u);const C=()=>{if(r.trim()){s(r.trim())}};return l(a,{nativeID:"__rn_buoy__pattern-input",testID:`buoy-highlight-${d}-input-row`,style:e.patternInputContainer,children:[t(G,{type:u,value:"",badgeOnly:true,compact:true}),t(A,{testID:`buoy-highlight-${d}-input`,value:r,onChangeText:b,onSubmitEditing:C,placeholder:"Enter pattern...",placeholderTextColor:o.color.placeholder,style:e.patternInput,autoFocus:true,returnKeyType:"done",autoCorrect:false,autoCapitalize:"none"}),r.trim()&&t(g,{testID:`buoy-highlight-${d}-submit`,accessibilityRole:"button",accessibilityLabel:"Add pattern",onPress:C,style:[e.addPatternButton,{backgroundColor:z.color+"20"}],children:t(i,{style:[e.addPatternButtonText,{color:z.color}],children:"Add"})}),t(g,{testID:`buoy-highlight-${d}-input-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:h,style:e.cancelButton,children:t(L,{size:16,color:o.color.textTertiary})})]})}function J({mode:d,pattern:u,onRemove:s}){const h=P(u.type);return l(g,{testID:pe(d,u.type,u.value),accessibilityRole:"button",accessibilityLabel:`${h.label} ${u.value}, tap to remove`,style:[e.patternChip,{borderColor:h.color+"40"}],onPress:s,activeOpacity:.7,children:[t(a,{style:[e.patternChipBadge,{backgroundColor:h.color+"20"}],children:t(i,{style:[e.patternChipBadgeText,{color:h.color}],children:h.shortLabel})}),t(i,{style:e.patternChipValue,numberOfLines:1,children:u.value}),t(L,{size:12,color:o.color.textTertiary,style:e.patternChipX})]})}const ye={label:"All",shortLabel:"All",color:o.color.textSecondary,icon:X};function D({filterType:d,count:u,isSelected:s,onPress:h}){const r=d==="all"?ye:P(d);const b=`buoy-highlight-detected-cat-${String(d).toLowerCase()}`;return l(g,{testID:b,accessibilityRole:"button",accessibilityLabel:`${r.label}, ${u}`,style:[e.categoryBadge,{backgroundColor:r.color+"15",borderColor:s?r.color:r.color+"40",borderWidth:s?2:1}],onPress:h,children:[t(r.icon,{size:12,color:r.color}),t(i,{style:[e.categoryBadgeText,{color:r.color}],children:r.label}),t(a,{style:[e.categoryBadgeCountBubble,{backgroundColor:r.color+"25"}],children:t(i,{testID:`${b}-count`,style:[e.categoryBadgeCount,{color:r.color}],children:u})})]})}const be=[{value:20,label:"20"},{value:50,label:"50"},{value:100,label:"100"},{value:150,label:"150"},{value:250,label:"250"},{value:500,label:"500"}];const j=[{value:"off",label:"Off",description:"No debug logging"},{value:"minimal",label:"Minimal",description:"Only hook value changes"},{value:"verbose",label:"Verbose",description:"Component + cause + changes"},{value:"all",label:"All",description:"Full fiber dump"}];export function HighlightFilterView({filters:d,onFilterChange:u,settings:s,onSettingsChange:h,availableProps:r,activeTab:b}){const[z,C]=f(false);const[Q,k]=f(false);const[B,H]=f(null);const[W,E]=f(null);const[m,x]=f("all");const[y,T]=f(null);const ee=n=>{switch(n){case"viewType":return r.viewTypes.map(c=>({value:c,type:"viewType"}));case"testID":return r.testIDs.map(c=>({value:c,type:"testID"}));case"nativeID":return r.nativeIDs.map(c=>({value:c,type:"nativeID"}));case"component":return r.componentNames.map(c=>({value:c,type:"component"}));case"accessibilityLabel":return r.accessibilityLabels.map(c=>({value:c,type:"accessibilityLabel"}));case"all":default:return[...r.viewTypes.map(c=>({value:c,type:"viewType"})),...r.testIDs.map(c=>({value:c,type:"testID"})),...r.nativeIDs.map(c=>({value:c,type:"nativeID"})),...r.componentNames.map(c=>({value:c,type:"component"})),...r.accessibilityLabels.map(c=>({value:c,type:"accessibilityLabel"}))]}};const F=ee(m);const U=r.viewTypes.length+r.testIDs.length+r.nativeIDs.length+r.componentNames.length+r.accessibilityLabels.length;const V=I((n,c)=>{const S=[...d.includePatterns,{type:n,value:c}];u({includePatterns:S});H(null)},[d.includePatterns,u]);const _=I((n,c)=>{const S=[...d.excludePatterns,{type:n,value:c}];u({excludePatterns:S});E(null)},[d.excludePatterns,u]);const te=I(n=>{const c=d.includePatterns.filter((S,$)=>$!==n);u({includePatterns:c})},[d.includePatterns,u]);const oe=I(n=>{const c=d.excludePatterns.filter((S,$)=>$!==n);u({excludePatterns:c})},[d.excludePatterns,u]);const ne=I((n,c)=>{T({type:n,value:c})},[]);const le=I(()=>{if(y){V(y.type,y.value);T(null)}},[y,V]);const re=I(()=>{if(y){_(y.type,y.value);T(null)}},[y,_]);return t(a,{style:e.container,children:t(O,{keyboardShouldPersistTaps:"handled",nativeID:"__rn_buoy__filter-view",testID:"buoy-highlight-filter-scroll",style:e.scrollView,contentContainerStyle:e.scrollContent,showsVerticalScrollIndicator:false,children:b==="filters"?l(M,{children:[l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:q,color:o.color.accent,size:12}),t(p.Title,{children:"INCLUDE ONLY"}),d.includePatterns.length>0&&t(p.Badge,{testID:"buoy-highlight-include-count",count:d.includePatterns.length,color:o.color.accent})]}),t(i,{style:e.sectionDescription,children:"Show only components matching these patterns. If any are set, components must match at least one."}),d.includePatterns.length>0&&t(a,{style:e.patternChips,children:d.includePatterns.map((n,c)=>t(J,{mode:"include",pattern:n,onRemove:()=>te(c)},`${n.type}-${n.value}-${c}`))}),t(a,{style:e.addPatternRow,children:z?t(Y,{mode:"include",onSelect:n=>{C(false);H(n)},onCancel:()=>C(false)}):B?t(Z,{mode:"include",type:B,onSubmit:n=>V(B,n),onCancel:()=>H(null)}):l(g,{testID:"buoy-highlight-include-add",accessibilityRole:"button",accessibilityLabel:"Add include pattern",style:[e.addButton,{borderColor:o.color.accentBorderStrong}],onPress:()=>C(true),children:[t(K,{size:14,color:o.color.accent}),t(i,{style:[e.addButtonText,{color:o.color.accent}],children:"Add include pattern"})]})})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:N,color:o.color.accent,size:12}),t(p.Title,{children:"EXCLUDE"}),d.excludePatterns.length>0&&t(p.Badge,{testID:"buoy-highlight-exclude-count",count:d.excludePatterns.length,color:o.color.accent})]}),t(i,{style:e.sectionDescription,children:"Hide components matching these patterns from the list."}),d.excludePatterns.length>0&&t(a,{style:e.patternChips,children:d.excludePatterns.map((n,c)=>t(J,{mode:"exclude",pattern:n,onRemove:()=>oe(c)},`${n.type}-${n.value}-${c}`))}),t(a,{style:e.addPatternRow,children:Q?t(Y,{mode:"exclude",onSelect:n=>{k(false);E(n)},onCancel:()=>k(false)}):W?t(Z,{mode:"exclude",type:W,onSubmit:n=>_(W,n),onCancel:()=>E(null)}):l(g,{testID:"buoy-highlight-exclude-add",accessibilityRole:"button",accessibilityLabel:"Add exclude pattern",style:[e.addButton,{borderColor:o.color.accentBorderStrong}],onPress:()=>k(true),children:[t(K,{size:14,color:o.color.accent}),t(i,{style:[e.addButtonText,{color:o.color.accent}],children:"Add exclude pattern"})]})})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:se,color:o.color.warning,size:12}),t(p.Title,{children:"RENDER COUNT RANGE"}),(d.minRenderCount!==void 0||d.maxRenderCount!==void 0)&&t(p.Badge,{count:1,color:o.color.warning})]}),t(i,{style:e.sectionDescription,children:"Show only components with render count in a specific range."}),l(a,{nativeID:"__rn_buoy__render-count-range",testID:"buoy-highlight-range",style:e.renderCountRangeContainer,children:[l(a,{style:e.renderCountInputRow,children:[l(a,{style:e.renderCountInputGroup,children:[t(i,{style:e.renderCountLabel,children:"Min"}),t(A,{value:d.minRenderCount!==void 0?String(d.minRenderCount):"",onChangeText:n=>{const c=parseInt(n,10);if(n===""||n===void 0){u({minRenderCount:void 0})}else if(!isNaN(c)&&c>=0){u({minRenderCount:c})}},testID:"buoy-highlight-range-min",placeholder:"0",placeholderTextColor:o.color.placeholder,style:e.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]}),t(i,{style:e.renderCountSeparator,children:"to"}),l(a,{style:e.renderCountInputGroup,children:[t(i,{style:e.renderCountLabel,children:"Max"}),t(A,{value:d.maxRenderCount!==void 0?String(d.maxRenderCount):"",onChangeText:n=>{const c=parseInt(n,10);if(n===""||n===void 0){u({maxRenderCount:void 0})}else if(!isNaN(c)&&c>=0){u({maxRenderCount:c})}},testID:"buoy-highlight-range-max",placeholder:"\u221E",placeholderTextColor:o.color.placeholder,style:e.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]})]}),(d.minRenderCount!==void 0||d.maxRenderCount!==void 0)&&l(g,{testID:"buoy-highlight-range-clear",accessibilityRole:"button",accessibilityLabel:"Clear range",style:e.clearRangeButton,onPress:()=>u({minRenderCount:void 0,maxRenderCount:void 0}),children:[t(L,{size:12,color:o.color.warning}),t(i,{style:e.clearRangeButtonText,children:"Clear Range"})]})]})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:X,color:o.color.textSecondary,size:12}),t(p.Title,{children:"DETECTED ITEMS"})]}),t(i,{style:e.sectionDescription,children:"Tap an item to quickly add it as an exclude pattern."}),l(O,{horizontal:true,showsHorizontalScrollIndicator:false,style:e.categoryBadgeScroll,contentContainerStyle:e.categoryBadgeScrollContent,children:[U>0&&t(D,{filterType:"all",count:U,isSelected:m==="all",onPress:()=>x("all")}),r.viewTypes.length>0&&t(D,{filterType:"viewType",count:r.viewTypes.length,isSelected:m==="viewType",onPress:()=>x("viewType")}),r.testIDs.length>0&&t(D,{filterType:"testID",count:r.testIDs.length,isSelected:m==="testID",onPress:()=>x("testID")}),r.nativeIDs.length>0&&t(D,{filterType:"nativeID",count:r.nativeIDs.length,isSelected:m==="nativeID",onPress:()=>x("nativeID")}),r.componentNames.length>0&&t(D,{filterType:"component",count:r.componentNames.length,isSelected:m==="component",onPress:()=>x("component")}),r.accessibilityLabels.length>0&&t(D,{filterType:"accessibilityLabel",count:r.accessibilityLabels.length,isSelected:m==="accessibilityLabel",onPress:()=>x("accessibilityLabel")})]}),t(a,{nativeID:"__rn_buoy__detected-items",testID:"buoy-highlight-detected",style:e.detectedItemsContainer,children:F.length>0?t(O,{keyboardShouldPersistTaps:"handled",testID:"buoy-highlight-detected-scroll",style:e.detectedItemsScroll,contentContainerStyle:e.detectedItems,nestedScrollEnabled:true,showsVerticalScrollIndicator:true,children:F.map(n=>{const c=P(n.type);return t(g,{testID:he(n.type,n.value),accessibilityRole:"button",accessibilityLabel:`${c.label} ${n.value}`,style:[e.detectedItem,{borderColor:c.color+"40"}],onPress:()=>ne(n.type,n.value),children:m==="all"?t(G,{type:n.type,value:n.value,compact:true,shortLabel:true}):t(i,{style:e.detectedItemText,numberOfLines:1,children:n.value})},`${n.type}-${n.value}`)})}):t(i,{testID:"buoy-highlight-detected-empty",style:e.emptyText,children:"No items detected yet. Start tracking to see components here."})})]}),t(ce,{visible:y!==null,transparent:true,animationType:"fade",onRequestClose:()=>T(null),children:t(ae,{accessible:false,testID:"buoy-highlight-detected-popup-backdrop",style:e.modalOverlay,onPress:()=>T(null),children:t(a,{accessible:false,testID:"buoy-highlight-detected-popup",style:e.actionPopup,children:y&&l(M,{children:[t(a,{style:e.actionPopupHeader,children:t(G,{type:y.type,value:y.value,compact:true,shortLabel:true})}),l(a,{style:e.actionPopupButtons,children:[l(g,{testID:"buoy-highlight-detected-popup-include",accessibilityRole:"button",accessibilityLabel:"Include only",style:[e.actionPopupButton,e.actionPopupInclude],onPress:le,children:[t(q,{size:16,color:o.color.accent}),t(i,{style:[e.actionPopupButtonText,{color:o.color.accent}],children:"Include Only"})]}),l(g,{testID:"buoy-highlight-detected-popup-exclude",accessibilityRole:"button",accessibilityLabel:"Exclude",style:[e.actionPopupButton,e.actionPopupExclude],onPress:re,children:[t(N,{size:16,color:o.color.accent}),t(i,{style:[e.actionPopupButtonText,{color:o.color.accent}],children:"Exclude"})]})]}),t(g,{testID:"buoy-highlight-detected-popup-cancel",accessibilityRole:"button",accessibilityLabel:"Cancel",style:e.actionPopupCancel,onPress:()=>T(null),children:t(i,{style:e.actionPopupCancelText,children:"Cancel"})})]})})})}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:N,color:o.color.textTertiary,size:12}),t(p.Title,{children:"HOW FILTERS WORK"})]}),t(a,{style:e.howItWorks,children:l(i,{style:e.howItWorksText,children:[t(i,{style:e.howItWorksBold,children:"Any:"})," Matches against all fields","\n",t(i,{style:e.howItWorksBold,children:"ViewType:"})," Native component class (RCTView, RCTText)","\n",t(i,{style:e.howItWorksBold,children:"testID:"})," Component testID prop","\n",t(i,{style:e.howItWorksBold,children:"Component:"})," React component name from fiber"]})})]})]}):t(M,{children:l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:de,color:o.color.textTertiary,size:12}),t(p.Title,{children:"SETTINGS"})]}),l(a,{style:e.settingsSection,children:[l(a,{style:e.settingItem,children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Show Render Count"}),t(w,{testID:R("showRenderCount"),value:s.showRenderCount,onValueChange:n=>{h({showRenderCount:n});if(!n&&s.trackRenderCauses){h({trackRenderCauses:false})}},trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.showRenderCount?o.color.accent:o.color.knob})]}),t(i,{style:e.settingDescription,children:"Display render count badge on highlights. Disabling improves performance by skipping count tracking."})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:[e.settingLabel,!s.showRenderCount&&e.settingLabelDisabled],children:"Track Render Causes"}),t(w,{testID:R("trackRenderCauses"),value:s.trackRenderCauses,onValueChange:n=>h({trackRenderCauses:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.warning+"80"},thumbColor:s.trackRenderCauses?o.color.warning:o.color.knob,disabled:!s.showRenderCount})]}),l(i,{style:e.settingDescription,children:["Detect WHY components render (props, hooks, parent re-render).",!s.showRenderCount&&l(i,{style:e.settingWarning,children:["\n",'Requires "Show Render Count" to be enabled.']})]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:[e.settingLabel,!s.trackRenderCauses&&e.settingLabelDisabled],children:"Enable Render History"}),t(w,{testID:R("enableRenderHistory"),value:s.enableRenderHistory,onValueChange:n=>h({enableRenderHistory:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.enableRenderHistory?o.color.accent:o.color.knob,disabled:!s.trackRenderCauses})]}),l(i,{style:e.settingDescription,children:["Store render events for each component to view in the History tab.",!s.trackRenderCauses&&l(i,{style:e.settingWarning,children:["\n",'Requires "Track Render Causes" to be enabled.']})]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Debug Log Level"}),t(a,{style:e.settingValue,children:t(i,{testID:"buoy-highlight-setting-debugLogLevel-value",style:[e.settingValueText,s.debugLogLevel!=="off"&&{color:o.color.warning}],children:j.find(n=>n.value===s.debugLogLevel)?.label||"Off"})})]}),t(i,{style:e.settingDescription,children:"Control console logging verbosity for render cause detection."}),t(a,{style:e.batchSizePresets,children:j.map(n=>t(g,{style:[e.batchSizePreset,s.debugLogLevel===n.value&&e.batchSizePresetActive,n.value!=="off"&&s.debugLogLevel===n.value&&{backgroundColor:o.color.warningSoft,borderColor:o.color.warning}],onPress:()=>h({debugLogLevel:n.value}),testID:`buoy-highlight-preset-log-${n.value}`,accessibilityRole:"button",accessibilityLabel:`Debug log level ${n.label}`,children:t(i,{style:[e.batchSizePresetText,s.debugLogLevel===n.value&&e.batchSizePresetTextActive,n.value!=="off"&&s.debugLogLevel===n.value&&{color:o.color.warning}],children:n.label})},n.value))}),l(i,{style:e.settingDescriptionMuted,children:[j.find(n=>n.value===s.debugLogLevel)?.description,s.debugLogLevel!=="off"&&" \u2022 Check Metro console for logs"]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Batch Size"}),t(a,{style:e.settingValue,children:t(i,{testID:"buoy-highlight-setting-batchSize-value",style:e.settingValueText,children:s.batchSize})})]}),t(i,{style:e.settingDescription,children:"Maximum components to highlight per render update. Higher values capture more re-renders but may impact performance on complex screens."}),t(a,{style:e.batchSizePresets,children:be.map(n=>t(g,{style:[e.batchSizePreset,s.batchSize===n.value&&e.batchSizePresetActive],onPress:()=>h({batchSize:n.value}),testID:`buoy-highlight-preset-batch-${n.value}`,accessibilityRole:"button",accessibilityLabel:`Batch size ${n.label}`,children:t(i,{style:[e.batchSizePresetText,s.batchSize===n.value&&e.batchSizePresetTextActive],children:n.label})},n.value))})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Show host views"}),t(w,{testID:R("showHostViews"),value:!!s.showHostViews,onValueChange:n=>h({showHostViews:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.showHostViews?o.color.accent:o.color.knob})]}),t(i,{style:e.settingDescription,children:"Include anonymous View / RCTView / Text hosts. Off by default so the list is named composites (what actually re-rendered)."})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Highlight Dev Tools"}),t(w,{testID:R("excludeDevTools"),value:!s.excludeDevTools,onValueChange:n=>h({excludeDevTools:!n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:!s.excludeDevTools?o.color.accent:o.color.knob})]}),l(i,{style:e.settingDescription,children:["Show re-render highlights on Buoy dev tools (floating menu, modals, etc.). Useful for optimizing the dev tools themselves.",!s.excludeDevTools&&l(i,{style:e.settingWarning,children:["\n","The highlight overlay is always excluded to prevent infinite loops."]})]})]})]})]})})})})}const e=ie.create({container:{flex:1,backgroundColor:"transparent"},scrollView:{flex:1},scrollContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:32},section:{backgroundColor:o.color.surface,borderRadius:8,borderWidth:1,borderColor:o.color.border,marginBottom:12,overflow:"hidden"},sectionDescription:{fontSize:11,color:o.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:16},patternChips:{flexDirection:"row",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:12},patternChip:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:4,paddingLeft:4,paddingRight:6,maxWidth:"100%",gap:4},patternChipBadge:{paddingVertical:2,paddingHorizontal:5,borderRadius:4},patternChipBadgeText:{fontSize:9,fontWeight:"700"},patternChipValue:{fontSize:11,color:o.color.text,fontFamily:v,flexShrink:1},patternChipX:{marginLeft:2},addPatternRow:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},addButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1,borderStyle:"dashed",gap:6},addButtonText:{fontSize:12,fontWeight:"500"},typePicker:{flexDirection:"row",alignItems:"center",gap:8},typePickerRow:{flex:1,flexDirection:"row",flexWrap:"wrap",gap:8},typeOption:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,borderWidth:1,backgroundColor:o.color.surfaceElevated,gap:6},typeOptionText:{fontSize:11,fontWeight:"600"},typePickerCancel:{padding:8},patternInputContainer:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:o.color.border,paddingLeft:4,paddingRight:8,paddingVertical:4,gap:4},patternInput:{flex:1,fontSize:12,color:o.color.text,paddingVertical:6,paddingHorizontal:4},addPatternButton:{paddingVertical:6,paddingHorizontal:10,borderRadius:4},addPatternButtonText:{fontSize:11,fontWeight:"600"},cancelButton:{padding:4},categoryBadgeScroll:{marginTop:12},categoryBadgeScrollContent:{paddingHorizontal:16,gap:8},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,borderWidth:1,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCountBubble:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCount:{fontSize:10,fontWeight:"600"},detectedItemsContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},detectedItemsScroll:{maxHeight:200},detectedItems:{flexDirection:"row",flexWrap:"wrap",gap:8},detectedItem:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:6,paddingHorizontal:10,gap:6},detectedItemText:{fontSize:11,color:o.color.text,fontFamily:v},emptyText:{fontSize:11,color:o.color.textTertiary,fontStyle:"italic",textAlign:"center",paddingVertical:16,paddingHorizontal:16},howItWorks:{paddingHorizontal:16,paddingVertical:12},howItWorksText:{fontSize:11,color:o.color.textTertiary,lineHeight:18,fontFamily:v},howItWorksBold:{fontWeight:"700",color:o.color.textSecondary},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:32},actionPopup:{backgroundColor:o.color.surface,borderRadius:12,borderWidth:1,borderColor:o.color.border,width:"100%",maxWidth:300,overflow:"hidden"},actionPopupHeader:{padding:16,borderBottomWidth:1,borderBottomColor:o.color.separator,alignItems:"center"},actionPopupButtons:{flexDirection:"row",padding:12,gap:8},actionPopupButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:12,borderRadius:8,gap:8},actionPopupInclude:{backgroundColor:o.color.accentSoft},actionPopupExclude:{backgroundColor:o.color.accentSoft},actionPopupButtonText:{fontSize:13,fontWeight:"600"},actionPopupCancel:{padding:12,borderTopWidth:1,borderTopColor:o.color.separator,alignItems:"center"},actionPopupCancelText:{fontSize:13,color:o.color.textTertiary,fontWeight:"500"},settingsSection:{paddingHorizontal:16,paddingTop:8,paddingBottom:16},settingItem:{gap:8},settingItemSpaced:{marginTop:16,paddingTop:16,borderTopWidth:1,borderTopColor:o.color.separator},settingHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},settingLabel:{fontSize:13,fontWeight:"600",color:o.color.text},settingValue:{backgroundColor:o.color.fillSecondary,paddingHorizontal:10,paddingVertical:4,borderRadius:6},settingValueText:{fontSize:12,fontWeight:"700",color:o.color.textTertiary,fontFamily:v},settingDescription:{fontSize:11,color:o.color.textSecondary,lineHeight:16},settingDescriptionMuted:{fontSize:10,color:o.color.textTertiary,lineHeight:14,marginTop:4,fontStyle:"italic"},settingLabelDisabled:{color:o.color.textTertiary},settingWarning:{color:o.color.warning,fontWeight:"500"},batchSizePresets:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:4},batchSizePreset:{paddingVertical:8,paddingHorizontal:14,borderRadius:6,backgroundColor:o.color.surfaceElevated,borderWidth:1,borderColor:o.color.border},batchSizePresetActive:{backgroundColor:o.color.fillSecondary,borderColor:o.color.fillTertiary},batchSizePresetText:{fontSize:12,fontWeight:"500",color:o.color.textSecondary,fontFamily:v},batchSizePresetTextActive:{color:o.color.textTertiary,fontWeight:"700"},renderCountRangeContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,gap:12},renderCountInputRow:{flexDirection:"row",alignItems:"center",gap:12},renderCountInputGroup:{flex:1,gap:4},renderCountLabel:{fontSize:10,fontWeight:"600",color:o.color.textTertiary,textTransform:"uppercase",letterSpacing:.5},renderCountInput:{backgroundColor:o.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:o.color.border,paddingVertical:10,paddingHorizontal:12,fontSize:14,fontWeight:"600",color:o.color.text,fontFamily:v,textAlign:"center"},renderCountSeparator:{fontSize:12,color:o.color.textTertiary,marginTop:18},clearRangeButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,backgroundColor:o.color.warningSoft,borderWidth:1,borderColor:o.color.warning+"40",gap:6,alignSelf:"center"},clearRangeButtonText:{fontSize:11,fontWeight:"600",color:o.color.warning}});export default HighlightFilterView;
|
|
1
|
+
"use strict";import fe,{useState as f,useCallback as I}from"react";import{View as a,Text as i,TouchableOpacity as g,TextInput as A,StyleSheet as ie,ScrollView as O,Modal as ce,Pressable as ae,Switch as w}from"react-native";import{Eye as q,Filter as N,Plus as K,X as L,Box as X,Settings as de,Hash as se,SectionHeader as p,night as o,monoFont as v}from"@buoy-gg/shared-ui";import{IdentifierBadge as G,IDENTIFIER_CONFIG as ue}from"./IdentifierBadge";import{detectedItemTestID as he,patternChipTestID as pe,settingTestID as R}from"../utils/testIDs";import{jsx as t,jsxs as l,Fragment as M}from"react/jsx-runtime";const P=d=>ue[d];const ge=["any","viewType","testID","nativeID","component","accessibilityLabel"];function Y({mode:d,onSelect:u,onCancel:s}){return l(a,{nativeID:"__rn_buoy__type-picker",testID:`buoy-highlight-${d}-types`,style:e.typePicker,children:[t(a,{style:e.typePickerRow,children:ge.map(h=>{const r=P(h);const b=r.icon;return l(g,{testID:`buoy-highlight-${d}-type-${h.toLowerCase()}`,accessibilityRole:"button",accessibilityLabel:r.label,style:[e.typeOption,{backgroundColor:r.color+"15",borderColor:r.color+"40"}],onPress:()=>u(h),children:[t(b,{size:14,color:r.color}),t(i,{style:[e.typeOptionText,{color:r.color}],children:r.label})]},h)})}),t(g,{testID:`buoy-highlight-${d}-types-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:s,style:e.typePickerCancel,children:t(L,{size:16,color:o.color.textTertiary})})]})}function Z({mode:d,type:u,onSubmit:s,onCancel:h}){const[r,b]=f("");const z=P(u);const C=()=>{if(r.trim()){s(r.trim())}};return l(a,{nativeID:"__rn_buoy__pattern-input",testID:`buoy-highlight-${d}-input-row`,style:e.patternInputContainer,children:[t(G,{type:u,value:"",badgeOnly:true,compact:true}),t(A,{testID:`buoy-highlight-${d}-input`,value:r,onChangeText:b,onSubmitEditing:C,placeholder:"Enter pattern...",placeholderTextColor:o.color.placeholder,style:e.patternInput,autoFocus:true,returnKeyType:"done",autoCorrect:false,autoCapitalize:"none"}),r.trim()&&t(g,{testID:`buoy-highlight-${d}-submit`,accessibilityRole:"button",accessibilityLabel:"Add pattern",onPress:C,style:[e.addPatternButton,{backgroundColor:z.color+"20"}],children:t(i,{style:[e.addPatternButtonText,{color:z.color}],children:"Add"})}),t(g,{testID:`buoy-highlight-${d}-input-cancel`,accessibilityRole:"button",accessibilityLabel:"Cancel",onPress:h,style:e.cancelButton,children:t(L,{size:16,color:o.color.textTertiary})})]})}function J({mode:d,pattern:u,onRemove:s}){const h=P(u.type);return l(g,{testID:pe(d,u.type,u.value),accessibilityRole:"button",accessibilityLabel:`${h.label} ${u.value}, tap to remove`,style:[e.patternChip,{borderColor:h.color+"40"}],onPress:s,activeOpacity:.7,children:[t(a,{style:[e.patternChipBadge,{backgroundColor:h.color+"20"}],children:t(i,{style:[e.patternChipBadgeText,{color:h.color}],children:h.shortLabel})}),t(i,{style:e.patternChipValue,numberOfLines:1,children:u.value}),t(L,{size:12,color:o.color.textTertiary,style:e.patternChipX})]})}const ye={label:"All",shortLabel:"All",color:o.color.textSecondary,icon:X};function S({filterType:d,count:u,isSelected:s,onPress:h}){const r=d==="all"?ye:P(d);const b=`buoy-highlight-detected-cat-${String(d).toLowerCase()}`;return l(g,{testID:b,accessibilityRole:"button",accessibilityLabel:`${r.label}, ${u}`,style:[e.categoryBadge,{backgroundColor:r.color+"15",borderColor:s?r.color:r.color+"40",borderWidth:s?2:1}],onPress:h,children:[t(r.icon,{size:12,color:r.color}),t(i,{style:[e.categoryBadgeText,{color:r.color}],children:r.label}),t(a,{style:[e.categoryBadgeCountBubble,{backgroundColor:r.color+"25"}],children:t(i,{testID:`${b}-count`,style:[e.categoryBadgeCount,{color:r.color}],children:u})})]})}const be=[{value:20,label:"20"},{value:50,label:"50"},{value:100,label:"100"},{value:150,label:"150"},{value:250,label:"250"},{value:500,label:"500"}];const j=[{value:"off",label:"Off",description:"No debug logging"},{value:"minimal",label:"Minimal",description:"Only hook value changes"},{value:"verbose",label:"Verbose",description:"Component + cause + changes"},{value:"all",label:"All",description:"Full fiber dump"}];export function HighlightFilterView({filters:d,onFilterChange:u,settings:s,onSettingsChange:h,availableProps:r,activeTab:b}){const[z,C]=f(false);const[Q,k]=f(false);const[B,H]=f(null);const[W,E]=f(null);const[m,x]=f("all");const[y,T]=f(null);const ee=n=>{switch(n){case"viewType":return r.viewTypes.map(c=>({value:c,type:"viewType"}));case"testID":return r.testIDs.map(c=>({value:c,type:"testID"}));case"nativeID":return r.nativeIDs.map(c=>({value:c,type:"nativeID"}));case"component":return r.componentNames.map(c=>({value:c,type:"component"}));case"accessibilityLabel":return r.accessibilityLabels.map(c=>({value:c,type:"accessibilityLabel"}));case"all":default:return[...r.viewTypes.map(c=>({value:c,type:"viewType"})),...r.testIDs.map(c=>({value:c,type:"testID"})),...r.nativeIDs.map(c=>({value:c,type:"nativeID"})),...r.componentNames.map(c=>({value:c,type:"component"})),...r.accessibilityLabels.map(c=>({value:c,type:"accessibilityLabel"}))]}};const F=ee(m);const U=r.viewTypes.length+r.testIDs.length+r.nativeIDs.length+r.componentNames.length+r.accessibilityLabels.length;const V=I((n,c)=>{const D=[...d.includePatterns,{type:n,value:c}];u({includePatterns:D});H(null)},[d.includePatterns,u]);const _=I((n,c)=>{const D=[...d.excludePatterns,{type:n,value:c}];u({excludePatterns:D});E(null)},[d.excludePatterns,u]);const te=I(n=>{const c=d.includePatterns.filter((D,$)=>$!==n);u({includePatterns:c})},[d.includePatterns,u]);const oe=I(n=>{const c=d.excludePatterns.filter((D,$)=>$!==n);u({excludePatterns:c})},[d.excludePatterns,u]);const ne=I((n,c)=>{T({type:n,value:c})},[]);const le=I(()=>{if(y){V(y.type,y.value);T(null)}},[y,V]);const re=I(()=>{if(y){_(y.type,y.value);T(null)}},[y,_]);return t(a,{style:e.container,children:t(O,{keyboardShouldPersistTaps:"handled",nativeID:"__rn_buoy__filter-view",testID:"buoy-highlight-filter-scroll",style:e.scrollView,contentContainerStyle:e.scrollContent,showsVerticalScrollIndicator:false,children:b==="filters"?l(M,{children:[l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:q,color:o.color.accent,size:12}),t(p.Title,{children:"INCLUDE ONLY"}),d.includePatterns.length>0&&t(p.Badge,{testID:"buoy-highlight-include-count",count:d.includePatterns.length,color:o.color.accent})]}),t(i,{style:e.sectionDescription,children:"Show only components matching these patterns. If any are set, components must match at least one."}),d.includePatterns.length>0&&t(a,{style:e.patternChips,children:d.includePatterns.map((n,c)=>t(J,{mode:"include",pattern:n,onRemove:()=>te(c)},`${n.type}-${n.value}-${c}`))}),t(a,{style:e.addPatternRow,children:z?t(Y,{mode:"include",onSelect:n=>{C(false);H(n)},onCancel:()=>C(false)}):B?t(Z,{mode:"include",type:B,onSubmit:n=>V(B,n),onCancel:()=>H(null)}):l(g,{testID:"buoy-highlight-include-add",accessibilityRole:"button",accessibilityLabel:"Add include pattern",style:[e.addButton,{borderColor:o.color.accentBorderStrong}],onPress:()=>C(true),children:[t(K,{size:14,color:o.color.accent}),t(i,{style:[e.addButtonText,{color:o.color.accent}],children:"Add include pattern"})]})})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:N,color:o.color.accent,size:12}),t(p.Title,{children:"EXCLUDE"}),d.excludePatterns.length>0&&t(p.Badge,{testID:"buoy-highlight-exclude-count",count:d.excludePatterns.length,color:o.color.accent})]}),t(i,{style:e.sectionDescription,children:"Hide components matching these patterns from the list."}),d.excludePatterns.length>0&&t(a,{style:e.patternChips,children:d.excludePatterns.map((n,c)=>t(J,{mode:"exclude",pattern:n,onRemove:()=>oe(c)},`${n.type}-${n.value}-${c}`))}),t(a,{style:e.addPatternRow,children:Q?t(Y,{mode:"exclude",onSelect:n=>{k(false);E(n)},onCancel:()=>k(false)}):W?t(Z,{mode:"exclude",type:W,onSubmit:n=>_(W,n),onCancel:()=>E(null)}):l(g,{testID:"buoy-highlight-exclude-add",accessibilityRole:"button",accessibilityLabel:"Add exclude pattern",style:[e.addButton,{borderColor:o.color.accentBorderStrong}],onPress:()=>k(true),children:[t(K,{size:14,color:o.color.accent}),t(i,{style:[e.addButtonText,{color:o.color.accent}],children:"Add exclude pattern"})]})})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:se,color:o.color.warning,size:12}),t(p.Title,{children:"RENDER COUNT RANGE"}),(d.minRenderCount!==void 0||d.maxRenderCount!==void 0)&&t(p.Badge,{count:1,color:o.color.warning})]}),t(i,{style:e.sectionDescription,children:"Show only components with render count in a specific range."}),l(a,{nativeID:"__rn_buoy__render-count-range",testID:"buoy-highlight-range",style:e.renderCountRangeContainer,children:[l(a,{style:e.renderCountInputRow,children:[l(a,{style:e.renderCountInputGroup,children:[t(i,{style:e.renderCountLabel,children:"Min"}),t(A,{value:d.minRenderCount!==void 0?String(d.minRenderCount):"",onChangeText:n=>{const c=parseInt(n,10);if(n===""||n===void 0){u({minRenderCount:void 0})}else if(!isNaN(c)&&c>=0){u({minRenderCount:c})}},testID:"buoy-highlight-range-min",placeholder:"0",placeholderTextColor:o.color.placeholder,style:e.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]}),t(i,{style:e.renderCountSeparator,children:"to"}),l(a,{style:e.renderCountInputGroup,children:[t(i,{style:e.renderCountLabel,children:"Max"}),t(A,{value:d.maxRenderCount!==void 0?String(d.maxRenderCount):"",onChangeText:n=>{const c=parseInt(n,10);if(n===""||n===void 0){u({maxRenderCount:void 0})}else if(!isNaN(c)&&c>=0){u({maxRenderCount:c})}},testID:"buoy-highlight-range-max",placeholder:"\u221E",placeholderTextColor:o.color.placeholder,style:e.renderCountInput,keyboardType:"number-pad",returnKeyType:"done"})]})]}),(d.minRenderCount!==void 0||d.maxRenderCount!==void 0)&&l(g,{testID:"buoy-highlight-range-clear",accessibilityRole:"button",accessibilityLabel:"Clear range",style:e.clearRangeButton,onPress:()=>u({minRenderCount:void 0,maxRenderCount:void 0}),children:[t(L,{size:12,color:o.color.warning}),t(i,{style:e.clearRangeButtonText,children:"Clear Range"})]})]})]}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:X,color:o.color.textSecondary,size:12}),t(p.Title,{children:"DETECTED ITEMS"})]}),t(i,{style:e.sectionDescription,children:"Tap an item to quickly add it as an exclude pattern."}),l(O,{keyboardShouldPersistTaps:"handled",horizontal:true,showsHorizontalScrollIndicator:false,style:e.categoryBadgeScroll,contentContainerStyle:e.categoryBadgeScrollContent,children:[U>0&&t(S,{filterType:"all",count:U,isSelected:m==="all",onPress:()=>x("all")}),r.viewTypes.length>0&&t(S,{filterType:"viewType",count:r.viewTypes.length,isSelected:m==="viewType",onPress:()=>x("viewType")}),r.testIDs.length>0&&t(S,{filterType:"testID",count:r.testIDs.length,isSelected:m==="testID",onPress:()=>x("testID")}),r.nativeIDs.length>0&&t(S,{filterType:"nativeID",count:r.nativeIDs.length,isSelected:m==="nativeID",onPress:()=>x("nativeID")}),r.componentNames.length>0&&t(S,{filterType:"component",count:r.componentNames.length,isSelected:m==="component",onPress:()=>x("component")}),r.accessibilityLabels.length>0&&t(S,{filterType:"accessibilityLabel",count:r.accessibilityLabels.length,isSelected:m==="accessibilityLabel",onPress:()=>x("accessibilityLabel")})]}),t(a,{nativeID:"__rn_buoy__detected-items",testID:"buoy-highlight-detected",style:e.detectedItemsContainer,children:F.length>0?t(O,{keyboardShouldPersistTaps:"handled",testID:"buoy-highlight-detected-scroll",style:e.detectedItemsScroll,contentContainerStyle:e.detectedItems,nestedScrollEnabled:true,showsVerticalScrollIndicator:true,children:F.map(n=>{const c=P(n.type);return t(g,{testID:he(n.type,n.value),accessibilityRole:"button",accessibilityLabel:`${c.label} ${n.value}`,style:[e.detectedItem,{borderColor:c.color+"40"}],onPress:()=>ne(n.type,n.value),children:m==="all"?t(G,{type:n.type,value:n.value,compact:true,shortLabel:true}):t(i,{style:e.detectedItemText,numberOfLines:1,children:n.value})},`${n.type}-${n.value}`)})}):t(i,{testID:"buoy-highlight-detected-empty",style:e.emptyText,children:"No items detected yet. Start tracking to see components here."})})]}),t(ce,{visible:y!==null,transparent:true,animationType:"fade",onRequestClose:()=>T(null),children:t(ae,{accessible:false,testID:"buoy-highlight-detected-popup-backdrop",style:e.modalOverlay,onPress:()=>T(null),children:t(a,{accessible:false,testID:"buoy-highlight-detected-popup",style:e.actionPopup,children:y&&l(M,{children:[t(a,{style:e.actionPopupHeader,children:t(G,{type:y.type,value:y.value,compact:true,shortLabel:true})}),l(a,{style:e.actionPopupButtons,children:[l(g,{testID:"buoy-highlight-detected-popup-include",accessibilityRole:"button",accessibilityLabel:"Include only",style:[e.actionPopupButton,e.actionPopupInclude],onPress:le,children:[t(q,{size:16,color:o.color.accent}),t(i,{style:[e.actionPopupButtonText,{color:o.color.accent}],children:"Include Only"})]}),l(g,{testID:"buoy-highlight-detected-popup-exclude",accessibilityRole:"button",accessibilityLabel:"Exclude",style:[e.actionPopupButton,e.actionPopupExclude],onPress:re,children:[t(N,{size:16,color:o.color.accent}),t(i,{style:[e.actionPopupButtonText,{color:o.color.accent}],children:"Exclude"})]})]}),t(g,{testID:"buoy-highlight-detected-popup-cancel",accessibilityRole:"button",accessibilityLabel:"Cancel",style:e.actionPopupCancel,onPress:()=>T(null),children:t(i,{style:e.actionPopupCancelText,children:"Cancel"})})]})})})}),l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:N,color:o.color.textTertiary,size:12}),t(p.Title,{children:"HOW FILTERS WORK"})]}),t(a,{style:e.howItWorks,children:l(i,{style:e.howItWorksText,children:[t(i,{style:e.howItWorksBold,children:"Any:"})," Matches against all fields","\n",t(i,{style:e.howItWorksBold,children:"ViewType:"})," Native component class (RCTView, RCTText)","\n",t(i,{style:e.howItWorksBold,children:"testID:"})," Component testID prop","\n",t(i,{style:e.howItWorksBold,children:"Component:"})," React component name from fiber"]})})]})]}):t(M,{children:l(a,{style:e.section,children:[l(p,{children:[t(p.Icon,{icon:de,color:o.color.textTertiary,size:12}),t(p.Title,{children:"SETTINGS"})]}),l(a,{style:e.settingsSection,children:[l(a,{style:e.settingItem,children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Show Render Count"}),t(w,{testID:R("showRenderCount"),value:s.showRenderCount,onValueChange:n=>{h({showRenderCount:n});if(!n&&s.trackRenderCauses){h({trackRenderCauses:false})}},trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.showRenderCount?o.color.accent:o.color.knob})]}),t(i,{style:e.settingDescription,children:"Display render count badge on highlights. Disabling improves performance by skipping count tracking."})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:[e.settingLabel,!s.showRenderCount&&e.settingLabelDisabled],children:"Track Render Causes"}),t(w,{testID:R("trackRenderCauses"),value:s.trackRenderCauses,onValueChange:n=>h({trackRenderCauses:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.warning+"80"},thumbColor:s.trackRenderCauses?o.color.warning:o.color.knob,disabled:!s.showRenderCount})]}),l(i,{style:e.settingDescription,children:["Detect WHY components render (props, hooks, parent re-render).",!s.showRenderCount&&l(i,{style:e.settingWarning,children:["\n",'Requires "Show Render Count" to be enabled.']})]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:[e.settingLabel,!s.trackRenderCauses&&e.settingLabelDisabled],children:"Enable Render History"}),t(w,{testID:R("enableRenderHistory"),value:s.enableRenderHistory,onValueChange:n=>h({enableRenderHistory:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.enableRenderHistory?o.color.accent:o.color.knob,disabled:!s.trackRenderCauses})]}),l(i,{style:e.settingDescription,children:["Store render events for each component to view in the History tab.",!s.trackRenderCauses&&l(i,{style:e.settingWarning,children:["\n",'Requires "Track Render Causes" to be enabled.']})]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Debug Log Level"}),t(a,{style:e.settingValue,children:t(i,{testID:"buoy-highlight-setting-debugLogLevel-value",style:[e.settingValueText,s.debugLogLevel!=="off"&&{color:o.color.warning}],children:j.find(n=>n.value===s.debugLogLevel)?.label||"Off"})})]}),t(i,{style:e.settingDescription,children:"Control console logging verbosity for render cause detection."}),t(a,{style:e.batchSizePresets,children:j.map(n=>t(g,{style:[e.batchSizePreset,s.debugLogLevel===n.value&&e.batchSizePresetActive,n.value!=="off"&&s.debugLogLevel===n.value&&{backgroundColor:o.color.warningSoft,borderColor:o.color.warning}],onPress:()=>h({debugLogLevel:n.value}),testID:`buoy-highlight-preset-log-${n.value}`,accessibilityRole:"button",accessibilityLabel:`Debug log level ${n.label}`,children:t(i,{style:[e.batchSizePresetText,s.debugLogLevel===n.value&&e.batchSizePresetTextActive,n.value!=="off"&&s.debugLogLevel===n.value&&{color:o.color.warning}],children:n.label})},n.value))}),l(i,{style:e.settingDescriptionMuted,children:[j.find(n=>n.value===s.debugLogLevel)?.description,s.debugLogLevel!=="off"&&" \u2022 Check Metro console for logs"]})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Batch Size"}),t(a,{style:e.settingValue,children:t(i,{testID:"buoy-highlight-setting-batchSize-value",style:e.settingValueText,children:s.batchSize})})]}),t(i,{style:e.settingDescription,children:"Maximum components to highlight per render update. Higher values capture more re-renders but may impact performance on complex screens."}),t(a,{style:e.batchSizePresets,children:be.map(n=>t(g,{style:[e.batchSizePreset,s.batchSize===n.value&&e.batchSizePresetActive],onPress:()=>h({batchSize:n.value}),testID:`buoy-highlight-preset-batch-${n.value}`,accessibilityRole:"button",accessibilityLabel:`Batch size ${n.label}`,children:t(i,{style:[e.batchSizePresetText,s.batchSize===n.value&&e.batchSizePresetTextActive],children:n.label})},n.value))})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Show host views"}),t(w,{testID:R("showHostViews"),value:!!s.showHostViews,onValueChange:n=>h({showHostViews:n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:s.showHostViews?o.color.accent:o.color.knob})]}),t(i,{style:e.settingDescription,children:"Include anonymous View / RCTView / Text hosts. Off by default so the list is named composites (what actually re-rendered)."})]}),l(a,{style:[e.settingItem,e.settingItemSpaced],children:[l(a,{style:e.settingHeader,children:[t(i,{style:e.settingLabel,children:"Highlight Dev Tools"}),t(w,{testID:R("excludeDevTools"),value:!s.excludeDevTools,onValueChange:n=>h({excludeDevTools:!n}),trackColor:{false:o.color.surfaceElevated,true:o.color.accent+"80"},thumbColor:!s.excludeDevTools?o.color.accent:o.color.knob})]}),l(i,{style:e.settingDescription,children:["Show re-render highlights on Buoy dev tools (floating menu, modals, etc.). Useful for optimizing the dev tools themselves.",!s.excludeDevTools&&l(i,{style:e.settingWarning,children:["\n","The highlight overlay is always excluded to prevent infinite loops."]})]})]})]})]})})})})}const e=ie.create({container:{flex:1,backgroundColor:"transparent"},scrollView:{flex:1},scrollContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:32},section:{backgroundColor:o.color.surface,borderRadius:8,borderWidth:1,borderColor:o.color.border,marginBottom:12,overflow:"hidden"},sectionDescription:{fontSize:11,color:o.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:16},patternChips:{flexDirection:"row",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:12},patternChip:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:4,paddingLeft:4,paddingRight:6,maxWidth:"100%",gap:4},patternChipBadge:{paddingVertical:2,paddingHorizontal:5,borderRadius:4},patternChipBadgeText:{fontSize:9,fontWeight:"700"},patternChipValue:{fontSize:11,color:o.color.text,fontFamily:v,flexShrink:1},patternChipX:{marginLeft:2},addPatternRow:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},addButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1,borderStyle:"dashed",gap:6},addButtonText:{fontSize:12,fontWeight:"500"},typePicker:{flexDirection:"row",alignItems:"center",gap:8},typePickerRow:{flex:1,flexDirection:"row",flexWrap:"wrap",gap:8},typeOption:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,borderWidth:1,backgroundColor:o.color.surfaceElevated,gap:6},typeOptionText:{fontSize:11,fontWeight:"600"},typePickerCancel:{padding:8},patternInputContainer:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:o.color.border,paddingLeft:4,paddingRight:8,paddingVertical:4,gap:4},patternInput:{flex:1,fontSize:12,color:o.color.text,paddingVertical:6,paddingHorizontal:4},addPatternButton:{paddingVertical:6,paddingHorizontal:10,borderRadius:4},addPatternButtonText:{fontSize:11,fontWeight:"600"},cancelButton:{padding:4},categoryBadgeScroll:{marginTop:12},categoryBadgeScrollContent:{paddingHorizontal:16,gap:8},categoryBadge:{flexDirection:"row",alignItems:"center",paddingVertical:8,paddingLeft:10,paddingRight:6,borderRadius:8,borderWidth:1,gap:6},categoryBadgeText:{fontSize:11,fontWeight:"600"},categoryBadgeCountBubble:{paddingHorizontal:6,paddingVertical:2,borderRadius:10,minWidth:20,alignItems:"center"},categoryBadgeCount:{fontSize:10,fontWeight:"600"},detectedItemsContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16},detectedItemsScroll:{maxHeight:200},detectedItems:{flexDirection:"row",flexWrap:"wrap",gap:8},detectedItem:{flexDirection:"row",alignItems:"center",backgroundColor:o.color.surfaceElevated,borderRadius:6,borderWidth:1,paddingVertical:6,paddingHorizontal:10,gap:6},detectedItemText:{fontSize:11,color:o.color.text,fontFamily:v},emptyText:{fontSize:11,color:o.color.textTertiary,fontStyle:"italic",textAlign:"center",paddingVertical:16,paddingHorizontal:16},howItWorks:{paddingHorizontal:16,paddingVertical:12},howItWorksText:{fontSize:11,color:o.color.textTertiary,lineHeight:18,fontFamily:v},howItWorksBold:{fontWeight:"700",color:o.color.textSecondary},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:32},actionPopup:{backgroundColor:o.color.surface,borderRadius:12,borderWidth:1,borderColor:o.color.border,width:"100%",maxWidth:300,overflow:"hidden"},actionPopupHeader:{padding:16,borderBottomWidth:1,borderBottomColor:o.color.separator,alignItems:"center"},actionPopupButtons:{flexDirection:"row",padding:12,gap:8},actionPopupButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:12,borderRadius:8,gap:8},actionPopupInclude:{backgroundColor:o.color.accentSoft},actionPopupExclude:{backgroundColor:o.color.accentSoft},actionPopupButtonText:{fontSize:13,fontWeight:"600"},actionPopupCancel:{padding:12,borderTopWidth:1,borderTopColor:o.color.separator,alignItems:"center"},actionPopupCancelText:{fontSize:13,color:o.color.textTertiary,fontWeight:"500"},settingsSection:{paddingHorizontal:16,paddingTop:8,paddingBottom:16},settingItem:{gap:8},settingItemSpaced:{marginTop:16,paddingTop:16,borderTopWidth:1,borderTopColor:o.color.separator},settingHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},settingLabel:{fontSize:13,fontWeight:"600",color:o.color.text},settingValue:{backgroundColor:o.color.fillSecondary,paddingHorizontal:10,paddingVertical:4,borderRadius:6},settingValueText:{fontSize:12,fontWeight:"700",color:o.color.textTertiary,fontFamily:v},settingDescription:{fontSize:11,color:o.color.textSecondary,lineHeight:16},settingDescriptionMuted:{fontSize:10,color:o.color.textTertiary,lineHeight:14,marginTop:4,fontStyle:"italic"},settingLabelDisabled:{color:o.color.textTertiary},settingWarning:{color:o.color.warning,fontWeight:"500"},batchSizePresets:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:4},batchSizePreset:{paddingVertical:8,paddingHorizontal:14,borderRadius:6,backgroundColor:o.color.surfaceElevated,borderWidth:1,borderColor:o.color.border},batchSizePresetActive:{backgroundColor:o.color.fillSecondary,borderColor:o.color.fillTertiary},batchSizePresetText:{fontSize:12,fontWeight:"500",color:o.color.textSecondary,fontFamily:v},batchSizePresetTextActive:{color:o.color.textTertiary,fontWeight:"700"},renderCountRangeContainer:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,gap:12},renderCountInputRow:{flexDirection:"row",alignItems:"center",gap:12},renderCountInputGroup:{flex:1,gap:4},renderCountLabel:{fontSize:10,fontWeight:"600",color:o.color.textTertiary,textTransform:"uppercase",letterSpacing:.5},renderCountInput:{backgroundColor:o.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:o.color.border,paddingVertical:10,paddingHorizontal:12,fontSize:14,fontWeight:"600",color:o.color.text,fontFamily:v,textAlign:"center"},renderCountSeparator:{fontSize:12,color:o.color.textTertiary,marginTop:18},clearRangeButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:8,paddingHorizontal:12,borderRadius:6,backgroundColor:o.color.warningSoft,borderWidth:1,borderColor:o.color.warning+"40",gap:6,alignSelf:"center"},clearRangeButtonText:{fontSize:11,fontWeight:"600",color:o.color.warning}});export default HighlightFilterView;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import q,{useState as j,useEffect as k,useRef as C,useCallback as m,memo as v,useMemo as y}from"react";import{View as z,Text as b,FlatList as D,StyleSheet as P}from"react-native";import{RenderTracker as r}from"../utils/RenderTracker";import{RenderListItem as
|
|
1
|
+
"use strict";import q,{useState as j,useEffect as k,useRef as C,useCallback as m,memo as v,useMemo as y}from"react";import{View as z,Text as b,FlatList as D,StyleSheet as P,Keyboard as N}from"react-native";import{RenderTracker as r}from"../utils/RenderTracker";import{RenderListItem as V}from"./RenderListItem";import{Lock as M,night as u,useLimit as U,ToolEmptyState as _,resolveListEmptyState as H}from"@buoy-gg/shared-ui";import{jsx as s,jsxs as I}from"react/jsx-runtime";function K({searchText:t,filters:R,onSelectRender:g,onStatsChange:p,onRendersChange:i,isTracking:S,isPro:x=false}){const[o,h]=j(()=>r.getFilteredRenders(t));const w=C(null);k(()=>{const e=r.subscribe(()=>{const n=r.getFilteredRenders(t);h(n);p(r.getStats());i?.(n)});return e},[t,p,i]);k(()=>{const e=r.getFilteredRenders(t);h(e);i?.(e)},[t,R,i]);const L=U("highlightUpdates.components");const l=x?Infinity:L;const d=y(()=>{return o.slice(0,l)},[o,l]);const c=y(()=>{return Math.max(0,o.length-l)},[o.length,l]);const B=m(e=>e.id,[]);const E=m(({item:e,index:n})=>s(V,{render:e,onPress:()=>{N.dismiss();g(e,n,d)}}),[g,d]);const F=m(()=>{if(c<=0)return null;return I(z,{testID:"buoy-highlight-locked",style:a.lockedBanner,children:[s(M,{size:14,color:u.color.warning}),I(b,{testID:"buoy-highlight-locked-text",style:a.lockedBannerText,children:[c," more ",c===1?"component":"components"," locked"]}),s(b,{style:a.lockedBannerSubtext,children:"Upgrade to Pro"})]})},[c]);if(o.length===0){const e=t.trim();const n=r.getStats().totalComponents;const f=e?r.getFilteredRenders("").length:0;const T=H({subject:"components",verb:"tracked",search:t,total:e?f:n,capturing:S,blocked:e&&f===0&&n>0?"The active filters hide everything tracked, so there is nothing to search.":void 0,waiting:{otto:"stare",title:"No renders tracked",message:"Component renders will appear here"},paused:{title:"No renders tracked",message:"Enable tracking to start capturing"}});return s(_,{...T,testID:"buoy-highlight-empty"})}return s(D,{testID:"buoy-highlight-list",ref:w,keyboardShouldPersistTaps:"handled",data:d,renderItem:E,keyExtractor:B,contentContainerStyle:a.listContent,showsVerticalScrollIndicator:true,initialNumToRender:10,maxToRenderPerBatch:10,windowSize:10,scrollEnabled:false,ListFooterComponent:F})}export const IsolatedRenderList=v(K);const a=P.create({listContent:{paddingTop:8},lockedBanner:{flexDirection:"row",alignItems:"center",justifyContent:"center",paddingVertical:12,paddingHorizontal:16,marginTop:8,gap:8},lockedBannerText:{color:u.color.warning,fontSize:13,fontWeight:"500"},lockedBannerSubtext:{color:u.color.textTertiary,fontSize:12}});export default IsolatedRenderList;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{getDOMControlProps as
|
|
1
|
+
"use strict";import{getDOMControlProps as k}from"@buoy-gg/shared-ui/utils";const w=new Set(["button","link","menuitem","tab","switch","checkbox","radio","option","textbox","slider"]);const m=new Set(["SCRIPT","STYLE","NOSCRIPT","TEMPLATE","SVG","PATH","HEAD","META","LINK"]);const h=80;function B(t){for(const r in t){if(r.startsWith("__reactContainer$")||r==="_reactRootContainer")return true}return false}function g(t){if(t.getAttribute("aria-hidden")==="true")return true;const r=getComputedStyle(t);return r.display==="none"||r.visibility==="hidden"}function x(t){const r=t;return typeof r.$$click==="function"||typeof r.onclick==="function"||t.tabIndex>=0&&t.hasAttribute("tabindex")}const O=new Set(["B","STRONG","EM","I","U","S","SPAN","SMALL","MARK","CODE","SUB","SUP","ABBR","CITE","Q","TIME","BR"]);function E(t){return Array.from(t.childNodes).some(r=>r.nodeType===3&&(r.textContent??"").trim()!=="")}function S(t){return O.has(t.tagName.toUpperCase())&&!t.hasAttribute("data-testid")&&!t.hasAttribute("aria-label")&&!t.hasAttribute("role")&&!x(t)&&!t.querySelector(`${p}, [role], [data-testid], [aria-label]`)}function R(t){let r="";const n=E(t);const e=o=>{if(o.nodeType===3)r+=o.textContent??"";else if(n&&o.nodeType===1){const i=o;if(i.tagName==="BR")r+=" ";else if(S(i)&&!g(i))i.childNodes.forEach(e)}};t.childNodes.forEach(e);r=r.replace(/\s+/g," ").trim();return r||void 0}function C(t,r){if(!t)return void 0;return r||t.length<=h?t:`${t.slice(0,h)}\u2026`}function P(t,r){return C((t.innerText??t.textContent??"").replace(/\s+/g," ").trim(),r)}const c="input, textarea, select";const p=`${c}, button, a[href]`;function b(t){let r="";const n=e=>{if(e.nodeType===3)r+=e.textContent??"";else if(e.nodeType===1&&!e.matches(c))e.childNodes.forEach(n)};n(t);return r.replace(/\s+/g," ").trim()}function N(t){let r=t;for(let n=0;n<3;n++){const e=r.previousElementSibling;if(e){const i=b(e);return i&&i.length<=h&&!e.matches(p)&&!e.querySelector(p)?e:null}const o=r.parentElement;if(!o||o.querySelectorAll(c).length>1)return null;r=o}return null}function v(t){const r=(t.getAttribute("aria-labelledby")??"").split(/\s+/).map(o=>o&&document.getElementById(o)?b(document.getElementById(o)):"").filter(Boolean).join(" ");const n=Array.from(t.labels??[]).map(b).filter(Boolean).join(" ");const e=t.matches(c)?N(t):null;return r||t.getAttribute("aria-label")||n||t.getAttribute("title")||t.getAttribute("placeholder")||(e?b(e):"")}export function labeledField(t){const r=t.closest("label")?.control;if(r instanceof HTMLElement)return r;const n=t.closest("[id]")?.id;if(n){for(const e of Array.from(document.querySelectorAll("[aria-labelledby]"))){if(e.matches(`${c}, [role=textbox]`)&&e.getAttribute("aria-labelledby").split(/\s+/).includes(n))return e}}for(let e=t,o=0;e&&o<3;e=e.parentElement,o++){const i=e.nextElementSibling;const s=i?.matches(c)?i:i?.querySelector(c);if(s instanceof HTMLElement&&N(s)===e)return s}return null}export function collectDOMElements(t={}){if(typeof document==="undefined"||!document.body)return[];const r=[];const n=(e,o,i)=>{if(m.has(e.tagName.toUpperCase())||B(e)||g(e))return;const s=i||e.hasAttribute("data-buoy-root")||e.hasAttribute("data-buoy-portal-host");const a=e.tagName.toLowerCase();const d=e.getAttribute("role")??void 0;const u=a==="button"||a==="a"&&e.hasAttribute("href")||a==="input"||a==="textarea"||a==="select"||d!==void 0&&w.has(d)||x(e);const y=e.getAttribute("data-testid")??void 0;const A=u?C(v(e),!!t.fullText):e.getAttribute("aria-label")??void 0;const T=u?P(e,!!t.fullText):o?void 0:R(e);if(u||y||A||T){const l={"data-testid":y,"aria-label":A,role:d,id:e.id||void 0};if(u&&a!=="input"&&a!=="textarea"&&a!=="select")l.onClick=()=>e.click();const f=k(e,l);if(d==="switch"||d==="checkbox"){const L=e.getAttribute("aria-checked")==="true";f.value=L;f.onValueChange=M=>{if(Boolean(M)!==(e.getAttribute("aria-checked")==="true"))e.click()};delete f.onPress}if(e.disabled)delete f.onPress;r.push({element:e,props:f,text:T,buoy:s})}const I=!u&&!o&&E(e);for(const l of Array.from(e.children)){if(I&&S(l))continue;if(l instanceof HTMLElement)n(l,o||u,s)}};n(document.body,false,false);return r}export function domElementName(t){const r=globalThis[Symbol.for("buoy.dom.componentName")];try{const n=r?.(t);if(n)return n}catch{}return t.tagName.toLowerCase()}export function watchDOMChanges(){if(typeof MutationObserver==="undefined"||typeof document==="undefined")return()=>0;let t=0;const r=new MutationObserver(()=>{t+=1});r.observe(document.body,{subtree:true,childList:true,characterData:true,attributes:true});return()=>{r.disconnect();return t}}
|