@buoy-gg/shared-ui 7.0.40 → 7.0.42

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

@@ -1,130 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DetailViewToggle = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _nightTheme = require("../night/nightTheme.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); }
-/**
- * DetailViewToggle — the row of view cards at the top of a detail screen
- * (ACTION · STATE · DIFF, CHANGE · STATE · DIFF, …).
- *
- * redux, zustand and jotai each shipped their own copy, differing only in
- * the view keys, labels and testID prefix. The cards, the accent chrome,
- * the disabled state (diff with nothing to compare) and the a11y contract
- * are all one component now; tools pass their `views`.
- */
-
-function DetailViewToggleImpl({
-  views,
-  activeView,
-  onViewChange,
-  disabledKeys,
-  testIDPrefix
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: styles.container,
-    children: views.map(view => {
-      const isActive = activeView === view.key;
-      const isDisabled = disabledKeys?.includes(view.key) ?? false;
-      const activeColor = view.activeColor ?? _nightTheme.night.color.accent;
-      const IconComponent = view.icon;
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-        style: [styles.card, isActive && [styles.cardActive, {
-          borderColor: activeColor
-        }], isDisabled && styles.cardDisabled],
-        onPress: () => !isDisabled && onViewChange(view.key),
-        activeOpacity: isDisabled ? 1 : 0.8,
-        disabled: isDisabled,
-        testID: testIDPrefix ? `${testIDPrefix}-view-${view.key}` : undefined,
-        accessibilityRole: "button",
-        accessibilityLabel: view.label,
-        accessibilityState: {
-          selected: isActive,
-          disabled: isDisabled
-        },
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.cardContent,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
-            size: 14,
-            color: isActive ? activeColor : isDisabled ? _nightTheme.night.color.textTertiary : _nightTheme.night.color.textSecondary
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: [styles.cardLabel, isActive && [styles.cardLabelActive, {
-              color: activeColor
-            }], isDisabled && styles.cardLabelDisabled],
-            children: view.label
-          })]
-        }), view.description ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: [styles.cardDescription, isActive && styles.cardDescriptionActive, isDisabled && styles.cardDescriptionDisabled],
-          children: view.description
-        }) : null]
-      }, view.key);
-    })
-  });
-}
-const DetailViewToggle = exports.DetailViewToggle = /*#__PURE__*/(0, _react.memo)(DetailViewToggleImpl);
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    flexDirection: "row",
-    gap: 8,
-    padding: 14,
-    // Transparent so the night sheet's star field shows through.
-    backgroundColor: "transparent"
-  },
-  card: {
-    flex: 1,
-    backgroundColor: _nightTheme.night.color.surface,
-    borderRadius: 12,
-    borderWidth: 1,
-    borderColor: _nightTheme.night.color.border,
-    padding: 10,
-    gap: 4
-  },
-  cardActive: {
-    borderWidth: 1.5,
-    backgroundColor: _nightTheme.night.color.accentSoft,
-    shadowColor: _nightTheme.night.color.accent,
-    shadowOffset: {
-      width: 0,
-      height: 2
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 8,
-    elevation: 3
-  },
-  cardDisabled: {
-    opacity: 0.5
-  },
-  cardContent: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6
-  },
-  cardLabel: {
-    fontSize: 10,
-    fontWeight: "700",
-    letterSpacing: 0.5,
-    color: _nightTheme.night.color.textSecondary
-  },
-  cardLabelActive: {
-    color: _nightTheme.night.color.text
-  },
-  cardLabelDisabled: {
-    color: _nightTheme.night.color.textTertiary
-  },
-  cardDescription: {
-    fontSize: 9,
-    color: _nightTheme.night.color.textTertiary,
-    lineHeight: 12
-  },
-  cardDescriptionActive: {
-    color: _nightTheme.night.color.textSecondary
-  },
-  cardDescriptionDisabled: {
-    color: _nightTheme.night.color.textTertiary
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.DetailViewToggle=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _nightTheme=require("../night/nightTheme.js");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(a,n){if("function"==typeof WeakMap)var l=new WeakMap,s=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,r,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(o=t?s:l){if(o.has(e))return o.get(e);o.set(e,i)}for(const c in e)"default"!==c&&{}.hasOwnProperty.call(e,c)&&((r=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,c))&&(r.get||r.set)?o(i,c,r):i[c]=e[c]);return i})(a,n)}function DetailViewToggleImpl({views:a,activeView:n,onViewChange:l,disabledKeys:s,testIDPrefix:e}){return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.container,children:a.map(t=>{const o=n===t.key;const r=s?.includes(t.key)??false;const i=t.activeColor??_nightTheme.night.color.accent;const c=t.icon;return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{style:[styles.card,o&&[styles.cardActive,{borderColor:i}],r&&styles.cardDisabled],onPress:()=>!r&&l(t.key),activeOpacity:r?1:.8,disabled:r,testID:e?`${e}-view-${t.key}`:void 0,accessibilityRole:"button",accessibilityLabel:t.label,accessibilityState:{selected:o,disabled:r},children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardContent,children:[(0,_jsxRuntime.jsx)(c,{size:14,color:o?i:r?_nightTheme.night.color.textTertiary:_nightTheme.night.color.textSecondary}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.cardLabel,o&&[styles.cardLabelActive,{color:i}],r&&styles.cardLabelDisabled],children:t.label})]}),t.description?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.cardDescription,o&&styles.cardDescriptionActive,r&&styles.cardDescriptionDisabled],children:t.description}):null]},t.key)})})}const DetailViewToggle=exports.DetailViewToggle=(0,_react.memo)(DetailViewToggleImpl);const styles=_reactNative.StyleSheet.create({container:{flexDirection:"row",gap:8,padding:14,backgroundColor:"transparent"},card:{flex:1,backgroundColor:_nightTheme.night.color.surface,borderRadius:12,borderWidth:1,borderColor:_nightTheme.night.color.border,padding:10,gap:4},cardActive:{borderWidth:1.5,backgroundColor:_nightTheme.night.color.accentSoft,shadowColor:_nightTheme.night.color.accent,shadowOffset:{width:0,height:2},shadowOpacity:.1,shadowRadius:8,elevation:3},cardDisabled:{opacity:.5},cardContent:{flexDirection:"row",alignItems:"center",gap:6},cardLabel:{fontSize:10,fontWeight:"700",letterSpacing:.5,color:_nightTheme.night.color.textSecondary},cardLabelActive:{color:_nightTheme.night.color.text},cardLabelDisabled:{color:_nightTheme.night.color.textTertiary},cardDescription:{fontSize:9,color:_nightTheme.night.color.textTertiary,lineHeight:12},cardDescriptionActive:{color:_nightTheme.night.color.textSecondary},cardDescriptionDisabled:{color:_nightTheme.night.color.textTertiary}});

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

