@buoy-gg/react-query 7.0.41 → 7.0.43

package/lib/module/react-query/components/query-browser/QueryActions.js

@@ -1,119 +1 @@
-"use strict";
-
-import { useQueryClient } from "@tanstack/react-query";
-import ActionButton from "./ActionButton";
-import { getQueryStatusLabel } from "../../utils/getQueryStatusLabel";
-import triggerLoading from "../../utils/actions/triggerLoading";
-import refetch from "../../utils/actions/refetch";
-import reset from "../../utils/actions/reset";
-import remove from "../../utils/actions/remove";
-import invalidate from "../../utils/actions/invalidate";
-import triggerError from "../../utils/actions/triggerError";
-import { View, Text, StyleSheet } from "react-native";
-import { night } from "@buoy-gg/shared-ui";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * Action panel rendered in query detail views providing mutation simulation and removal controls.
- */
-export default function QueryActions({
-  query,
-  setSelectedQuery
-}) {
-  const queryClient = useQueryClient();
-  if (query === undefined) {
-    return null;
-  }
-  const queryStatus = query.state.status;
-  const isFetching = getQueryStatusLabel(query) === "fetching";
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.container,
-    children: [/*#__PURE__*/_jsxs(View, {
-      style: styles.section,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.sectionLabel,
-        children: "Actions"
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.buttonsRow,
-        children: [/*#__PURE__*/_jsx(ActionButton, {
-          disabled: isFetching,
-          onClick: () => refetch({
-            query
-          }),
-          variant: "refetch",
-          text: "Refetch"
-        }), /*#__PURE__*/_jsx(ActionButton, {
-          disabled: queryStatus === "pending",
-          onClick: () => invalidate({
-            query,
-            queryClient
-          }),
-          variant: "invalidate",
-          text: "Invalidate"
-        }), /*#__PURE__*/_jsx(ActionButton, {
-          disabled: queryStatus === "pending",
-          onClick: () => reset({
-            queryClient,
-            query
-          }),
-          variant: "reset",
-          text: "Reset"
-        }), /*#__PURE__*/_jsx(ActionButton, {
-          disabled: isFetching,
-          onClick: () => {
-            remove({
-              queryClient,
-              query
-            });
-            setSelectedQuery(undefined);
-          },
-          variant: "remove",
-          text: "Remove"
-        })]
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.section,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.sectionLabel,
-        children: "Triggers"
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.buttonsRow,
-        children: [/*#__PURE__*/_jsx(ActionButton, {
-          disabled: false,
-          onClick: () => triggerLoading({
-            query
-          }),
-          variant: "triggerLoading",
-          text: query.state.fetchStatus === "fetching" ? "Restore Loading" : "Trigger Loading"
-        }), /*#__PURE__*/_jsx(ActionButton, {
-          disabled: queryStatus === "pending",
-          onClick: () => triggerError({
-            query,
-            queryClient
-          }),
-          variant: "triggerError",
-          text: queryStatus === "error" ? "Restore Error" : "Trigger Error"
-        })]
-      })]
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  container: {
-    gap: 16
-  },
-  section: {
-    gap: 8
-  },
-  sectionLabel: {
-    fontSize: 11,
-    fontWeight: "600",
-    color: night.color.textTertiary,
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  },
-  buttonsRow: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 8
-  }
-});
+"use strict";import{useQueryClient as g}from"@tanstack/react-query";import i from"./ActionButton";import{getQueryStatusLabel as f}from"../../utils/getQueryStatusLabel";import m from"../../utils/actions/triggerLoading";import p from"../../utils/actions/refetch";import h from"../../utils/actions/reset";import x from"../../utils/actions/remove";import u from"../../utils/actions/invalidate";import b from"../../utils/actions/triggerError";import{View as o,Text as c,StyleSheet as v}from"react-native";import{night as C}from"@buoy-gg/shared-ui";import{jsx as e,jsxs as n}from"react/jsx-runtime";export default function L({query:t,setSelectedQuery:d}){const s=g();if(t===void 0){return null}const a=t.state.status;const l=f(t)==="fetching";return n(o,{style:r.container,children:[n(o,{style:r.section,children:[e(c,{style:r.sectionLabel,children:"Actions"}),n(o,{style:r.buttonsRow,children:[e(i,{disabled:l,onClick:()=>p({query:t}),variant:"refetch",text:"Refetch"}),e(i,{disabled:a==="pending",onClick:()=>u({query:t,queryClient:s}),variant:"invalidate",text:"Invalidate"}),e(i,{disabled:a==="pending",onClick:()=>h({queryClient:s,query:t}),variant:"reset",text:"Reset"}),e(i,{disabled:l,onClick:()=>{x({queryClient:s,query:t});d(void 0)},variant:"remove",text:"Remove"})]})]}),n(o,{style:r.section,children:[e(c,{style:r.sectionLabel,children:"Triggers"}),n(o,{style:r.buttonsRow,children:[e(i,{disabled:false,onClick:()=>m({query:t}),variant:"triggerLoading",text:t.state.fetchStatus==="fetching"?"Restore Loading":"Trigger Loading"}),e(i,{disabled:a==="pending",onClick:()=>b({query:t,queryClient:s}),variant:"triggerError",text:a==="error"?"Restore Error":"Trigger Error"})]})]})]})}const r=v.create({container:{gap:16},section:{gap:8},sectionLabel:{fontSize:11,fontWeight:"600",color:C.color.textTertiary,textTransform:"uppercase",letterSpacing:.5},buttonsRow:{flexDirection:"row",flexWrap:"wrap",gap:8}});

