@buoy-gg/react-query 1.7.2

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

@@ -0,0 +1,253 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  VirtualizedDataExplorer: true,
+  DataViewer: true,
+  TypeLegend: true,
+  ReactQueryDevToolsModal: true
+};
+Object.defineProperty(exports, "DataViewer", {
+  enumerable: true,
+  get: function () {
+    return _dataViewer.DataViewer;
+  }
+});
+Object.defineProperty(exports, "ReactQueryDevToolsModal", {
+  enumerable: true,
+  get: function () {
+    return _ReactQueryDevToolsModal.ReactQueryDevToolsModal;
+  }
+});
+Object.defineProperty(exports, "TypeLegend", {
+  enumerable: true,
+  get: function () {
+    return _dataViewer.TypeLegend;
+  }
+});
+Object.defineProperty(exports, "VirtualizedDataExplorer", {
+  enumerable: true,
+  get: function () {
+    return _dataViewer.VirtualizedDataExplorer;
+  }
+});
+var _ReactQueryModal = require("./modals/ReactQueryModal");
+Object.keys(_ReactQueryModal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ReactQueryModal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ReactQueryModal[key];
+    }
+  });
+});
+var _ReactQueryModalHeader = require("./modals/ReactQueryModalHeader");
+Object.keys(_ReactQueryModalHeader).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ReactQueryModalHeader[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ReactQueryModalHeader[key];
+    }
+  });
+});
+var _QueryBrowserModal = require("./modals/QueryBrowserModal");
+Object.keys(_QueryBrowserModal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _QueryBrowserModal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _QueryBrowserModal[key];
+    }
+  });
+});
+var _MutationBrowserModal = require("./modals/MutationBrowserModal");
+Object.keys(_MutationBrowserModal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MutationBrowserModal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _MutationBrowserModal[key];
+    }
+  });
+});
+var _MutationEditorModal = require("./modals/MutationEditorModal");
+Object.keys(_MutationEditorModal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MutationEditorModal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _MutationEditorModal[key];
+    }
+  });
+});
+var _DataEditorModal = require("./modals/DataEditorModal");
+Object.keys(_DataEditorModal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _DataEditorModal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _DataEditorModal[key];
+    }
+  });
+});
+var _QueryBrowserFooter = require("./modals/QueryBrowserFooter");
+Object.keys(_QueryBrowserFooter).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _QueryBrowserFooter[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _QueryBrowserFooter[key];
+    }
+  });
+});
+var _MutationBrowserFooter = require("./modals/MutationBrowserFooter");
+Object.keys(_MutationBrowserFooter).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MutationBrowserFooter[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _MutationBrowserFooter[key];
+    }
+  });
+});
+var _SwipeIndicator = require("./modals/SwipeIndicator");
+Object.keys(_SwipeIndicator).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _SwipeIndicator[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SwipeIndicator[key];
+    }
+  });
+});
+var _queryBrowser = require("./query-browser");
+Object.keys(_queryBrowser).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _queryBrowser[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _queryBrowser[key];
+    }
+  });
+});
+var _dataViewer = require("@buoy-gg/shared-ui/dataViewer");
+var _QueryBrowserMode = require("./QueryBrowserMode");
+Object.keys(_QueryBrowserMode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _QueryBrowserMode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _QueryBrowserMode[key];
+    }
+  });
+});
+var _MutationBrowserMode = require("./MutationBrowserMode");
+Object.keys(_MutationBrowserMode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MutationBrowserMode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _MutationBrowserMode[key];
+    }
+  });
+});
+var _MutationEditorMode = require("./MutationEditorMode");
+Object.keys(_MutationEditorMode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MutationEditorMode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _MutationEditorMode[key];
+    }
+  });
+});
+var _DataEditorMode = require("./DataEditorMode");
+Object.keys(_DataEditorMode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _DataEditorMode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _DataEditorMode[key];
+    }
+  });
+});
+var _QuerySelector = require("./QuerySelector");
+Object.keys(_QuerySelector).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _QuerySelector[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _QuerySelector[key];
+    }
+  });
+});
+var _QueryDebugInfo = require("./QueryDebugInfo");
+Object.keys(_QueryDebugInfo).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _QueryDebugInfo[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _QueryDebugInfo[key];
+    }
+  });
+});
+var _WifiToggle = require("./WifiToggle");
+Object.keys(_WifiToggle).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _WifiToggle[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _WifiToggle[key];
+    }
+  });
+});
+var _ReactQuerySection = require("./ReactQuerySection");
+Object.keys(_ReactQuerySection).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ReactQuerySection[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ReactQuerySection[key];
+    }
+  });
+});
+var _ReactQueryDevToolsModal = require("./ReactQueryDevToolsModal");

