@buoy-gg/shared-ui 7.0.40 → 7.0.42

package/lib/module/ui/components/DynamicFilterView.js

@@ -1,754 +1 @@
-"use strict";
-
-import { View, Text, TouchableOpacity, StyleSheet, ScrollView } from "react-native";
-import { useEffect, useState } from "react";
-import { Filter, Plus, Copy, Eye, Info } from "../../icons/index.js";
-import { SectionHeader } from "./SectionHeader.js";
-import { FilterList, AddFilterInput, AddFilterButton } from "./FilterComponents.js";
-import { useFilterManager } from "../../hooks/useFilterManager.js";
-import { buoyColors } from "../gameUI/constants/gameUIColors.js";
-import { night } from "../night/nightTheme.js";
-import { monoFont } from "../fonts.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-export function DynamicFilterView({
-  sections = [],
-  filterSummarySection,
-  addFilterSection,
-  includeOnlySection,
-  availableItemsSection,
-  howItWorksSection,
-  previewSection,
-  onFilterChange,
-  onPatternToggle,
-  onPatternAdd,
-  activePatterns = new Set(),
-  renderPatternMeta,
-  tabs,
-  activeTab,
-  onTabChange
-}) {
-  const filterManager = useFilterManager(activePatterns);
-  const includeFilterManager = useFilterManager(includeOnlySection?.patterns || new Set());
-  const [internalActiveTab, setInternalActiveTab] = useState(tabs?.[0]?.id || "");
-  const currentActiveTab = activeTab || internalActiveTab;
-  useEffect(() => {
-    if (activePatterns.size !== filterManager.filters.size || !Array.from(activePatterns).every(p => filterManager.filters.has(p))) {
-      // Sync external changes
-    }
-  }, [activePatterns, filterManager.filters]);
-  const handleAddPattern = () => {
-    if (filterManager.newFilter.trim() && onPatternAdd) {
-      onPatternAdd(filterManager.newFilter.trim());
-      filterManager.addFilter(filterManager.newFilter);
-    }
-  };
-  const handleAddIncludePattern = () => {
-    if (includeFilterManager.newFilter.trim() && includeOnlySection?.onPatternAdd) {
-      includeOnlySection.onPatternAdd(includeFilterManager.newFilter.trim());
-      includeFilterManager.addFilter(includeFilterManager.newFilter);
-    }
-  };
-  const suggestedItems = availableItemsSection?.items?.filter(item => {
-    return !Array.from(activePatterns).some(pattern => item.includes(pattern));
-  }) || [];
-  const renderTabs = () => {
-    if (!tabs || tabs.length === 0) return null;
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.tabContainer,
-      children: tabs.map(tab => /*#__PURE__*/_jsxs(TouchableOpacity, {
-        onPress: () => {
-          if (onTabChange) onTabChange(tab.id);else setInternalActiveTab(tab.id);
-        },
-        style: [styles.tabButton, currentActiveTab === tab.id ? styles.tabButtonActive : styles.tabButtonInactive],
-        children: [tab.icon && /*#__PURE__*/_jsx(tab.icon, {
-          size: 14,
-          color: currentActiveTab === tab.id ? buoyColors.primary : night.color.textTertiary
-        }), /*#__PURE__*/_jsx(Text, {
-          style: [styles.tabButtonText, currentActiveTab === tab.id ? styles.tabButtonTextActive : styles.tabButtonTextInactive],
-          children: tab.label
-        }), tab.count !== undefined && tab.count > 0 && /*#__PURE__*/_jsx(View, {
-          style: styles.tabBadge,
-          children: /*#__PURE__*/_jsx(Text, {
-            style: styles.tabBadgeText,
-            children: tab.count
-          })
-        })]
-      }, tab.id))
-    });
-  };
-  const renderFilterSection = section => {
-    if (section.type === "custom" && section.renderCustom) {
-      return section.renderCustom();
-    }
-    if (section.type === "patterns") {
-      return null; // Handled separately
-    }
-    if (!section.data || section.data.length === 0) return null;
-    return /*#__PURE__*/_jsxs(View, {
-      style: styles.section,
-      children: [/*#__PURE__*/_jsxs(SectionHeader, {
-        children: [section.icon && /*#__PURE__*/_jsx(SectionHeader.Icon, {
-          icon: section.icon,
-          color: section.color || buoyColors.primary,
-          size: 12
-        }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-          children: section.title
-        })]
-      }), section.description && /*#__PURE__*/_jsx(Text, {
-        style: styles.sectionDescription,
-        children: section.description
-      }), /*#__PURE__*/_jsx(View, {
-        style: styles.filterGrid,
-        children: section.data.map(option => {
-          const hasCount = option.count !== undefined;
-          const countIsZero = hasCount && option.count === 0;
-          const showLabel = section.type !== "method" || option.icon;
-          return /*#__PURE__*/_jsxs(TouchableOpacity, {
-            testID: `buoy-filter-option-${option.id}`,
-            accessibilityRole: "button",
-            accessibilityLabel: String(option.label ?? option.id),
-            style: [styles.filterCard, option.isActive && styles.activeFilterCard],
-            onPress: () => onFilterChange?.(option.id, option.value),
-            children: [option.icon ? /*#__PURE__*/_jsx(option.icon, {
-              size: 24,
-              color: option.color,
-              style: styles.filterIcon
-            }) : section.type === "method" ? /*#__PURE__*/_jsx(View, {
-              style: [styles.methodBadgeCompact, {
-                backgroundColor: `${option.color}20`
-              }],
-              children: /*#__PURE__*/_jsx(Text, {
-                style: [styles.methodTextCompact, {
-                  color: option.color
-                }],
-                numberOfLines: 1,
-                adjustsFontSizeToFit: true,
-                minimumFontScale: 0.8,
-                children: option.label
-              })
-            }) : null, hasCount && /*#__PURE__*/_jsx(Text, {
-              style: [countIsZero ? styles.filterCountZero : styles.filterCountActive],
-              children: option.count
-            }), showLabel && /*#__PURE__*/_jsx(Text, {
-              style: styles.filterLabelCompact,
-              children: option.label
-            }), option.description && /*#__PURE__*/_jsx(Text, {
-              style: styles.filterDescriptionBottom,
-              children: option.description
-            })]
-          }, option.id);
-        })
-      })]
-    }, section.id);
-  };
-  const renderContent = () => {
-    if (tabs && currentActiveTab) {
-      const activeTabData = tabs.find(tab => tab.id === currentActiveTab);
-      if (activeTabData?.content) {
-        return activeTabData.content();
-      }
-    }
-    return /*#__PURE__*/_jsxs(_Fragment, {
-      children: [filterSummarySection?.enabled && (filterSummarySection.includePatterns?.size || filterSummarySection.excludePatterns?.size) ? /*#__PURE__*/_jsxs(View, {
-        style: styles.filterSummarySection,
-        children: [/*#__PURE__*/_jsxs(View, {
-          style: styles.filterSummaryHeader,
-          children: [/*#__PURE__*/_jsx(Info, {
-            size: 14,
-            color: buoyColors.warning
-          }), /*#__PURE__*/_jsx(Text, {
-            style: styles.filterSummaryTitle,
-            children: "Filters Active"
-          })]
-        }), /*#__PURE__*/_jsxs(Text, {
-          style: styles.filterSummaryText,
-          children: ["Showing ", filterSummarySection.filteredCount, " of ", filterSummarySection.totalCount, " queries", filterSummarySection.includePatterns?.size ? /*#__PURE__*/_jsxs(Text, {
-            style: styles.filterSummaryInclude,
-            children: [" ", "\u2022 Including: ", Array.from(filterSummarySection.includePatterns).join(", ")]
-          }) : null, filterSummarySection.excludePatterns?.size ? /*#__PURE__*/_jsxs(Text, {
-            style: styles.filterSummaryExclude,
-            children: [" ", "\u2022 Excluding: ", Array.from(filterSummarySection.excludePatterns).join(", ")]
-          }) : null]
-        })]
-      }) : null, sections.map(renderFilterSection), includeOnlySection?.enabled && /*#__PURE__*/_jsxs(View, {
-        style: styles.includeOnlySection,
-        children: [/*#__PURE__*/_jsxs(SectionHeader, {
-          children: [/*#__PURE__*/_jsx(SectionHeader.Icon, {
-            icon: includeOnlySection.icon || Eye,
-            color: buoyColors.success,
-            size: 12
-          }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-            children: includeOnlySection.title || "INCLUDE ONLY FILTERS"
-          }), includeOnlySection.patterns.size > 0 && /*#__PURE__*/_jsx(SectionHeader.Badge, {
-            count: includeOnlySection.patterns.size,
-            color: buoyColors.success
-          })]
-        }), includeOnlySection.description && /*#__PURE__*/_jsx(Text, {
-          style: styles.includeOnlyDescription,
-          children: includeOnlySection.description
-        }), /*#__PURE__*/_jsx(View, {
-          style: styles.includeOnlyInputWrapper,
-          children: !includeFilterManager.showAddInput ? /*#__PURE__*/_jsx(AddFilterButton, {
-            onPress: () => includeFilterManager.setShowAddInput(true),
-            color: buoyColors.success,
-            label: "Add include pattern",
-            testID: "buoy-filter-include-add-open"
-          }) : /*#__PURE__*/_jsx(AddFilterInput, {
-            value: includeFilterManager.newFilter,
-            onChange: includeFilterManager.setNewFilter,
-            onSubmit: handleAddIncludePattern,
-            onCancel: () => {
-              includeFilterManager.setShowAddInput(false);
-              includeFilterManager.setNewFilter("");
-            },
-            placeholder: includeOnlySection.placeholder || "Enter pattern to include...",
-            color: buoyColors.success,
-            testID: "buoy-filter-include-input"
-          })
-        }), includeOnlySection.patterns.size > 0 && /*#__PURE__*/_jsx(ScrollView, {
-          testID: "buoy-filter-include-scroll",
-          style: styles.includeOnlyFiltersContent,
-          showsVerticalScrollIndicator: true,
-          nestedScrollEnabled: true,
-          children: /*#__PURE__*/_jsx(FilterList, {
-            filters: includeOnlySection.patterns,
-            onRemoveFilter: includeOnlySection.onPatternToggle,
-            color: buoyColors.success
-          })
-        })]
-      }), addFilterSection?.enabled && /*#__PURE__*/_jsxs(View, {
-        style: styles.excludeFiltersSection,
-        children: [/*#__PURE__*/_jsxs(SectionHeader, {
-          children: [/*#__PURE__*/_jsx(SectionHeader.Icon, {
-            icon: Filter,
-            color: buoyColors.primary,
-            size: 12
-          }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-            children: addFilterSection.title || "EXCLUDE FILTERS"
-          }), activePatterns.size > 0 && /*#__PURE__*/_jsx(SectionHeader.Badge, {
-            count: activePatterns.size,
-            color: buoyColors.primary
-          })]
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.excludeFiltersDescription,
-          children: "Hide queries matching these patterns from the list."
-        }), /*#__PURE__*/_jsx(View, {
-          style: styles.excludeFiltersInputWrapper,
-          children: !filterManager.showAddInput ? /*#__PURE__*/_jsx(AddFilterButton, {
-            onPress: () => filterManager.setShowAddInput(true),
-            color: buoyColors.primary,
-            label: "Add exclude pattern"
-          }) : /*#__PURE__*/_jsxs(_Fragment, {
-            children: [addFilterSection.renderExtra?.(), /*#__PURE__*/_jsx(AddFilterInput, {
-              value: filterManager.newFilter,
-              onChange: filterManager.setNewFilter,
-              onSubmit: handleAddPattern,
-              onCancel: () => {
-                filterManager.setShowAddInput(false);
-                filterManager.setNewFilter("");
-              },
-              placeholder: addFilterSection.placeholder || "Enter pattern to exclude...",
-              color: buoyColors.primary
-            })]
-          })
-        }), activePatterns.size > 0 && /*#__PURE__*/_jsx(ScrollView
-        // The active patterns live in their own short scroller, so a
-        // pattern added a moment ago is usually below its fold.
-        , {
-          testID: "buoy-filter-active-scroll",
-          style: styles.excludeFiltersContent,
-          showsVerticalScrollIndicator: true,
-          nestedScrollEnabled: true,
-          children: /*#__PURE__*/_jsx(FilterList, {
-            filters: activePatterns,
-            onRemoveFilter: onPatternToggle,
-            color: buoyColors.primary,
-            renderItemMeta: renderPatternMeta
-          })
-        })]
-      }), availableItemsSection?.enabled && /*#__PURE__*/_jsxs(View, {
-        style: styles.availableKeysSection,
-        children: [/*#__PURE__*/_jsxs(SectionHeader, {
-          children: [/*#__PURE__*/_jsx(SectionHeader.Icon, {
-            icon: availableItemsSection.icon || Plus,
-            color: buoyColors.primary,
-            size: 12
-          }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-            children: availableItemsSection.title || "AVAILABLE ITEMS"
-          }), /*#__PURE__*/_jsx(SectionHeader.Badge, {
-            count: suggestedItems.length,
-            color: buoyColors.primary
-          })]
-        }), /*#__PURE__*/_jsx(ScrollView, {
-          style: styles.availableKeysScroll,
-          horizontal: false,
-          showsVerticalScrollIndicator: true,
-          nestedScrollEnabled: true,
-          scrollEnabled: true,
-          children: suggestedItems.length > 0 ? suggestedItems.map(item => /*#__PURE__*/_jsxs(TouchableOpacity, {
-            onPress: () => {
-              if (onPatternAdd) {
-                onPatternAdd(item);
-                filterManager.addFilter(item);
-              }
-            },
-            style: styles.availableKeyItem,
-            "sentry-label": "ignore-touchable-opacity",
-            testID: `buoy-filter-available-${item}`,
-            accessibilityRole: "button",
-            accessibilityLabel: `Add filter ${item}`,
-            children: [/*#__PURE__*/_jsx(Text, {
-              style: styles.availableKeyText,
-              numberOfLines: 1,
-              children: item
-            }), /*#__PURE__*/_jsx(Plus, {
-              size: 12,
-              color: buoyColors.primary
-            })]
-          }, item)) : /*#__PURE__*/_jsx(Text, {
-            style: styles.emptyStateText,
-            children: availableItemsSection.emptyMessage || "No items available"
-          })
-        })]
-      }), howItWorksSection?.enabled && /*#__PURE__*/_jsxs(View, {
-        style: styles.howItWorksSection,
-        children: [/*#__PURE__*/_jsxs(SectionHeader, {
-          children: [/*#__PURE__*/_jsx(SectionHeader.Icon, {
-            icon: howItWorksSection.icon || Filter,
-            color: night.color.textSecondary,
-            size: 12
-          }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-            children: howItWorksSection.title || "HOW FILTERS WORK"
-          })]
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.howItWorksText,
-          children: howItWorksSection.description || "Filters help you focus on relevant data by hiding unwanted items."
-        }), howItWorksSection.examples && howItWorksSection.examples.length > 0 && /*#__PURE__*/_jsxs(View, {
-          style: styles.examplesContainer,
-          children: [/*#__PURE__*/_jsx(Text, {
-            style: styles.examplesTitle,
-            children: "EXAMPLES:"
-          }), howItWorksSection.examples.map((example, index) => /*#__PURE__*/_jsx(Text, {
-            style: styles.exampleItem,
-            children: example
-          }, index))]
-        })]
-      }), previewSection?.enabled && /*#__PURE__*/_jsxs(View, {
-        style: styles.previewSection,
-        children: [/*#__PURE__*/_jsxs(SectionHeader, {
-          children: [/*#__PURE__*/_jsx(SectionHeader.Icon, {
-            icon: previewSection.icon || Copy,
-            color: buoyColors.primary,
-            size: 12
-          }), /*#__PURE__*/_jsx(SectionHeader.Title, {
-            children: previewSection.title || "PREVIEW"
-          }), previewSection.headerActions && /*#__PURE__*/_jsx(SectionHeader.Actions, {
-            children: previewSection.headerActions()
-          })]
-        }), /*#__PURE__*/_jsx(View, {
-          style: styles.previewContent,
-          children: previewSection.content()
-        })]
-      })]
-    });
-  };
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.container,
-    children: [renderTabs(), /*#__PURE__*/_jsx(ScrollView
-    // The filter screen's own scroller. Named because the sections it
-    // holds — including the active-pattern list — run past the bottom of
-    // a docked sheet, so reaching one means scrolling THIS, not the short
-    // nested scroller the pattern happens to sit in.
-    , {
-      testID: "buoy-filter-scroll",
-      style: styles.content,
-      contentContainerStyle: styles.scrollContent,
-      showsVerticalScrollIndicator: false,
-      "sentry-label": "ignore-scrollview",
-      children: renderContent()
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    // Transparent so the host modal's night star field shows through.
-    backgroundColor: "transparent"
-  },
-  content: {
-    flex: 1
-  },
-  scrollContent: {
-    paddingTop: 16,
-    paddingHorizontal: 16,
-    paddingBottom: 24
-  },
-  tabContainer: {
-    flexDirection: "row",
-    paddingHorizontal: 16,
-    paddingVertical: 12,
-    gap: 8,
-    backgroundColor: night.color.surface,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.border
-  },
-  tabButton: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 6,
-    paddingVertical: 10,
-    paddingHorizontal: 16,
-    borderRadius: 8,
-    borderWidth: 1
-  },
-  /**
-   * Selection is marked with a 2px accent outline. Border width stays 1 so
-   * selecting a
-   * tile doesn't shift the grid by a pixel.
-   */
-  tabButtonActive: {
-    // White THUMB, not a grey one — the INACTIVE tab is already
-    // `night.color.surfaceElevated` here, so a grey active state would be invisible.
-    backgroundColor: buoyColors.primary + "20",
-    borderColor: buoyColors.primary,
-    borderWidth: 2
-  },
-  tabButtonInactive: {
-    backgroundColor: night.color.surfaceElevated,
-    borderColor: night.color.border
-  },
-  tabButtonText: {
-    fontSize: 11,
-    fontWeight: "600",
-    letterSpacing: 0.5
-  },
-  tabButtonTextActive: {
-    color: buoyColors.primary
-  },
-  tabButtonTextInactive: {
-    color: night.color.textTertiary
-  },
-  tabBadge: {
-    backgroundColor: buoyColors.primary + "40",
-    paddingHorizontal: 6,
-    paddingVertical: 1,
-    borderRadius: 8,
-    minWidth: 18,
-    alignItems: "center"
-  },
-  tabBadgeText: {
-    fontSize: 9,
-    color: buoyColors.primary,
-    fontWeight: "700"
-  },
-  section: {
-    marginBottom: 8
-  },
-  filterInputWrapper: {
-    marginBottom: 4
-  },
-  filterGrid: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 8,
-    marginTop: 8
-  },
-  filterCard: {
-    backgroundColor: night.color.surface,
-    borderRadius: 12,
-    // rounded-xl
-    paddingHorizontal: 8,
-    paddingVertical: 10,
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center",
-    borderWidth: 1,
-    borderColor: night.color.border,
-    width: 72,
-    minHeight: 68
-  },
-  activeFilterCard: {
-    backgroundColor: buoyColors.primary + "33",
-    borderColor: buoyColors.primary,
-    borderWidth: 2,
-    // Subtle glow effect like web — no glows on a light surface.
-    shadowColor: buoyColors.primary,
-    shadowOffset: {
-      width: 0,
-      height: 0
-    },
-    shadowOpacity: 0.3,
-    shadowRadius: 8,
-    elevation: 4
-  },
-  filterIcon: {
-    marginBottom: 0
-  },
-  filterCountActive: {
-    fontSize: 14,
-    fontWeight: "700",
-    color: night.color.text,
-    fontFamily: monoFont,
-    marginTop: 3,
-    marginBottom: 1,
-    textShadowColor: "rgba(0, 0, 0, 0.2)",
-    textShadowOffset: {
-      width: 0,
-      height: 0.5
-    },
-    textShadowRadius: 1
-  },
-  filterCountZero: {
-    fontSize: 11,
-    fontWeight: "500",
-    color: night.color.textTertiary,
-    fontFamily: monoFont,
-    marginTop: 3,
-    marginBottom: 1
-  },
-  filterLabelCompact: {
-    fontSize: 10,
-    color: night.color.text,
-    fontWeight: "600",
-    textAlign: "center",
-    textTransform: "capitalize",
-    textShadowColor: "rgba(0, 0, 0, 0.3)",
-    textShadowOffset: {
-      width: 0,
-      height: 0.5
-    },
-    textShadowRadius: 1
-  },
-  filterDescriptionBottom: {
-    fontSize: 8,
-    color: night.color.textTertiary,
-    textAlign: "center",
-    marginTop: 2,
-    lineHeight: 11
-  },
-  sectionDescription: {
-    fontSize: 10,
-    color: night.color.textSecondary,
-    marginTop: 4,
-    marginBottom: 4,
-    lineHeight: 14
-  },
-  methodBadgeCompact: {
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderRadius: 5,
-    minWidth: 48,
-    maxWidth: 60,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  methodTextCompact: {
-    fontSize: 13,
-    fontWeight: "700",
-    letterSpacing: 0.3,
-    fontFamily: monoFont
-  },
-  activeFiltersSection: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  activeFiltersContent: {
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 16,
-    maxHeight: 200
-  },
-  includeOnlySection: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  includeOnlyDescription: {
-    fontSize: 10,
-    color: night.color.textSecondary,
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    lineHeight: 14
-  },
-  includeOnlyInputWrapper: {
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 8
-  },
-  includeOnlyFiltersContent: {
-    paddingHorizontal: 16,
-    paddingBottom: 16,
-    maxHeight: 150
-  },
-  excludeFiltersSection: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  excludeFiltersDescription: {
-    fontSize: 10,
-    color: night.color.textSecondary,
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    lineHeight: 14
-  },
-  excludeFiltersInputWrapper: {
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 8
-  },
-  excludeFiltersContent: {
-    paddingHorizontal: 16,
-    paddingBottom: 16,
-    maxHeight: 150
-  },
-  filterSummarySection: {
-    backgroundColor: buoyColors.warning + "15",
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: buoyColors.warning + "40",
-    padding: 12,
-    marginBottom: 12
-  },
-  filterSummaryHeader: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    marginBottom: 6
-  },
-  filterSummaryTitle: {
-    fontSize: 12,
-    fontWeight: "600",
-    color: buoyColors.warning
-  },
-  filterSummaryText: {
-    fontSize: 11,
-    color: night.color.text,
-    lineHeight: 16
-  },
-  filterSummaryInclude: {
-    color: buoyColors.success,
-    fontWeight: "500"
-  },
-  filterSummaryExclude: {
-    color: buoyColors.primary,
-    fontWeight: "500"
-  },
-  emptyStateText: {
-    fontSize: 11,
-    color: night.color.textTertiary,
-    fontStyle: "italic",
-    textAlign: "center",
-    paddingVertical: 12
-  },
-  availableKeysSection: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  availableKeysScroll: {
-    maxHeight: 150,
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 16
-  },
-  availableKeyItem: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    paddingVertical: 10,
-    paddingHorizontal: 12,
-    backgroundColor: night.color.surfaceElevated,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginBottom: 8
-  },
-  availableKeyText: {
-    flex: 1,
-    fontSize: 11,
-    color: night.color.text,
-    fontFamily: monoFont,
-    marginRight: 8
-  },
-  howItWorksSection: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.border,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  howItWorksText: {
-    fontSize: 11,
-    color: night.color.textSecondary,
-    lineHeight: 16,
-    marginBottom: 12,
-    marginTop: 8,
-    paddingHorizontal: 16,
-    fontFamily: monoFont
-  },
-  examplesContainer: {
-    paddingTop: 8,
-    paddingHorizontal: 16,
-    paddingBottom: 16,
-    borderTopWidth: 1,
-    borderTopColor: night.color.border
-  },
-  examplesTitle: {
-    fontSize: 10,
-    fontWeight: "600",
-    color: night.color.textTertiary,
-    fontFamily: monoFont,
-    letterSpacing: 0.5,
-    marginBottom: 6
-  },
-  exampleItem: {
-    fontSize: 10,
-    color: night.color.textTertiary,
-    fontFamily: monoFont,
-    lineHeight: 16
-  },
-  previewSection: {
-    backgroundColor: night.color.surfaceElevated,
-    // Slightly lighter to distinguish from other sections
-    borderRadius: 16,
-    // rounded-2xl like web
-    borderWidth: 1,
-    borderColor: night.color.fillTertiary,
-    marginTop: 16,
-    overflow: "hidden"
-  },
-  previewContent: {
-    paddingHorizontal: 16,
-    paddingTop: 12,
-    paddingBottom: 16,
-    backgroundColor: night.color.bg,
-    // Darker content area for contrast
-    marginHorizontal: 12,
-    marginBottom: 12,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.border
-  }
-});
+"use strict";import{View as c,Text as a,TouchableOpacity as F,StyleSheet as U,ScrollView as w}from"react-native";import{useEffect as X,useState as Y}from"react";import{Filter as A,Plus as v,Copy as J,Eye as Q,Info as ee}from"../../icons/index.js";import{SectionHeader as d}from"./SectionHeader.js";import{FilterList as H,AddFilterInput as W,AddFilterButton as E}from"./FilterComponents.js";import{useFilterManager as R}from"../../hooks/useFilterManager.js";import{buoyColors as i}from"../gameUI/constants/gameUIColors.js";import{night as o}from"../night/nightTheme.js";import{monoFont as f}from"../fonts.js";import{jsx as e,jsxs as n,Fragment as D}from"react/jsx-runtime";export function DynamicFilterView({sections:L=[],filterSummarySection:p,addFilterSection:T,includeOnlySection:s,availableItemsSection:x,howItWorksSection:h,previewSection:y,onFilterChange:V,onPatternToggle:k,onPatternAdd:z,activePatterns:g=new Set,renderPatternMeta:j,tabs:b,activeTab:K,onTabChange:B}){const u=R(g);const m=R(s?.patterns||new Set);const[P,M]=Y(b?.[0]?.id||"");const C=K||P;X(()=>{if(g.size!==u.filters.size||!Array.from(g).every(t=>u.filters.has(t))){}},[g,u.filters]);const N=()=>{if(u.newFilter.trim()&&z){z(u.newFilter.trim());u.addFilter(u.newFilter)}};const O=()=>{if(m.newFilter.trim()&&s?.onPatternAdd){s.onPatternAdd(m.newFilter.trim());m.addFilter(m.newFilter)}};const I=x?.items?.filter(t=>{return!Array.from(g).some(l=>t.includes(l))})||[];const $=()=>{if(!b||b.length===0)return null;return e(c,{style:r.tabContainer,children:b.map(t=>n(F,{onPress:()=>{if(B)B(t.id);else M(t.id)},style:[r.tabButton,C===t.id?r.tabButtonActive:r.tabButtonInactive],children:[t.icon&&e(t.icon,{size:14,color:C===t.id?i.primary:o.color.textTertiary}),e(a,{style:[r.tabButtonText,C===t.id?r.tabButtonTextActive:r.tabButtonTextInactive],children:t.label}),t.count!==void 0&&t.count>0&&e(c,{style:r.tabBadge,children:e(a,{style:r.tabBadgeText,children:t.count})})]},t.id))})};const Z=t=>{if(t.type==="custom"&&t.renderCustom){return t.renderCustom()}if(t.type==="patterns"){return null}if(!t.data||t.data.length===0)return null;return n(c,{style:r.section,children:[n(d,{children:[t.icon&&e(d.Icon,{icon:t.icon,color:t.color||i.primary,size:12}),e(d.Title,{children:t.title})]}),t.description&&e(a,{style:r.sectionDescription,children:t.description}),e(c,{style:r.filterGrid,children:t.data.map(l=>{const S=l.count!==void 0;const q=S&&l.count===0;const G=t.type!=="method"||l.icon;return n(F,{testID:`buoy-filter-option-${l.id}`,accessibilityRole:"button",accessibilityLabel:String(l.label??l.id),style:[r.filterCard,l.isActive&&r.activeFilterCard],onPress:()=>V?.(l.id,l.value),children:[l.icon?e(l.icon,{size:24,color:l.color,style:r.filterIcon}):t.type==="method"?e(c,{style:[r.methodBadgeCompact,{backgroundColor:`${l.color}20`}],children:e(a,{style:[r.methodTextCompact,{color:l.color}],numberOfLines:1,adjustsFontSizeToFit:true,minimumFontScale:.8,children:l.label})}):null,S&&e(a,{style:[q?r.filterCountZero:r.filterCountActive],children:l.count}),G&&e(a,{style:r.filterLabelCompact,children:l.label}),l.description&&e(a,{style:r.filterDescriptionBottom,children:l.description})]},l.id)})})]},t.id)};const _=()=>{if(b&&C){const t=b.find(l=>l.id===C);if(t?.content){return t.content()}}return n(D,{children:[p?.enabled&&(p.includePatterns?.size||p.excludePatterns?.size)?n(c,{style:r.filterSummarySection,children:[n(c,{style:r.filterSummaryHeader,children:[e(ee,{size:14,color:i.warning}),e(a,{style:r.filterSummaryTitle,children:"Filters Active"})]}),n(a,{style:r.filterSummaryText,children:["Showing ",p.filteredCount," of ",p.totalCount," queries",p.includePatterns?.size?n(a,{style:r.filterSummaryInclude,children:[" ","\u2022 Including: ",Array.from(p.includePatterns).join(", ")]}):null,p.excludePatterns?.size?n(a,{style:r.filterSummaryExclude,children:[" ","\u2022 Excluding: ",Array.from(p.excludePatterns).join(", ")]}):null]})]}):null,L.map(Z),s?.enabled&&n(c,{style:r.includeOnlySection,children:[n(d,{children:[e(d.Icon,{icon:s.icon||Q,color:i.success,size:12}),e(d.Title,{children:s.title||"INCLUDE ONLY FILTERS"}),s.patterns.size>0&&e(d.Badge,{count:s.patterns.size,color:i.success})]}),s.description&&e(a,{style:r.includeOnlyDescription,children:s.description}),e(c,{style:r.includeOnlyInputWrapper,children:!m.showAddInput?e(E,{onPress:()=>m.setShowAddInput(true),color:i.success,label:"Add include pattern",testID:"buoy-filter-include-add-open"}):e(W,{value:m.newFilter,onChange:m.setNewFilter,onSubmit:O,onCancel:()=>{m.setShowAddInput(false);m.setNewFilter("")},placeholder:s.placeholder||"Enter pattern to include...",color:i.success,testID:"buoy-filter-include-input"})}),s.patterns.size>0&&e(w,{testID:"buoy-filter-include-scroll",style:r.includeOnlyFiltersContent,showsVerticalScrollIndicator:true,nestedScrollEnabled:true,children:e(H,{filters:s.patterns,onRemoveFilter:s.onPatternToggle,color:i.success})})]}),T?.enabled&&n(c,{style:r.excludeFiltersSection,children:[n(d,{children:[e(d.Icon,{icon:A,color:i.primary,size:12}),e(d.Title,{children:T.title||"EXCLUDE FILTERS"}),g.size>0&&e(d.Badge,{count:g.size,color:i.primary})]}),e(a,{style:r.excludeFiltersDescription,children:"Hide queries matching these patterns from the list."}),e(c,{style:r.excludeFiltersInputWrapper,children:!u.showAddInput?e(E,{onPress:()=>u.setShowAddInput(true),color:i.primary,label:"Add exclude pattern"}):n(D,{children:[T.renderExtra?.(),e(W,{value:u.newFilter,onChange:u.setNewFilter,onSubmit:N,onCancel:()=>{u.setShowAddInput(false);u.setNewFilter("")},placeholder:T.placeholder||"Enter pattern to exclude...",color:i.primary})]})}),g.size>0&&e(w,{testID:"buoy-filter-active-scroll",style:r.excludeFiltersContent,showsVerticalScrollIndicator:true,nestedScrollEnabled:true,children:e(H,{filters:g,onRemoveFilter:k,color:i.primary,renderItemMeta:j})})]}),x?.enabled&&n(c,{style:r.availableKeysSection,children:[n(d,{children:[e(d.Icon,{icon:x.icon||v,color:i.primary,size:12}),e(d.Title,{children:x.title||"AVAILABLE ITEMS"}),e(d.Badge,{count:I.length,color:i.primary})]}),e(w,{style:r.availableKeysScroll,horizontal:false,showsVerticalScrollIndicator:true,nestedScrollEnabled:true,scrollEnabled:true,children:I.length>0?I.map(t=>n(F,{onPress:()=>{if(z){z(t);u.addFilter(t)}},style:r.availableKeyItem,"sentry-label":"ignore-touchable-opacity",testID:`buoy-filter-available-${t}`,accessibilityRole:"button",accessibilityLabel:`Add filter ${t}`,children:[e(a,{style:r.availableKeyText,numberOfLines:1,children:t}),e(v,{size:12,color:i.primary})]},t)):e(a,{style:r.emptyStateText,children:x.emptyMessage||"No items available"})})]}),h?.enabled&&n(c,{style:r.howItWorksSection,children:[n(d,{children:[e(d.Icon,{icon:h.icon||A,color:o.color.textSecondary,size:12}),e(d.Title,{children:h.title||"HOW FILTERS WORK"})]}),e(a,{style:r.howItWorksText,children:h.description||"Filters help you focus on relevant data by hiding unwanted items."}),h.examples&&h.examples.length>0&&n(c,{style:r.examplesContainer,children:[e(a,{style:r.examplesTitle,children:"EXAMPLES:"}),h.examples.map((t,l)=>e(a,{style:r.exampleItem,children:t},l))]})]}),y?.enabled&&n(c,{style:r.previewSection,children:[n(d,{children:[e(d.Icon,{icon:y.icon||J,color:i.primary,size:12}),e(d.Title,{children:y.title||"PREVIEW"}),y.headerActions&&e(d.Actions,{children:y.headerActions()})]}),e(c,{style:r.previewContent,children:y.content()})]})]})};return n(c,{style:r.container,children:[$(),e(w,{testID:"buoy-filter-scroll",style:r.content,contentContainerStyle:r.scrollContent,showsVerticalScrollIndicator:false,"sentry-label":"ignore-scrollview",children:_()})]})}const r=U.create({container:{flex:1,backgroundColor:"transparent"},content:{flex:1},scrollContent:{paddingTop:16,paddingHorizontal:16,paddingBottom:24},tabContainer:{flexDirection:"row",paddingHorizontal:16,paddingVertical:12,gap:8,backgroundColor:o.color.surface,borderBottomWidth:1,borderBottomColor:o.color.border},tabButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:10,paddingHorizontal:16,borderRadius:8,borderWidth:1},tabButtonActive:{backgroundColor:i.primary+"20",borderColor:i.primary,borderWidth:2},tabButtonInactive:{backgroundColor:o.color.surfaceElevated,borderColor:o.color.border},tabButtonText:{fontSize:11,fontWeight:"600",letterSpacing:.5},tabButtonTextActive:{color:i.primary},tabButtonTextInactive:{color:o.color.textTertiary},tabBadge:{backgroundColor:i.primary+"40",paddingHorizontal:6,paddingVertical:1,borderRadius:8,minWidth:18,alignItems:"center"},tabBadgeText:{fontSize:9,color:i.primary,fontWeight:"700"},section:{marginBottom:8},filterInputWrapper:{marginBottom:4},filterGrid:{flexDirection:"row",flexWrap:"wrap",gap:8,marginTop:8},filterCard:{backgroundColor:o.color.surface,borderRadius:12,paddingHorizontal:8,paddingVertical:10,flexDirection:"column",alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:o.color.border,width:72,minHeight:68},activeFilterCard:{backgroundColor:i.primary+"33",borderColor:i.primary,borderWidth:2,shadowColor:i.primary,shadowOffset:{width:0,height:0},shadowOpacity:.3,shadowRadius:8,elevation:4},filterIcon:{marginBottom:0},filterCountActive:{fontSize:14,fontWeight:"700",color:o.color.text,fontFamily:f,marginTop:3,marginBottom:1,textShadowColor:"rgba(0, 0, 0, 0.2)",textShadowOffset:{width:0,height:.5},textShadowRadius:1},filterCountZero:{fontSize:11,fontWeight:"500",color:o.color.textTertiary,fontFamily:f,marginTop:3,marginBottom:1},filterLabelCompact:{fontSize:10,color:o.color.text,fontWeight:"600",textAlign:"center",textTransform:"capitalize",textShadowColor:"rgba(0, 0, 0, 0.3)",textShadowOffset:{width:0,height:.5},textShadowRadius:1},filterDescriptionBottom:{fontSize:8,color:o.color.textTertiary,textAlign:"center",marginTop:2,lineHeight:11},sectionDescription:{fontSize:10,color:o.color.textSecondary,marginTop:4,marginBottom:4,lineHeight:14},methodBadgeCompact:{paddingHorizontal:8,paddingVertical:4,borderRadius:5,minWidth:48,maxWidth:60,alignItems:"center",justifyContent:"center"},methodTextCompact:{fontSize:13,fontWeight:"700",letterSpacing:.3,fontFamily:f},activeFiltersSection:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,marginTop:16,overflow:"hidden"},activeFiltersContent:{paddingHorizontal:16,paddingTop:8,paddingBottom:16,maxHeight:200},includeOnlySection:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,marginTop:16,overflow:"hidden"},includeOnlyDescription:{fontSize:10,color:o.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:14},includeOnlyInputWrapper:{paddingHorizontal:16,paddingTop:8,paddingBottom:8},includeOnlyFiltersContent:{paddingHorizontal:16,paddingBottom:16,maxHeight:150},excludeFiltersSection:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,marginTop:16,overflow:"hidden"},excludeFiltersDescription:{fontSize:10,color:o.color.textSecondary,paddingHorizontal:16,paddingTop:8,lineHeight:14},excludeFiltersInputWrapper:{paddingHorizontal:16,paddingTop:8,paddingBottom:8},excludeFiltersContent:{paddingHorizontal:16,paddingBottom:16,maxHeight:150},filterSummarySection:{backgroundColor:i.warning+"15",borderRadius:8,borderWidth:1,borderColor:i.warning+"40",padding:12,marginBottom:12},filterSummaryHeader:{flexDirection:"row",alignItems:"center",gap:6,marginBottom:6},filterSummaryTitle:{fontSize:12,fontWeight:"600",color:i.warning},filterSummaryText:{fontSize:11,color:o.color.text,lineHeight:16},filterSummaryInclude:{color:i.success,fontWeight:"500"},filterSummaryExclude:{color:i.primary,fontWeight:"500"},emptyStateText:{fontSize:11,color:o.color.textTertiary,fontStyle:"italic",textAlign:"center",paddingVertical:12},availableKeysSection:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,marginTop:16,overflow:"hidden"},availableKeysScroll:{maxHeight:150,paddingHorizontal:16,paddingTop:8,paddingBottom:16},availableKeyItem:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:10,paddingHorizontal:12,backgroundColor:o.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:o.color.border,marginBottom:8},availableKeyText:{flex:1,fontSize:11,color:o.color.text,fontFamily:f,marginRight:8},howItWorksSection:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,marginTop:16,overflow:"hidden"},howItWorksText:{fontSize:11,color:o.color.textSecondary,lineHeight:16,marginBottom:12,marginTop:8,paddingHorizontal:16,fontFamily:f},examplesContainer:{paddingTop:8,paddingHorizontal:16,paddingBottom:16,borderTopWidth:1,borderTopColor:o.color.border},examplesTitle:{fontSize:10,fontWeight:"600",color:o.color.textTertiary,fontFamily:f,letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:o.color.textTertiary,fontFamily:f,lineHeight:16},previewSection:{backgroundColor:o.color.surfaceElevated,borderRadius:16,borderWidth:1,borderColor:o.color.fillTertiary,marginTop:16,overflow:"hidden"},previewContent:{paddingHorizontal:16,paddingTop:12,paddingBottom:16,backgroundColor:o.color.bg,marginHorizontal:12,marginBottom:12,borderRadius:8,borderWidth:1,borderColor:o.color.border}});