package/lib/module/react-query/components/query-browser/QueryBrowser.js

@@ -1,176 +1 @@
-"use strict";
-
-import { useMemo, useCallback } from "react";
-import { StyleSheet, FlatList } from "react-native";
-import QueryRow from "./QueryRow";
-import useAllQueries from "../../hooks/useAllQueries";
-import { getQueryStatusLabel } from "../../utils/getQueryStatusLabel";
-import { night, ToolEmptyState, EVENT_LIST_PRESET, monoFont } from "@buoy-gg/shared-ui";
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * Scrollable list view of cached queries with filtering support and selection handling.
- */
-export default function QueryBrowser({
-  selectedQuery,
-  onQuerySelect,
-  activeFilter,
-  emptyStateMessage,
-  emptyState,
-  contentContainerStyle,
-  queries: externalQueries,
-  searchText = "",
-  ignoredPatterns = new Set(),
-  includedPatterns = new Set()
-}) {
-  // Holds all queries using the working hook, or use external queries if provided
-  const internalQueries = useAllQueries();
-  const allQueries = externalQueries ?? internalQueries;
-
-  // Filter queries based on active filter, search text, and ignored patterns
-  const filteredQueries = useMemo(() => {
-    let filtered = allQueries;
-
-    // Apply status filter
-    if (activeFilter) {
-      filtered = filtered.filter(query => {
-        const status = getQueryStatusLabel(query);
-        return status === activeFilter;
-      });
-    }
-
-    // Apply search filter on query keys
-    if (searchText) {
-      const searchLower = searchText.toLowerCase();
-      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 keyString.includes(searchLower);
-      });
-    }
-
-    // Apply included patterns filter (show ONLY queries matching any pattern)
-    // This acts as a whitelist - if any include patterns exist, query must match at least one
-    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 true if query matches ANY included pattern
-        return Array.from(includedPatterns).some(pattern => keyString.includes(pattern.toLowerCase()));
-      });
-    }
-
-    // Apply ignored patterns filter (hide queries matching any pattern)
-    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 true if NO patterns match (i.e., keep the query)
-        return !Array.from(ignoredPatterns).some(pattern => keyString.includes(pattern.toLowerCase()));
-      });
-    }
-
-    // Sort by most recently updated (dataUpdatedAt descending)
-    filtered.sort((a, b) => {
-      const aTime = a.state.dataUpdatedAt || 0;
-      const bTime = b.state.dataUpdatedAt || 0;
-      return bTime - aTime; // Most recent first
-    });
-    return filtered;
-  }, [allQueries, activeFilter, searchText, includedPatterns, ignoredPatterns]);
-
-  // Function to handle query selection with stable comparison
-  const handleQuerySelect = useCallback(query => {
-    // Compare queries by their queryKey and queryHash for stable selection
-    const isCurrentlySelected = selectedQuery?.queryHash === query.queryHash;
-    if (isCurrentlySelected) {
-      onQuerySelect(undefined); // Deselect
-      return;
-    }
-    onQuerySelect(query);
-  }, [selectedQuery?.queryHash, onQuerySelect]);
-  if (filteredQueries.length === 0) {
-    return /*#__PURE__*/_jsx(ToolEmptyState, {
-      testID: "buoy-rq-empty",
-      ...(emptyState ?? {
-        otto: "empty",
-        title: "No queries found",
-        message: emptyStateMessage || (activeFilter ? `No ${activeFilter} queries found` : "No queries found")
-      })
-    });
-  }
-  return (
-    /*#__PURE__*/
-    // Virtualized list with STABLE keys (queryHash). The previous
-    // ScrollView + map mounted every row, and its key included
-    // dataUpdatedAt/fetchStatus so rows REMOUNTED on each update — at 300
-    // seeded queries that measured 168% CPU with 546 row renders during a
-    // 5s idle dwell (tool-bench 2026-07-06). TanStack Query objects are
-    // mutable with stable identity, so `stateSig` carries the changing
-    // fields for the row's memo comparison.
-    _jsx(FlatList, {
-      testID: "buoy-rq-query-list",
-      style: styles.listWrapper,
-      contentContainerStyle: contentContainerStyle || styles.listContent,
-      data: filteredQueries,
-      keyExtractor: queryKeyExtractor,
-      renderItem: ({
-        item: query
-      }) => /*#__PURE__*/_jsx(QueryRow, {
-        query: query,
-        stateSig: computeQueryStateSig(query),
-        isSelected: selectedQuery?.queryHash === query.queryHash,
-        onSelect: handleQuerySelect
-      }),
-      showsVerticalScrollIndicator: true,
-      ...EVENT_LIST_PRESET
-    })
-  );
-}
-const queryKeyExtractor = q => q.queryHash;
-
-/** The row-visible slice of a query's mutable state, as a comparable
- * string — drives QueryRow's memo (see comment above). */
-function computeQueryStateSig(q) {
-  let observers = 0;
-  let stale = false;
-  try {
-    observers = q.getObserversCount();
-    stale = q.isStale();
-  } catch {
-    // defensive: state reads on a disposed query must not break the list
-  }
-  return `${q.state.dataUpdatedAt}|${q.state.fetchStatus}|${q.state.status}|${observers}|${stale}`;
-}
-const styles = StyleSheet.create({
-  listWrapper: {
-    flexGrow: 1
-  },
-  listContent: {
-    paddingBottom: 16,
-    // Transparent so JsModal's ToolBackground shows through (the modal paints opaque base beneath it).
-    backgroundColor: "transparent"
-  },
-  emptyContainer: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    padding: 32,
-    backgroundColor: night.color.surface,
-    margin: 16,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.border
-  },
-  emptyText: {
-    color: night.color.textTertiary,
-    fontSize: 14,
-    textAlign: "center",
-    fontFamily: monoFont,
-    letterSpacing: 0.5
-  }
-});
+"use strict";import{useMemo as K,useCallback as q}from"react";import{StyleSheet as k,FlatList as L}from"react-native";import x from"./QueryRow";import E from"../../hooks/useAllQueries";import{getQueryStatusLabel as j}from"../../utils/getQueryStatusLabel";import{night as c,ToolEmptyState as H,EVENT_LIST_PRESET as I,monoFont as T}from"@buoy-gg/shared-ui";import{jsx as m}from"react/jsx-runtime";export default function $({selectedQuery:s,onQuerySelect:i,activeFilter:n,emptyStateMessage:g,emptyState:C,contentContainerStyle:b,queries:h,searchText:u="",ignoredPatterns:l=new Set,includedPatterns:y=new Set}){const w=E();const d=h??w;const p=K(()=>{let e=d;if(n){e=e.filter(t=>{const o=j(t);return o===n})}if(u){const t=u.toLowerCase();e=e.filter(o=>{if(!o?.queryKey)return false;const a=Array.isArray(o.queryKey)?o.queryKey:[o.queryKey];const r=a.filter(f=>f!=null).map(f=>String(f)).join(" ").toLowerCase();return r.includes(t)})}if(y.size>0){e=e.filter(t=>{if(!t?.queryKey)return false;const o=Array.isArray(t.queryKey)?t.queryKey:[t.queryKey];const a=o.filter(r=>r!=null).map(r=>String(r)).join(" ").toLowerCase();return Array.from(y).some(r=>a.includes(r.toLowerCase()))})}if(l.size>0){e=e.filter(t=>{if(!t?.queryKey)return true;const o=Array.isArray(t.queryKey)?t.queryKey:[t.queryKey];const a=o.filter(r=>r!=null).map(r=>String(r)).join(" ").toLowerCase();return!Array.from(l).some(r=>a.includes(r.toLowerCase()))})}e.sort((t,o)=>{const a=t.state.dataUpdatedAt||0;const r=o.state.dataUpdatedAt||0;return r-a});return e},[d,n,u,y,l]);const A=q(e=>{const t=s?.queryHash===e.queryHash;if(t){i(void 0);return}i(e)},[s?.queryHash,i]);if(p.length===0){return m(H,{testID:"buoy-rq-empty",...C??{otto:"empty",title:"No queries found",message:g||(n?`No ${n} queries found`:"No queries found")}})}return m(L,{testID:"buoy-rq-query-list",style:S.listWrapper,contentContainerStyle:b||S.listContent,data:p,keyExtractor:Q,renderItem:({item:e})=>m(x,{query:e,stateSig:N(e),isSelected:s?.queryHash===e.queryHash,onSelect:A}),showsVerticalScrollIndicator:true,...I})}const Q=s=>s.queryHash;function N(s){let i=0;let n=false;try{i=s.getObserversCount();n=s.isStale()}catch{}return`${s.state.dataUpdatedAt}|${s.state.fetchStatus}|${s.state.status}|${i}|${n}`}const S=k.create({listWrapper:{flexGrow:1},listContent:{paddingBottom:16,backgroundColor:"transparent"},emptyContainer:{flex:1,justifyContent:"center",alignItems:"center",padding:32,backgroundColor:c.color.surface,margin:16,borderRadius:8,borderWidth:1,borderColor:c.color.border},emptyText:{color:c.color.textTertiary,fontSize:14,textAlign:"center",fontFamily:T,letterSpacing:.5}});

