@buoy-gg/shared-ui 7.0.41 → 7.0.43

package/lib/commonjs/dataViewer/SplitDiffViewer.js

@@ -1,421 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SplitDiffViewer = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _lineDiff = require("./lineDiff.js");
-var _DiffSummary = require("./DiffSummary.js");
-var _diffThemes = require("./diffThemes.js");
-var _fonts = require("../ui/fonts.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); }
-/**
- * SplitDiffViewer
- *
- * A line-by-line split diff viewer for comparing two values.
- * Shows PREV on the left and CUR on the right with word-level highlighting.
- * This is a dumb component - all state is controlled externally.
- */
-
-/**
- * SplitDiffViewer displays a side-by-side diff comparison.
- */
-const SplitDiffViewer = exports.SplitDiffViewer = /*#__PURE__*/(0, _react.memo)(function SplitDiffViewer({
-  oldValue,
-  newValue,
-  theme = _diffThemes.devToolsDefaultTheme,
-  options = {},
-  showThemeName = false,
-  height = 400
-}) {
-  const {
-    hideLineNumbers = false,
-    disableWordDiff = false,
-    showDiffOnly = false,
-    compareMethod = "words",
-    contextLines = 3
-  } = options;
-
-  // Compute line-by-line diff with options
-  const diffComputeOptions = {
-    compareMethod,
-    disableWordDiff,
-    showDiffOnly,
-    contextLines
-  };
-  const lineDiffs = (0, _react.useMemo)(() => (0, _lineDiff.computeLineDiff)(oldValue, newValue, diffComputeOptions), [oldValue, newValue, compareMethod, disableWordDiff, showDiffOnly, contextLines]);
-
-  // Create dynamic styles based on theme
-  const dynamicStyles = (0, _react.useMemo)(() => createDynamicStyles(theme, height), [theme, height]);
-
-  // Render word diff content
-  const renderWordDiff = wordDiffs => {
-    return wordDiffs.map((word, idx) => {
-      let backgroundColor = "transparent";
-      if (word.type === _lineDiff.DiffType.ADDED) {
-        backgroundColor = theme.addedWordHighlight;
-      } else if (word.type === _lineDiff.DiffType.REMOVED) {
-        backgroundColor = theme.removedWordHighlight;
-      }
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: [dynamicStyles.wordDiff, {
-          backgroundColor
-        }],
-        children: word.value
-      }, idx);
-    });
-  };
-
-  // Get colors for diff type
-  const getDiffColors = (type, isModified = false) => {
-    if (isModified) {
-      return {
-        background: theme.modifiedBackground,
-        text: theme.modifiedText,
-        markerBg: theme.markerModifiedBackground
-      };
-    }
-    switch (type) {
-      case _lineDiff.DiffType.ADDED:
-        return {
-          background: theme.addedBackground,
-          text: theme.addedText,
-          markerBg: theme.markerAddedBackground
-        };
-      case _lineDiff.DiffType.REMOVED:
-        return {
-          background: theme.removedBackground,
-          text: theme.removedText,
-          markerBg: theme.markerRemovedBackground
-        };
-      case _lineDiff.DiffType.DEFAULT:
-        return {
-          background: theme.unchangedBackground,
-          text: theme.unchangedText,
-          markerBg: "transparent"
-        };
-      default:
-        return {
-          background: theme.unchangedBackground,
-          text: theme.unchangedText,
-          markerBg: "transparent"
-        };
-    }
-  };
-
-  // Render a single line side (left or right)
-  const renderLineSide = (lineNumber, content, type, marker, isEmpty = false) => {
-    if (isEmpty) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [!hideLineNumbers && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [dynamicStyles.gutter, dynamicStyles.emptyGutter],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: dynamicStyles.lineNumber,
-            children: " "
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [dynamicStyles.marker, dynamicStyles.emptyMarker],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: dynamicStyles.markerText,
-            children: " "
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [dynamicStyles.contentCell, dynamicStyles.emptyContent],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: dynamicStyles.content,
-            children: " "
-          })
-        })]
-      });
-    }
-    const colors = getDiffColors(type);
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [!hideLineNumbers && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [dynamicStyles.gutter, {
-          backgroundColor: theme.lineNumberBackground
-        }],
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: dynamicStyles.lineNumber,
-          children: lineNumber || " "
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [dynamicStyles.marker, {
-          backgroundColor: colors.markerBg
-        }],
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: [dynamicStyles.markerText, {
-            color: theme.markerText
-          }],
-          children: marker
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [dynamicStyles.contentCell, {
-          backgroundColor: colors.background
-        }],
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: [dynamicStyles.content, {
-            color: colors.text
-          }],
-          children: Array.isArray(content) ? renderWordDiff(content) : content || " "
-        })
-      })]
-    });
-  };
-
-  // Check if we should show a separator (gap in line numbers)
-  const shouldShowSeparator = (idx, diffs) => {
-    if (!showDiffOnly || idx === 0) return false;
-    const prevDiff = diffs[idx - 1];
-    const currDiff = diffs[idx];
-
-    // Check for gap in line numbers
-    const leftGap = currDiff.leftLineNumber && prevDiff.leftLineNumber && currDiff.leftLineNumber - prevDiff.leftLineNumber > 1;
-    const rightGap = currDiff.rightLineNumber && prevDiff.rightLineNumber && currDiff.rightLineNumber - prevDiff.rightLineNumber > 1;
-    return leftGap || rightGap;
-  };
-
-  // Render a complete row with both left and right sides
-  const renderDiffRow = (diff, idx, diffs) => {
-    const isRemoved = diff.type === _lineDiff.DiffType.REMOVED;
-    const isAdded = diff.type === _lineDiff.DiffType.ADDED;
-    const isModified = diff.type === _lineDiff.DiffType.MODIFIED;
-    const isDefault = diff.type === _lineDiff.DiffType.DEFAULT;
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
-      children: [shouldShowSeparator(idx, diffs) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: dynamicStyles.separator,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: dynamicStyles.separatorText,
-          children: "\u2022 \u2022 \u2022"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: dynamicStyles.row,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: dynamicStyles.leftSide,
-          children: isRemoved || isModified || isDefault ? renderLineSide(diff.leftLineNumber, diff.leftContent, isModified ? _lineDiff.DiffType.REMOVED : diff.type, isRemoved || isModified ? "-" : " ") : renderLineSide(undefined, undefined, _lineDiff.DiffType.DEFAULT, " ", true)
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: dynamicStyles.centerDivider
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: dynamicStyles.rightSide,
-          children: isAdded || isModified || isDefault ? renderLineSide(diff.rightLineNumber, diff.rightContent, isModified ? _lineDiff.DiffType.ADDED : diff.type, isAdded || isModified ? "+" : " ") : renderLineSide(undefined, undefined, _lineDiff.DiffType.DEFAULT, " ", true)
-        })]
-      })]
-    }, idx);
-  };
-
-  // Count diff statistics
-  const addedCount = lineDiffs.filter(d => d.type === _lineDiff.DiffType.ADDED).length;
-  const removedCount = lineDiffs.filter(d => d.type === _lineDiff.DiffType.REMOVED).length;
-  const modifiedCount = lineDiffs.filter(d => d.type === _lineDiff.DiffType.MODIFIED).length;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: [dynamicStyles.container, theme.glowColor && {
-      shadowColor: theme.glowColor,
-      shadowOffset: {
-        width: 0,
-        height: 0
-      },
-      shadowOpacity: theme.neonIntensity && theme.neonIntensity > 0.7 ? 0.5 : theme.neonIntensity && theme.neonIntensity > 0.3 ? 0.3 : 0.1,
-      shadowRadius: theme.neonIntensity && theme.neonIntensity > 0.7 ? 10 : theme.neonIntensity && theme.neonIntensity > 0.3 ? 5 : 2
-    }],
-    children: [showThemeName && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: dynamicStyles.themeBadge,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: dynamicStyles.themeName,
-        children: theme.name
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: dynamicStyles.themeDescription,
-        children: theme.description
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: dynamicStyles.header,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: dynamicStyles.headerLeft,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: dynamicStyles.headerTitle,
-          children: "PREV"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: dynamicStyles.divider
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: dynamicStyles.headerRight,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: dynamicStyles.headerTitle,
-          children: "CUR"
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DiffSummary.DiffSummary, {
-      added: addedCount,
-      removed: removedCount,
-      modified: modifiedCount,
-      theme: theme
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
-      style: dynamicStyles.scrollView,
-      showsVerticalScrollIndicator: false,
-      contentContainerStyle: dynamicStyles.scrollContent,
-      children: lineDiffs.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: dynamicStyles.emptyState,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: dynamicStyles.emptyText,
-          children: showDiffOnly ? "No differences found" : "No content to display"
-        })
-      }) : lineDiffs.map((diff, idx) => renderDiffRow(diff, idx, lineDiffs))
-    })]
-  });
-});
-
-// Create dynamic styles based on theme
-function createDynamicStyles(theme, height) {
-  return _reactNative.StyleSheet.create({
-    container: {
-      height,
-      backgroundColor: theme.background,
-      borderRadius: 8,
-      overflow: "hidden",
-      borderWidth: 1,
-      borderColor: theme.borderColor
-    },
-    themeBadge: {
-      backgroundColor: theme.panelBackground,
-      paddingHorizontal: 12,
-      paddingVertical: 8,
-      borderBottomWidth: 1,
-      borderBottomColor: theme.borderColor
-    },
-    themeName: {
-      fontSize: 12,
-      fontWeight: "700",
-      color: theme.accentColor || theme.unchangedText,
-      fontFamily: _fonts.monoFont,
-      letterSpacing: 0.5
-    },
-    themeDescription: {
-      fontSize: 10,
-      color: theme.unchangedText,
-      fontFamily: _fonts.monoFont,
-      marginTop: 2,
-      opacity: 0.8
-    },
-    header: {
-      flexDirection: "row",
-      backgroundColor: theme.headerBackground,
-      borderBottomWidth: 1,
-      borderBottomColor: theme.borderColor
-    },
-    headerLeft: {
-      flex: 1,
-      paddingVertical: 8,
-      paddingHorizontal: 12
-    },
-    headerRight: {
-      flex: 1,
-      paddingVertical: 8,
-      paddingHorizontal: 12
-    },
-    headerTitle: {
-      fontSize: 10,
-      fontWeight: "700",
-      color: theme.accentColor || theme.unchangedText,
-      fontFamily: _fonts.monoFont,
-      letterSpacing: 0.5,
-      textTransform: "uppercase"
-    },
-    divider: {
-      width: 1,
-      backgroundColor: theme.dividerColor
-    },
-    scrollView: {
-      flex: 1
-    },
-    scrollContent: {
-      paddingBottom: 10
-    },
-    row: {
-      flexDirection: "row",
-      minHeight: 20
-    },
-    leftSide: {
-      flex: 1,
-      flexDirection: "row"
-    },
-    rightSide: {
-      flex: 1,
-      flexDirection: "row"
-    },
-    centerDivider: {
-      width: 1,
-      backgroundColor: theme.dividerColor
-    },
-    gutter: {
-      width: 35,
-      paddingHorizontal: 4,
-      justifyContent: "center",
-      alignItems: "flex-end",
-      backgroundColor: theme.lineNumberBackground,
-      borderRightWidth: 1,
-      borderRightColor: theme.lineNumberBorder
-    },
-    emptyGutter: {
-      backgroundColor: theme.contextBackground
-    },
-    lineNumber: {
-      fontSize: 9,
-      fontFamily: _fonts.monoFont,
-      color: theme.lineNumberText
-    },
-    marker: {
-      width: 20,
-      justifyContent: "center",
-      alignItems: "center"
-    },
-    emptyMarker: {
-      backgroundColor: theme.contextBackground
-    },
-    markerText: {
-      fontSize: 10,
-      fontFamily: _fonts.monoFont,
-      fontWeight: "600"
-    },
-    contentCell: {
-      flex: 1,
-      paddingHorizontal: 8,
-      paddingVertical: 2
-    },
-    emptyContent: {
-      backgroundColor: theme.contextBackground
-    },
-    content: {
-      fontSize: 10,
-      fontFamily: _fonts.monoFont,
-      lineHeight: 16
-    },
-    wordDiff: {
-      fontSize: 10,
-      fontFamily: _fonts.monoFont
-    },
-    separator: {
-      height: 20,
-      justifyContent: "center",
-      alignItems: "center",
-      backgroundColor: theme.separatorBackground
-    },
-    separatorText: {
-      fontSize: 8,
-      color: theme.separatorText,
-      fontFamily: _fonts.monoFont,
-      letterSpacing: 2
-    },
-    emptyState: {
-      padding: 40,
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    emptyText: {
-      fontSize: 11,
-      color: theme.emptyStateText,
-      fontStyle: "italic",
-      fontFamily: _fonts.monoFont
-    }
-  });
-}
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.SplitDiffViewer=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _lineDiff=require("./lineDiff.js");var _DiffSummary=require("./DiffSummary.js");var _diffThemes=require("./diffThemes.js");var _fonts=require("../ui/fonts.js");var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(n,y){if("function"==typeof WeakMap)var x=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(i,D){if(!D&&i&&i.__esModule)return i;var c,u,f={__proto__:null,default:i};if(null===i||"object"!=typeof i&&"function"!=typeof i)return f;if(c=D?r:x){if(c.has(i))return c.get(i);c.set(i,f)}for(const a in i)"default"!==a&&{}.hasOwnProperty.call(i,a)&&((u=(c=Object.defineProperty)&&Object.getOwnPropertyDescriptor(i,a))&&(u.get||u.set)?c(f,a,u):f[a]=i[a]);return f})(n,y)}const SplitDiffViewer=exports.SplitDiffViewer=(0,_react.memo)(function n({oldValue:y,newValue:x,theme:r=_diffThemes.devToolsDefaultTheme,options:i={},showThemeName:D=false,height:c=400}){const{hideLineNumbers:u=false,disableWordDiff:f=false,showDiffOnly:a=false,compareMethod:T="words",contextLines:h=3}=i;const b={compareMethod:T,disableWordDiff:f,showDiffOnly:a,contextLines:h};const g=(0,_react.useMemo)(()=>(0,_lineDiff.computeLineDiff)(y,x,b),[y,x,T,f,a,h]);const e=(0,_react.useMemo)(()=>createDynamicStyles(r,c),[r,c]);const w=t=>{return t.map((o,s)=>{let l="transparent";if(o.type===_lineDiff.DiffType.ADDED){l=r.addedWordHighlight}else if(o.type===_lineDiff.DiffType.REMOVED){l=r.removedWordHighlight}return(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[e.wordDiff,{backgroundColor:l}],children:o.value},s)})};const j=(t,o=false)=>{if(o){return{background:r.modifiedBackground,text:r.modifiedText,markerBg:r.markerModifiedBackground}}switch(t){case _lineDiff.DiffType.ADDED:return{background:r.addedBackground,text:r.addedText,markerBg:r.markerAddedBackground};case _lineDiff.DiffType.REMOVED:return{background:r.removedBackground,text:r.removedText,markerBg:r.markerRemovedBackground};case _lineDiff.DiffType.DEFAULT:return{background:r.unchangedBackground,text:r.unchangedText,markerBg:"transparent"};default:return{background:r.unchangedBackground,text:r.unchangedText,markerBg:"transparent"}}};const m=(t,o,s,l,p=false)=>{if(p){return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[!u&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.gutter,e.emptyGutter],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.lineNumber,children:" "})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.marker,e.emptyMarker],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.markerText,children:" "})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.contentCell,e.emptyContent],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.content,children:" "})})]})}const d=j(s);return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[!u&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.gutter,{backgroundColor:r.lineNumberBackground}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.lineNumber,children:t||" "})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.marker,{backgroundColor:d.markerBg}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[e.markerText,{color:r.markerText}],children:l})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[e.contentCell,{backgroundColor:d.background}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[e.content,{color:d.text}],children:Array.isArray(o)?w(o):o||" "})})]})};const C=(t,o)=>{if(!a||t===0)return false;const s=o[t-1];const l=o[t];const p=l.leftLineNumber&&s.leftLineNumber&&l.leftLineNumber-s.leftLineNumber>1;const d=l.rightLineNumber&&s.rightLineNumber&&l.rightLineNumber-s.rightLineNumber>1;return p||d};const S=(t,o,s)=>{const l=t.type===_lineDiff.DiffType.REMOVED;const p=t.type===_lineDiff.DiffType.ADDED;const d=t.type===_lineDiff.DiffType.MODIFIED;const k=t.type===_lineDiff.DiffType.DEFAULT;return(0,_jsxRuntime.jsxs)(_react.Fragment,{children:[C(o,s)&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.separator,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.separatorText,children:"\u2022 \u2022 \u2022"})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:e.row,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.leftSide,children:l||d||k?m(t.leftLineNumber,t.leftContent,d?_lineDiff.DiffType.REMOVED:t.type,l||d?"-":" "):m(void 0,void 0,_lineDiff.DiffType.DEFAULT," ",true)}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.centerDivider}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.rightSide,children:p||d||k?m(t.rightLineNumber,t.rightContent,d?_lineDiff.DiffType.ADDED:t.type,p||d?"+":" "):m(void 0,void 0,_lineDiff.DiffType.DEFAULT," ",true)})]})]},o)};const V=g.filter(t=>t.type===_lineDiff.DiffType.ADDED).length;const v=g.filter(t=>t.type===_lineDiff.DiffType.REMOVED).length;const B=g.filter(t=>t.type===_lineDiff.DiffType.MODIFIED).length;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[e.container,r.glowColor&&{shadowColor:r.glowColor,shadowOffset:{width:0,height:0},shadowOpacity:r.neonIntensity&&r.neonIntensity>.7?.5:r.neonIntensity&&r.neonIntensity>.3?.3:.1,shadowRadius:r.neonIntensity&&r.neonIntensity>.7?10:r.neonIntensity&&r.neonIntensity>.3?5:2}],children:[D&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:e.themeBadge,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.themeName,children:r.name}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.themeDescription,children:r.description})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:e.header,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.headerLeft,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.headerTitle,children:"PREV"})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.divider}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.headerRight,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.headerTitle,children:"CUR"})})]}),(0,_jsxRuntime.jsx)(_DiffSummary.DiffSummary,{added:V,removed:v,modified:B,theme:r}),(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{style:e.scrollView,showsVerticalScrollIndicator:false,contentContainerStyle:e.scrollContent,children:g.length===0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:e.emptyState,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:e.emptyText,children:a?"No differences found":"No content to display"})}):g.map((t,o)=>S(t,o,g))})]})});function createDynamicStyles(n,y){return _reactNative.StyleSheet.create({container:{height:y,backgroundColor:n.background,borderRadius:8,overflow:"hidden",borderWidth:1,borderColor:n.borderColor},themeBadge:{backgroundColor:n.panelBackground,paddingHorizontal:12,paddingVertical:8,borderBottomWidth:1,borderBottomColor:n.borderColor},themeName:{fontSize:12,fontWeight:"700",color:n.accentColor||n.unchangedText,fontFamily:_fonts.monoFont,letterSpacing:.5},themeDescription:{fontSize:10,color:n.unchangedText,fontFamily:_fonts.monoFont,marginTop:2,opacity:.8},header:{flexDirection:"row",backgroundColor:n.headerBackground,borderBottomWidth:1,borderBottomColor:n.borderColor},headerLeft:{flex:1,paddingVertical:8,paddingHorizontal:12},headerRight:{flex:1,paddingVertical:8,paddingHorizontal:12},headerTitle:{fontSize:10,fontWeight:"700",color:n.accentColor||n.unchangedText,fontFamily:_fonts.monoFont,letterSpacing:.5,textTransform:"uppercase"},divider:{width:1,backgroundColor:n.dividerColor},scrollView:{flex:1},scrollContent:{paddingBottom:10},row:{flexDirection:"row",minHeight:20},leftSide:{flex:1,flexDirection:"row"},rightSide:{flex:1,flexDirection:"row"},centerDivider:{width:1,backgroundColor:n.dividerColor},gutter:{width:35,paddingHorizontal:4,justifyContent:"center",alignItems:"flex-end",backgroundColor:n.lineNumberBackground,borderRightWidth:1,borderRightColor:n.lineNumberBorder},emptyGutter:{backgroundColor:n.contextBackground},lineNumber:{fontSize:9,fontFamily:_fonts.monoFont,color:n.lineNumberText},marker:{width:20,justifyContent:"center",alignItems:"center"},emptyMarker:{backgroundColor:n.contextBackground},markerText:{fontSize:10,fontFamily:_fonts.monoFont,fontWeight:"600"},contentCell:{flex:1,paddingHorizontal:8,paddingVertical:2},emptyContent:{backgroundColor:n.contextBackground},content:{fontSize:10,fontFamily:_fonts.monoFont,lineHeight:16},wordDiff:{fontSize:10,fontFamily:_fonts.monoFont},separator:{height:20,justifyContent:"center",alignItems:"center",backgroundColor:n.separatorBackground},separatorText:{fontSize:8,color:n.separatorText,fontFamily:_fonts.monoFont,letterSpacing:2},emptyState:{padding:40,alignItems:"center",justifyContent:"center"},emptyText:{fontSize:11,color:n.emptyStateText,fontStyle:"italic",fontFamily:_fonts.monoFont}})}