package/lib/commonjs/react-query/components/modals/DataEditorModal.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DataEditorModal = DataEditorModal;
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _useSelectedQuery = require("../../hooks/useSelectedQuery");
+var _ReactQueryModalHeader = require("./ReactQueryModalHeader");
+var _DataEditorMode = require("../DataEditorMode");
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Specialized modal for data editing following "Decompose by Responsibility"
+ * Single purpose: Display data editor when a query is selected
+ */
+function DataEditorModal({
+  visible,
+  selectedQueryKey,
+  onQuerySelect,
+  onClose,
+  onMinimize,
+  enableSharedModalDimensions = false,
+  onTabChange
+}) {
+  const {
+    query: selectedQuery,
+    version: queryVersion
+  } = (0, _useSelectedQuery.useGetQueryByQueryKeyWithVersion)(selectedQueryKey);
+  const [modalMode, setModalMode] = (0, _react.useState)("bottomSheet");
+  const handleModeChange = (0, _react.useCallback)(mode => {
+    setModalMode(mode);
+  }, []);
+  const renderHeaderContent = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactQueryModalHeader.ReactQueryModalHeader, {
+    selectedQuery: selectedQuery,
+    activeTab: "queries",
+    onTabChange: onTabChange,
+    onBack: () => onQuerySelect(undefined)
+  });
+  const storagePrefix = enableSharedModalDimensions ? _sharedUi.devToolsStorageKeys.reactQuery.modal() : `${_sharedUi.devToolsStorageKeys.reactQuery.modal()}_data_editor`;
+  if (!visible || !selectedQuery) return null;
+  const footerNode = /*#__PURE__*/(0, _jsxRuntime.jsx)(_DataEditorMode.DataEditorActionsFooter, {
+    selectedQuery: selectedQuery,
+    isFloatingMode: modalMode === "floating",
+    queryVersion: queryVersion
+  }, `footer-${queryVersion}`);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.JsModal, {
+    visible: visible,
+    onClose: onClose,
+    onMinimize: onMinimize,
+    persistenceKey: storagePrefix,
+    header: {
+      customContent: renderHeaderContent(),
+      showToggleButton: true
+    },
+    onModeChange: handleModeChange,
+    enablePersistence: true,
+    initialMode: "bottomSheet",
+    enableGlitchEffects: true,
+    styles: {},
+    footer: footerNode,
+    footerHeight: 72,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DataEditorMode.DataEditorMode, {
+      selectedQuery: selectedQuery,
+      isFloatingMode: modalMode === "floating",
+      disableInternalFooter: true,
+      queryVersion: queryVersion
+    })
+  });
+}

package/lib/commonjs/react-query/components/modals/MutationBrowserFooter.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MutationBrowserFooter = MutationBrowserFooter;
+var _reactNative = require("react-native");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _MutationStatusCount = _interopRequireDefault(require("../query-browser/MutationStatusCount"));
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * Footer component for MutationBrowserModal following composition principles
+ *
+ * Applied principles:
+ * - Decompose by Responsibility: Dedicated footer component for mutation filter controls
+ * - Prefer Composition over Configuration: Specialized footer matching DataEditorMode pattern
+ * - Extract Reusable Logic: Consistent footer styling across modal types
+ */
+function MutationBrowserFooter({
+  activeFilter,
+  onFilterChange,
+  modalMode
+}) {
+  const isFloatingMode = modalMode === "floating";
+  const insets = (0, _sharedUi.useSafeAreaInsets)({
+    minBottom: 16
+  });
+
+  // Use useMemo to ensure paddingBottom is recalculated when isFloatingMode changes
+  const paddingBottom = (0, _react.useMemo)(() => {
+    return !isFloatingMode ? insets.bottom : 0;
+  }, [isFloatingMode, insets.bottom]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    // Force re-render with key change
+    style: [styles.filterFooter, {
+      paddingBottom
+    },
+    // Remove border radius when docked to bottom
+    !isFloatingMode && styles.dockedFooter],
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.filterContainer,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MutationStatusCount.default, {
+        activeFilter: activeFilter,
+        onFilterChange: onFilterChange
+      })
+    })
+  }, `footer-${isFloatingMode ? "floating" : "docked"}`);
+}
+const styles = _reactNative.StyleSheet.create({
+  filterFooter: {
+    borderTopWidth: 1,
+    borderTopColor: _sharedUi.buoyColors.border,
+    paddingVertical: 8,
+    paddingHorizontal: 0,
+    backgroundColor: _sharedUi.buoyColors.base,
+    borderBottomLeftRadius: 14,
+    borderBottomRightRadius: 14
+  },
+  dockedFooter: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  filterContainer: {
+    minHeight: 32,
+    justifyContent: "center"
+  }
+});