package/lib/module/react-query/components/query-browser/QueryDetails.js

@@ -1,136 +1 @@
-"use strict";
-
-import QueryDetailsChip from "./QueryDetailsChip";
-import { View, Text, ScrollView, StyleSheet } from "react-native";
-import { displayValue, night, monoFont } from "@buoy-gg/shared-ui";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * Renders the primary metadata summary for a selected query, including fetch status and timings.
- */
-export default function QueryDetails({
-  query
-}) {
-  if (query === undefined) {
-    return null;
-  }
-  // Convert the timestamp to a Date object and format it
-  const lastUpdated = new Date(query.state.dataUpdatedAt).toLocaleTimeString("en-US", {
-    hour: "2-digit",
-    minute: "2-digit",
-    second: "2-digit",
-    hour12: true
-  });
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.minWidth,
-    children: [/*#__PURE__*/_jsx(Text, {
-      style: styles.headerText,
-      children: "Query Details"
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(ScrollView, {
-        "sentry-label": "ignore devtools query details scroll",
-        horizontal: true,
-        style: styles.flexOne,
-        children: /*#__PURE__*/_jsx(Text, {
-          testID: "buoy-rq-detail-key",
-          style: styles.queryKeyText,
-          children: displayValue(query.queryKey, true)
-        })
-      }), /*#__PURE__*/_jsx(QueryDetailsChip, {
-        query: query,
-        testID: "buoy-rq-detail-status"
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.labelText,
-        children: "Observers:"
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-rq-detail-observers",
-        style: styles.valueText,
-        children: `${query.getObserversCount()}`
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.labelText,
-        children: "Last Updated:"
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-rq-detail-updated",
-        style: styles.valueText,
-        children: `${lastUpdated}`
-      })]
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  minWidth: {
-    minWidth: 200,
-    backgroundColor: night.color.surface,
-    borderRadius: 6,
-    borderWidth: 1,
-    borderColor: night.color.accent + "4D",
-    overflow: "hidden",
-    shadowColor: night.color.accent,
-    shadowOffset: {
-      width: 0,
-      height: 0
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 6
-  },
-  headerText: {
-    backgroundColor: night.color.accent + "15",
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    fontWeight: "600",
-    fontSize: 12,
-    color: night.color.accent,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.accent + "33",
-    letterSpacing: 0.5,
-    textTransform: "uppercase",
-    fontFamily: monoFont
-  },
-  row: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.separator
-  },
-  flexOne: {
-    flex: 1,
-    marginRight: 8
-  },
-  queryKeyText: {
-    fontSize: 12,
-    color: night.color.text,
-    fontFamily: monoFont,
-    lineHeight: 18,
-    flexShrink: 1,
-    backgroundColor: night.color.accent + "15",
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderRadius: 4,
-    borderWidth: 1,
-    borderColor: night.color.accent + "4D"
-  },
-  labelText: {
-    fontSize: 10,
-    color: night.color.textSecondary,
-    fontWeight: "600",
-    letterSpacing: 0.5,
-    textTransform: "uppercase",
-    fontFamily: monoFont
-  },
-  valueText: {
-    fontSize: 12,
-    color: night.color.text,
-    fontWeight: "500",
-    fontVariant: ["tabular-nums"],
-    fontFamily: monoFont
-  }
-});
+"use strict";import s from"./QueryDetailsChip";import{View as i,Text as r,ScrollView as c,StyleSheet as h}from"react-native";import{displayValue as u,night as e,monoFont as a}from"@buoy-gg/shared-ui";import{jsx as o,jsxs as n}from"react/jsx-runtime";export default function y({query:l}){if(l===void 0){return null}const d=new Date(l.state.dataUpdatedAt).toLocaleTimeString("en-US",{hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:true});return n(i,{style:t.minWidth,children:[o(r,{style:t.headerText,children:"Query Details"}),n(i,{style:t.row,children:[o(c,{"sentry-label":"ignore devtools query details scroll",horizontal:true,style:t.flexOne,children:o(r,{testID:"buoy-rq-detail-key",style:t.queryKeyText,children:u(l.queryKey,true)})}),o(s,{query:l,testID:"buoy-rq-detail-status"})]}),n(i,{style:t.row,children:[o(r,{style:t.labelText,children:"Observers:"}),o(r,{testID:"buoy-rq-detail-observers",style:t.valueText,children:`${l.getObserversCount()}`})]}),n(i,{style:t.row,children:[o(r,{style:t.labelText,children:"Last Updated:"}),o(r,{testID:"buoy-rq-detail-updated",style:t.valueText,children:`${d}`})]})]})}const t=h.create({minWidth:{minWidth:200,backgroundColor:e.color.surface,borderRadius:6,borderWidth:1,borderColor:e.color.accent+"4D",overflow:"hidden",shadowColor:e.color.accent,shadowOffset:{width:0,height:0},shadowOpacity:.1,shadowRadius:6},headerText:{backgroundColor:e.color.accent+"15",paddingHorizontal:12,paddingVertical:10,fontWeight:"600",fontSize:12,color:e.color.accent,borderBottomWidth:1,borderBottomColor:e.color.accent+"33",letterSpacing:.5,textTransform:"uppercase",fontFamily:a},row:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingHorizontal:12,paddingVertical:10,borderBottomWidth:1,borderBottomColor:e.color.separator},flexOne:{flex:1,marginRight:8},queryKeyText:{fontSize:12,color:e.color.text,fontFamily:a,lineHeight:18,flexShrink:1,backgroundColor:e.color.accent+"15",paddingHorizontal:8,paddingVertical:4,borderRadius:4,borderWidth:1,borderColor:e.color.accent+"4D"},labelText:{fontSize:10,color:e.color.textSecondary,fontWeight:"600",letterSpacing:.5,textTransform:"uppercase",fontFamily:a},valueText:{fontSize:12,color:e.color.text,fontWeight:"500",fontVariant:["tabular-nums"],fontFamily:a}});

