@buoy-gg/shared-ui 7.0.41 → 7.0.42

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

@@ -1,291 +1 @@
-"use strict";
-
-import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
-import { ChevronDown, ChevronRight } from "../../icons/index.js";
-import { night } from "../night/nightTheme.js";
-import { monoFont } from "../fonts.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function CompactRow({
-  statusDotColor,
-  statusLabel,
-  statusSublabel,
-  primaryText,
-  secondaryText,
-  secondaryAccessory,
-  expandedContent,
-  isExpanded,
-  badgeText,
-  badgeColor,
-  customBadge,
-  showChevron,
-  bottomRightText,
-  isSelected,
-  onPress,
-  disabled,
-  expandedGlowColor,
-  testID,
-  statusTestID,
-  statusSublabelTestID,
-  primaryTestID,
-  secondaryTestID,
-  accessibilityLabel,
-  trailingAction
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: [styles.rowWrapper, isExpanded && styles.rowWrapperExpanded],
-    children: /*#__PURE__*/_jsxs(View, {
-      style: [styles.row, isSelected && styles.selectedRow, isExpanded && [styles.expandedRowActive, {
-        borderColor: expandedGlowColor || night.color.accent,
-        // The resting hairline sets borderBottomColor specifically, and a
-        // specific side always beats the generic borderColor — restate it
-        // or the expanded card's bottom edge keeps the faint separator.
-        borderBottomColor: expandedGlowColor || night.color.accent,
-        shadowColor: expandedGlowColor || night.color.accent
-      }]],
-      children: [/*#__PURE__*/_jsxs(View, {
-        style: styles.headerRow,
-        children: [/*#__PURE__*/_jsx(TouchableOpacity, {
-          style: styles.headerPress,
-          onPress: onPress,
-          activeOpacity: 0.8,
-          disabled: disabled || !onPress,
-          testID: testID,
-          accessibilityLabel: accessibilityLabel
-          // Label alone is not enough on Fabric: a row that announces text but
-          // no role reads to VoiceOver as static content, so the fact that it
-          // opens something is only discoverable by tapping it.
-          ,
-          accessibilityRole: onPress ? "button" : undefined,
-          children: /*#__PURE__*/_jsxs(View, {
-            style: styles.rowContent,
-            children: [/*#__PURE__*/_jsxs(View, {
-              style: styles.statusSection,
-              children: [/*#__PURE__*/_jsx(View, {
-                style: [styles.statusDot, {
-                  backgroundColor: statusDotColor
-                }]
-              }), /*#__PURE__*/_jsxs(View, {
-                style: styles.statusInfo,
-                children: [/*#__PURE__*/_jsx(Text, {
-                  style: [styles.statusLabel, {
-                    color: statusDotColor
-                  }],
-                  numberOfLines: 1,
-                  testID: statusTestID,
-                  children: statusLabel
-                }), statusSublabel ? /*#__PURE__*/_jsx(Text, {
-                  style: styles.observerText,
-                  numberOfLines: 1,
-                  testID: statusSublabelTestID,
-                  children: statusSublabel
-                }) : null]
-              })]
-            }), /*#__PURE__*/_jsxs(View, {
-              style: styles.querySection,
-              children: [/*#__PURE__*/_jsx(Text, {
-                style: styles.queryHash,
-                numberOfLines: isExpanded ? undefined : 2,
-                testID: primaryTestID,
-                children: primaryText
-              }), !isExpanded && (secondaryText || secondaryAccessory) ? /*#__PURE__*/_jsxs(View, {
-                style: styles.secondaryRow,
-                children: [secondaryText ? /*#__PURE__*/_jsx(Text, {
-                  style: styles.secondaryText,
-                  numberOfLines: 1,
-                  testID: secondaryTestID,
-                  children: secondaryText
-                }) : null, secondaryAccessory]
-              }) : null]
-            }), /*#__PURE__*/_jsxs(View, {
-              style: styles.rightSection,
-              children: [(customBadge || badgeText !== undefined || !isExpanded && bottomRightText) && /*#__PURE__*/_jsxs(View, {
-                style: styles.badgeContainer,
-                children: [customBadge ? customBadge : badgeText !== undefined ? /*#__PURE__*/_jsx(Text, {
-                  style: [styles.statusBadge, {
-                    color: badgeColor || statusDotColor
-                  }],
-                  children: badgeText
-                }) : null, !isExpanded && bottomRightText ? /*#__PURE__*/_jsx(Text, {
-                  style: styles.bottomRightText,
-                  numberOfLines: 1,
-                  children: bottomRightText
-                }) : null]
-              }), showChevron && /*#__PURE__*/_jsx(View, {
-                style: styles.chevronContainer,
-                children: isExpanded ? /*#__PURE__*/_jsx(ChevronDown, {
-                  size: 14,
-                  color: night.color.textTertiary
-                }) : /*#__PURE__*/_jsx(ChevronRight, {
-                  size: 14,
-                  color: night.color.textTertiary
-                })
-              })]
-            })]
-          })
-        }), trailingAction ? /*#__PURE__*/_jsx(View, {
-          style: styles.trailingAction,
-          children: trailingAction
-        }) : null]
-      }), isExpanded && expandedContent && /*#__PURE__*/_jsx(View, {
-        style: styles.expandedContent,
-        children: expandedContent
-      })]
-    })
-  });
-}
-const styles = StyleSheet.create({
-  rowWrapper: {
-    position: "relative",
-    marginHorizontal: 8,
-    marginVertical: 3
-  },
-  /** The expanded card scales to 1.02 and grows a 2px glow border, which eats
-   * the 3px resting margin — without extra room its bottom edge sits on the
-   * next card. */
-  rowWrapperExpanded: {
-    marginVertical: 12
-  },
-  row: {
-    // Translucent night scrim so the shared ToolBackground reads through —
-    // kept in step with DevToolsCard (same fill, same luminance contract).
-    backgroundColor: "rgba(12, 12, 12, 0.9)",
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    // …separated by a single hairline instead of four borders per row.
-    // Declared after borderWidth so the specific side wins on the chat path.
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.separator,
-    padding: 12,
-    paddingHorizontal: 12,
-    transform: [{
-      scale: 1
-    }]
-  },
-  selectedRow: {
-    // Neutral fill, no outline, no lift — the same selection language as the
-    // sidebar. The classic path keeps its tinted, scaled, glowing card.
-    backgroundColor: night.color.accentSoft,
-    borderColor: night.color.accentBorderStrong,
-    transform: [{
-      scale: 1.01
-    }],
-    shadowColor: night.color.accent,
-    shadowOffset: {
-      width: 0,
-      height: 0
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 8,
-    elevation: 2
-  },
-  expandedRowActive: {
-    transform: [{
-      scale: 1.02
-    }],
-    borderWidth: 2,
-    paddingBottom: 16,
-    shadowOffset: {
-      width: 0,
-      height: 0
-    },
-    shadowOpacity: 0.8,
-    shadowRadius: 20,
-    elevation: 10
-  },
-  headerRow: {
-    flexDirection: "row",
-    alignItems: "center"
-  },
-  headerPress: {
-    flex: 1,
-    minWidth: 0
-  },
-  trailingAction: {
-    marginLeft: 8,
-    justifyContent: "center"
-  },
-  rowContent: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  statusSection: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    width: 90,
-    // Fixed width instead of flex to ensure consistent alignment
-    minWidth: 90
-  },
-  statusDot: {
-    width: 8,
-    height: 8,
-    borderRadius: 4
-  },
-  statusInfo: {
-    flex: 1,
-    maxWidth: 70 // Ensure status text doesn't overflow
-  },
-  statusLabel: {
-    fontSize: 11,
-    fontWeight: "600",
-    lineHeight: 14
-  },
-  observerText: {
-    fontSize: 10,
-    color: night.color.textTertiary,
-    marginTop: 1
-  },
-  querySection: {
-    flex: 2,
-    paddingHorizontal: 12
-  },
-  queryHash: {
-    fontFamily: monoFont,
-    fontSize: 12,
-    color: night.color.text,
-    lineHeight: 16
-  },
-  secondaryRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    marginTop: 1
-  },
-  secondaryText: {
-    fontSize: 10,
-    color: night.color.textTertiary,
-    marginTop: 1
-  },
-  rightSection: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8
-  },
-  badgeContainer: {
-    flexDirection: "column",
-    alignItems: "flex-end",
-    gap: 2
-  },
-  statusBadge: {
-    fontSize: 12,
-    fontWeight: "600",
-    fontVariant: ["tabular-nums"]
-  },
-  chevronContainer: {
-    padding: 2
-  },
-  expandedContent: {
-    marginTop: 8,
-    paddingTop: 8,
-    borderTopWidth: 1,
-    borderTopColor: night.color.separator,
-    marginLeft: 24 // Align with content after status dot
-  },
-  bottomRightText: {
-    fontSize: 9,
-    color: night.color.textTertiary,
-    fontFamily: monoFont
-  }
-});
+"use strict";import{View as o,Text as l,TouchableOpacity as L,StyleSheet as H}from"react-native";import{ChevronDown as j,ChevronRight as B}from"../../icons/index.js";import{night as t}from"../night/nightTheme.js";import{monoFont as w}from"../fonts.js";import{jsx as r,jsxs as n}from"react/jsx-runtime";export function CompactRow({statusDotColor:a,statusLabel:b,statusSublabel:g,primaryText:x,secondaryText:c,secondaryAccessory:y,expandedContent:u,isExpanded:i,badgeText:s,badgeColor:C,customBadge:d,showChevron:R,bottomRightText:h,isSelected:S,onPress:f,disabled:T,expandedGlowColor:m,testID:I,statusTestID:W,statusSublabelTestID:v,primaryTestID:D,secondaryTestID:z,accessibilityLabel:O,trailingAction:p}){return r(o,{style:[e.rowWrapper,i&&e.rowWrapperExpanded],children:n(o,{style:[e.row,S&&e.selectedRow,i&&[e.expandedRowActive,{borderColor:m||t.color.accent,borderBottomColor:m||t.color.accent,shadowColor:m||t.color.accent}]],children:[n(o,{style:e.headerRow,children:[r(L,{style:e.headerPress,onPress:f,activeOpacity:.8,disabled:T||!f,testID:I,accessibilityLabel:O,accessibilityRole:f?"button":void 0,children:n(o,{style:e.rowContent,children:[n(o,{style:e.statusSection,children:[r(o,{style:[e.statusDot,{backgroundColor:a}]}),n(o,{style:e.statusInfo,children:[r(l,{style:[e.statusLabel,{color:a}],numberOfLines:1,testID:W,children:b}),g?r(l,{style:e.observerText,numberOfLines:1,testID:v,children:g}):null]})]}),n(o,{style:e.querySection,children:[r(l,{style:e.queryHash,numberOfLines:i?void 0:2,testID:D,children:x}),!i&&(c||y)?n(o,{style:e.secondaryRow,children:[c?r(l,{style:e.secondaryText,numberOfLines:1,testID:z,children:c}):null,y]}):null]}),n(o,{style:e.rightSection,children:[(d||s!==void 0||!i&&h)&&n(o,{style:e.badgeContainer,children:[d?d:s!==void 0?r(l,{style:[e.statusBadge,{color:C||a}],children:s}):null,!i&&h?r(l,{style:e.bottomRightText,numberOfLines:1,children:h}):null]}),R&&r(o,{style:e.chevronContainer,children:i?r(j,{size:14,color:t.color.textTertiary}):r(B,{size:14,color:t.color.textTertiary})})]})]})}),p?r(o,{style:e.trailingAction,children:p}):null]}),i&&u&&r(o,{style:e.expandedContent,children:u})]})})}const e=H.create({rowWrapper:{position:"relative",marginHorizontal:8,marginVertical:3},rowWrapperExpanded:{marginVertical:12},row:{backgroundColor:"rgba(12, 12, 12, 0.9)",borderRadius:8,borderWidth:1,borderColor:t.color.border,borderBottomWidth:1,borderBottomColor:t.color.separator,padding:12,paddingHorizontal:12,transform:[{scale:1}]},selectedRow:{backgroundColor:t.color.accentSoft,borderColor:t.color.accentBorderStrong,transform:[{scale:1.01}],shadowColor:t.color.accent,shadowOffset:{width:0,height:0},shadowOpacity:.1,shadowRadius:8,elevation:2},expandedRowActive:{transform:[{scale:1.02}],borderWidth:2,paddingBottom:16,shadowOffset:{width:0,height:0},shadowOpacity:.8,shadowRadius:20,elevation:10},headerRow:{flexDirection:"row",alignItems:"center"},headerPress:{flex:1,minWidth:0},trailingAction:{marginLeft:8,justifyContent:"center"},rowContent:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},statusSection:{flexDirection:"row",alignItems:"center",gap:8,width:90,minWidth:90},statusDot:{width:8,height:8,borderRadius:4},statusInfo:{flex:1,maxWidth:70},statusLabel:{fontSize:11,fontWeight:"600",lineHeight:14},observerText:{fontSize:10,color:t.color.textTertiary,marginTop:1},querySection:{flex:2,paddingHorizontal:12},queryHash:{fontFamily:w,fontSize:12,color:t.color.text,lineHeight:16},secondaryRow:{flexDirection:"row",alignItems:"center",gap:6,marginTop:1},secondaryText:{fontSize:10,color:t.color.textTertiary,marginTop:1},rightSection:{flexDirection:"row",alignItems:"center",gap:8},badgeContainer:{flexDirection:"column",alignItems:"flex-end",gap:2},statusBadge:{fontSize:12,fontWeight:"600",fontVariant:["tabular-nums"]},chevronContainer:{padding:2},expandedContent:{marginTop:8,paddingTop:8,borderTopWidth:1,borderTopColor:t.color.separator,marginLeft:24},bottomRightText:{fontSize:9,color:t.color.textTertiary,fontFamily:w}});

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

