@buoy-gg/storage 7.0.40 → 7.0.42

package/lib/commonjs/storage/components/StorageEventCard.js

@@ -1,117 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StorageEventCard = void 0;
-exports.getValueType = getValueType;
-var _react = require("react");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _storageActionHelpers = require("../utils/storageActionHelpers");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * StorageEventCard
- *
- * Shared card component for displaying storage events.
- * Used by both Storage DevTools and Events DevTools for consistent UI.
- * Uses CompactRow for consistent layout with Redux/React Query cards.
- */
-
-/** Value type for storage events */
-
-/**
- * Compute value type from a value
- */
-function getValueType(value) {
-  const parsed = (0, _sharedUi.parseValue)(value);
-  if (parsed === null) return "null";
-  if (parsed === undefined) return "undefined";
-  if (Array.isArray(parsed)) return "array";
-  if (typeof parsed === "boolean") return "boolean";
-  if (typeof parsed === "number") return "number";
-  if (typeof parsed === "string") return "string";
-  if (typeof parsed === "object") return "object";
-  return "undefined";
-}
-/**
- * Get color for action type
- */
-function getActionColor(action) {
-  switch (action) {
-    // AsyncStorage & MMKV - Set operations
-    case "setItem":
-    case "multiSet":
-    case "set.string":
-    case "set.number":
-    case "set.boolean":
-    case "set.buffer":
-      return _sharedUi.macOSColors.semantic.success;
-
-    // AsyncStorage & MMKV - Remove/Delete operations
-    case "removeItem":
-    case "multiRemove":
-    case "clear":
-    case "delete":
-    case "clearAll":
-      return _sharedUi.macOSColors.semantic.error;
-
-    // AsyncStorage - Merge operations
-    case "mergeItem":
-    case "multiMerge":
-      return _sharedUi.macOSColors.semantic.info;
-
-    // MMKV - Get operations
-    case "get.string":
-    case "get.number":
-    case "get.boolean":
-    case "get.buffer":
-      return _sharedUi.macOSColors.semantic.warning;
-    default:
-      return _sharedUi.macOSColors.text.muted;
-  }
-}
-
-/**
- * Get storage type label for sublabel
- */
-function getStorageTypeSublabel(storageTypes, totalOps) {
-  const types = Array.from(storageTypes).map(t => t === "async" ? "Async" : "MMKV").join("/");
-  return `${types} · ${totalOps} op${totalOps !== 1 ? "s" : ""}`;
-}
-const StorageEventCard = exports.StorageEventCard = /*#__PURE__*/(0, _react.memo)(function StorageEventCard({
-  data,
-  onPress,
-  isSelected = false,
-  showChevron = true,
-  testID
-}) {
-  const actionColor = getActionColor(data.lastAction);
-  const actionLabel = (0, _storageActionHelpers.translateStorageAction)(data.lastAction);
-  const totalOps = data.totalOperations ?? 1;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.CompactRow
-  // Status section (left) - shows "Storage" with action-colored dot
-  , {
-    statusDotColor: actionColor,
-    statusLabel: "Storage",
-    statusSublabel: getStorageTypeSublabel(data.storageTypes, totalOps)
-    // Content section (middle) - shows the key name
-    ,
-    primaryText: data.key
-    // Badge section (right) - shows action label (SET, REMOVE, etc.)
-    ,
-    badgeText: actionLabel,
-    badgeColor: actionColor,
-    showChevron: showChevron
-    // Bottom right - timestamp
-    ,
-    bottomRightText: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.RelativeTime, {
-      timestamp: data.lastEventTimestamp
-    })
-    // Interaction
-    ,
-    isSelected: isSelected,
-    onPress: onPress,
-    testID: testID,
-    accessibilityLabel: `${actionLabel} ${data.key}`
-  });
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.StorageEventCard=void 0;exports.getValueType=getValueType;var _storageLabels=require("../utils/storageLabels");var _react=require("react");var _sharedUi=require("@buoy-gg/shared-ui");var _storageActionHelpers=require("../utils/storageActionHelpers");var _jsxRuntime=require("react/jsx-runtime");function getValueType(t){const e=(0,_sharedUi.parseValue)(t);if(e===null)return"null";if(e===void 0)return"undefined";if(Array.isArray(e))return"array";if(typeof e==="boolean")return"boolean";if(typeof e==="number")return"number";if(typeof e==="string")return"string";if(typeof e==="object")return"object";return"undefined"}function getActionColor(t){switch(t){case"setItem":case"multiSet":case"set.string":case"set.number":case"set.boolean":case"set.buffer":return _sharedUi.macOSColors.semantic.success;case"removeItem":case"multiRemove":case"clear":case"delete":case"clearAll":return _sharedUi.macOSColors.semantic.error;case"mergeItem":case"multiMerge":return _sharedUi.macOSColors.semantic.info;case"get.string":case"get.number":case"get.boolean":case"get.buffer":return _sharedUi.macOSColors.semantic.warning;default:return _sharedUi.macOSColors.text.muted}}function getStorageTypeSublabel(t,e){const r=Array.from(t).map(s=>s==="async"?_storageLabels.storageLabels.async:_storageLabels.storageLabels.mmkv).join("/");return`${r} \xB7 ${e} op${e!==1?"s":""}`}const StorageEventCard=exports.StorageEventCard=(0,_react.memo)(function t({data:e,onPress:r,isSelected:s=false,showChevron:n=true,testID:i}){const a=getActionColor(e.lastAction);const o=(0,_storageActionHelpers.translateStorageAction)(e.lastAction);const c=e.totalOperations??1;return(0,_jsxRuntime.jsx)(_sharedUi.CompactRow,{statusDotColor:a,statusLabel:"Storage",statusSublabel:getStorageTypeSublabel(e.storageTypes,c),primaryText:e.key,badgeText:o,badgeColor:a,showChevron:n,bottomRightText:(0,_jsxRuntime.jsx)(_sharedUi.RelativeTime,{timestamp:e.lastEventTimestamp}),isSelected:s,onPress:r,testID:i,accessibilityLabel:`${o} ${e.key}`})});