package/lib/commonjs/react-query/components/modals/MutationBrowserModal.js

@@ -0,0 +1,146 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MutationBrowserModal = MutationBrowserModal;
+var _react = require("react");
+var _useSelectedMutation = require("../../hooks/useSelectedMutation");
+var _MutationBrowserMode = require("../MutationBrowserMode");
+var _MutationBrowserFooter = require("./MutationBrowserFooter");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _ReactQueryModalHeader = require("./ReactQueryModalHeader");
+var _reactNative = require("react-native");
+var _SwipeIndicator = require("./SwipeIndicator");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Specialized modal wrapper for browsing mutations. Handles persistence, swipe gestures, and
+ * filter coordination before delegating to the underlying list view.
+ */
+function MutationBrowserModal({
+  visible,
+  selectedMutationId,
+  onMutationSelect,
+  onClose,
+  onMinimize,
+  activeFilter: externalActiveFilter,
+  onFilterChange: externalOnFilterChange,
+  onTabChange,
+  enableSharedModalDimensions = false,
+  searchText = "",
+  onSearchChange
+}) {
+  const selectedMutation = (0, _useSelectedMutation.useGetMutationById)(selectedMutationId);
+  const [internalActiveFilter, setInternalActiveFilter] = (0, _react.useState)(null);
+  const activeFilter = externalActiveFilter ?? internalActiveFilter;
+  const setActiveFilter = externalOnFilterChange ?? setInternalActiveFilter;
+
+  // Track modal mode for conditional styling
+  // Initialize with bottomSheet but it will be updated from persisted state if available
+  const [modalMode, setModalMode] = (0, _react.useState)("bottomSheet");
+  const storagePrefix = enableSharedModalDimensions ? _sharedUi.devToolsStorageKeys.reactQuery.modal() : _sharedUi.devToolsStorageKeys.reactQuery.mutationModal();
+
+  // Animated value for gesture tracking [[memory:4875251]]
+  const translationX = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
+  const handleSwipeNavigation = (0, _react.useCallback)(direction => {
+    if (direction === "right") {
+      onTabChange("queries");
+    }
+  }, [onTabChange]);
+  const handleModeChange = (0, _react.useCallback)(mode => {
+    setModalMode(mode);
+  }, []);
+
+  // Create PanResponder for swipe navigation
+  const panResponder = (0, _react.useRef)(_reactNative.PanResponder.create({
+    onStartShouldSetPanResponder: () => false,
+    onMoveShouldSetPanResponder: (evt, gestureState) => {
+      // Only capture horizontal swipes
+      return Math.abs(gestureState.dx) > 5 && Math.abs(gestureState.dy) < 10;
+    },
+    onPanResponderMove: (evt, gestureState) => {
+      // Update translation for visual feedback
+      translationX.setValue(gestureState.dx);
+    },
+    onPanResponderRelease: (evt, gestureState) => {
+      const {
+        dx,
+        vx
+      } = gestureState;
+      const swipeThreshold = 80; // Match EDGE_THRESHOLD from SwipeIndicator
+      const velocityThreshold = 0.5;
+
+      // Reset visual feedback with spring animation
+      _reactNative.Animated.spring(translationX, {
+        toValue: 0,
+        useNativeDriver: true
+      }).start();
+      if (Math.abs(dx) > swipeThreshold || Math.abs(vx) > velocityThreshold) {
+        if (dx > 0 || vx > 0) {
+          handleSwipeNavigation("right");
+        } else {
+          handleSwipeNavigation("left");
+        }
+      }
+    },
+    onPanResponderTerminate: () => {
+      // Reset on termination
+      _reactNative.Animated.spring(translationX, {
+        toValue: 0,
+        useNativeDriver: true
+      }).start();
+    }
+  })).current;
+  if (!visible) return null;
+  const renderHeaderContent = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactQueryModalHeader.ReactQueryModalHeader, {
+    selectedMutation: selectedMutation,
+    activeTab: "mutations",
+    onTabChange: onTabChange,
+    onBack: () => onMutationSelect(undefined),
+    searchText: searchText,
+    onSearchChange: onSearchChange
+  });
+  const footerNode = /*#__PURE__*/(0, _jsxRuntime.jsx)(_MutationBrowserFooter.MutationBrowserFooter, {
+    activeFilter: activeFilter,
+    onFilterChange: setActiveFilter,
+    modalMode: modalMode
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.JsModal, {
+    visible: visible,
+    onClose: onClose,
+    onMinimize: onMinimize,
+    persistenceKey: storagePrefix,
+    header: {
+      customContent: renderHeaderContent(),
+      showToggleButton: true
+    },
+    onModeChange: handleModeChange,
+    enablePersistence: true,
+    initialMode: "bottomSheet",
+    enableGlitchEffects: true,
+    styles: {},
+    footer: footerNode,
+    footerHeight: 56,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: {
+        flex: 1
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        ...panResponder.panHandlers,
+        style: {
+          flex: 1
+        },
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SwipeIndicator.SwipeIndicator, {
+          translationX: translationX,
+          canSwipeLeft: false,
+          canSwipeRight: true
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MutationBrowserMode.MutationBrowserMode, {
+          selectedMutation: selectedMutation,
+          onMutationSelect: onMutationSelect,
+          activeFilter: activeFilter,
+          searchText: searchText
+        })]
+      })
+    })
+  });
+}