@@ -1,303 +1 @@
-"use strict";
-
-import { useState, useRef, useCallback, memo, useEffect } from "react";
-import { Text, TouchableOpacity, StyleSheet } from "react-native";
-import { copyToClipboard } from "../../clipboard/copyToClipboard.js";
-import { gameUIColors } from "../gameUI/constants/gameUIColors.js";
-import { Copy, CheckCircle2, AlertTriangle, Trash2 } from "../../icons/lucide-icons.js";
-import { macOSColors } from "../gameUI/constants/macOSDesignSystemColors.js";
-import { ClipboardHintBanner } from "./ClipboardHintBanner.js";
-import { devToolsStorageKeys } from "../../storage/devToolsStorageKeys.js";
-import { persistentStorage } from "../../utils/persistentStorage";
-import { useHintsDisabled } from "../../context/index.js";
-import { ProUpgradeModal } from "../../license/index.js";
-import { useIsPro } from "@buoy-gg/license";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/**
- * Reusable copy button component with visual feedback
- * Shows different icons for idle, success, and error states
- * Based on the React Query dev tools copy button implementation
- */
-// Global state to track if hint has been shown (shared across all CopyButton instances)
-let globalHintAcknowledged = null;
-let globalHintLoadPromise = null;
-async function loadHintAcknowledged() {
-  if (globalHintAcknowledged !== null) {
-    return globalHintAcknowledged;
-  }
-  if (!globalHintLoadPromise) {
-    globalHintLoadPromise = (async () => {
-      try {
-        const hintKey = devToolsStorageKeys.clipboard.hintAcknowledged();
-        const acknowledged = await persistentStorage.getItem(hintKey);
-        globalHintAcknowledged = acknowledged === "true";
-        return globalHintAcknowledged;
-      } catch {
-        globalHintAcknowledged = false;
-        return false;
-      }
-    })();
-  }
-  return globalHintLoadPromise;
-}
-async function setHintAcknowledged() {
-  try {
-    const hintKey = devToolsStorageKeys.clipboard.hintAcknowledged();
-    await persistentStorage.setItem(hintKey, "true");
-    globalHintAcknowledged = true;
-  } catch {
-    // Failed to save, just update local state
-    globalHintAcknowledged = true;
-  }
-}
-export const CopyButton = /*#__PURE__*/memo(function CopyButton({
-  value,
-  isFocused = false,
-  size = 16,
-  buttonStyle,
-  label,
-  labelStyle,
-  onCopySuccess,
-  onCopyError,
-  feedbackDuration = 1500,
-  colors = {},
-  ...touchableProps
-}) {
-  const isPro = useIsPro();
-  const [copyState, setCopyState] = useState("idle");
-  const [showHint, setShowHint] = useState(false);
-  const [showLicenseModal, setShowLicenseModal] = useState(false);
-
-  // Auto-close upgrade modal when user becomes Pro
-  useEffect(() => {
-    if (showLicenseModal && isPro) {
-      setShowLicenseModal(false);
-    }
-  }, [showLicenseModal, isPro]);
-  const hintsDisabled = useHintsDisabled();
-  const valueRef = useRef(value);
-  const timeoutRef = useRef(null);
-  valueRef.current = value;
-
-  // Cleanup timeout on unmount
-  useEffect(() => {
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, []);
-
-  // Handle hint acknowledgment
-  const handleHintAcknowledge = useCallback(async () => {
-    setShowHint(false);
-    await setHintAcknowledged();
-  }, []);
-
-  // Handle press - either show license modal (if not Pro) or copy
-  const handlePress = useCallback(() => {
-    if (!isPro) {
-      setShowLicenseModal(true);
-      return;
-    }
-    handleCopyInternal();
-  }, [isPro]);
-  const handleCopyInternal = useCallback(async () => {
-    // Clear existing timeout if any
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = null;
-    }
-    try {
-      const resolvedValue = typeof valueRef.current === "function" ? valueRef.current() : valueRef.current;
-      const copied = await copyToClipboard(resolvedValue);
-      if (copied) {
-        setCopyState("success");
-        onCopySuccess?.();
-
-        // Check if we should show the hint (first successful copy)
-        // Skip if hints are globally disabled
-        if (!hintsDisabled) {
-          const alreadyAcknowledged = await loadHintAcknowledged();
-          if (!alreadyAcknowledged) {
-            setShowHint(true);
-          }
-        }
-        timeoutRef.current = setTimeout(() => {
-          setCopyState("idle");
-          timeoutRef.current = null;
-        }, feedbackDuration);
-      } else {
-        setCopyState("error");
-        onCopyError?.();
-        timeoutRef.current = setTimeout(() => {
-          setCopyState("idle");
-          timeoutRef.current = null;
-        }, feedbackDuration);
-      }
-    } catch {
-      setCopyState("error");
-      onCopyError?.();
-      timeoutRef.current = setTimeout(() => {
-        setCopyState("idle");
-        timeoutRef.current = null;
-      }, feedbackDuration);
-    }
-  }, [feedbackDuration, onCopySuccess, onCopyError, hintsDisabled]);
-  const getColor = useCallback(() => {
-    switch (copyState) {
-      case "success":
-        return colors.success || gameUIColors.success;
-      case "error":
-        return colors.error || gameUIColors.error;
-      default:
-        return isFocused ? colors.idleFocused || gameUIColors.info : colors.idle || gameUIColors.secondary;
-    }
-  }, [copyState, isFocused, colors]);
-
-  // Render the appropriate icon - always show copy icon, modal handles gating
-  const renderIcon = () => {
-    if (copyState === "success") {
-      return /*#__PURE__*/_jsx(CheckCircle2, {
-        size: size,
-        color: getColor(),
-        strokeWidth: 2
-      });
-    }
-    if (copyState === "error") {
-      return /*#__PURE__*/_jsx(AlertTriangle, {
-        size: size,
-        color: getColor(),
-        strokeWidth: 2
-      });
-    }
-    return /*#__PURE__*/_jsx(Copy, {
-      size: size,
-      color: getColor(),
-      strokeWidth: 2
-    });
-  };
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsxs(TouchableOpacity, {
-      ...touchableProps,
-      style: [styles.button, buttonStyle],
-      onPress: copyState === "idle" || !isPro ? handlePress : undefined,
-      activeOpacity: 0.7,
-      hitSlop: {
-        top: 4,
-        bottom: 4,
-        left: 4,
-        right: 4
-      },
-      accessibilityLabel: copyState === "idle" ? "Copy to clipboard" : copyState === "success" ? "Copied to clipboard" : "Failed to copy",
-      accessibilityRole: "button",
-      children: [renderIcon(), label ? /*#__PURE__*/_jsx(Text, {
-        style: [styles.label, {
-          color: getColor()
-        }, labelStyle],
-        children: label
-      }) : null]
-    }), /*#__PURE__*/_jsx(ClipboardHintBanner, {
-      visible: showHint,
-      onAcknowledge: handleHintAcknowledge
-    }), /*#__PURE__*/_jsx(ProUpgradeModal, {
-      visible: showLicenseModal,
-      onClose: () => setShowLicenseModal(false),
-      featureName: "Copy"
-    })]
-  });
-});
-const styles = StyleSheet.create({
-  button: {
-    padding: 4,
-    justifyContent: "center",
-    alignItems: "center",
-    alignSelf: "flex-start",
-    overflow: "hidden",
-    // Only relevant when a `label` is present; a bare icon button has one
-    // child, so the row direction and gap cost it nothing.
-    flexDirection: "row",
-    gap: 7
-  },
-  label: {
-    fontSize: 12.5,
-    fontWeight: "600"
-  }
-});
-
-/**
- * Preset copy button for inline use (smaller size)
- */
-export const InlineCopyButton = /*#__PURE__*/memo(function InlineCopyButton(props) {
-  return /*#__PURE__*/_jsx(CopyButton, {
-    size: 12,
-    ...props
-  });
-});
-
-/**
- * Preset copy button for header/toolbar use (medium size)
- */
-export const ToolbarCopyButton = /*#__PURE__*/memo(function ToolbarCopyButton(props) {
-  return /*#__PURE__*/_jsx(CopyButton, {
-    size: 14,
-    ...props
-  });
-});
-
-/**
- * Preset copy button for main actions (larger size)
- */
-export const ActionCopyButton = /*#__PURE__*/memo(function ActionCopyButton(props) {
-  return /*#__PURE__*/_jsx(CopyButton, {
-    size: 18,
-    ...props
-  });
-});
-/**
- * Shared clear/trash button for devtool headers.
- * Always renders a red Trash2 icon — consistent across all tools.
- */
-export const ToolbarClearButton = /*#__PURE__*/memo(function ToolbarClearButton({
-  onPress,
-  disabled = false,
-  buttonStyle,
-  testID
-}) {
-  return /*#__PURE__*/_jsx(TouchableOpacity, {
-    onPress: onPress,
-    style: [clearStyles.button, disabled && clearStyles.disabled, buttonStyle],
-    disabled: disabled,
-    hitSlop: {
-      top: 8,
-      bottom: 8,
-      left: 8,
-      right: 8
-    },
-    testID: testID,
-    accessibilityLabel: "Clear",
-    accessibilityRole: "button",
-    children: /*#__PURE__*/_jsx(Trash2, {
-      size: 14,
-      color: disabled ? macOSColors.text.disabled : macOSColors.semantic.error
-    })
-  });
-});
-const clearStyles = StyleSheet.create({
-  button: {
-    padding: 4,
-    justifyContent: "center",
-    alignItems: "center",
-    // Only relevant when a `label` is present; a bare icon button has one
-    // child, so the row direction and gap cost it nothing.
-    flexDirection: "row",
-    gap: 7
-  },
-  label: {
-    fontSize: 12.5,
-    fontWeight: "600"
-  },
-  disabled: {
-    opacity: 0.4
-  }
-});
+"use strict";import{useState as S,useRef as I,useCallback as y,memo as d,useEffect as H}from"react";import{Text as J,TouchableOpacity as z,StyleSheet as P}from"react-native";import{copyToClipboard as Q}from"../../clipboard/copyToClipboard.js";import{gameUIColors as h}from"../gameUI/constants/gameUIColors.js";import{Copy as X,CheckCircle2 as Y,AlertTriangle as Z,Trash2 as $}from"../../icons/lucide-icons.js";import{macOSColors as j}from"../gameUI/constants/macOSDesignSystemColors.js";import{ClipboardHintBanner as E}from"./ClipboardHintBanner.js";import{devToolsStorageKeys as v}from"../../storage/devToolsStorageKeys.js";import{persistentStorage as L}from"../../utils/persistentStorage";import{useHintsDisabled as tt}from"../../context/index.js";import{ProUpgradeModal as et}from"../../license/index.js";import{useIsPro as ot}from"@buoy-gg/license";import{jsx as o,jsxs as R,Fragment as rt}from"react/jsx-runtime";let i=null;let T=null;async function nt(){if(i!==null){return i}if(!T){T=(async()=>{try{const r=v.clipboard.hintAcknowledged();const t=await L.getItem(r);i=t==="true";return i}catch{i=false;return false}})()}return T}async function it(){try{const r=v.clipboard.hintAcknowledged();await L.setItem(r,"true");i=true}catch{i=true}}export const CopyButton=d(function r({value:t,isFocused:s=false,size:c=16,buttonStyle:b,label:x,labelStyle:K,onCopySuccess:k,onCopyError:g,feedbackDuration:f=1500,colors:a={},...M}){const u=ot();const[n,l]=S("idle");const[O,A]=S(false);const[C,w]=S(false);H(()=>{if(C&&u){w(false)}},[C,u]);const B=tt();const p=I(t);const e=I(null);p.current=t;H(()=>{return()=>{if(e.current){clearTimeout(e.current)}}},[]);const _=y(async()=>{A(false);await it()},[]);const D=y(()=>{if(!u){w(true);return}U()},[u]);const U=y(async()=>{if(e.current){clearTimeout(e.current);e.current=null}try{const V=typeof p.current==="function"?p.current():p.current;const q=await Q(V);if(q){l("success");k?.();if(!B){const G=await nt();if(!G){A(true)}}e.current=setTimeout(()=>{l("idle");e.current=null},f)}else{l("error");g?.();e.current=setTimeout(()=>{l("idle");e.current=null},f)}}catch{l("error");g?.();e.current=setTimeout(()=>{l("idle");e.current=null},f)}},[f,k,g,B]);const m=y(()=>{switch(n){case"success":return a.success||h.success;case"error":return a.error||h.error;default:return s?a.idleFocused||h.info:a.idle||h.secondary}},[n,s,a]);const N=()=>{if(n==="success"){return o(Y,{size:c,color:m(),strokeWidth:2})}if(n==="error"){return o(Z,{size:c,color:m(),strokeWidth:2})}return o(X,{size:c,color:m(),strokeWidth:2})};return R(rt,{children:[R(z,{...M,style:[W.button,b],onPress:n==="idle"||!u?D:void 0,activeOpacity:.7,hitSlop:{top:4,bottom:4,left:4,right:4},accessibilityLabel:n==="idle"?"Copy to clipboard":n==="success"?"Copied to clipboard":"Failed to copy",accessibilityRole:"button",children:[N(),x?o(J,{style:[W.label,{color:m()},K],children:x}):null]}),o(E,{visible:O,onAcknowledge:_}),o(et,{visible:C,onClose:()=>w(false),featureName:"Copy"})]})});const W=P.create({button:{padding:4,justifyContent:"center",alignItems:"center",alignSelf:"flex-start",overflow:"hidden",flexDirection:"row",gap:7},label:{fontSize:12.5,fontWeight:"600"}});export const InlineCopyButton=d(function r(t){return o(CopyButton,{size:12,...t})});export const ToolbarCopyButton=d(function r(t){return o(CopyButton,{size:14,...t})});export const ActionCopyButton=d(function r(t){return o(CopyButton,{size:18,...t})});export const ToolbarClearButton=d(function r({onPress:t,disabled:s=false,buttonStyle:c,testID:b}){return o(z,{onPress:t,style:[F.button,s&&F.disabled,c],disabled:s,hitSlop:{top:8,bottom:8,left:8,right:8},testID:b,accessibilityLabel:"Clear",accessibilityRole:"button",children:o($,{size:14,color:s?j.text.disabled:j.semantic.error})})});const F=P.create({button:{padding:4,justifyContent:"center",alignItems:"center",flexDirection:"row",gap:7},label:{fontSize:12.5,fontWeight:"600"},disabled:{opacity:.4}});