@buoy-gg/shared-ui 7.0.40 → 7.0.42

package/lib/commonjs/ui/components/EmptyState.js

@@ -1,151 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EmptyState = EmptyState;
-exports.NoDataEmptyState = NoDataEmptyState;
-exports.NoResultsEmptyState = NoResultsEmptyState;
-exports.NoSearchResultsEmptyState = NoSearchResultsEmptyState;
-var _reactNative = require("react-native");
-var _macOSDesignSystemColors = require("../gameUI/constants/macOSDesignSystemColors.js");
-var _index = require("../otto/index.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Reusable empty state component for consistent empty/no-data displays
- */
-function EmptyState({
-  otto,
-  title,
-  description,
-  icon: Icon,
-  iconSize = 48,
-  iconColor = _macOSDesignSystemColors.macOSColors.border.hover,
-  action,
-  variant = "default",
-  style
-}) {
-  const containerStyle = [styles.container, variant === "card" && styles.cardVariant, variant === "minimal" && styles.minimalVariant, style];
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: containerStyle,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.content,
-      children: [otto ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.iconContainer,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Otto, {
-          state: otto,
-          pixelSize: Math.max(2, Math.round(iconSize / 16))
-        })
-      }) : Icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.iconContainer,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-          size: iconSize,
-          color: iconColor
-        })
-      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.title,
-        children: title
-      }), description && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.description,
-        children: description
-      }), action && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-        style: styles.actionButton,
-        onPress: action.onPress,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.actionButtonText,
-          children: action.label
-        })
-      })]
-    })
-  });
-}
-
-/**
- * Pre-configured empty state for no data scenarios
- */
-function NoDataEmptyState() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(EmptyState, {
-    title: "No data found",
-    description: "Data will appear here when available"
-  });
-}
-
-/**
- * Pre-configured empty state for filtered results
- */
-function NoResultsEmptyState() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(EmptyState, {
-    title: "No matching results",
-    description: "Try adjusting your filters to see more results"
-  });
-}
-
-/**
- * Pre-configured empty state for search results
- */
-function NoSearchResultsEmptyState({
-  searchTerm
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(EmptyState, {
-    title: "No search results",
-    description: searchTerm ? `No results found for "${searchTerm}"` : "Try a different search term"
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    padding: 32
-  },
-  content: {
-    alignItems: "center",
-    maxWidth: 300
-  },
-  cardVariant: {
-    backgroundColor: "rgba(128, 128, 128, 0.06)",
-    padding: 32,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: "rgba(128, 128, 128, 0.1)"
-  },
-  minimalVariant: {
-    padding: 16
-  },
-  iconContainer: {
-    marginBottom: 16
-  },
-  title: {
-    color: _macOSDesignSystemColors.macOSColors.text.icon,
-    fontSize: 16,
-    fontWeight: "500",
-    textAlign: "center",
-    marginBottom: 8
-  },
-  description: {
-    // ⚠️ KNOWN LOW CONTRAST. This reads a BORDER token — border.hover is tuned
-    // to be a faint LINE, so as text it lands at ~2.8:1 on the near-black
-    // canvas, under WCAG AA. `macOSColors.text.muted` is the real tertiary-text
-    // token and would clear it comfortably. Left as-is because it is the
-    // shipped look and changing it moves every empty state in the suite; worth
-    // a deliberate pass rather than a drive-by.
-    color: _macOSDesignSystemColors.macOSColors.border.hover,
-    fontSize: 14,
-    textAlign: "center",
-    lineHeight: 20
-  },
-  actionButton: {
-    marginTop: 16,
-    paddingHorizontal: 16,
-    paddingVertical: 8,
-    backgroundColor: "rgba(59, 130, 246, 0.1)",
-    borderRadius: 6,
-    borderWidth: 1,
-    borderColor: "rgba(59, 130, 246, 0.2)"
-  },
-  actionButtonText: {
-    color: "#3B82F6",
-    fontSize: 14,
-    fontWeight: "500"
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EmptyState=EmptyState;exports.NoDataEmptyState=NoDataEmptyState;exports.NoResultsEmptyState=NoResultsEmptyState;exports.NoSearchResultsEmptyState=NoSearchResultsEmptyState;var _reactNative=require("react-native");var _macOSDesignSystemColors=require("../gameUI/constants/macOSDesignSystemColors.js");var _index=require("../otto/index.js");var _jsxRuntime=require("react/jsx-runtime");function EmptyState({otto:t,title:a,description:r,icon:o,iconSize:n=48,iconColor:s=_macOSDesignSystemColors.macOSColors.border.hover,action:e,variant:i="default",style:l}){const c=[styles.container,i==="card"&&styles.cardVariant,i==="minimal"&&styles.minimalVariant,l];return(0,_jsxRuntime.jsx)(_reactNative.View,{style:c,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.content,children:[t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.iconContainer,children:(0,_jsxRuntime.jsx)(_index.Otto,{state:t,pixelSize:Math.max(2,Math.round(n/16))})}):o?(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.iconContainer,children:(0,_jsxRuntime.jsx)(o,{size:n,color:s})}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.title,children:a}),r&&(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.description,children:r}),e&&(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:styles.actionButton,onPress:e.onPress,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.actionButtonText,children:e.label})})]})})}function NoDataEmptyState(){return(0,_jsxRuntime.jsx)(EmptyState,{title:"No data found",description:"Data will appear here when available"})}function NoResultsEmptyState(){return(0,_jsxRuntime.jsx)(EmptyState,{title:"No matching results",description:"Try adjusting your filters to see more results"})}function NoSearchResultsEmptyState({searchTerm:t}){return(0,_jsxRuntime.jsx)(EmptyState,{title:"No search results",description:t?`No results found for "${t}"`:"Try a different search term"})}const styles=_reactNative.StyleSheet.create({container:{flex:1,justifyContent:"center",alignItems:"center",padding:32},content:{alignItems:"center",maxWidth:300},cardVariant:{backgroundColor:"rgba(128, 128, 128, 0.06)",padding:32,borderRadius:8,borderWidth:1,borderColor:"rgba(128, 128, 128, 0.1)"},minimalVariant:{padding:16},iconContainer:{marginBottom:16},title:{color:_macOSDesignSystemColors.macOSColors.text.icon,fontSize:16,fontWeight:"500",textAlign:"center",marginBottom:8},description:{color:_macOSDesignSystemColors.macOSColors.border.hover,fontSize:14,textAlign:"center",lineHeight:20},actionButton:{marginTop:16,paddingHorizontal:16,paddingVertical:8,backgroundColor:"rgba(59, 130, 246, 0.1)",borderRadius:6,borderWidth:1,borderColor:"rgba(59, 130, 246, 0.2)"},actionButtonText:{color:"#3B82F6",fontSize:14,fontWeight:"500"}});