@@ -1,126 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DEVTOOLS_CARD_CONSTANTS = void 0;
-exports.DevToolsCard = DevToolsCard;
-var _reactNative = require("react-native");
-var _nightTheme = require("../night/nightTheme.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * DevToolsCard
- *
- * A unified container component for all DevTools list items.
- * Provides consistent sizing, spacing, and styling across all packages.
- *
- * Usage:
- * ```tsx
- * <DevToolsCard onPress={handlePress} isSelected={selected}>
- *   <YourCustomContent />
- * </DevToolsCard>
- * ```
- */
-
-/**
- * Standard card dimensions - adjust these to change all DevTools cards globally
- */
-const DEVTOOLS_CARD_CONSTANTS = exports.DEVTOOLS_CARD_CONSTANTS = {
-  /** Horizontal padding inside the card */
-  padding: 12,
-  /** Horizontal margin between card and screen edge */
-  marginHorizontal: 12,
-  /** Vertical margin between cards */
-  marginVertical: 4,
-  /** Card corner radius */
-  borderRadius: 8,
-  /** Minimum height for touch accessibility (Apple HIG) */
-  minHeight: 44,
-  /** Border width */
-  borderWidth: 1
-};
-function DevToolsCard({
-  children,
-  onPress,
-  onLongPress,
-  isSelected = false,
-  disabled = false,
-  activeOpacity = 0.8,
-  style,
-  contentStyle,
-  testID,
-  accessibilityLabel,
-  accessible
-}) {
-  const isInteractive = !!onPress || !!onLongPress;
-
-  // Non-interactive card (just a container)
-  if (!isInteractive) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: [styles.wrapper, style],
-      testID: testID,
-      accessible: accessible,
-      accessibilityLabel: accessibilityLabel,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [styles.card, isSelected && styles.selectedCard, contentStyle],
-        children: children
-      })
-    });
-  }
-
-  // Interactive card
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [styles.wrapper, style],
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-      style: [styles.card, isSelected && styles.selectedCard, contentStyle],
-      onPress: onPress,
-      onLongPress: onLongPress,
-      activeOpacity: activeOpacity,
-      disabled: disabled,
-      testID: testID,
-      accessibilityLabel: accessibilityLabel,
-      children: children
-    })
-  });
-}
-
-/**
- * A bordered tile in a gutter. `CompactRow` is the other row primitive; keep the
- * two in step.
- */
-const styles = _reactNative.StyleSheet.create({
-  wrapper: {
-    marginHorizontal: DEVTOOLS_CARD_CONSTANTS.marginHorizontal,
-    marginVertical: DEVTOOLS_CARD_CONSTANTS.marginVertical
-  },
-  card: {
-    // Translucent night scrim — same luminance contract as the old
-    // buoyColors.cardScrim (backing stays readable under the brightest
-    // scenes), re-based on the night surface so the ToolBackground reads
-    // through every tool's card lists, not only around them.
-    backgroundColor: "rgba(12, 12, 12, 0.9)",
-    borderRadius: DEVTOOLS_CARD_CONSTANTS.borderRadius,
-    borderWidth: DEVTOOLS_CARD_CONSTANTS.borderWidth,
-    borderColor: _nightTheme.night.color.border,
-    // The separator. On classic this just re-states the full outline; on chat
-    // it is the ONLY edge the row has.
-    borderBottomWidth: 1,
-    borderBottomColor: _nightTheme.night.color.separator,
-    padding: DEVTOOLS_CARD_CONSTANTS.padding,
-    paddingHorizontal: DEVTOOLS_CARD_CONSTANTS.padding,
-    minHeight: DEVTOOLS_CARD_CONSTANTS.minHeight
-  },
-  selectedCard: {
-    // The night selection language: soft accent fill + accent border.
-    backgroundColor: _nightTheme.night.color.accentSoft,
-    borderColor: _nightTheme.night.color.accentBorderStrong,
-    shadowColor: _nightTheme.night.color.accent,
-    shadowOffset: {
-      width: 0,
-      height: 0
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 8,
-    elevation: 2
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.DEVTOOLS_CARD_CONSTANTS=void 0;exports.DevToolsCard=DevToolsCard;var _reactNative=require("react-native");var _nightTheme=require("../night/nightTheme.js");var _jsxRuntime=require("react/jsx-runtime");const DEVTOOLS_CARD_CONSTANTS=exports.DEVTOOLS_CARD_CONSTANTS={padding:12,marginHorizontal:12,marginVertical:4,borderRadius:8,minHeight:44,borderWidth:1};function DevToolsCard({children:r,onPress:e,onLongPress:t,isSelected:i=false,disabled:s=false,activeOpacity:c=.8,style:o,contentStyle:a,testID:d,accessibilityLabel:n,accessible:l}){const h=!!e||!!t;if(!h){return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.wrapper,o],testID:d,accessible:l,accessibilityLabel:n,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.card,i&&styles.selectedCard,a],children:r})})}return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.wrapper,o],children:(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{style:[styles.card,i&&styles.selectedCard,a],onPress:e,onLongPress:t,activeOpacity:c,disabled:s,testID:d,accessibilityLabel:n,children:r})})}const styles=_reactNative.StyleSheet.create({wrapper:{marginHorizontal:DEVTOOLS_CARD_CONSTANTS.marginHorizontal,marginVertical:DEVTOOLS_CARD_CONSTANTS.marginVertical},card:{backgroundColor:"rgba(12, 12, 12, 0.9)",borderRadius:DEVTOOLS_CARD_CONSTANTS.borderRadius,borderWidth:DEVTOOLS_CARD_CONSTANTS.borderWidth,borderColor:_nightTheme.night.color.border,borderBottomWidth:1,borderBottomColor:_nightTheme.night.color.separator,padding:DEVTOOLS_CARD_CONSTANTS.padding,paddingHorizontal:DEVTOOLS_CARD_CONSTANTS.padding,minHeight:DEVTOOLS_CARD_CONSTANTS.minHeight},selectedCard:{backgroundColor:_nightTheme.night.color.accentSoft,borderColor:_nightTheme.night.color.accentBorderStrong,shadowColor:_nightTheme.night.color.accent,shadowOffset:{width:0,height:0},shadowOpacity:.1,shadowRadius:8,elevation:2}});

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

