@buoy-gg/react-query 7.0.40 → 7.0.42

package/lib/commonjs/react-query/components/QueryFilterViewV3.js

@@ -1,224 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.QueryFilterViewV3 = QueryFilterViewV3;
-var _react = require("react");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _getQueryStatusLabel = require("../utils/getQueryStatusLabel");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Comprehensive filter control panel for React Query DevTools matching the Network DevTools
- * filter UI pattern. Provides status filtering and query key pattern-based filtering.
- */
-function QueryFilterViewV3({
-  queries,
-  activeFilter,
-  onFilterChange,
-  ignoredPatterns,
-  onPatternToggle,
-  includedPatterns,
-  onIncludedPatternToggle
-}) {
-  // Calculate status counts
-  const statusCounts = (0, _react.useMemo)(() => {
-    const counts = {
-      all: queries.length,
-      disabled: 0,
-      fresh: 0,
-      stale: 0,
-      fetching: 0,
-      paused: 0,
-      inactive: 0,
-      error: 0
-    };
-    queries.forEach(query => {
-      // Count by the status LABEL (single source of truth) so the Error chip's
-      // count matches exactly what the cards show and what the Error filter
-      // returns. (Previously error was counted off `state.error`, a different
-      // axis than the label, so the count, cards, and filter could disagree.)
-      const status = (0, _getQueryStatusLabel.getQueryStatusLabel)(query);
-      if (status === "disabled") counts.disabled++;else if (status === "error") counts.error++;else if (status === "fresh") counts.fresh++;else if (status === "stale") counts.stale++;else if (status === "fetching") counts.fetching++;else if (status === "paused") counts.paused++;else if (status === "inactive") counts.inactive++;
-    });
-    return counts;
-  }, [queries]);
-
-  // Extract available query keys (excluding numeric-only keys)
-  const availableQueryKeys = (0, _react.useMemo)(() => {
-    const keys = new Set();
-    queries.forEach(query => {
-      if (!query?.queryKey) return;
-      const queryKeys = Array.isArray(query.queryKey) ? query.queryKey : [query.queryKey];
-      queryKeys.forEach(key => {
-        if (key != null) {
-          const keyStr = String(key);
-          // Skip if key is purely numeric (likely a dynamic ID)
-          if (!/^\d+$/.test(keyStr)) {
-            keys.add(keyStr);
-          }
-        }
-      });
-    });
-    return Array.from(keys).sort().slice(0, 50); // Limit to 50
-  }, [queries]);
-
-  // Convert available query keys to suggestion items (just strings)
-  const suggestionItems = (0, _react.useMemo)(() => {
-    return availableQueryKeys;
-  }, [availableQueryKeys]);
-
-  // Calculate filtered query count based on active patterns
-  const filteredCount = (0, _react.useMemo)(() => {
-    let filtered = queries;
-
-    // Apply included patterns filter
-    if (includedPatterns.size > 0) {
-      filtered = filtered.filter(query => {
-        if (!query?.queryKey) return false;
-        const keys = Array.isArray(query.queryKey) ? query.queryKey : [query.queryKey];
-        const keyString = keys.filter(k => k != null).map(k => String(k)).join(" ").toLowerCase();
-        return Array.from(includedPatterns).some(pattern => keyString.includes(pattern.toLowerCase()));
-      });
-    }
-
-    // Apply ignored patterns filter
-    if (ignoredPatterns.size > 0) {
-      filtered = filtered.filter(query => {
-        if (!query?.queryKey) return true;
-        const keys = Array.isArray(query.queryKey) ? query.queryKey : [query.queryKey];
-        const keyString = keys.filter(k => k != null).map(k => String(k)).join(" ").toLowerCase();
-        return !Array.from(ignoredPatterns).some(pattern => keyString.includes(pattern.toLowerCase()));
-      });
-    }
-    return filtered.length;
-  }, [queries, includedPatterns, ignoredPatterns]);
-
-  // Build the filter configuration
-  const filterConfig = (0, _react.useMemo)(() => {
-    return {
-      filterSummarySection: {
-        enabled: true,
-        totalCount: queries.length,
-        filteredCount: filteredCount,
-        includePatterns: includedPatterns,
-        excludePatterns: ignoredPatterns
-      },
-      sections: [
-      // Status section - radio button style
-      {
-        id: "status",
-        title: "Status",
-        type: "status",
-        data: [{
-          id: "status::all",
-          label: "All",
-          count: statusCounts.all,
-          icon: _sharedUi.Globe,
-          color: _sharedUi.buoyColors.primary,
-          isActive: !activeFilter || activeFilter === "all"
-        }, {
-          id: "status::disabled",
-          label: "Disabled",
-          count: statusCounts.disabled,
-          icon: _sharedUi.XCircle,
-          color: _sharedUi.buoyColors.textMuted,
-          isActive: activeFilter === "disabled"
-        }, {
-          id: "status::fresh",
-          label: "Fresh",
-          count: statusCounts.fresh,
-          icon: _sharedUi.Zap,
-          color: _sharedUi.buoyColors.success,
-          isActive: activeFilter === "fresh"
-        }, {
-          id: "status::stale",
-          label: "Stale",
-          count: statusCounts.stale,
-          icon: _sharedUi.Clock,
-          color: _sharedUi.buoyColors.warning,
-          isActive: activeFilter === "stale"
-        }, {
-          id: "status::fetching",
-          label: "Fetching",
-          count: statusCounts.fetching,
-          icon: _sharedUi.RefreshCw,
-          color: _sharedUi.buoyColors.primary,
-          isActive: activeFilter === "fetching"
-        }, {
-          id: "status::paused",
-          label: "Paused",
-          count: statusCounts.paused,
-          icon: _sharedUi.Clock,
-          color: _sharedUi.buoyColors.textMuted,
-          isActive: activeFilter === "paused"
-        }, {
-          id: "status::inactive",
-          label: "Inactive",
-          count: statusCounts.inactive,
-          icon: _sharedUi.Clock,
-          color: _sharedUi.buoyColors.textSecondary,
-          isActive: activeFilter === "inactive"
-        }, {
-          id: "status::error",
-          label: "Error",
-          count: statusCounts.error,
-          icon: _sharedUi.XCircle,
-          color: _sharedUi.buoyColors.error,
-          isActive: activeFilter === "error"
-        }]
-      }],
-      addFilterSection: {
-        enabled: true,
-        placeholder: "Enter pattern to exclude...",
-        title: "EXCLUDE FILTERS",
-        icon: _sharedUi.Filter
-      },
-      includeOnlySection: {
-        enabled: true,
-        title: "INCLUDE ONLY FILTERS",
-        description: "Show ONLY queries matching these patterns. All non-matching queries will be hidden.",
-        placeholder: "Enter pattern to include...",
-        icon: _sharedUi.Eye,
-        patterns: includedPatterns,
-        onPatternToggle: onIncludedPatternToggle,
-        onPatternAdd: onIncludedPatternToggle
-      },
-      availableItemsSection: {
-        enabled: true,
-        title: "AVAILABLE QUERY KEYS",
-        emptyMessage: "No queries found. Query keys will appear here once queries are active.",
-        items: suggestionItems
-      },
-      howItWorksSection: {
-        enabled: true,
-        title: "HOW QUERY FILTERS WORK",
-        description: "There are two types of query key filters:",
-        examples: ["", "INCLUDE ONLY (green):", "• Shows ONLY queries matching the pattern", "• Example: 'rewards' → shows only reward queries", "• When active, non-matching queries are hidden", "", "EXCLUDE (blue):", "• Hides queries matching the pattern", "• Example: 'analytics' → hides analytics queries", "", "Filters are case-insensitive and match partial keys."]
-      },
-      activePatterns: ignoredPatterns
-    };
-  }, [statusCounts, activeFilter, ignoredPatterns, includedPatterns, suggestionItems, onIncludedPatternToggle, queries.length, filteredCount]);
-
-  // Handle filter item clicks
-  const handleFilterSelect = itemId => {
-    const [section, value] = itemId.split("::");
-    if (section === "status") {
-      // Status filters are mutually exclusive
-      if (value === "all" || activeFilter === value) {
-        onFilterChange(null);
-      } else {
-        onFilterChange(value);
-      }
-    } else if (section === "suggestion") {
-      // Toggle pattern
-      onPatternToggle(value);
-    }
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.DynamicFilterView, {
-    ...filterConfig,
-    onFilterChange: handleFilterSelect,
-    onPatternToggle: onPatternToggle,
-    onPatternAdd: onPatternToggle
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.QueryFilterViewV3=QueryFilterViewV3;var _react=require("react");var _sharedUi=require("@buoy-gg/shared-ui");var _getQueryStatusLabel=require("../utils/getQueryStatusLabel");var _jsxRuntime=require("react/jsx-runtime");function QueryFilterViewV3({queries:o,activeFilter:i,onFilterChange:d,ignoredPatterns:a,onPatternToggle:c,includedPatterns:n,onIncludedPatternToggle:y}){const l=(0,_react.useMemo)(()=>{const e={all:o.length,disabled:0,fresh:0,stale:0,fetching:0,paused:0,inactive:0,error:0};o.forEach(t=>{const r=(0,_getQueryStatusLabel.getQueryStatusLabel)(t);if(r==="disabled")e.disabled++;else if(r==="error")e.error++;else if(r==="fresh")e.fresh++;else if(r==="stale")e.stale++;else if(r==="fetching")e.fetching++;else if(r==="paused")e.paused++;else if(r==="inactive")e.inactive++});return e},[o]);const f=(0,_react.useMemo)(()=>{const e=new Set;o.forEach(t=>{if(!t?.queryKey)return;const r=Array.isArray(t.queryKey)?t.queryKey:[t.queryKey];r.forEach(u=>{if(u!=null){const s=String(u);if(!/^\d+$/.test(s)){e.add(s)}}})});return Array.from(e).sort().slice(0,50)},[o]);const h=(0,_react.useMemo)(()=>{return f},[f]);const b=(0,_react.useMemo)(()=>{let e=o;if(n.size>0){e=e.filter(t=>{if(!t?.queryKey)return false;const r=Array.isArray(t.queryKey)?t.queryKey:[t.queryKey];const u=r.filter(s=>s!=null).map(s=>String(s)).join(" ").toLowerCase();return Array.from(n).some(s=>u.includes(s.toLowerCase()))})}if(a.size>0){e=e.filter(t=>{if(!t?.queryKey)return true;const r=Array.isArray(t.queryKey)?t.queryKey:[t.queryKey];const u=r.filter(s=>s!=null).map(s=>String(s)).join(" ").toLowerCase();return!Array.from(a).some(s=>u.includes(s.toLowerCase()))})}return e.length},[o,n,a]);const p=(0,_react.useMemo)(()=>{return{filterSummarySection:{enabled:true,totalCount:o.length,filteredCount:b,includePatterns:n,excludePatterns:a},sections:[{id:"status",title:"Status",type:"status",data:[{id:"status::all",label:"All",count:l.all,icon:_sharedUi.Globe,color:_sharedUi.buoyColors.primary,isActive:!i||i==="all"},{id:"status::disabled",label:"Disabled",count:l.disabled,icon:_sharedUi.XCircle,color:_sharedUi.buoyColors.textMuted,isActive:i==="disabled"},{id:"status::fresh",label:"Fresh",count:l.fresh,icon:_sharedUi.Zap,color:_sharedUi.buoyColors.success,isActive:i==="fresh"},{id:"status::stale",label:"Stale",count:l.stale,icon:_sharedUi.Clock,color:_sharedUi.buoyColors.warning,isActive:i==="stale"},{id:"status::fetching",label:"Fetching",count:l.fetching,icon:_sharedUi.RefreshCw,color:_sharedUi.buoyColors.primary,isActive:i==="fetching"},{id:"status::paused",label:"Paused",count:l.paused,icon:_sharedUi.Clock,color:_sharedUi.buoyColors.textMuted,isActive:i==="paused"},{id:"status::inactive",label:"Inactive",count:l.inactive,icon:_sharedUi.Clock,color:_sharedUi.buoyColors.textSecondary,isActive:i==="inactive"},{id:"status::error",label:"Error",count:l.error,icon:_sharedUi.XCircle,color:_sharedUi.buoyColors.error,isActive:i==="error"}]}],addFilterSection:{enabled:true,placeholder:"Enter pattern to exclude...",title:"EXCLUDE FILTERS",icon:_sharedUi.Filter},includeOnlySection:{enabled:true,title:"INCLUDE ONLY FILTERS",description:"Show ONLY queries matching these patterns. All non-matching queries will be hidden.",placeholder:"Enter pattern to include...",icon:_sharedUi.Eye,patterns:n,onPatternToggle:y,onPatternAdd:y},availableItemsSection:{enabled:true,title:"AVAILABLE QUERY KEYS",emptyMessage:"No queries found. Query keys will appear here once queries are active.",items:h},howItWorksSection:{enabled:true,title:"HOW QUERY FILTERS WORK",description:"There are two types of query key filters:",examples:["","INCLUDE ONLY (green):","\u2022 Shows ONLY queries matching the pattern","\u2022 Example: 'rewards' \u2192 shows only reward queries","\u2022 When active, non-matching queries are hidden","","EXCLUDE (blue):","\u2022 Hides queries matching the pattern","\u2022 Example: 'analytics' \u2192 hides analytics queries","","Filters are case-insensitive and match partial keys."]},activePatterns:a}},[l,i,a,n,h,y,o.length,b]);const m=e=>{const[t,r]=e.split("::");if(t==="status"){if(r==="all"||i===r){d(null)}else{d(r)}}else if(t==="suggestion"){c(r)}};return(0,_jsxRuntime.jsx)(_sharedUi.DynamicFilterView,{...p,onFilterChange:m,onPatternToggle:c,onPatternAdd:c})}

package/lib/commonjs/react-query/components/QuerySelector.js

@@ -1,209 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.QuerySelector = QuerySelector;
-var _reactNative = require("react-native");
-var _getQueryStatusColor = require("../utils/getQueryStatusColor");
-var _QueryDebugInfo = require("./QueryDebugInfo");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Modal selector that lists all known queries, highlighting status and enabling the user to focus
- * a specific query within the dev tools experience.
- */
-function QuerySelector({
-  queries,
-  selectedQuery,
-  isOpen,
-  onClose,
-  onSelect
-}) {
-  const getQueryDisplayName = query => {
-    return Array.isArray(query.queryKey) ? query.queryKey.join(" - ") : String(query.queryKey);
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
-    accessibilityLabel: "Query selector",
-    accessibilityHint: "View query selector",
-    "sentry-label": "ignore query selector",
-    visible: isOpen,
-    transparent: true,
-    animationType: "fade",
-    onRequestClose: onClose,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-      accessibilityLabel: "Query selector overlay",
-      accessibilityHint: "View query selector overlay",
-      "sentry-label": "ignore query selector overlay",
-      style: styles.modalOverlay,
-      onPress: onClose,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        accessibilityLabel: "Query selector content",
-        accessibilityHint: "View query selector content",
-        "sentry-label": "ignore query selector content",
-        style: styles.modalContent,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.modalHeader,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.modalTitle,
-            children: "Select Query"
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-            style: styles.modalSubtitle,
-            children: [queries.length, " ", queries.length === 1 ? "query" : "queries", " ", "available"]
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
-          accessibilityLabel: "Query selector scroll view",
-          accessibilityHint: "View query selector scroll view",
-          "sentry-label": "ignore query selector scroll view",
-          style: styles.scrollView,
-          contentContainerStyle: styles.scrollViewContent,
-          showsVerticalScrollIndicator: true,
-          children: queries.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            style: styles.emptyState,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: styles.emptyTitle,
-              children: "No Queries Found"
-            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-              style: styles.emptyDescription,
-              children: ["No React Query queries are currently active.", "\n\n", "To see queries here:", "\n", "\u2022 Make API calls using useQuery", "\n", "\u2022 Ensure queries are within QueryClientProvider", "\n", "\u2022 Check console for debugging info"]
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueryDebugInfo.QueryDebugInfo, {})]
-          }) : queries.map((query, index) => {
-            const displayName = getQueryDisplayName(query);
-            const statusColorName = (0, _getQueryStatusColor.getQueryStatusColor)({
-              queryState: query.state,
-              observerCount: query.getObserversCount(),
-              isStale: query.isStale()
-            });
-
-            // Convert color names to hex colors
-            const colorMap = {
-              blue: "#3B82F6",
-              gray: "#6B7280",
-              purple: "#8B5CF6",
-              yellow: "#F59E0B",
-              green: "#10B981",
-              red: "#EF4444"
-            };
-            const statusColor = colorMap[statusColorName] || "#6B7280";
-            const isSelected = query === selectedQuery;
-            return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-              accessibilityLabel: `Query ${displayName}`,
-              accessibilityHint: `View query ${displayName}`,
-              "sentry-label": `ignore query ${displayName}`,
-              style: [styles.queryItem, isSelected && styles.selectedQueryItem],
-              onPress: () => onSelect(query),
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                style: [styles.statusDot, {
-                  backgroundColor: statusColor
-                }]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: [styles.queryText, isSelected && styles.selectedQueryText],
-                numberOfLines: 1,
-                children: displayName
-              })]
-            }, `${query.queryHash}-${index}`);
-          })
-        })]
-      })
-    })
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  modalOverlay: {
-    flex: 1,
-    backgroundColor: "rgba(0, 0, 0, 0.5)",
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  modalContent: {
-    backgroundColor: "#1F1F1F",
-    borderRadius: 8,
-    width: "80%",
-    maxHeight: "80%",
-    minHeight: "50%",
-    borderWidth: 1,
-    borderColor: "rgba(255, 255, 255, 0.1)",
-    flex: 0
-  },
-  modalHeader: {
-    padding: 16,
-    borderBottomWidth: 1,
-    borderBottomColor: "rgba(255, 255, 255, 0.1)"
-  },
-  modalTitle: {
-    color: "#FFFFFF",
-    fontSize: 16,
-    fontWeight: "600",
-    marginBottom: 4
-  },
-  modalSubtitle: {
-    color: "#9CA3AF",
-    fontSize: 12
-  },
-  scrollView: {
-    flex: 1
-  },
-  scrollViewContent: {
-    padding: 8,
-    flexGrow: 1
-  },
-  emptyState: {
-    padding: 32,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  emptyTitle: {
-    color: "#E5E7EB",
-    fontSize: 16,
-    fontWeight: "500",
-    marginBottom: 8,
-    textAlign: "center"
-  },
-  emptyDescription: {
-    color: "#9CA3AF",
-    fontSize: 14,
-    textAlign: "center",
-    lineHeight: 20
-  },
-  queryItem: {
-    flexDirection: "row",
-    alignItems: "center",
-    padding: 8,
-    borderRadius: 4
-  },
-  selectedQueryItem: {
-    backgroundColor: "rgba(255, 255, 255, 0.1)"
-  },
-  statusDot: {
-    width: 8,
-    height: 8,
-    borderRadius: 4,
-    marginRight: 8
-  },
-  queryText: {
-    color: "#E5E7EB",
-    fontSize: 14,
-    flex: 1
-  },
-  selectedQueryText: {
-    color: "#FFFFFF",
-    fontWeight: "500"
-  },
-  trigger: {
-    flexDirection: "row",
-    alignItems: "center",
-    backgroundColor: "rgba(255, 255, 255, 0.05)",
-    borderRadius: 4,
-    paddingHorizontal: 8,
-    paddingVertical: 6,
-    borderWidth: 1,
-    borderColor: "rgba(255, 255, 255, 0.1)",
-    minWidth: 120,
-    maxWidth: 200
-  },
-  triggerText: {
-    color: "#E5E7EB",
-    fontSize: 12,
-    flex: 1,
-    marginHorizontal: 6
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.QuerySelector=QuerySelector;var _reactNative=require("react-native");var _getQueryStatusColor=require("../utils/getQueryStatusColor");var _QueryDebugInfo=require("./QueryDebugInfo");var _jsxRuntime=require("react/jsx-runtime");function QuerySelector({queries:t,selectedQuery:i,isOpen:s,onClose:l,onSelect:n}){const a=e=>{return Array.isArray(e.queryKey)?e.queryKey.join(" - "):String(e.queryKey)};return(0,_jsxRuntime.jsx)(_reactNative.Modal,{accessibilityLabel:"Query selector",accessibilityHint:"View query selector","sentry-label":"ignore query selector",visible:s,transparent:true,animationType:"fade",onRequestClose:l,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityLabel:"Query selector overlay",accessibilityHint:"View query selector overlay","sentry-label":"ignore query selector overlay",style:styles.modalOverlay,onPress:l,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{accessibilityLabel:"Query selector content",accessibilityHint:"View query selector content","sentry-label":"ignore query selector content",style:styles.modalContent,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.modalHeader,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.modalTitle,children:"Select Query"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.modalSubtitle,children:[t.length," ",t.length===1?"query":"queries"," ","available"]})]}),(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{accessibilityLabel:"Query selector scroll view",accessibilityHint:"View query selector scroll view","sentry-label":"ignore query selector scroll view",style:styles.scrollView,contentContainerStyle:styles.scrollViewContent,showsVerticalScrollIndicator:true,children:t.length===0?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.emptyState,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyTitle,children:"No Queries Found"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.emptyDescription,children:["No React Query queries are currently active.","\n\n","To see queries here:","\n","\u2022 Make API calls using useQuery","\n","\u2022 Ensure queries are within QueryClientProvider","\n","\u2022 Check console for debugging info"]}),(0,_jsxRuntime.jsx)(_QueryDebugInfo.QueryDebugInfo,{})]}):t.map((e,c)=>{const r=a(e);const u=(0,_getQueryStatusColor.getQueryStatusColor)({queryState:e.state,observerCount:e.getObserversCount(),isStale:e.isStale()});const y={blue:"#3B82F6",gray:"#6B7280",purple:"#8B5CF6",yellow:"#F59E0B",green:"#10B981",red:"#EF4444"};const d=y[u]||"#6B7280";const o=e===i;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{accessibilityLabel:`Query ${r}`,accessibilityHint:`View query ${r}`,"sentry-label":`ignore query ${r}`,style:[styles.queryItem,o&&styles.selectedQueryItem],onPress:()=>n(e),children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.statusDot,{backgroundColor:d}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.queryText,o&&styles.selectedQueryText],numberOfLines:1,children:r})]},`${e.queryHash}-${c}`)})})]})})})}const styles=_reactNative.StyleSheet.create({modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center"},modalContent:{backgroundColor:"#1F1F1F",borderRadius:8,width:"80%",maxHeight:"80%",minHeight:"50%",borderWidth:1,borderColor:"rgba(255, 255, 255, 0.1)",flex:0},modalHeader:{padding:16,borderBottomWidth:1,borderBottomColor:"rgba(255, 255, 255, 0.1)"},modalTitle:{color:"#FFFFFF",fontSize:16,fontWeight:"600",marginBottom:4},modalSubtitle:{color:"#9CA3AF",fontSize:12},scrollView:{flex:1},scrollViewContent:{padding:8,flexGrow:1},emptyState:{padding:32,alignItems:"center",justifyContent:"center"},emptyTitle:{color:"#E5E7EB",fontSize:16,fontWeight:"500",marginBottom:8,textAlign:"center"},emptyDescription:{color:"#9CA3AF",fontSize:14,textAlign:"center",lineHeight:20},queryItem:{flexDirection:"row",alignItems:"center",padding:8,borderRadius:4},selectedQueryItem:{backgroundColor:"rgba(255, 255, 255, 0.1)"},statusDot:{width:8,height:8,borderRadius:4,marginRight:8},queryText:{color:"#E5E7EB",fontSize:14,flex:1},selectedQueryText:{color:"#FFFFFF",fontWeight:"500"},trigger:{flexDirection:"row",alignItems:"center",backgroundColor:"rgba(255, 255, 255, 0.05)",borderRadius:4,paddingHorizontal:8,paddingVertical:6,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.1)",minWidth:120,maxWidth:200},triggerText:{color:"#E5E7EB",fontSize:12,flex:1,marginHorizontal:6}});

package/lib/commonjs/react-query/components/ReactQueryDevToolsModal.js

@@ -1,91 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactQueryDevToolsModal = ReactQueryDevToolsModal;
-var _react = require("react");
-var _reactQuery = require("@tanstack/react-query");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _ReactQueryModal = require("./modals/ReactQueryModal");
-var _reactQueryEventStore = require("../stores/reactQueryEventStore");
-var _jsxRuntime = require("react/jsx-runtime");
-/** Configuration options for the high-level React Query dev tools modal wrapper. */
-
-/**
- * Opinionated wrapper around `ReactQueryModal` that manages selection state and filters so
- * consumers can drop in the full dev tools experience with a single component.
- */
-function ReactQueryDevToolsModal({
-  visible,
-  onClose,
-  onMinimize,
-  enableSharedModalDimensions = true
-}) {
-  // Get QueryClient and connect to event store for unified Events DevTools
-  const queryClient = (0, _reactQuery.useQueryClient)();
-  (0, _react.useEffect)(() => {
-    // Connect the QueryClient to the event store so events flow to unified Events DevTools
-    // Only connect if not already connected (to preserve connection across modal open/close)
-    if (!_reactQueryEventStore.reactQueryEventStore.isConnected()) {
-      _reactQueryEventStore.reactQueryEventStore.setQueryClient(queryClient);
-    }
-    // Don't disconnect on unmount - keep the connection for unified Events DevTools
-  }, [queryClient]);
-  const [selectedQueryKey, setSelectedQueryKey] = (0, _react.useState)(undefined);
-  const [selectedMutationId, setSelectedMutationId] = (0, _react.useState)(undefined);
-  const [activeFilter, setActiveFilter] = (0, _react.useState)(null);
-  const [activeTab, setActiveTab] = (0, _react.useState)("queries");
-  const [searchText, setSearchText] = (0, _react.useState)("");
-  const resetState = (0, _react.useCallback)(() => {
-    setSelectedQueryKey(undefined);
-    setSelectedMutationId(undefined);
-    setActiveFilter(null);
-    setActiveTab("queries");
-    setSearchText("");
-  }, []);
-  const handleClose = (0, _react.useCallback)(() => {
-    resetState();
-    onClose();
-  }, [onClose, resetState]);
-  const handleQuerySelect = (0, _react.useCallback)(query => {
-    setSelectedQueryKey(query?.queryKey);
-  }, []);
-  const handleMutationSelect = (0, _react.useCallback)(mutation => {
-    setSelectedMutationId(mutation?.mutationId);
-  }, []);
-  const handleFilterChange = (0, _react.useCallback)(filter => {
-    setActiveFilter(filter);
-  }, []);
-  const handleTabChange = (0, _react.useCallback)(tab => {
-    setActiveTab(tab);
-    setActiveFilter(null);
-    setSelectedQueryKey(undefined);
-    setSelectedMutationId(undefined);
-    setSearchText("");
-  }, []);
-  const handleSearchChange = (0, _react.useCallback)(text => {
-    setSearchText(text);
-  }, []);
-  if (!visible) {
-    return null;
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.TickProvider, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactQueryModal.ReactQueryModal, {
-      visible: visible,
-      selectedQueryKey: selectedQueryKey,
-      selectedMutationId: selectedMutationId,
-      onQuerySelect: handleQuerySelect,
-      onMutationSelect: handleMutationSelect,
-      onClose: handleClose,
-      onMinimize: onMinimize,
-      activeFilter: activeFilter,
-      onFilterChange: handleFilterChange,
-      activeTab: activeTab,
-      onTabChange: handleTabChange,
-      searchText: searchText,
-      onSearchChange: handleSearchChange,
-      enableSharedModalDimensions: enableSharedModalDimensions
-    })
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ReactQueryDevToolsModal=ReactQueryDevToolsModal;var _react=require("react");var _reactQuery=require("@tanstack/react-query");var _sharedUi=require("@buoy-gg/shared-ui");var _ReactQueryModal=require("./modals/ReactQueryModal");var _reactQueryEventStore=require("../stores/reactQueryEventStore");var _jsxRuntime=require("react/jsx-runtime");function ReactQueryDevToolsModal({visible:u,onClose:c,onMinimize:o,enableSharedModalDimensions:d=true}){const s=(0,_reactQuery.useQueryClient)();(0,_react.useEffect)(()=>{if(!_reactQueryEventStore.reactQueryEventStore.isConnected()){_reactQueryEventStore.reactQueryEventStore.setQueryClient(s)}},[s]);const[y,t]=(0,_react.useState)(void 0);const[h,a]=(0,_react.useState)(void 0);const[v,r]=(0,_react.useState)(null);const[S,l]=(0,_react.useState)("queries");const[C,n]=(0,_react.useState)("");const i=(0,_react.useCallback)(()=>{t(void 0);a(void 0);r(null);l("queries");n("")},[]);const Q=(0,_react.useCallback)(()=>{i();c()},[c,i]);const b=(0,_react.useCallback)(e=>{t(e?.queryKey)},[]);const M=(0,_react.useCallback)(e=>{a(e?.mutationId)},[]);const f=(0,_react.useCallback)(e=>{r(e)},[]);const q=(0,_react.useCallback)(e=>{l(e);r(null);t(void 0);a(void 0);n("")},[]);const T=(0,_react.useCallback)(e=>{n(e)},[]);if(!u){return null}return(0,_jsxRuntime.jsx)(_sharedUi.TickProvider,{children:(0,_jsxRuntime.jsx)(_ReactQueryModal.ReactQueryModal,{visible:u,selectedQueryKey:y,selectedMutationId:h,onQuerySelect:b,onMutationSelect:M,onClose:Q,onMinimize:o,activeFilter:v,onFilterChange:f,activeTab:S,onTabChange:q,searchText:C,onSearchChange:T,enableSharedModalDimensions:d})})}

package/lib/commonjs/react-query/components/ReactQuerySection.js

@@ -1,47 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactQuerySection = ReactQuerySection;
-var _reactNative = require("react-native");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _svgs = require("./query-browser/svgs");
-var _jsxRuntime = require("react/jsx-runtime");
-// Component definition moved outside render to prevent recreation on every render
-const TanstackIcon = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-  style: {
-    width: 24,
-    height: 24
-  },
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgs.TanstackLogo, {})
-});
-
-/**
- * React Query section component following composition principles.
- * Encapsulates React Query specific business logic and UI.
- */
-function ReactQuerySection({
-  onPress,
-  getReactBuoySubtitle
-}) {
-  // Format subtitle to be shorter: "45 queries • 10 mutations" → "45Q • 10M"
-  const formatSubtitle = () => {
-    const full = getReactBuoySubtitle();
-    const match = full.match(/(\d+) queries • (\d+) mutations/);
-    if (match) {
-      return `${match[1]}Q • ${match[2]}M`;
-    }
-    return "No data";
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.CyberpunkSectionButton, {
-    id: "react-buoy-dev-tools",
-    title: "QUERY",
-    subtitle: formatSubtitle(),
-    icon: TanstackIcon,
-    iconColor: _sharedUi.buoyColors.error,
-    iconBackgroundColor: _sharedUi.buoyColors.error + "1A",
-    onPress: onPress,
-    index: 1
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ReactQuerySection=ReactQuerySection;var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _svgs=require("./query-browser/svgs");var _jsxRuntime=require("react/jsx-runtime");const TanstackIcon=()=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:{width:24,height:24},children:(0,_jsxRuntime.jsx)(_svgs.TanstackLogo,{})});function ReactQuerySection({onPress:r,getReactBuoySubtitle:t}){const o=()=>{const s=t();const e=s.match(/(\d+) queries • (\d+) mutations/);if(e){return`${e[1]}Q \u2022 ${e[2]}M`}return"No data"};return(0,_jsxRuntime.jsx)(_sharedUi.CyberpunkSectionButton,{id:"react-buoy-dev-tools",title:"QUERY",subtitle:o(),icon:TanstackIcon,iconColor:_sharedUi.buoyColors.error,iconBackgroundColor:_sharedUi.buoyColors.error+"1A",onPress:r,index:1})}

package/lib/commonjs/react-query/components/ReactQueryTracker.js

@@ -1,38 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactQueryTracker = ReactQueryTracker;
-var _react = require("react");
-var _reactQuery = require("@tanstack/react-query");
-var _reactQueryEventStore = require("../stores/reactQueryEventStore");
-/**
- * Connects the React Query event store to the app's QueryClient at startup.
- *
- * Auto-rendered by `FloatingDevTools` (the same treatment `RouteTracker` gets),
- * so nobody has to mount it by hand.
- *
- * Why it has to exist: until this, `setQueryClient` was called from exactly one
- * place — `ReactQueryDevToolsModal`'s mount effect — which meant the store had
- * no client unless somebody opened the React Query TOOL. Anything else that
- * consumes these events was therefore silently empty, and the Events timeline
- * showed a React Query badge with a confident `0` on it: not "nothing to
- * report" but "nobody was listening", and no way to tell the two apart.
- *
- * `useContext(QueryClientContext)`, NOT `useQueryClient()`: the hook throws
- * when there is no provider above it, and this component is mounted whether or
- * not the host app uses React Query at all. An app without a provider just
- * reads `undefined` here and nothing connects, which is the old behaviour.
- */
-function ReactQueryTracker() {
-  const queryClient = (0, _react.useContext)(_reactQuery.QueryClientContext);
-  (0, _react.useEffect)(() => {
-    if (!queryClient) return;
-    // The tool connects the same client when it opens; leave that alone rather
-    // than tearing down its cache subscriptions and rebuilding them.
-    if (_reactQueryEventStore.reactQueryEventStore.isConnected()) return;
-    _reactQueryEventStore.reactQueryEventStore.setQueryClient(queryClient);
-  }, [queryClient]);
-  return null;
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ReactQueryTracker=ReactQueryTracker;var _react=require("react");var _reactQuery=require("@tanstack/react-query");var _reactQueryEventStore=require("../stores/reactQueryEventStore");function ReactQueryTracker(){const e=(0,_react.useContext)(_reactQuery.QueryClientContext);(0,_react.useEffect)(()=>{if(!e)return;if(_reactQueryEventStore.reactQueryEventStore.isConnected())return;_reactQueryEventStore.reactQueryEventStore.setQueryClient(e)},[e]);return null}