package/lib/commonjs/storage/components/StorageEventDetailContent.js

@@ -1,494 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StorageEventDetailContent = StorageEventDetailContent;
-exports.StorageEventDetailFooter = StorageEventDetailFooter;
-var _reactNative = require("react-native");
-var _react = require("react");
-var _asyncStorage = _interopRequireDefault(require("@react-native-async-storage/async-storage"));
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _license = require("@buoy-gg/license");
-var _lineDiff = require("../utils/lineDiff");
-var _ThemedSplitView = require("./DiffViewer/modes/ThemedSplitView");
-var _diffThemes = require("./DiffViewer/themes/diffThemes");
-var _TreeDiffViewer = require("./DiffViewer/TreeDiffViewer");
-var _storageActionHelpers = require("../utils/storageActionHelpers");
-var _StorageEventActionButton = require("./StorageEventActionButton");
-var _storageTimeTravelUtils = require("../utils/storageTimeTravelUtils");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/**
- * StorageEventDetailContent
- *
- * Detail view for storage events using the shared EventHistoryViewer component.
- */
-
-/**
- * Compare-bar index for "the state before the oldest event".
- *
- * Not an event — it's reconstructed from that event's own `prevValue`, which
- * every write records. Without it a key's first event had nothing to diff
- * against and both panes showed the same value.
- */const ORIGIN_INDEX = -1;
-
-/** Compare-bar copy for each origin state. Kept in sync with the Flutter port. */
-const ORIGIN_LABELS = {
-  prior: {
-    label: "BEFORE #1",
-    timestamp: "value before first event",
-    relativeTime: "not captured",
-    badge: "PRIOR"
-  },
-  absent: {
-    label: "NO PRIOR VALUE",
-    timestamp: "key did not exist",
-    relativeTime: "created here",
-    badge: "ABSENT"
-  },
-  scanned: {
-    label: "ALREADY PRESENT",
-    timestamp: "value found at startup",
-    relativeTime: "not a write",
-    badge: "SCANNED"
-  }
-};
-
-// Unified storage event type (supports both AsyncStorage and MMKV)
-
-/**
- * Get color for storage action
- */
-function getActionColor(action) {
-  switch (action) {
-    case "setItem":
-    case "multiSet":
-      return _sharedUi.macOSColors.semantic.success;
-    case "removeItem":
-    case "multiRemove":
-    case "clear":
-      return _sharedUi.macOSColors.semantic.error;
-    case "mergeItem":
-    case "multiMerge":
-      return _sharedUi.macOSColors.semantic.info;
-    default:
-      return _sharedUi.macOSColors.text.muted;
-  }
-}
-
-/**
- * Get the type of a value
- */
-function getValueType(value) {
-  if (value === null) return "null";
-  if (value === undefined) return "undefined";
-  if (Array.isArray(value)) return "array";
-  return typeof value;
-}
-
-/**
- * Format timestamp with milliseconds
- */
-function formatTimeWithMs(date) {
-  const h = String(date.getHours()).padStart(2, "0");
-  const m = String(date.getMinutes()).padStart(2, "0");
-  const s = String(date.getSeconds()).padStart(2, "0");
-  const ms = String(date.getMilliseconds()).padStart(3, "0");
-  return `${h}:${m}:${s}.${ms}`;
-}
-const SPLIT_VIEW_OPTIONS = {
-  hideLineNumbers: false,
-  disableWordDiff: false,
-  showDiffOnly: false,
-  compareMethod: "words",
-  contextLines: 3,
-  lineOffset: 0
-};
-const SPLIT_VIEW_DIFFERENCES = [];
-function StorageEventDetailContent({
-  conversation,
-  selectedEventIndex = 0,
-  onEventIndexChange = () => {},
-  disableInternalFooter = false
-}) {
-  // Pro feature gating
-  const isPro = (0, _license.useIsPro)();
-  const [showProModal, setShowProModal] = (0, _react.useState)(false);
-
-  // There is only the diff view now. The current stored value is what the Keys
-  // table shows — repeating it behind a toggle here meant two places to look for
-  // one fact, and the toggle was the first thing between you and the diff you
-  // opened this screen for.
-  const [diffMode, setDiffMode] = (0, _react.useState)("split");
-
-  // Compare indices for diff view
-  // Matches what the sync effect below computes, so the first frame doesn't
-  // briefly pair the oldest event with itself.
-  const [leftIndex, setLeftIndex] = (0, _react.useState)(Math.max(ORIGIN_INDEX, selectedEventIndex - 1));
-  const [rightIndex, setRightIndex] = (0, _react.useState)(selectedEventIndex);
-
-  // Track if preferences have been loaded
-  const hasLoadedPreferences = (0, _react.useRef)(false);
-
-  // Get sorted events
-  const navigationItems = (0, _react.useMemo)(() => conversation.events.sort((a, b) => a.timestamp.getTime() - b.timestamp.getTime()), [conversation.events]);
-  const totalEvents = navigationItems.length;
-
-  // Load saved preferences on mount
-  (0, _react.useEffect)(() => {
-    if (hasLoadedPreferences.current) return;
-    const loadPreferences = async () => {
-      try {
-        const savedDiffMode = await _asyncStorage.default.getItem(_sharedUi.devToolsStorageKeys.storage.diffViewerMode());
-        if (savedDiffMode === "split" || savedDiffMode === "tree") {
-          setDiffMode(savedDiffMode);
-        }
-        hasLoadedPreferences.current = true;
-      } catch {
-        // Failed to load preferences
-      }
-    };
-    loadPreferences();
-  }, []);
-
-  // Keep compare indices synced to selection. Left may land on ORIGIN_INDEX,
-  // which is not an event — it's the state the oldest event overwrote.
-  (0, _react.useEffect)(() => {
-    const newRight = Math.min(totalEvents - 1, Math.max(0, selectedEventIndex));
-    const newLeft = Math.max(ORIGIN_INDEX, Math.min(newRight - 1, selectedEventIndex - 1));
-    setLeftIndex(newLeft);
-    setRightIndex(newRight);
-  }, [selectedEventIndex, totalEvents]);
-
-  // Save diff mode preference when changed
-  const handleDiffModeChange = (0, _react.useCallback)(async mode => {
-    setDiffMode(mode);
-    try {
-      await _asyncStorage.default.setItem(_sharedUi.devToolsStorageKeys.storage.diffViewerMode(), mode);
-    } catch {
-      // Failed to save preference
-    }
-  }, []);
-
-  // Get current event
-  const selectedEvent = navigationItems[selectedEventIndex];
-  const action = selectedEvent?.action;
-  // Compute type from the parsed value so it matches what we actually render
-
-  // Get events for diff comparison. leftIndex === ORIGIN_INDEX means "the state
-  // before the oldest event", which has no event object of its own.
-  const isOriginLeft = leftIndex === ORIGIN_INDEX;
-  const leftEvent = isOriginLeft ? undefined : navigationItems[Math.max(0, Math.min(totalEvents - 1, leftIndex))];
-  const rightEvent = navigationItems[Math.max(0, Math.min(totalEvents - 1, rightIndex))];
-
-  // Every write records the value it overwrote (for time travel), so even the
-  // very first event can be diffed against what was actually there. Three
-  // distinct origins, and conflating them would misinform:
-  //   PRIOR   — the write replaced a real value (including `[]`, `""`, `null`)
-  //   ABSENT  — the write created the key; there was nothing before it
-  //   SCANNED — not a write at all, just the startup snapshot of a key that
-  //             already existed, so nothing changed at this event
-  const originKind = (0, _react.useMemo)(() => {
-    const data = rightEvent?.data;
-    if (data?.initialScan) return "scanned";
-    return data?.prevValue === null || data?.prevValue === undefined ? "absent" : "prior";
-  }, [rightEvent]);
-  const originValue = (0, _react.useMemo)(() => {
-    if (originKind === "absent") return _lineDiff.ABSENT_VALUE;
-    // A scanned key was already holding the event's own value, so diffing
-    // against it correctly reports no change.
-    if (originKind === "scanned") return (0, _sharedUi.parseValue)(rightEvent?.data?.value);
-    return (0, _sharedUi.parseValue)(rightEvent?.data?.prevValue);
-  }, [originKind, rightEvent]);
-
-  // Create event display info for compare bar
-  const leftEventInfo = (0, _react.useMemo)(() => isOriginLeft ? {
-    index: ORIGIN_INDEX,
-    label: ORIGIN_LABELS[originKind].label,
-    timestamp: ORIGIN_LABELS[originKind].timestamp,
-    relativeTime: ORIGIN_LABELS[originKind].relativeTime,
-    badge: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: [styles.actionBadgeSmall, {
-        backgroundColor: `${_sharedUi.night.color.textTertiary}20`
-      }],
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: [styles.actionTextSmall, {
-          color: _sharedUi.night.color.textTertiary
-        }],
-        children: ORIGIN_LABELS[originKind].badge
-      })
-    })
-  } : {
-    index: leftIndex,
-    label: `#${leftIndex + 1} / ${totalEvents}`,
-    timestamp: leftEvent ? formatTimeWithMs(leftEvent.timestamp) : "",
-    relativeTime: leftEvent ? (0, _sharedUi.formatRelativeTime)(leftEvent.timestamp) : "",
-    badge: leftEvent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: [styles.actionBadgeSmall, {
-        backgroundColor: `${getActionColor(leftEvent.action)}20`
-      }],
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: [styles.actionTextSmall, {
-          color: getActionColor(leftEvent.action)
-        }],
-        children: (0, _storageActionHelpers.translateStorageAction)(leftEvent.action)
-      })
-    }) : undefined
-  }, [leftIndex, leftEvent, totalEvents, isOriginLeft, originKind]);
-  const rightEventInfo = (0, _react.useMemo)(() => ({
-    index: rightIndex,
-    label: `#${rightIndex + 1} / ${totalEvents}`,
-    timestamp: rightEvent ? formatTimeWithMs(rightEvent.timestamp) : "",
-    relativeTime: rightEvent ? (0, _sharedUi.formatRelativeTime)(rightEvent.timestamp) : "",
-    badge: rightEvent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: [styles.actionBadgeSmall, {
-        backgroundColor: `${getActionColor(rightEvent.action)}20`
-      }],
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: [styles.actionTextSmall, {
-          color: getActionColor(rightEvent.action)
-        }],
-        children: (0, _storageActionHelpers.translateStorageAction)(rightEvent.action)
-      })
-    }) : undefined
-  }), [rightIndex, rightEvent, totalEvents]);
-
-  // Diff mode tabs
-  const diffModeTabs = (0, _react.useMemo)(() => [{
-    key: "tree",
-    label: "TREE VIEW"
-  }, {
-    key: "split",
-    label: "SPLIT VIEW"
-  }], []);
-
-  // Navigation handlers for compare bar
-  const handleLeftPrevious = (0, _react.useCallback)(() => {
-    // Stops at ORIGIN_INDEX — one step past event #1 is the state it overwrote.
-    if (leftIndex > ORIGIN_INDEX) {
-      setLeftIndex(leftIndex - 1);
-    }
-  }, [leftIndex]);
-  const handleLeftNext = (0, _react.useCallback)(() => {
-    if (leftIndex < rightIndex - 1) {
-      setLeftIndex(leftIndex + 1);
-    }
-  }, [leftIndex, rightIndex]);
-  const handleRightPrevious = (0, _react.useCallback)(() => {
-    if (rightIndex > leftIndex + 1) {
-      setRightIndex(rightIndex - 1);
-    }
-  }, [rightIndex, leftIndex]);
-  const handleRightNext = (0, _react.useCallback)(() => {
-    if (rightIndex < totalEvents - 1) {
-      setRightIndex(rightIndex + 1);
-    }
-  }, [rightIndex, totalEvents]);
-
-  // Memoized so the diff viewers don't see new oldValue/newValue refs on every
-  // re-render. parseValue runs JSON.parse, which would otherwise produce fresh
-  // object identities every time and force expensive recomputations downstream
-  // (line diff, tree diff, expansion-state effects, etc.).
-  const previousValue = (0, _react.useMemo)(() => isOriginLeft ? originValue : (0, _sharedUi.parseValue)(leftEvent?.data?.value ?? null), [isOriginLeft, originValue, leftEvent]);
-  const currentValue = (0, _react.useMemo)(() => (0, _sharedUi.parseValue)(rightEvent?.data?.value), [rightEvent]);
-
-  // Render diff content
-  const renderDiffContent = (0, _react.useCallback)(() => {
-    if (diffMode === "split") {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ThemedSplitView.ThemedSplitView, {
-        oldValue: previousValue,
-        newValue: currentValue,
-        differences: SPLIT_VIEW_DIFFERENCES,
-        theme: _diffThemes.diffThemes.devToolsDefault,
-        options: SPLIT_VIEW_OPTIONS,
-        showThemeName: false,
-        scrollEnabled: false
-      });
-    }
-
-    // Inline: the whole diff section scrolls as one page (see
-    // `scrollDiffSection` below), so the tree must not scroll itself.
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TreeDiffViewer.TreeDiffViewer, {
-      oldValue: previousValue,
-      newValue: currentValue,
-      scrollEnabled: false
-    });
-  }, [previousValue, currentValue, diffMode]);
-
-  // Footer navigation handlers
-  const handleFooterPrevious = (0, _react.useCallback)(() => {
-    onEventIndexChange(Math.max(0, selectedEventIndex - 1));
-  }, [selectedEventIndex, onEventIndexChange]);
-  const handleFooterNext = (0, _react.useCallback)(() => {
-    onEventIndexChange(Math.min(totalEvents - 1, selectedEventIndex + 1));
-  }, [selectedEventIndex, totalEvents, onEventIndexChange]);
-
-  // Time-travel action handlers
-  const handleUndo = (0, _react.useCallback)(async () => {
-    if (!isPro) {
-      setShowProModal(true);
-      return;
-    }
-    if (!selectedEvent || selectedEvent.storageType === "mmkv") return;
-    try {
-      await (0, _storageTimeTravelUtils.undoOperation)(selectedEvent);
-    } catch {
-      // Silent fail
-    }
-  }, [selectedEvent, isPro]);
-  const handleJump = (0, _react.useCallback)(async () => {
-    if (!isPro) {
-      setShowProModal(true);
-      return;
-    }
-    if (!selectedEvent || selectedEvent.storageType === "mmkv") return;
-    const asyncEvents = navigationItems.filter(e => e.storageType !== "mmkv");
-    const targetIndex = asyncEvents.findIndex(e => e.timestamp.getTime() === selectedEvent.timestamp.getTime());
-    if (targetIndex === -1) return;
-    try {
-      await (0, _storageTimeTravelUtils.jumpToState)(asyncEvents, targetIndex);
-    } catch {
-      // Silent fail
-    }
-  }, [selectedEvent, navigationItems, isPro]);
-  const handleCopy = (0, _react.useCallback)(async () => {
-    if (!selectedEvent) return;
-    const eventData = {
-      action: selectedEvent.action,
-      timestamp: selectedEvent.timestamp.toISOString(),
-      data: selectedEvent.data
-    };
-    await (0, _sharedUi.copyToClipboard)(eventData);
-  }, [selectedEvent]);
-
-  // Check if current event supports actions
-  const isAsyncStorageEvent = selectedEvent?.storageType !== "mmkv";
-  const canUndoEvent = isAsyncStorageEvent && selectedEvent && (0, _storageTimeTravelUtils.canUndo)(selectedEvent);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [isAsyncStorageEvent && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.actionButtonsContainer,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton, {
-        type: "undo",
-        text: "UNDO",
-        onPress: handleUndo,
-        disabled: !canUndoEvent,
-        locked: !isPro
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton, {
-        type: "jump",
-        text: "JUMP",
-        onPress: handleJump,
-        locked: !isPro
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton, {
-        type: "copy",
-        text: "COPY",
-        onPress: handleCopy
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.EventHistoryViewer
-    // Diff only: no `renderCurrentView`, so the viewer drops the toggle
-    // cards entirely rather than showing a one-option switch.
-    , {
-      activeView: "diff",
-      diffViewLabel: "DIFF VIEW",
-      diffViewDescription: "Compare changes between versions",
-      diffViewIcon: _sharedUi.GitBranch
-      // Diff View
-      ,
-      diffModeTabs: diffModeTabs,
-      activeDiffMode: diffMode,
-      onDiffModeChange: handleDiffModeChange,
-      renderDiffContent: renderDiffContent
-      // Both diff modes render inline now, so the whole section scrolls as
-      // one page rather than confining the rows to a nested pane.
-      ,
-      scrollDiffSection: true
-      // Compare Bar
-      ,
-      leftEvent: leftEventInfo,
-      rightEvent: rightEventInfo,
-      showCompareNavigation: true,
-      onLeftPrevious: handleLeftPrevious,
-      onLeftNext: handleLeftNext,
-      onRightPrevious: handleRightPrevious,
-      onRightNext: handleRightNext,
-      canLeftPrevious: leftIndex > ORIGIN_INDEX,
-      canLeftNext: leftIndex < rightIndex - 1,
-      canRightPrevious: rightIndex > leftIndex + 1,
-      canRightNext: rightIndex < totalEvents - 1
-      // Footer
-      ,
-      disableInternalFooter: disableInternalFooter,
-      footerCurrentIndex: selectedEventIndex,
-      footerTotalItems: totalEvents,
-      footerItemLabel: "Event",
-      footerSubtitle: (0, _sharedUi.formatRelativeTime)(selectedEvent?.timestamp),
-      onFooterPrevious: handleFooterPrevious,
-      onFooterNext: handleFooterNext
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ProUpgradeModal, {
-      visible: showProModal,
-      onClose: () => setShowProModal(false),
-      featureName: "Storage Time-Travel"
-    })]
-  });
-}
-
-/**
- * External footer component for modal use
- */
-function StorageEventDetailFooter({
-  conversation,
-  selectedEventIndex = 0,
-  onEventIndexChange = () => {},
-  applySafeAreaInset = true
-}) {
-  const navigationItems = conversation.events.sort((a, b) => a.timestamp.getTime() - b.timestamp.getTime());
-  const totalEvents = navigationItems.length;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.EventStepperFooter, {
-    currentIndex: selectedEventIndex,
-    totalItems: totalEvents,
-    onPrevious: () => onEventIndexChange(Math.max(0, selectedEventIndex - 1)),
-    onNext: () => onEventIndexChange(Math.min(totalEvents - 1, selectedEventIndex + 1)),
-    itemLabel: "Event",
-    subtitle: (0, _sharedUi.formatRelativeTime)(navigationItems[selectedEventIndex]?.timestamp),
-    applySafeAreaInset: applySafeAreaInset
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  // Action Buttons
-  actionButtonsContainer: {
-    flexDirection: "row",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: 8,
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    backgroundColor: _sharedUi.night.color.surface,
-    borderBottomWidth: 1,
-    borderBottomColor: _sharedUi.night.color.border
-  },
-  // Content Card
-  valueBox: {
-    backgroundColor: _sharedUi.night.color.bg,
-    borderRadius: 6,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border,
-    padding: 8
-  },
-  valueText: {
-    fontSize: 12,
-    color: _sharedUi.night.color.text,
-    fontFamily: _sharedUi.monoFont,
-    lineHeight: 18
-  },
-  // Action badges for compare bar
-  actionBadgeSmall: {
-    paddingHorizontal: 6,
-    paddingVertical: 1,
-    borderRadius: 3
-  },
-  actionTextSmall: {
-    fontSize: 8,
-    fontWeight: "700",
-    fontFamily: _sharedUi.monoFont
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.StorageEventDetailContent=StorageEventDetailContent;exports.StorageEventDetailFooter=StorageEventDetailFooter;var _reactNative=require("react-native");var _react=require("react");var _asyncStorage=_interopRequireDefault(require("@react-native-async-storage/async-storage"));var _sharedUi=require("@buoy-gg/shared-ui");var _license=require("@buoy-gg/license");var _lineDiff=require("../utils/lineDiff");var _ThemedSplitView=require("./DiffViewer/modes/ThemedSplitView");var _diffThemes=require("./DiffViewer/themes/diffThemes");var _TreeDiffViewer=require("./DiffViewer/TreeDiffViewer");var _storageActionHelpers=require("../utils/storageActionHelpers");var _StorageEventActionButton=require("./StorageEventActionButton");var _storageTimeTravelUtils=require("../utils/storageTimeTravelUtils");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const ORIGIN_INDEX=-1;const ORIGIN_LABELS={prior:{label:"BEFORE #1",timestamp:"value before first event",relativeTime:"not captured",badge:"PRIOR"},absent:{label:"NO PRIOR VALUE",timestamp:"key did not exist",relativeTime:"created here",badge:"ABSENT"},scanned:{label:"ALREADY PRESENT",timestamp:"value found at startup",relativeTime:"not a write",badge:"SCANNED"}};function getActionColor(e){switch(e){case"setItem":case"multiSet":return _sharedUi.macOSColors.semantic.success;case"removeItem":case"multiRemove":case"clear":return _sharedUi.macOSColors.semantic.error;case"mergeItem":case"multiMerge":return _sharedUi.macOSColors.semantic.info;default:return _sharedUi.macOSColors.text.muted}}function getValueType(e){if(e===null)return"null";if(e===void 0)return"undefined";if(Array.isArray(e))return"array";return typeof e}function formatTimeWithMs(e){const t=String(e.getHours()).padStart(2,"0");const f=String(e.getMinutes()).padStart(2,"0");const g=String(e.getSeconds()).padStart(2,"0");const l=String(e.getMilliseconds()).padStart(3,"0");return`${t}:${f}:${g}.${l}`}const SPLIT_VIEW_OPTIONS={hideLineNumbers:false,disableWordDiff:false,showDiffOnly:false,compareMethod:"words",contextLines:3,lineOffset:0};const SPLIT_VIEW_DIFFERENCES=[];function StorageEventDetailContent({conversation:e,selectedEventIndex:t=0,onEventIndexChange:f=()=>{},disableInternalFooter:g=false}){const l=(0,_license.useIsPro)();const[S,h]=(0,_react.useState)(false);const[p,M]=(0,_react.useState)("split");const[o,T]=(0,_react.useState)(Math.max(ORIGIN_INDEX,t-1));const[n,b]=(0,_react.useState)(t);const w=(0,_react.useRef)(false);const d=(0,_react.useMemo)(()=>e.events.sort((r,u)=>r.timestamp.getTime()-u.timestamp.getTime()),[e.events]);const s=d.length;(0,_react.useEffect)(()=>{if(w.current)return;const r=async()=>{try{const u=await _asyncStorage.default.getItem(_sharedUi.devToolsStorageKeys.storage.diffViewerMode());if(u==="split"||u==="tree"){M(u)}w.current=true}catch{}};r()},[]);(0,_react.useEffect)(()=>{const r=Math.min(s-1,Math.max(0,t));const u=Math.max(ORIGIN_INDEX,Math.min(r-1,t-1));T(u);b(r)},[t,s]);const D=(0,_react.useCallback)(async r=>{M(r);try{await _asyncStorage.default.setItem(_sharedUi.devToolsStorageKeys.storage.diffViewerMode(),r)}catch{}},[]);const a=d[t];const $=a?.action;const v=o===ORIGIN_INDEX;const c=v?void 0:d[Math.max(0,Math.min(s-1,o))];const i=d[Math.max(0,Math.min(s-1,n))];const m=(0,_react.useMemo)(()=>{const r=i?.data;if(r?.initialScan)return"scanned";return r?.prevValue===null||r?.prevValue===void 0?"absent":"prior"},[i]);const C=(0,_react.useMemo)(()=>{if(m==="absent")return _lineDiff.ABSENT_VALUE;if(m==="scanned")return(0,_sharedUi.parseValue)(i?.data?.value);return(0,_sharedUi.parseValue)(i?.data?.prevValue)},[m,i]);const P=(0,_react.useMemo)(()=>v?{index:ORIGIN_INDEX,label:ORIGIN_LABELS[m].label,timestamp:ORIGIN_LABELS[m].timestamp,relativeTime:ORIGIN_LABELS[m].relativeTime,badge:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.actionBadgeSmall,{backgroundColor:`${_sharedUi.night.color.textTertiary}20`}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionTextSmall,{color:_sharedUi.night.color.textTertiary}],children:ORIGIN_LABELS[m].badge})})}:{index:o,label:`#${o+1} / ${s}`,timestamp:c?formatTimeWithMs(c.timestamp):"",relativeTime:c?(0,_sharedUi.formatRelativeTime)(c.timestamp):"",badge:c?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.actionBadgeSmall,{backgroundColor:`${getActionColor(c.action)}20`}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionTextSmall,{color:getActionColor(c.action)}],children:(0,_storageActionHelpers.translateStorageAction)(c.action)})}):void 0},[o,c,s,v,m]);const R=(0,_react.useMemo)(()=>({index:n,label:`#${n+1} / ${s}`,timestamp:i?formatTimeWithMs(i.timestamp):"",relativeTime:i?(0,_sharedUi.formatRelativeTime)(i.timestamp):"",badge:i?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.actionBadgeSmall,{backgroundColor:`${getActionColor(i.action)}20`}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.actionTextSmall,{color:getActionColor(i.action)}],children:(0,_storageActionHelpers.translateStorageAction)(i.action)})}):void 0}),[n,i,s]);const I=(0,_react.useMemo)(()=>[{key:"tree",label:"TREE VIEW"},{key:"split",label:"SPLIT VIEW"}],[]);const N=(0,_react.useCallback)(()=>{if(o>ORIGIN_INDEX){T(o-1)}},[o]);const k=(0,_react.useCallback)(()=>{if(o<n-1){T(o+1)}},[o,n]);const _=(0,_react.useCallback)(()=>{if(n>o+1){b(n-1)}},[n,o]);const L=(0,_react.useCallback)(()=>{if(n<s-1){b(n+1)}},[n,s]);const y=(0,_react.useMemo)(()=>v?C:(0,_sharedUi.parseValue)(c?.data?.value??null),[v,C,c]);const x=(0,_react.useMemo)(()=>(0,_sharedUi.parseValue)(i?.data?.value),[i]);const j=(0,_react.useCallback)(()=>{if(p==="split"){return(0,_jsxRuntime.jsx)(_ThemedSplitView.ThemedSplitView,{oldValue:y,newValue:x,differences:SPLIT_VIEW_DIFFERENCES,theme:_diffThemes.diffThemes.devToolsDefault,options:SPLIT_VIEW_OPTIONS,showThemeName:false,scrollEnabled:false})}return(0,_jsxRuntime.jsx)(_TreeDiffViewer.TreeDiffViewer,{oldValue:y,newValue:x,scrollEnabled:false})},[y,x,p]);const A=(0,_react.useCallback)(()=>{f(Math.max(0,t-1))},[t,f]);const O=(0,_react.useCallback)(()=>{f(Math.min(s-1,t+1))},[t,s,f]);const B=(0,_react.useCallback)(async()=>{if(!l){h(true);return}if(!a||a.storageType==="mmkv")return;try{await(0,_storageTimeTravelUtils.undoOperation)(a)}catch{}},[a,l]);const F=(0,_react.useCallback)(async()=>{if(!l){h(true);return}if(!a||a.storageType==="mmkv")return;const r=d.filter(V=>V.storageType!=="mmkv");const u=r.findIndex(V=>V.timestamp.getTime()===a.timestamp.getTime());if(u===-1)return;try{await(0,_storageTimeTravelUtils.jumpToState)(r,u)}catch{}},[a,d,l]);const q=(0,_react.useCallback)(async()=>{if(!a)return;const r={action:a.action,timestamp:a.timestamp.toISOString(),data:a.data};await(0,_sharedUi.copyToClipboard)(r)},[a]);const E=a?.storageType!=="mmkv";const U=E&&a&&(0,_storageTimeTravelUtils.canUndo)(a);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[E&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.actionButtonsContainer,children:[(0,_jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton,{type:"undo",text:"UNDO",onPress:B,disabled:!U,locked:!l}),(0,_jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton,{type:"jump",text:"JUMP",onPress:F,locked:!l}),(0,_jsxRuntime.jsx)(_StorageEventActionButton.StorageEventActionButton,{type:"copy",text:"COPY",onPress:q})]}),(0,_jsxRuntime.jsx)(_sharedUi.EventHistoryViewer,{activeView:"diff",diffViewLabel:"DIFF VIEW",diffViewDescription:"Compare changes between versions",diffViewIcon:_sharedUi.GitBranch,diffModeTabs:I,activeDiffMode:p,onDiffModeChange:D,renderDiffContent:j,scrollDiffSection:true,leftEvent:P,rightEvent:R,showCompareNavigation:true,onLeftPrevious:N,onLeftNext:k,onRightPrevious:_,onRightNext:L,canLeftPrevious:o>ORIGIN_INDEX,canLeftNext:o<n-1,canRightPrevious:n>o+1,canRightNext:n<s-1,disableInternalFooter:g,footerCurrentIndex:t,footerTotalItems:s,footerItemLabel:"Event",footerSubtitle:(0,_sharedUi.formatRelativeTime)(a?.timestamp),onFooterPrevious:A,onFooterNext:O}),(0,_jsxRuntime.jsx)(_sharedUi.ProUpgradeModal,{visible:S,onClose:()=>h(false),featureName:"Storage Time-Travel"})]})}function StorageEventDetailFooter({conversation:e,selectedEventIndex:t=0,onEventIndexChange:f=()=>{},applySafeAreaInset:g=true}){const l=e.events.sort((h,p)=>h.timestamp.getTime()-p.timestamp.getTime());const S=l.length;return(0,_jsxRuntime.jsx)(_sharedUi.EventStepperFooter,{currentIndex:t,totalItems:S,onPrevious:()=>f(Math.max(0,t-1)),onNext:()=>f(Math.min(S-1,t+1)),itemLabel:"Event",subtitle:(0,_sharedUi.formatRelativeTime)(l[t]?.timestamp),applySafeAreaInset:g})}const styles=_reactNative.StyleSheet.create({actionButtonsContainer:{flexDirection:"row",justifyContent:"center",alignItems:"center",gap:8,paddingHorizontal:12,paddingVertical:10,backgroundColor:_sharedUi.night.color.surface,borderBottomWidth:1,borderBottomColor:_sharedUi.night.color.border},valueBox:{backgroundColor:_sharedUi.night.color.bg,borderRadius:6,borderWidth:1,borderColor:_sharedUi.night.color.border,padding:8},valueText:{fontSize:12,color:_sharedUi.night.color.text,fontFamily:_sharedUi.monoFont,lineHeight:18},actionBadgeSmall:{paddingHorizontal:6,paddingVertical:1,borderRadius:3},actionTextSmall:{fontSize:8,fontWeight:"700",fontFamily:_sharedUi.monoFont}});