package/lib/commonjs/react-query/components/modals/MutationEditorModal.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MutationEditorModal = MutationEditorModal;
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _useSelectedMutation = require("../../hooks/useSelectedMutation");
+var _ReactQueryModalHeader = require("./ReactQueryModalHeader");
+var _MutationEditorMode = require("../MutationEditorMode");
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Modal variant dedicated to editing a single mutation entry. Restores persisted positioning and
+ * mirrors the behavior of the query editor.
+ */
+function MutationEditorModal({
+  visible,
+  selectedMutationId,
+  onMutationSelect,
+  onClose,
+  onMinimize,
+  onTabChange,
+  enableSharedModalDimensions = false
+}) {
+  const selectedMutation = (0, _useSelectedMutation.useGetMutationById)(selectedMutationId);
+  const [modalMode, setModalMode] = (0, _react.useState)("bottomSheet");
+  const handleModeChange = (0, _react.useCallback)(mode => {
+    setModalMode(mode);
+  }, []);
+  const renderHeaderContent = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactQueryModalHeader.ReactQueryModalHeader, {
+    selectedMutation: selectedMutation,
+    activeTab: "mutations",
+    onTabChange: onTabChange,
+    onBack: () => onMutationSelect(undefined)
+  });
+  const storagePrefix = enableSharedModalDimensions ? _sharedUi.devToolsStorageKeys.reactQuery.modal() : _sharedUi.devToolsStorageKeys.reactQuery.mutationModal();
+  if (!visible || !selectedMutation) return null;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.JsModal, {
+    visible: visible,
+    onClose: onClose,
+    onMinimize: onMinimize,
+    persistenceKey: storagePrefix,
+    header: {
+      customContent: renderHeaderContent(),
+      showToggleButton: true
+    },
+    onModeChange: handleModeChange,
+    enablePersistence: true,
+    initialMode: "bottomSheet",
+    enableGlitchEffects: true,
+    styles: {},
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MutationEditorMode.MutationEditorMode, {
+      selectedMutation: selectedMutation,
+      isFloatingMode: modalMode === "floating"
+    })
+  });
+}

package/lib/commonjs/react-query/components/modals/QueryBrowserFooter.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.QueryBrowserFooter = QueryBrowserFooter;
+var _reactNative = require("react-native");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _QueryStatusCount = _interopRequireDefault(require("../query-browser/QueryStatusCount"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * Footer component for QueryBrowserModal following composition principles
+ *
+ * Applied principles:
+ * - Decompose by Responsibility: Dedicated footer component for filter controls
+ * - Prefer Composition over Configuration: Specialized footer matching DataEditorMode pattern
+ * - Extract Reusable Logic: Consistent footer styling across modal types
+ */
+function QueryBrowserFooter({
+  activeFilter,
+  onFilterChange,
+  isFloatingMode = true // Default to floating mode if not specified
+}) {
+  // Use safe area insets with a minimum bottom padding of 16 for docked mode
+  // This ensures proper spacing even on resized simulators or devices without home indicator
+  const insets = (0, _sharedUi.useSafeAreaInsets)({
+    minBottom: 16
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [styles.filterFooter, {
+      paddingBottom: !isFloatingMode ? insets.bottom : 0
+    },
+    // Remove border radius when docked to bottom
+    !isFloatingMode && styles.dockedFooter],
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.filterContainer,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueryStatusCount.default, {
+        activeFilter: activeFilter,
+        onFilterChange: onFilterChange
+      })
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  filterFooter: {
+    borderTopWidth: 1,
+    borderTopColor: _sharedUi.buoyColors.border,
+    paddingVertical: 8,
+    paddingHorizontal: 0,
+    backgroundColor: _sharedUi.buoyColors.base,
+    borderBottomLeftRadius: 14,
+    borderBottomRightRadius: 14
+  },
+  dockedFooter: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  filterContainer: {
+    minHeight: 32,
+    justifyContent: "center"
+  }
+});