@@ -1,215 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DraggableHeader = void 0;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * DraggableHeader — the canonical floating-tools drag handle.
- *
- * Used by FloatingDevTools, JsModal's floating mode, and the perf-monitor
- * bubble. Tracks drag via relative `dx`/`dy` (so parent padding/margins
- * don't affect motion), discriminates tap-vs-drag by total distance, and
- * clamps the final position to the container bounds.
- *
- * IMPORTANT: the PanResponder is created exactly ONCE per mount. All
- * volatile props (callbacks, bounds, sizing) flow through `propsRef` so
- * a parent re-render mid-gesture does NOT re-create the responder. Re-
- * creating it during a drag detaches the active gesture and snaps the
- * element back — that bug burned us once already.
- */
-const DraggableHeader = exports.DraggableHeader = /*#__PURE__*/(0, _react.memo)(function DraggableHeader({
-  children,
-  position,
-  onDragStart,
-  onDragEnd,
-  onTap,
-  onLongPress,
-  longPressDelay = 350,
-  containerBounds = _reactNative.Dimensions.get("window"),
-  elementSize = {
-    width: 100,
-    height: 50
-  },
-  minPosition = {
-    x: 0,
-    y: 0
-  },
-  style,
-  enabled = true,
-  claimOnMove = true,
-  onLayout,
-  hitSlop,
-  maxOverflowX = 0,
-  testID,
-  accessibilityLabel
-}) {
-  const isDraggingRef = (0, _react.useRef)(false);
-  const dragDistanceRef = (0, _react.useRef)(0);
-  const startPositionRef = (0, _react.useRef)({
-    x: 0,
-    y: 0
-  });
-  const longPressTimerRef = (0, _react.useRef)(null);
-  const longPressFiredRef = (0, _react.useRef)(false);
-
-  // Clear any pending long-press timer if the component unmounts mid-press,
-  // so the timeout never fires after we're gone.
-  (0, _react.useEffect)(() => {
-    return () => {
-      if (longPressTimerRef.current != null) {
-        clearTimeout(longPressTimerRef.current);
-        longPressTimerRef.current = null;
-      }
-    };
-  }, []);
-
-  // Latest props in a ref. Keeps the PanResponder closure stable across
-  // re-renders so an active drag never gets its handlers swapped.
-  const propsRef = (0, _react.useRef)({
-    onDragStart,
-    onDragEnd,
-    onTap,
-    onLongPress,
-    longPressDelay,
-    containerBounds,
-    elementSize,
-    minPosition,
-    enabled,
-    claimOnMove,
-    maxOverflowX
-  });
-  propsRef.current = {
-    onDragStart,
-    onDragEnd,
-    onTap,
-    onLongPress,
-    longPressDelay,
-    containerBounds,
-    elementSize,
-    minPosition,
-    enabled,
-    claimOnMove,
-    maxOverflowX
-  };
-  const panResponder = (0, _react.useMemo)(() => {
-    const cancelLongPress = () => {
-      if (longPressTimerRef.current != null) {
-        clearTimeout(longPressTimerRef.current);
-        longPressTimerRef.current = null;
-      }
-    };
-    return _reactNative.PanResponder.create({
-      onStartShouldSetPanResponder: () => propsRef.current.enabled,
-      onMoveShouldSetPanResponder: (_, g) => propsRef.current.enabled && propsRef.current.claimOnMove && (Math.abs(g.dx) > 1 || Math.abs(g.dy) > 1),
-      onPanResponderTerminationRequest: () => false,
-      onPanResponderGrant: () => {
-        isDraggingRef.current = false;
-        dragDistanceRef.current = 0;
-        longPressFiredRef.current = false;
-        // Read position synchronously so the first onPanResponderMove
-        // has the correct startPosition. stopAnimation's callback can
-        // be async on iOS and races the first move event.
-        const sx = position.x.__getValue();
-        const sy = position.y.__getValue();
-        startPositionRef.current = {
-          x: sx,
-          y: sy
-        };
-        const {
-          onLongPress: lp,
-          longPressDelay: lpDelay
-        } = propsRef.current;
-        if (lp) {
-          longPressTimerRef.current = setTimeout(() => {
-            longPressTimerRef.current = null;
-            if (!isDraggingRef.current && dragDistanceRef.current <= 5) {
-              longPressFiredRef.current = true;
-              lp();
-            }
-          }, lpDelay);
-        }
-      },
-      onPanResponderMove: (_evt, gestureState) => {
-        const totalDistance = Math.abs(gestureState.dx) + Math.abs(gestureState.dy);
-        dragDistanceRef.current = totalDistance;
-        if (totalDistance > 5 && !isDraggingRef.current) {
-          isDraggingRef.current = true;
-          cancelLongPress();
-          propsRef.current.onDragStart?.();
-        }
-        // Use dx/dy relative movement so parent transforms don't affect
-        // the drag.
-        const x = startPositionRef.current.x + gestureState.dx;
-        const y = startPositionRef.current.y + gestureState.dy;
-        position.setValue({
-          x,
-          y
-        });
-      },
-      onPanResponderRelease: () => {
-        cancelLongPress();
-        const longPressed = longPressFiredRef.current;
-        longPressFiredRef.current = false;
-        const wasTap = dragDistanceRef.current <= 5 && !isDraggingRef.current;
-        if (wasTap) {
-          if (!longPressed) propsRef.current.onTap?.();
-          isDraggingRef.current = false;
-          return;
-        }
-
-        // Read the final position synchronously and clamp.
-        const cx = position.x.__getValue();
-        const cy = position.y.__getValue();
-        const {
-          containerBounds: bounds,
-          elementSize: size,
-          minPosition: minPos,
-          maxOverflowX: maxOX,
-          onDragEnd: dragEnd
-        } = propsRef.current;
-        const maxX = bounds.width - size.width + maxOX;
-        const clampedX = Math.max(minPos.x, Math.min(cx, maxX));
-        const clampedY = Math.max(minPos.y, Math.min(cy, bounds.height - size.height));
-        position.setValue({
-          x: clampedX,
-          y: clampedY
-        });
-        dragEnd?.({
-          x: clampedX,
-          y: clampedY
-        });
-        isDraggingRef.current = false;
-      },
-      onPanResponderTerminate: () => {
-        cancelLongPress();
-        longPressFiredRef.current = false;
-        isDraggingRef.current = false;
-      }
-    });
-    // The responder is stable for the component's lifetime — props are
-    // read from a ref. Position is the only Animated.Value reference and
-    // is itself stable (created via useRef in the parent hook).
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [position]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: style,
-    onLayout: onLayout,
-    hitSlop: hitSlop,
-    testID: testID,
-    accessibilityLabel: accessibilityLabel,
-    accessibilityRole: onTap ? "button" : undefined,
-    accessibilityActions: onTap ? [{
-      name: "activate",
-      label: "Hide or show"
-    }] : undefined,
-    onAccessibilityAction: event => {
-      if (event.nativeEvent.actionName === "activate") propsRef.current.onTap?.();
-    },
-    ...panResponder.panHandlers,
-    children: children
-  });
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.DraggableHeader=void 0;var _react=require("react");var _reactNative=require("react-native");var _jsxRuntime=require("react/jsx-runtime");const DraggableHeader=exports.DraggableHeader=(0,_react.memo)(function O({children:H,position:a,onDragStart:R,onDragEnd:m,onTap:i,onLongPress:y,longPressDelay:h=350,containerBounds:g=_reactNative.Dimensions.get("window"),elementSize:b={width:100,height:50},minPosition:p={x:0,y:0},style:T,enabled:P=true,claimOnMove:_=true,onLayout:j,hitSlop:q,maxOverflowX:v=0,testID:A,accessibilityLabel:E}){const t=(0,_react.useRef)(false);const d=(0,_react.useRef)(0);const x=(0,_react.useRef)({x:0,y:0});const n=(0,_react.useRef)(null);const s=(0,_react.useRef)(false);(0,_react.useEffect)(()=>{return()=>{if(n.current!=null){clearTimeout(n.current);n.current=null}}},[]);const r=(0,_react.useRef)({onDragStart:R,onDragEnd:m,onTap:i,onLongPress:y,longPressDelay:h,containerBounds:g,elementSize:b,minPosition:p,enabled:P,claimOnMove:_,maxOverflowX:v});r.current={onDragStart:R,onDragEnd:m,onTap:i,onLongPress:y,longPressDelay:h,containerBounds:g,elementSize:b,minPosition:p,enabled:P,claimOnMove:_,maxOverflowX:v};const L=(0,_react.useMemo)(()=>{const u=()=>{if(n.current!=null){clearTimeout(n.current);n.current=null}};return _reactNative.PanResponder.create({onStartShouldSetPanResponder:()=>r.current.enabled,onMoveShouldSetPanResponder:(o,e)=>r.current.enabled&&r.current.claimOnMove&&(Math.abs(e.dx)>1||Math.abs(e.dy)>1),onPanResponderTerminationRequest:()=>false,onPanResponderGrant:()=>{t.current=false;d.current=0;s.current=false;const o=a.x.__getValue();const e=a.y.__getValue();x.current={x:o,y:e};const{onLongPress:c,longPressDelay:l}=r.current;if(c){n.current=setTimeout(()=>{n.current=null;if(!t.current&&d.current<=5){s.current=true;c()}},l)}},onPanResponderMove:(o,e)=>{const c=Math.abs(e.dx)+Math.abs(e.dy);d.current=c;if(c>5&&!t.current){t.current=true;u();r.current.onDragStart?.()}const l=x.current.x+e.dx;const f=x.current.y+e.dy;a.setValue({x:l,y:f})},onPanResponderRelease:()=>{u();const o=s.current;s.current=false;const e=d.current<=5&&!t.current;if(e){if(!o)r.current.onTap?.();t.current=false;return}const c=a.x.__getValue();const l=a.y.__getValue();const{containerBounds:f,elementSize:M,minPosition:D,maxOverflowX:S,onDragEnd:X}=r.current;const N=f.width-M.width+S;const w=Math.max(D.x,Math.min(c,N));const V=Math.max(D.y,Math.min(l,f.height-M.height));a.setValue({x:w,y:V});X?.({x:w,y:V});t.current=false},onPanResponderTerminate:()=>{u();s.current=false;t.current=false}})},[a]);return(0,_jsxRuntime.jsx)(_reactNative.View,{style:T,onLayout:j,hitSlop:q,testID:A,accessibilityLabel:E,accessibilityRole:i?"button":void 0,accessibilityActions:i?[{name:"activate",label:"Hide or show"}]:void 0,onAccessibilityAction:u=>{if(u.nativeEvent.actionName==="activate")r.current.onTap?.()},...L.panHandlers,children:H})});