package/lib/module/react-query/components/query-browser/QueryDetailsChip.js

@@ -1,74 +1 @@
-"use strict";
-
-import { getQueryStatusLabel } from "../../utils/getQueryStatusLabel";
-import { Text, View, StyleSheet } from "react-native";
-import { buoyColors, monoFont } from "@buoy-gg/shared-ui";
-import { jsx as _jsx } from "react/jsx-runtime";
-const backgroundColors = {
-  fresh: buoyColors.success + "15",
-  stale: buoyColors.warning + "15",
-  fetching: buoyColors.primary + "15",
-  paused: buoyColors.textMuted + "1A",
-  noObserver: buoyColors.textMuted + "1A",
-  error: buoyColors.error + "15",
-  inactive: buoyColors.textMuted + "1A"
-};
-const borderColors = {
-  fresh: buoyColors.success + "33",
-  stale: buoyColors.warning + "33",
-  fetching: buoyColors.primary + "33",
-  paused: buoyColors.textMuted + "33",
-  noObserver: buoyColors.textMuted + "33",
-  error: buoyColors.error + "33",
-  inactive: buoyColors.textMuted + "33"
-};
-const textColors = {
-  fresh: buoyColors.success,
-  stale: buoyColors.warning,
-  fetching: buoyColors.primary,
-  paused: buoyColors.textMuted,
-  noObserver: buoyColors.textMuted,
-  error: buoyColors.error,
-  inactive: buoyColors.textMuted
-};
-/**
- * Chip component used to display small query metadata values (status, observers, etc.).
- */
-export default function QueryDetailsChip({
-  query,
-  testID
-}) {
-  const status = getQueryStatusLabel(query);
-  const backgroundColor = backgroundColors[status];
-  const borderColor = borderColors[status];
-  const textColor = textColors[status];
-  return /*#__PURE__*/_jsx(View, {
-    style: [styles.container, {
-      backgroundColor,
-      borderColor
-    }],
-    children: /*#__PURE__*/_jsx(Text, {
-      testID: testID,
-      style: [styles.text, {
-        color: textColor
-      }],
-      children: status
-    })
-  });
-}
-const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderWidth: 1,
-    borderRadius: 6,
-    alignSelf: "flex-start"
-  },
-  text: {
-    fontSize: 11,
-    fontWeight: "600",
-    textTransform: "uppercase",
-    letterSpacing: 0.5,
-    fontFamily: monoFont
-  }
-});
+"use strict";import{getQueryStatusLabel as u}from"../../utils/getQueryStatusLabel";import{Text as d,View as l,StyleSheet as x}from"react-native";import{buoyColors as t,monoFont as f}from"@buoy-gg/shared-ui";import{jsx as r}from"react/jsx-runtime";const p={fresh:t.success+"15",stale:t.warning+"15",fetching:t.primary+"15",paused:t.textMuted+"1A",noObserver:t.textMuted+"1A",error:t.error+"15",inactive:t.textMuted+"1A"};const g={fresh:t.success+"33",stale:t.warning+"33",fetching:t.primary+"33",paused:t.textMuted+"33",noObserver:t.textMuted+"33",error:t.error+"33",inactive:t.textMuted+"33"};const m={fresh:t.success,stale:t.warning,fetching:t.primary,paused:t.textMuted,noObserver:t.textMuted,error:t.error,inactive:t.textMuted};export default function h({query:s,testID:n}){const e=u(s);const i=p[e];const a=g[e];const c=m[e];return r(l,{style:[o.container,{backgroundColor:i,borderColor:a}],children:r(d,{testID:n,style:[o.text,{color:c}],children:e})})}const o=x.create({container:{paddingHorizontal:8,paddingVertical:4,borderWidth:1,borderRadius:6,alignSelf:"flex-start"},text:{fontSize:11,fontWeight:"600",textTransform:"uppercase",letterSpacing:.5,fontFamily:f}});

