@buoy-gg/shared-ui 7.0.40 → 7.0.42

package/lib/commonjs/env/EnvironmentSelector.js

@@ -1,205 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EnvironmentSelector = EnvironmentSelector;
-var _react = _interopRequireDefault(require("react"));
-var _reactNative = require("react-native");
-var _index = require("../icons/index.js");
-var _gameUIColors = require("../ui/gameUI/constants/gameUIColors.js");
-var _ExpandablePopover = require("../ui/components/ExpandablePopover.js");
-var _types = require("../types/types.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-// ============================================================================
-// Constants
-// ============================================================================
-const ENV_SELECTOR_WIDTH = 140; // Wider than minimized tools stack
-const PEEK_HEIGHT = 28;
-const OPTION_HEIGHT = 44;
-const PADDING_VERTICAL = 8;
-const COLLAPSE_BUTTON_HEIGHT = 24;
-
-// ============================================================================
-// Types
-// ============================================================================
-
-// ============================================================================
-// Environment Config Helper
-// ============================================================================
-
-function getEnvironmentConfig(environment) {
-  const normalized = (0, _types.normalizeEnvironment)(environment);
-  switch (normalized) {
-    case "local":
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info
-      };
-    case "dev":
-      return {
-        label: "DEV",
-        backgroundColor: _gameUIColors.gameUIColors.warning
-      };
-    case "qa":
-      return {
-        label: "QA",
-        backgroundColor: _gameUIColors.gameUIColors.optional
-      };
-    case "staging":
-      return {
-        label: "STAGING",
-        backgroundColor: _gameUIColors.gameUIColors.success
-      };
-    case "prod":
-      return {
-        label: "PROD",
-        backgroundColor: _gameUIColors.gameUIColors.error
-      };
-    default:
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info
-      };
-  }
-}
-
-// ============================================================================
-// Environment Option Component
-// ============================================================================
-
-function EnvironmentOption({
-  environment,
-  isSelected,
-  onPress
-}) {
-  const config = getEnvironmentConfig(environment);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-    onPress: onPress,
-    style: ({
-      pressed
-    }) => [styles.optionContainer, isSelected && styles.optionContainerSelected, pressed && styles.optionContainerPressed],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.optionLeft,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [styles.optionDot, {
-          backgroundColor: config.backgroundColor
-        }, {
-          shadowColor: config.backgroundColor,
-          shadowOffset: {
-            width: 0,
-            height: 0
-          },
-          shadowOpacity: 0.6,
-          shadowRadius: 4,
-          elevation: 2
-        }]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.optionLabel,
-        children: config.label
-      })]
-    }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Check, {
-      size: 14,
-      color: _gameUIColors.gameUIColors.success,
-      strokeWidth: 3
-    })]
-  });
-}
-
-// ============================================================================
-// Main Component
-// ============================================================================
-
-function EnvironmentSelector({
-  hasItems,
-  currentEnvironment,
-  availableEnvironments,
-  onSelect,
-  width = ENV_SELECTOR_WIDTH,
-  collapsedContent
-}) {
-  // Calculate expanded height based on number of environments
-  const expandedHeight = PADDING_VERTICAL + availableEnvironments.length * OPTION_HEIGHT + COLLAPSE_BUTTON_HEIGHT + 4;
-
-  // Default collapsed content shows current environment
-  const defaultCollapsedContent = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.collapsedEnvBadge,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: [styles.collapsedDot, {
-        backgroundColor: getEnvironmentConfig(currentEnvironment).backgroundColor
-      }]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: styles.collapsedLabel,
-      children: getEnvironmentConfig(currentEnvironment).label
-    })]
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandablePopover.ExpandablePopover, {
-    hasItems: hasItems,
-    width: width,
-    expandedHeight: expandedHeight,
-    peekHeight: PEEK_HEIGHT,
-    showCount: false,
-    collapsedContent: collapsedContent || defaultCollapsedContent,
-    collapsedLabel: `Switch environment from ${currentEnvironment}`,
-    children: availableEnvironments.map(env => /*#__PURE__*/(0, _jsxRuntime.jsx)(EnvironmentOption, {
-      environment: env,
-      isSelected: env === currentEnvironment,
-      onPress: () => onSelect(env)
-    }, env))
-  });
-}
-
-// ============================================================================
-// Styles
-// ============================================================================
-
-const styles = _reactNative.StyleSheet.create({
-  collapsedEnvBadge: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6
-  },
-  collapsedDot: {
-    width: 8,
-    height: 8,
-    borderRadius: 4
-  },
-  collapsedLabel: {
-    fontSize: 11,
-    fontWeight: "600",
-    color: _gameUIColors.gameUIColors.primaryLight,
-    letterSpacing: 0.5
-  },
-  optionContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    paddingHorizontal: 12,
-    height: OPTION_HEIGHT,
-    width: "100%"
-  },
-  optionContainerSelected: {
-    backgroundColor: "rgba(128, 128, 128, 0.1)"
-  },
-  optionContainerPressed: {
-    backgroundColor: "rgba(128, 128, 128, 0.2)"
-  },
-  optionLeft: {
-    flexDirection: "row",
-    alignItems: "center",
-    flex: 1
-  },
-  optionDot: {
-    width: 8,
-    height: 8,
-    borderRadius: 4,
-    marginRight: 10
-  },
-  optionLabel: {
-    fontSize: 12,
-    fontWeight: "600",
-    color: _gameUIColors.gameUIColors.primaryLight,
-    letterSpacing: 0.5
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EnvironmentSelector=EnvironmentSelector;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _index=require("../icons/index.js");var _gameUIColors=require("../ui/gameUI/constants/gameUIColors.js");var _ExpandablePopover=require("../ui/components/ExpandablePopover.js");var _types=require("../types/types.js");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const ENV_SELECTOR_WIDTH=140;const PEEK_HEIGHT=28;const OPTION_HEIGHT=44;const PADDING_VERTICAL=8;const COLLAPSE_BUTTON_HEIGHT=24;function getEnvironmentConfig(e){const o=(0,_types.normalizeEnvironment)(e);switch(o){case"local":return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info};case"dev":return{label:"DEV",backgroundColor:_gameUIColors.gameUIColors.warning};case"qa":return{label:"QA",backgroundColor:_gameUIColors.gameUIColors.optional};case"staging":return{label:"STAGING",backgroundColor:_gameUIColors.gameUIColors.success};case"prod":return{label:"PROD",backgroundColor:_gameUIColors.gameUIColors.error};default:return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info}}}function EnvironmentOption({environment:e,isSelected:o,onPress:r}){const t=getEnvironmentConfig(e);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:r,style:({pressed:a})=>[styles.optionContainer,o&&styles.optionContainerSelected,a&&styles.optionContainerPressed],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.optionLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.optionDot,{backgroundColor:t.backgroundColor},{shadowColor:t.backgroundColor,shadowOffset:{width:0,height:0},shadowOpacity:.6,shadowRadius:4,elevation:2}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.optionLabel,children:t.label})]}),o&&(0,_jsxRuntime.jsx)(_index.Check,{size:14,color:_gameUIColors.gameUIColors.success,strokeWidth:3})]})}function EnvironmentSelector({hasItems:e,currentEnvironment:o,availableEnvironments:r,onSelect:t,width:a=ENV_SELECTOR_WIDTH,collapsedContent:l}){const s=PADDING_VERTICAL+r.length*OPTION_HEIGHT+COLLAPSE_BUTTON_HEIGHT+4;const i=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.collapsedEnvBadge,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.collapsedDot,{backgroundColor:getEnvironmentConfig(o).backgroundColor}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.collapsedLabel,children:getEnvironmentConfig(o).label})]});return(0,_jsxRuntime.jsx)(_ExpandablePopover.ExpandablePopover,{hasItems:e,width:a,expandedHeight:s,peekHeight:PEEK_HEIGHT,showCount:false,collapsedContent:l||i,collapsedLabel:`Switch environment from ${o}`,children:r.map(n=>(0,_jsxRuntime.jsx)(EnvironmentOption,{environment:n,isSelected:n===o,onPress:()=>t(n)},n))})}const styles=_reactNative.StyleSheet.create({collapsedEnvBadge:{flexDirection:"row",alignItems:"center",gap:6},collapsedDot:{width:8,height:8,borderRadius:4},collapsedLabel:{fontSize:11,fontWeight:"600",color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5},optionContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,height:OPTION_HEIGHT,width:"100%"},optionContainerSelected:{backgroundColor:"rgba(128, 128, 128, 0.1)"},optionContainerPressed:{backgroundColor:"rgba(128, 128, 128, 0.2)"},optionLeft:{flexDirection:"row",alignItems:"center",flex:1},optionDot:{width:8,height:8,borderRadius:4,marginRight:10},optionLabel:{fontSize:12,fontWeight:"600",color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5}});