package/lib/commonjs/ui/components/EntityFilterView.js

@@ -1,355 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EntityFilterView = EntityFilterView;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _index = require("../../icons/index.js");
-var _nightTheme = require("../night/nightTheme.js");
-var _SectionHeader = require("./SectionHeader.js");
-var _FilterComponents = require("./FilterComponents.js");
-var _fonts = require("../fonts.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * EntityFilterView — the "hide these by name" filter screen the state tools
- * share: a list of registered entities (stores, atoms) you can tap to hide,
- * the active name patterns with a remove ✕, an add-pattern affordance, and
- * a how-it-works card.
- *
- * zustand and jotai each shipped their own copy (~370 lines apiece). The
- * tool supplies the entities, the nouns and the testID prefix; the screen
- * is drawn once.
- *
- * testID convention (unchanged from zustand's):
- *   `${prefix}-filters-scroll`, `${prefix}-filters-${entityKey}-count`,
- *   `${prefix}-filters-${entityKey}-${slug(name)}`, `${prefix}-filters-count`,
- *   `${prefix}-filters-add-open`, `${prefix}-filters-add-input`,
- *   `${prefix}-filters-chip-${slug(pattern)}`.
- */
-
-/** True if any active pattern hides this entity. */
-function isHidden(entity, ignoredPatterns) {
-  return Array.from(ignoredPatterns).some(p => entity.name.toLowerCase().includes(p.toLowerCase()));
-}
-
-/** The entity color for a pattern that exactly names a registered entity. */
-function colorForPattern(pattern, entities) {
-  const match = entities.find(e => e.name.toLowerCase() === pattern.toLowerCase());
-  return match ? match.color : null;
-}
-function EntityFilterView({
-  entities,
-  ignoredPatterns,
-  onTogglePattern,
-  onAddPattern,
-  entityNoun,
-  entitySingular,
-  entityKey,
-  testIDPrefix,
-  slug,
-  howItWorks,
-  examples,
-  addPlaceholder,
-  emptyMessage
-}) {
-  const [showAddInput, setShowAddInput] = (0, _react.useState)(false);
-  const [inputValue, setInputValue] = (0, _react.useState)("");
-  const handleAddPattern = () => {
-    const trimmed = inputValue.trim();
-    if (trimmed) {
-      onAddPattern(trimmed);
-      setInputValue("");
-      setShowAddInput(false);
-    }
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
-    style: styles.container,
-    contentContainerStyle: styles.scrollContent,
-    showsVerticalScrollIndicator: false,
-    nestedScrollEnabled: true,
-    testID: `${testIDPrefix}-filters-scroll`,
-    children: [entities.length === 0 && emptyMessage ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.section,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title, {
-          children: ["REGISTERED ", entityNoun]
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.emptyText,
-        testID: `${testIDPrefix}-filters-${entityKey}s-empty`,
-        children: emptyMessage
-      })]
-    }) : null, entities.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.section,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title, {
-          children: ["REGISTERED ", entityNoun]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader.Badge, {
-          count: entities.length,
-          color: _nightTheme.night.color.accent,
-          testID: `${testIDPrefix}-filters-${entityKey}-count`
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
-        style: styles.entityList,
-        contentContainerStyle: styles.entityListContent,
-        showsVerticalScrollIndicator: true,
-        nestedScrollEnabled: true,
-        testID: `${testIDPrefix}-filters-${entityKey}-list`,
-        children: entities.map(entity => {
-          const hidden = isHidden(entity, ignoredPatterns);
-          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-            style: [styles.entityRow, hidden && styles.entityRowHidden],
-            onPress: () => onAddPattern(entity.name),
-            disabled: hidden,
-            testID: `${testIDPrefix}-filters-${entityKey}-${slug(entity.name)}`,
-            accessibilityRole: "button",
-            accessibilityLabel: `Hide ${entity.name}`,
-            accessibilityState: {
-              disabled: hidden
-            },
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: [styles.dot, {
-                backgroundColor: hidden ? _nightTheme.night.color.textTertiary : entity.color
-              }]
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: [styles.entityText, hidden ? styles.entityTextHidden : {
-                color: entity.color
-              }],
-              numberOfLines: 1,
-              children: entity.name
-            }), hidden ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: styles.hiddenLabel,
-              children: "hidden"
-            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: [styles.addLabel, {
-                color: entity.color + "99"
-              }],
-              children: "+ hide"
-            })]
-          }, entity.name);
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.section,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader.Icon, {
-          icon: _index.Filter,
-          color: _nightTheme.night.color.accent,
-          size: 12
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title, {
-          children: [entitySingular.toUpperCase(), " NAME FILTERS"]
-        }), ignoredPatterns.size > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader.Badge, {
-          count: ignoredPatterns.size,
-          color: _nightTheme.night.color.accent,
-          testID: `${testIDPrefix}-filters-count`
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.addInputWrapper,
-        children: !showAddInput ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_FilterComponents.AddFilterButton, {
-          onPress: () => setShowAddInput(true),
-          color: _nightTheme.night.color.accent,
-          label: `Add ${entitySingular} name pattern`,
-          testID: `${testIDPrefix}-filters-add-open`
-        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_FilterComponents.AddFilterInput, {
-          value: inputValue,
-          onChange: setInputValue,
-          onSubmit: handleAddPattern,
-          onCancel: () => {
-            setShowAddInput(false);
-            setInputValue("");
-          },
-          placeholder: addPlaceholder ?? `Enter ${entitySingular} name pattern to hide...`,
-          color: _nightTheme.night.color.accent,
-          testID: `${testIDPrefix}-filters-add-input`
-        })
-      }), ignoredPatterns.size > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.patternList,
-        children: Array.from(ignoredPatterns).map(pattern => {
-          const color = colorForPattern(pattern, entities);
-          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-            style: styles.patternRow,
-            onPress: () => onTogglePattern(pattern),
-            activeOpacity: 0.8,
-            testID: `${testIDPrefix}-filters-chip-${slug(pattern)}`,
-            accessibilityRole: "button",
-            accessibilityLabel: `Remove filter ${pattern}`,
-            children: [color ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: [styles.dot, {
-                backgroundColor: color
-              }]
-            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: [styles.patternText, color ? {
-                color
-              } : null],
-              numberOfLines: 1,
-              children: pattern
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.X, {
-              size: 12,
-              color: _nightTheme.night.color.accent + "80"
-            })]
-          }, pattern);
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.section,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_SectionHeader.SectionHeader, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader.Icon, {
-          icon: _index.Filter,
-          color: _nightTheme.night.color.textSecondary,
-          size: 12
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SectionHeader.SectionHeader.Title, {
-          children: "HOW EVENT FILTERS WORK"
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.howItWorksText,
-        children: howItWorks
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.examplesContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.examplesTitle,
-          children: "EXAMPLES:"
-        }), examples.map(ex => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.exampleItem,
-          children: ex
-        }, ex))]
-      })]
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    flex: 1,
-    // Transparent so the night sheet's star field shows through.
-    backgroundColor: "transparent"
-  },
-  scrollContent: {
-    paddingTop: 16,
-    paddingHorizontal: 16,
-    paddingBottom: 24,
-    gap: 16
-  },
-  section: {
-    backgroundColor: _nightTheme.night.color.surface,
-    borderRadius: 16,
-    borderWidth: 1,
-    borderColor: _nightTheme.night.color.border,
-    overflow: "hidden"
-  },
-  entityList: {
-    maxHeight: 180
-  },
-  entityListContent: {
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 16,
-    gap: 10
-  },
-  entityRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    paddingVertical: 10,
-    paddingHorizontal: 12,
-    backgroundColor: _nightTheme.night.color.surfaceElevated,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: _nightTheme.night.color.border
-  },
-  entityRowHidden: {
-    opacity: 0.45
-  },
-  dot: {
-    width: 7,
-    height: 7,
-    borderRadius: 3.5
-  },
-  entityText: {
-    flex: 1,
-    fontSize: 12,
-    fontWeight: "600",
-    fontFamily: _fonts.monoFont
-  },
-  entityTextHidden: {
-    color: _nightTheme.night.color.textTertiary,
-    textDecorationLine: "line-through"
-  },
-  hiddenLabel: {
-    fontSize: 10,
-    fontWeight: "500",
-    color: _nightTheme.night.color.textTertiary,
-    fontFamily: _fonts.monoFont
-  },
-  addLabel: {
-    fontSize: 10,
-    fontWeight: "600",
-    fontFamily: _fonts.monoFont
-  },
-  addInputWrapper: {
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 8
-  },
-  patternList: {
-    paddingHorizontal: 16,
-    paddingBottom: 16,
-    gap: 8
-  },
-  patternRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    paddingVertical: 10,
-    paddingHorizontal: 12,
-    backgroundColor: _nightTheme.night.color.surfaceElevated,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: _nightTheme.night.color.border,
-    gap: 8
-  },
-  patternText: {
-    flex: 1,
-    fontSize: 12,
-    fontFamily: _fonts.monoFont,
-    color: _nightTheme.night.color.text
-  },
-  emptyText: {
-    fontSize: 11,
-    color: _nightTheme.night.color.textTertiary,
-    paddingHorizontal: 16,
-    paddingTop: 8,
-    paddingBottom: 16,
-    fontFamily: _fonts.monoFont
-  },
-  howItWorksText: {
-    fontSize: 11,
-    color: _nightTheme.night.color.textSecondary,
-    lineHeight: 16,
-    marginTop: 8,
-    paddingHorizontal: 16,
-    fontFamily: _fonts.monoFont
-  },
-  examplesContainer: {
-    paddingTop: 8,
-    paddingHorizontal: 16,
-    paddingBottom: 16,
-    borderTopWidth: 1,
-    borderTopColor: _nightTheme.night.color.border,
-    marginTop: 12
-  },
-  examplesTitle: {
-    fontSize: 10,
-    fontWeight: "600",
-    color: _nightTheme.night.color.textTertiary,
-    fontFamily: _fonts.monoFont,
-    letterSpacing: 0.5,
-    marginBottom: 6
-  },
-  exampleItem: {
-    fontSize: 10,
-    color: _nightTheme.night.color.textTertiary,
-    fontFamily: _fonts.monoFont,
-    lineHeight: 16
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EntityFilterView=EntityFilterView;var _react=require("react");var _reactNative=require("react-native");var _index=require("../../icons/index.js");var _nightTheme=require("../night/nightTheme.js");var _SectionHeader=require("./SectionHeader.js");var _FilterComponents=require("./FilterComponents.js");var _fonts=require("../fonts.js");var _jsxRuntime=require("react/jsx-runtime");function isHidden(o,n){return Array.from(n).some(i=>o.name.toLowerCase().includes(i.toLowerCase()))}function colorForPattern(o,n){const i=n.find(l=>l.name.toLowerCase()===o.toLowerCase());return i?i.color:null}function EntityFilterView({entities:o,ignoredPatterns:n,onTogglePattern:i,onAddPattern:l,entityNoun:h,entitySingular:c,entityKey:a,testIDPrefix:r,slug:p,howItWorks:m,examples:u,addPlaceholder:y,emptyMessage:x}){const[f,d]=(0,_react.useState)(false);const[g,s]=(0,_react.useState)("");const T=()=>{const e=g.trim();if(e){l(e);s("");d(false)}};return(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{style:styles.container,contentContainerStyle:styles.scrollContent,showsVerticalScrollIndicator:false,nestedScrollEnabled:true,testID:`${r}-filters-scroll`,children:[o.length===0&&x?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader,{children:(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title,{children:["REGISTERED ",h]})}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyText,testID:`${r}-filters-${a}s-empty`,children:x})]}):null,o.length>0&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader,{children:[(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title,{children:["REGISTERED ",h]}),(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader.Badge,{count:o.length,color:_nightTheme.night.color.accent,testID:`${r}-filters-${a}-count`})]}),(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:styles.entityList,contentContainerStyle:styles.entityListContent,showsVerticalScrollIndicator:true,nestedScrollEnabled:true,testID:`${r}-filters-${a}-list`,children:o.map(e=>{const t=isHidden(e,n);return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.entityRow,t&&styles.entityRowHidden],onPress:()=>l(e.name),disabled:t,testID:`${r}-filters-${a}-${p(e.name)}`,accessibilityRole:"button",accessibilityLabel:`Hide ${e.name}`,accessibilityState:{disabled:t},children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.dot,{backgroundColor:t?_nightTheme.night.color.textTertiary:e.color}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.entityText,t?styles.entityTextHidden:{color:e.color}],numberOfLines:1,children:e.name}),t?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.hiddenLabel,children:"hidden"}):(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.addLabel,{color:e.color+"99"}],children:"+ hide"})]},e.name)})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader.Icon,{icon:_index.Filter,color:_nightTheme.night.color.accent,size:12}),(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader.Title,{children:[c.toUpperCase()," NAME FILTERS"]}),n.size>0&&(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader.Badge,{count:n.size,color:_nightTheme.night.color.accent,testID:`${r}-filters-count`})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.addInputWrapper,children:!f?(0,_jsxRuntime.jsx)(_FilterComponents.AddFilterButton,{onPress:()=>d(true),color:_nightTheme.night.color.accent,label:`Add ${c} name pattern`,testID:`${r}-filters-add-open`}):(0,_jsxRuntime.jsx)(_FilterComponents.AddFilterInput,{value:g,onChange:s,onSubmit:T,onCancel:()=>{d(false);s("")},placeholder:y??`Enter ${c} name pattern to hide...`,color:_nightTheme.night.color.accent,testID:`${r}-filters-add-input`})}),n.size>0&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.patternList,children:Array.from(n).map(e=>{const t=colorForPattern(e,o);return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:styles.patternRow,onPress:()=>i(e),activeOpacity:.8,testID:`${r}-filters-chip-${p(e)}`,accessibilityRole:"button",accessibilityLabel:`Remove filter ${e}`,children:[t?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.dot,{backgroundColor:t}]}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.patternText,t?{color:t}:null],numberOfLines:1,children:e}),(0,_jsxRuntime.jsx)(_index.X,{size:12,color:_nightTheme.night.color.accent+"80"})]},e)})})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_SectionHeader.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader.Icon,{icon:_index.Filter,color:_nightTheme.night.color.textSecondary,size:12}),(0,_jsxRuntime.jsx)(_SectionHeader.SectionHeader.Title,{children:"HOW EVENT FILTERS WORK"})]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.howItWorksText,children:m}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.examplesContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.examplesTitle,children:"EXAMPLES:"}),u.map(e=>(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.exampleItem,children:e},e))]})]})]})}const styles=_reactNative.StyleSheet.create({container:{flex:1,backgroundColor:"transparent"},scrollContent:{paddingTop:16,paddingHorizontal:16,paddingBottom:24,gap:16},section:{backgroundColor:_nightTheme.night.color.surface,borderRadius:16,borderWidth:1,borderColor:_nightTheme.night.color.border,overflow:"hidden"},entityList:{maxHeight:180},entityListContent:{paddingHorizontal:16,paddingTop:8,paddingBottom:16,gap:10},entityRow:{flexDirection:"row",alignItems:"center",gap:10,paddingVertical:10,paddingHorizontal:12,backgroundColor:_nightTheme.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_nightTheme.night.color.border},entityRowHidden:{opacity:.45},dot:{width:7,height:7,borderRadius:3.5},entityText:{flex:1,fontSize:12,fontWeight:"600",fontFamily:_fonts.monoFont},entityTextHidden:{color:_nightTheme.night.color.textTertiary,textDecorationLine:"line-through"},hiddenLabel:{fontSize:10,fontWeight:"500",color:_nightTheme.night.color.textTertiary,fontFamily:_fonts.monoFont},addLabel:{fontSize:10,fontWeight:"600",fontFamily:_fonts.monoFont},addInputWrapper:{paddingHorizontal:16,paddingTop:8,paddingBottom:8},patternList:{paddingHorizontal:16,paddingBottom:16,gap:8},patternRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:10,paddingHorizontal:12,backgroundColor:_nightTheme.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_nightTheme.night.color.border,gap:8},patternText:{flex:1,fontSize:12,fontFamily:_fonts.monoFont,color:_nightTheme.night.color.text},emptyText:{fontSize:11,color:_nightTheme.night.color.textTertiary,paddingHorizontal:16,paddingTop:8,paddingBottom:16,fontFamily:_fonts.monoFont},howItWorksText:{fontSize:11,color:_nightTheme.night.color.textSecondary,lineHeight:16,marginTop:8,paddingHorizontal:16,fontFamily:_fonts.monoFont},examplesContainer:{paddingTop:8,paddingHorizontal:16,paddingBottom:16,borderTopWidth:1,borderTopColor:_nightTheme.night.color.border,marginTop:12},examplesTitle:{fontSize:10,fontWeight:"600",color:_nightTheme.night.color.textTertiary,fontFamily:_fonts.monoFont,letterSpacing:.5,marginBottom:6},exampleItem:{fontSize:10,color:_nightTheme.night.color.textTertiary,fontFamily:_fonts.monoFont,lineHeight:16}});