package/lib/module/react-query/components/query-browser/QueryInformation.js

@@ -1,90 +1 @@
-"use strict";
-
-import QueryDetails from "./QueryDetails";
-import QueryActions from "./QueryActions";
-import DataExplorer from "./Explorer";
-import { View, Text, ScrollView, StyleSheet } from "react-native";
-import { night } from "@buoy-gg/shared-ui";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * Stacked detail view combining metadata, actions, and explorers for the selected query.
- */
-export default function QueryInformation({
-  selectedQuery,
-  setSelectedQuery
-}) {
-  return /*#__PURE__*/_jsxs(ScrollView, {
-    "sentry-label": "ignore devtools query info scroll",
-    style: styles.flexOne,
-    contentContainerStyle: styles.scrollContent,
-    children: [/*#__PURE__*/_jsx(View, {
-      style: styles.section,
-      children: /*#__PURE__*/_jsx(QueryDetails, {
-        query: selectedQuery
-      })
-    }), /*#__PURE__*/_jsx(View, {
-      style: styles.section,
-      children: /*#__PURE__*/_jsx(QueryActions, {
-        query: selectedQuery,
-        setSelectedQuery: setSelectedQuery
-      })
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.section,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.headerText,
-        children: "Data Explorer"
-      }), /*#__PURE__*/_jsx(View, {
-        style: styles.contentView,
-        children: /*#__PURE__*/_jsx(DataExplorer, {
-          editable: true,
-          label: "Data",
-          value: selectedQuery?.state.data,
-          defaultExpanded: ["Data"],
-          activeQuery: selectedQuery
-        })
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.section,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.headerText,
-        children: "Query Explorer"
-      }), /*#__PURE__*/_jsx(View, {
-        style: styles.contentView,
-        children: /*#__PURE__*/_jsx(DataExplorer, {
-          label: "Query",
-          value: selectedQuery,
-          defaultExpanded: ["Query", "queryKey"],
-          activeQuery: selectedQuery
-        })
-      })]
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  flexOne: {
-    flex: 1,
-    // Transparent so the night sheet's star field shows through.
-    backgroundColor: "transparent"
-  },
-  scrollContent: {
-    paddingBottom: 16,
-    paddingHorizontal: 8
-  },
-  section: {
-    marginBottom: 16
-  },
-  headerText: {
-    fontSize: 16,
-    fontWeight: "600",
-    color: night.color.text,
-    marginBottom: 8,
-    textAlign: "left"
-  },
-  contentView: {
-    backgroundColor: night.color.surface,
-    borderRadius: 12,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    padding: 16
-  }
-});
+"use strict";import c from"./QueryDetails";import d from"./QueryActions";import i from"./Explorer";import{View as o,Text as a,ScrollView as y,StyleSheet as u}from"react-native";import{night as n}from"@buoy-gg/shared-ui";import{jsx as e,jsxs as l}from"react/jsx-runtime";export default function f({selectedQuery:r,setSelectedQuery:s}){return l(y,{"sentry-label":"ignore devtools query info scroll",style:t.flexOne,contentContainerStyle:t.scrollContent,children:[e(o,{style:t.section,children:e(c,{query:r})}),e(o,{style:t.section,children:e(d,{query:r,setSelectedQuery:s})}),l(o,{style:t.section,children:[e(a,{style:t.headerText,children:"Data Explorer"}),e(o,{style:t.contentView,children:e(i,{editable:true,label:"Data",value:r?.state.data,defaultExpanded:["Data"],activeQuery:r})})]}),l(o,{style:t.section,children:[e(a,{style:t.headerText,children:"Query Explorer"}),e(o,{style:t.contentView,children:e(i,{label:"Query",value:r,defaultExpanded:["Query","queryKey"],activeQuery:r})})]})]})}const t=u.create({flexOne:{flex:1,backgroundColor:"transparent"},scrollContent:{paddingBottom:16,paddingHorizontal:8},section:{marginBottom:16},headerText:{fontSize:16,fontWeight:"600",color:n.color.text,marginBottom:8,textAlign:"left"},contentView:{backgroundColor:n.color.surface,borderRadius:12,borderWidth:1,borderColor:n.color.border,padding:16}});