package/lib/commonjs/env/EnvironmentSelectorInline.js

@@ -1,299 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EnvironmentSelectorInline = EnvironmentSelectorInline;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _index = require("../icons/index.js");
-var _gameUIColors = require("../ui/gameUI/constants/gameUIColors.js");
-var _types = require("../types/types.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-// ============================================================================
-// Constants
-// ============================================================================
-const OPTION_HEIGHT = 36;
-
-// ============================================================================
-// Types
-// ============================================================================
-
-// ============================================================================
-// Environment Config Helper
-// ============================================================================
-
-function getEnvironmentConfig(environment) {
-  const normalized = (0, _types.normalizeEnvironment)(environment);
-  switch (normalized) {
-    case "local":
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info
-      };
-    case "dev":
-      return {
-        label: "DEV",
-        backgroundColor: _gameUIColors.gameUIColors.warning
-      };
-    case "qa":
-      return {
-        label: "QA",
-        backgroundColor: _gameUIColors.gameUIColors.optional
-      };
-    case "staging":
-      return {
-        label: "STAGING",
-        backgroundColor: _gameUIColors.gameUIColors.success
-      };
-    case "prod":
-      return {
-        label: "PROD",
-        backgroundColor: _gameUIColors.gameUIColors.error
-      };
-    default:
-      return {
-        label: "LOCAL",
-        backgroundColor: _gameUIColors.gameUIColors.info
-      };
-  }
-}
-
-// ============================================================================
-// Environment Option Component
-// ============================================================================
-
-function EnvironmentOption({
-  environment,
-  isSelected,
-  onPress
-}) {
-  const config = getEnvironmentConfig(environment);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-    onPress: onPress,
-    style: ({
-      pressed
-    }) => [styles.optionContainer, isSelected && styles.optionContainerSelected, pressed && styles.optionContainerPressed],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.optionLeft,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [styles.optionDot, {
-          backgroundColor: config.backgroundColor
-        }, {
-          shadowColor: config.backgroundColor,
-          shadowOffset: {
-            width: 0,
-            height: 0
-          },
-          shadowOpacity: 0.6,
-          shadowRadius: 3,
-          elevation: 2
-        }]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.optionLabel,
-        numberOfLines: 1,
-        children: config.label
-      })]
-    }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Check, {
-      size: 12,
-      color: _gameUIColors.gameUIColors.success,
-      strokeWidth: 3
-    })]
-  });
-}
-
-// ============================================================================
-// Main Component
-// ============================================================================
-
-function EnvironmentSelectorInline({
-  currentEnvironment,
-  availableEnvironments,
-  onSelect
-}) {
-  const [isExpanded, setIsExpanded] = (0, _react.useState)(false);
-  const heightAnim = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
-  const rotateAnim = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
-  const config = getEnvironmentConfig(currentEnvironment);
-
-  // Calculate expanded height based on number of environments
-  const expandedHeight = availableEnvironments.length * OPTION_HEIGHT;
-
-  // Animate height and chevron rotation
-  (0, _react.useEffect)(() => {
-    _reactNative.Animated.parallel([_reactNative.Animated.timing(heightAnim, {
-      toValue: isExpanded ? expandedHeight : 0,
-      duration: 200,
-      useNativeDriver: false
-    }), _reactNative.Animated.timing(rotateAnim, {
-      toValue: isExpanded ? 1 : 0,
-      duration: 200,
-      useNativeDriver: true
-    })]).start();
-  }, [isExpanded, expandedHeight, heightAnim, rotateAnim]);
-  const handleToggle = (0, _react.useCallback)(() => {
-    setIsExpanded(prev => !prev);
-  }, []);
-  const handleSelect = (0, _react.useCallback)(env => {
-    setIsExpanded(false);
-    onSelect(env);
-  }, [onSelect]);
-  const chevronRotation = rotateAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: ["0deg", "180deg"]
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.wrapper,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-      style: [styles.optionsDropup, {
-        height: heightAnim,
-        opacity: heightAnim.interpolate({
-          inputRange: [0, expandedHeight * 0.5, expandedHeight],
-          outputRange: [0, 0.8, 1]
-        })
-      }],
-      pointerEvents: isExpanded ? "auto" : "none",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: {
-          height: expandedHeight
-        },
-        children: availableEnvironments.map(env => /*#__PURE__*/(0, _jsxRuntime.jsx)(EnvironmentOption, {
-          environment: env,
-          isSelected: env === currentEnvironment,
-          onPress: () => handleSelect(env)
-        }, env))
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-      onPress: handleToggle,
-      style: ({
-        pressed
-      }) => [styles.badge, isExpanded && styles.badgeExpanded, pressed && styles.badgePressed],
-      accessibilityRole: "button",
-      accessibilityLabel: `Current environment: ${config.label}. Tap to switch.`,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [styles.dot, {
-          backgroundColor: config.backgroundColor
-        }, {
-          shadowColor: config.backgroundColor,
-          shadowOffset: {
-            width: 0,
-            height: 0
-          },
-          shadowOpacity: 0.6,
-          shadowRadius: 4,
-          elevation: 2
-        }]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.label,
-        numberOfLines: 1,
-        children: config.label
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-        style: {
-          transform: [{
-            rotate: chevronRotation
-          }]
-        },
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ChevronUp, {
-          size: 10,
-          color: _gameUIColors.gameUIColors.muted
-        })
-      })]
-    })]
-  });
-}
-
-// ============================================================================
-// Styles
-// ============================================================================
-
-const styles = _reactNative.StyleSheet.create({
-  wrapper: {
-    position: "relative",
-    zIndex: 1000
-  },
-  badge: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingVertical: 6,
-    paddingLeft: 8,
-    paddingRight: 6,
-    gap: 6,
-    backgroundColor: "transparent",
-    borderRadius: 6
-  },
-  badgeExpanded: {
-    backgroundColor: _gameUIColors.gameUIColors.blackTint1,
-    borderTopLeftRadius: 0,
-    borderTopRightRadius: 0
-  },
-  badgePressed: {
-    opacity: 0.7
-  },
-  dot: {
-    width: 8,
-    height: 8,
-    borderRadius: 4
-  },
-  label: {
-    fontSize: 11,
-    fontWeight: "600",
-    color: _gameUIColors.gameUIColors.primaryLight,
-    letterSpacing: 0.5
-  },
-  optionsDropup: {
-    position: "absolute",
-    bottom: "100%",
-    left: 0,
-    right: 0,
-    backgroundColor: _gameUIColors.gameUIColors.blackTint1,
-    borderTopLeftRadius: 6,
-    borderTopRightRadius: 6,
-    borderBottomLeftRadius: 0,
-    borderBottomRightRadius: 0,
-    borderTopWidth: 1,
-    borderLeftWidth: 1,
-    borderRightWidth: 1,
-    borderBottomWidth: 0,
-    borderColor: _gameUIColors.gameUIColors.border,
-    overflow: "hidden",
-    shadowColor: "#000",
-    shadowOffset: {
-      width: 0,
-      height: -4
-    },
-    shadowOpacity: 0.3,
-    shadowRadius: 8,
-    elevation: 10
-  },
-  optionContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    paddingHorizontal: 10,
-    height: OPTION_HEIGHT
-  },
-  optionContainerSelected: {
-    backgroundColor: "rgba(128, 128, 128, 0.1)"
-  },
-  optionContainerPressed: {
-    backgroundColor: "rgba(128, 128, 128, 0.2)"
-  },
-  optionLeft: {
-    flexDirection: "row",
-    alignItems: "center",
-    flex: 1
-  },
-  optionDot: {
-    width: 6,
-    height: 6,
-    borderRadius: 3,
-    marginRight: 8
-  },
-  optionLabel: {
-    fontSize: 10,
-    fontWeight: "600",
-    color: _gameUIColors.gameUIColors.primaryLight,
-    letterSpacing: 0.5
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.EnvironmentSelectorInline=EnvironmentSelectorInline;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _index=require("../icons/index.js");var _gameUIColors=require("../ui/gameUI/constants/gameUIColors.js");var _types=require("../types/types.js");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(s,i){if("function"==typeof WeakMap)var c=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,d){if(!d&&e&&e.__esModule)return e;var r,a,t={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return t;if(r=d?o:c){if(r.has(e))return r.get(e);r.set(e,t)}for(const l in e)"default"!==l&&{}.hasOwnProperty.call(e,l)&&((a=(r=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,l))&&(a.get||a.set)?r(t,l,a):t[l]=e[l]);return t})(s,i)}const OPTION_HEIGHT=36;function getEnvironmentConfig(s){const i=(0,_types.normalizeEnvironment)(s);switch(i){case"local":return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info};case"dev":return{label:"DEV",backgroundColor:_gameUIColors.gameUIColors.warning};case"qa":return{label:"QA",backgroundColor:_gameUIColors.gameUIColors.optional};case"staging":return{label:"STAGING",backgroundColor:_gameUIColors.gameUIColors.success};case"prod":return{label:"PROD",backgroundColor:_gameUIColors.gameUIColors.error};default:return{label:"LOCAL",backgroundColor:_gameUIColors.gameUIColors.info}}}function EnvironmentOption({environment:s,isSelected:i,onPress:c}){const o=getEnvironmentConfig(s);return(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:c,style:({pressed:e})=>[styles.optionContainer,i&&styles.optionContainerSelected,e&&styles.optionContainerPressed],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.optionLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.optionDot,{backgroundColor:o.backgroundColor},{shadowColor:o.backgroundColor,shadowOffset:{width:0,height:0},shadowOpacity:.6,shadowRadius:3,elevation:2}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.optionLabel,numberOfLines:1,children:o.label})]}),i&&(0,_jsxRuntime.jsx)(_index.Check,{size:12,color:_gameUIColors.gameUIColors.success,strokeWidth:3})]})}function EnvironmentSelectorInline({currentEnvironment:s,availableEnvironments:i,onSelect:c}){const[o,e]=(0,_react.useState)(false);const d=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;const r=(0,_react.useRef)(new _reactNative.Animated.Value(0)).current;const a=getEnvironmentConfig(s);const t=i.length*OPTION_HEIGHT;(0,_react.useEffect)(()=>{_reactNative.Animated.parallel([_reactNative.Animated.timing(d,{toValue:o?t:0,duration:200,useNativeDriver:false}),_reactNative.Animated.timing(r,{toValue:o?1:0,duration:200,useNativeDriver:true})]).start()},[o,t,d,r]);const l=(0,_react.useCallback)(()=>{e(n=>!n)},[]);const u=(0,_react.useCallback)(n=>{e(false);c(n)},[c]);const g=r.interpolate({inputRange:[0,1],outputRange:["0deg","180deg"]});return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.wrapper,children:[(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[styles.optionsDropup,{height:d,opacity:d.interpolate({inputRange:[0,t*.5,t],outputRange:[0,.8,1]})}],pointerEvents:o?"auto":"none",children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:t},children:i.map(n=>(0,_jsxRuntime.jsx)(EnvironmentOption,{environment:n,isSelected:n===s,onPress:()=>u(n)},n))})}),(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:l,style:({pressed:n})=>[styles.badge,o&&styles.badgeExpanded,n&&styles.badgePressed],accessibilityRole:"button",accessibilityLabel:`Current environment: ${a.label}. Tap to switch.`,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.dot,{backgroundColor:a.backgroundColor},{shadowColor:a.backgroundColor,shadowOffset:{width:0,height:0},shadowOpacity:.6,shadowRadius:4,elevation:2}]}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.label,numberOfLines:1,children:a.label}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{transform:[{rotate:g}]},children:(0,_jsxRuntime.jsx)(_index.ChevronUp,{size:10,color:_gameUIColors.gameUIColors.muted})})]})]})}const styles=_reactNative.StyleSheet.create({wrapper:{position:"relative",zIndex:1e3},badge:{flexDirection:"row",alignItems:"center",paddingVertical:6,paddingLeft:8,paddingRight:6,gap:6,backgroundColor:"transparent",borderRadius:6},badgeExpanded:{backgroundColor:_gameUIColors.gameUIColors.blackTint1,borderTopLeftRadius:0,borderTopRightRadius:0},badgePressed:{opacity:.7},dot:{width:8,height:8,borderRadius:4},label:{fontSize:11,fontWeight:"600",color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5},optionsDropup:{position:"absolute",bottom:"100%",left:0,right:0,backgroundColor:_gameUIColors.gameUIColors.blackTint1,borderTopLeftRadius:6,borderTopRightRadius:6,borderBottomLeftRadius:0,borderBottomRightRadius:0,borderTopWidth:1,borderLeftWidth:1,borderRightWidth:1,borderBottomWidth:0,borderColor:_gameUIColors.gameUIColors.border,overflow:"hidden",shadowColor:"#000",shadowOffset:{width:0,height:-4},shadowOpacity:.3,shadowRadius:8,elevation:10},optionContainer:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:10,height:OPTION_HEIGHT},optionContainerSelected:{backgroundColor:"rgba(128, 128, 128, 0.1)"},optionContainerPressed:{backgroundColor:"rgba(128, 128, 128, 0.2)"},optionLeft:{flexDirection:"row",alignItems:"center",flex:1},optionDot:{width:6,height:6,borderRadius:3,marginRight:8},optionLabel:{fontSize:10,fontWeight:"600",color:_gameUIColors.gameUIColors.primaryLight,letterSpacing:.5}});