@git-diff-view/react 0.0.9 → 0.0.11

package/dist/cjs/index.development.js

@@ -392,7 +392,7 @@ _File_instances = new WeakSet(), _File_doCheck = function _File_doCheck() {
     }
 };
 const getFile = (raw, lang, fileName) => {
-    const key = raw + "--" + "0.0.9" + "--" + lang;
+    const key = raw + "--" + "0.0.11" + "--" + lang;
     if (map.has(key))
         return map.get(key);
     const file = new File(raw, lang, fileName);
@@ -401,6 +401,13 @@ const getFile = (raw, lang, fileName) => {
 };
 const _cacheMap = map;
 
+exports.NewLineSymbol = void 0;
+(function (NewLineSymbol) {
+    NewLineSymbol[NewLineSymbol["CRLF"] = 1] = "CRLF";
+    NewLineSymbol[NewLineSymbol["CR"] = 2] = "CR";
+    NewLineSymbol[NewLineSymbol["LF"] = 3] = "LF";
+    NewLineSymbol[NewLineSymbol["NEWLINE"] = 4] = "NEWLINE";
+})(exports.NewLineSymbol || (exports.NewLineSymbol = {}));
 const maxLength = 1000;
 /** Get the maximum position in the range. */
 function rangeMax(range) {
@@ -424,25 +431,41 @@ function commonLength(stringA, rangeA, stringB, rangeB, reverse) {
 function isInValidString(s) {
     return s.trim().length === 0 || s.length >= maxLength;
 }
+// TODO maybe could use the original content line
 /** Get the changed ranges in the strings, relative to each other. */
-function relativeChanges(stringA, stringB) {
+function relativeChanges(addition, deletion) {
+    const stringA = addition.text;
+    const stringB = deletion.text;
     let bRange = { location: 0, length: stringB.length };
     let aRange = { location: 0, length: stringA.length };
     const _stringA = stringA.trimEnd();
     const _stringB = stringB.trimEnd();
     const aEndStr = stringA.slice(-2);
     const bEndStr = stringB.slice(-2);
-    if (_stringA === _stringB && aEndStr !== bEndStr && (aEndStr === "\r\n" || bEndStr === "\r\n")) {
+    const hasNewLineChanged = addition.noTrailingNewLine !== deletion.noTrailingNewLine;
+    if (_stringA === _stringB && (hasNewLineChanged || aEndStr !== bEndStr)) {
         return {
             stringARange: {
                 location: _stringA.length,
                 length: stringA.length - _stringA.length,
-                isNewLineSymbolChanged: true,
+                newLineSymbol: hasNewLineChanged
+                    ? exports.NewLineSymbol.NEWLINE
+                    : aEndStr === "\r\n"
+                        ? exports.NewLineSymbol.CRLF
+                        : aEndStr.endsWith("\r")
+                            ? exports.NewLineSymbol.CR
+                            : exports.NewLineSymbol.LF,
             },
             stringBRange: {
                 location: _stringB.length,
                 length: stringB.length - _stringB.length,
-                isNewLineSymbolChanged: true,
+                newLineSymbol: hasNewLineChanged
+                    ? exports.NewLineSymbol.NEWLINE
+                    : bEndStr === "\r\n"
+                        ? exports.NewLineSymbol.CRLF
+                        : bEndStr.endsWith("\r")
+                            ? exports.NewLineSymbol.CR
+                            : exports.NewLineSymbol.LF,
             },
         };
     }
@@ -466,10 +489,12 @@ function relativeChanges(stringA, stringB) {
     return { stringARange: aRange, stringBRange: bRange };
 }
 /** Check two string have a diff range */
-function hasRelativeChange(stringA, stringB) {
-    const _stringA = stringA.trim();
-    const _stringB = stringB.trim();
-    const { stringARange, stringBRange } = relativeChanges(_stringA, _stringB);
+function hasRelativeChange(addition, deletion) {
+    const _stringA = addition.text.trim();
+    const _stringB = deletion.text.trim();
+    const _addition = addition.clone(_stringA);
+    const _deletion = deletion.clone(_stringB);
+    const { stringARange, stringBRange } = relativeChanges(_addition, _deletion);
     return (stringARange.location > 0 ||
         stringBRange.location > 0 ||
         stringARange.length < _stringA.length ||
@@ -517,6 +542,9 @@ class DiffLine {
             this.newLineNumber === other.newLineNumber &&
             this.noTrailingNewLine === other.noTrailingNewLine);
     }
+    clone(text) {
+        return new DiffLine(text, this.type, this.originalLineNumber, this.oldLineNumber, this.newLineNumber);
+    }
 }
 const checkDiffLineIncludeChange = (diffLine) => {
     if (!diffLine)
@@ -677,9 +705,9 @@ const getDiffRange = (additions, deletions) => {
         for (let i = 0; i < len; i++) {
             const addition = additions[i];
             const deletion = deletions[i];
-            const hasDiffRange = hasRelativeChange(addition.text, deletion.text);
+            const hasDiffRange = hasRelativeChange(addition, deletion);
             if (hasDiffRange) {
-                const { stringARange, stringBRange } = relativeChanges(addition.text, deletion.text);
+                const { stringARange, stringBRange } = relativeChanges(addition, deletion);
                 addition.needRematch = true;
                 addition.range = stringARange;
                 deletion.needRematch = true;
@@ -1064,7 +1092,7 @@ class DiffFile {
         _DiffFile_updateCount.set(this, 0);
         _DiffFile_composeByDiff.set(this, false);
         _DiffFile_highlighterName.set(this, void 0);
-        this._version_ = "0.0.9";
+        this._version_ = "0.0.11";
         this._oldFileContent = "";
         this._oldFileLang = "";
         this._newFileContent = "";
@@ -1810,31 +1838,33 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
         let oldLineNumber = 1;
         let oldFileContent = "";
         let newFileContent = "";
-        while (oldLineNumber <= this.diffLineLength) {
-            const index = oldLineNumber++;
-            const diffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldDiffLine).call(this, index);
-            if (diffLine) {
-                oldFileContent += diffLine.text;
+        let hasSymbolChanged = false;
+        while (oldLineNumber <= this.diffLineLength || newLineNumber <= this.diffLineLength) {
+            const oldIndex = oldLineNumber++;
+            const newIndex = newLineNumber++;
+            const oldDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldDiffLine).call(this, oldIndex);
+            const newDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewDiffLine).call(this, newIndex);
+            if (oldDiffLine) {
+                oldFileContent += oldDiffLine.text;
             }
             else {
                 // empty line for placeholder
                 oldFileContent += "\n";
-                oldFilePlaceholderLines[index] = true;
+                oldFilePlaceholderLines[oldIndex] = true;
             }
-        }
-        while (newLineNumber <= this.diffLineLength) {
-            const index = newLineNumber++;
-            const diffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewDiffLine).call(this, index);
-            if (diffLine) {
-                newFileContent += diffLine.text;
+            if (newDiffLine) {
+                newFileContent += newDiffLine.text;
             }
             else {
                 // empty line for placeholder
                 newFileContent += "\n";
-                newFilePlaceholderLines[index] = true;
+                newFilePlaceholderLines[newIndex] = true;
+            }
+            if (!hasSymbolChanged && oldDiffLine && newDiffLine) {
+                hasSymbolChanged = hasSymbolChanged || oldDiffLine.noTrailingNewLine !== newDiffLine.noTrailingNewLine;
             }
         }
-        if (oldFileContent === newFileContent)
+        if (!hasSymbolChanged && oldFileContent === newFileContent)
             return;
         this._oldFileContent = oldFileContent;
         this._newFileContent = newFileContent;
@@ -1849,17 +1879,25 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
         let newLineNumber = 1;
         let oldLineNumber = 1;
         let newFileContent = "";
+        let hasSymbolChanged = false;
         while (oldLineNumber <= __classPrivateFieldGet(this, _DiffFile_oldFileResult, "f").maxLineNumber) {
             const newDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewDiffLine).call(this, newLineNumber++);
+            const oldDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldDiffLine).call(this, oldLineNumber);
             if (newDiffLine) {
                 newFileContent += newDiffLine.text;
                 oldLineNumber = newDiffLine.oldLineNumber ? newDiffLine.oldLineNumber + 1 : oldLineNumber;
             }
             else {
-                newFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldRawLine).call(this, oldLineNumber++);
+                if (!oldDiffLine) {
+                    newFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldRawLine).call(this, oldLineNumber);
+                }
+                oldLineNumber++;
+            }
+            if (!hasSymbolChanged && newDiffLine && oldDiffLine) {
+                hasSymbolChanged = hasSymbolChanged || newDiffLine.noTrailingNewLine !== oldDiffLine.noTrailingNewLine;
             }
         }
-        if (newFileContent === this._oldFileContent)
+        if (!hasSymbolChanged && newFileContent === this._oldFileContent)
             return;
         this._newFileContent = newFileContent;
         __classPrivateFieldSet(this, _DiffFile_newFileResult, getFile(this._newFileContent, this._newFileLang, this._newFileName), "f");
@@ -1868,17 +1906,25 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
         let oldLineNumber = 1;
         let newLineNumber = 1;
         let oldFileContent = "";
+        let hasSymbolChanged = false;
         while (newLineNumber <= __classPrivateFieldGet(this, _DiffFile_newFileResult, "f").maxLineNumber) {
             const oldDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldDiffLine).call(this, oldLineNumber++);
+            const newDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewDiffLine).call(this, newLineNumber);
             if (oldDiffLine) {
                 oldFileContent += oldDiffLine.text;
                 newLineNumber = oldDiffLine.newLineNumber ? oldDiffLine.newLineNumber + 1 : newLineNumber;
             }
             else {
-                oldFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewRawLine).call(this, newLineNumber++);
+                if (!newDiffLine) {
+                    oldFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewRawLine).call(this, newLineNumber);
+                }
+                newLineNumber++;
+            }
+            if (!hasSymbolChanged && newDiffLine && oldDiffLine) {
+                hasSymbolChanged = hasSymbolChanged || newDiffLine.noTrailingNewLine !== oldDiffLine.noTrailingNewLine;
             }
         }
-        if (oldFileContent === this._newFileContent)
+        if (!hasSymbolChanged && oldFileContent === this._newFileContent)
             return;
         this._oldFileContent = oldFileContent;
         __classPrivateFieldSet(this, _DiffFile_oldFileResult, getFile(this._oldFileContent, this._oldFileLang, this._oldFileName), "f");
@@ -2076,7 +2122,7 @@ const getUnifiedContentLine = (diffFile) => {
     return lines.filter((line) => line.type === exports.DiffFileLineType.content);
 };
 
-const versions = "0.0.9";
+const versions = "0.0.11";
 
 const useUnmount = (cb, deps) => {
     const ref = React.useRef(cb);
@@ -2174,14 +2220,18 @@ const useDomWidth = ({ selector, enable }) => {
 
 exports.DiffModeEnum = void 0;
 (function (DiffModeEnum) {
-    DiffModeEnum[DiffModeEnum["Split"] = 1] = "Split";
-    DiffModeEnum[DiffModeEnum["Unified"] = 2] = "Unified";
+    // github like
+    DiffModeEnum[DiffModeEnum["SplitGitHub"] = 1] = "SplitGitHub";
+    // gitlab like
+    DiffModeEnum[DiffModeEnum["SplitGitLab"] = 2] = "SplitGitLab";
+    DiffModeEnum[DiffModeEnum["Split"] = 3] = "Split";
+    DiffModeEnum[DiffModeEnum["Unified"] = 4] = "Unified";
 })(exports.DiffModeEnum || (exports.DiffModeEnum = {}));
 const DiffViewContext = React.createContext(null);
 DiffViewContext.displayName = "DiffViewContext";
 const useDiffViewContext = () => React.useContext(DiffViewContext);
 
-const useSyncHeight = ({ selector, side, enable, }) => {
+const useSyncHeight = ({ selector, side, enable }) => {
     const { useDiffContext } = useDiffViewContext();
     const id = useDiffContext(React.useCallback((s) => s.id, []));
     useSafeLayout(() => {
@@ -2366,7 +2416,7 @@ const memoFunc = (func) => {
 };
 const asideWidth = "--diff-aside-width--";
 
-const _DiffSplitHunkLine = ({ index, diffFile, side, lineNumber, }) => {
+const _DiffSplitHunkLineGitHub = ({ index, diffFile, side, lineNumber, }) => {
     var _a;
     const currentHunk = diffFile.getSplitHunkLine(index);
     const expandEnabled = diffFile.getExpandEnabled();
@@ -2405,6 +2455,55 @@ const _DiffSplitHunkLine = ({ index, diffFile, side, lineNumber, }) => {
                 } }, ((_a = currentHunk.splitInfo) === null || _a === void 0 ? void 0 : _a.plainText) || currentHunk.text)))) : (React__namespace.createElement("td", { className: "diff-line-hunk-placeholder select-none", colSpan: 2, style: { backgroundColor: `var(${hunkContentBGName})` } },
         React__namespace.createElement("div", { className: "min-h-[28px]" }, "\u2002")))));
 };
+const _DiffSplitHunkLineGitLab = ({ index, diffFile, side, lineNumber, }) => {
+    var _a;
+    const currentHunk = diffFile.getSplitHunkLine(index);
+    const expandEnabled = diffFile.getExpandEnabled();
+    useSyncHeight({
+        selector: `tr[data-line="${lineNumber}-hunk"]`,
+        side: exports.SplitSide[exports.SplitSide.old],
+        enable: side === exports.SplitSide.new,
+    });
+    const couldExpand = expandEnabled && currentHunk && currentHunk.splitInfo;
+    const isExpandAll = currentHunk &&
+        currentHunk.splitInfo &&
+        currentHunk.splitInfo.endHiddenIndex - currentHunk.splitInfo.startHiddenIndex < composeLen;
+    const isFirstLine = currentHunk && currentHunk.index === 0;
+    const isLastLine = currentHunk && currentHunk.isLast;
+    return (React__namespace.createElement("tr", { "data-line": `${lineNumber}-hunk`, "data-state": "hunk", "data-side": exports.SplitSide[side], className: "diff-line diff-line-hunk" },
+        React__namespace.createElement("td", { className: "diff-line-hunk-action sticky left-0 p-[1px] w-[1%] min-w-[40px] select-none", style: {
+                backgroundColor: `var(${hunkLineNumberBGName})`,
+                color: `var(${plainLineNumberColorName})`,
+                width: `var(${asideWidth})`,
+                minWidth: `var(${asideWidth})`,
+                maxWidth: `var(${asideWidth})`,
+            } }, couldExpand ? (isFirstLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+            React__namespace.createElement(ExpandUp, { className: "fill-current" }))) : isLastLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px] relative", title: "Expand Down", "data-title": "Expand Down", onClick: () => {
+                diffFile.onSplitHunkExpand("down", index);
+            } },
+            React__namespace.createElement(ExpandDown, { className: "fill-current" }))) : isExpandAll ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand All", "data-title": "Expand All", onClick: () => diffFile.onSplitHunkExpand("all", index) },
+            React__namespace.createElement(ExpandAll, { className: "fill-current" }))) : (React__namespace.createElement(React__namespace.Fragment, null,
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Down", "data-title": "Expand Down", onClick: () => diffFile.onSplitHunkExpand("down", index) },
+                React__namespace.createElement(ExpandDown, { className: "fill-current" })),
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+                React__namespace.createElement(ExpandUp, { className: "fill-current" }))))) : (React__namespace.createElement("div", { className: "min-h-[28px]" }, "\u2002"))),
+        React__namespace.createElement("td", { className: "diff-line-hunk-content pr-[10px] align-middle", style: { backgroundColor: `var(${hunkContentBGName})` } },
+            React__namespace.createElement("div", { className: "pl-[1.5em]", style: {
+                    color: `var(${hunkContentColorName})`,
+                } }, ((_a = currentHunk.splitInfo) === null || _a === void 0 ? void 0 : _a.plainText) || currentHunk.text))));
+};
+const _DiffSplitHunkLine = ({ index, diffFile, side, lineNumber, }) => {
+    const { useDiffContext } = useDiffViewContext();
+    const diffViewMode = useDiffContext(React__namespace.useCallback((s) => s.mode, []));
+    if (diffViewMode === exports.DiffModeEnum.SplitGitHub ||
+        diffViewMode === exports.DiffModeEnum.Split ||
+        diffViewMode === exports.DiffModeEnum.Unified) {
+        return React__namespace.createElement(_DiffSplitHunkLineGitHub, { index: index, diffFile: diffFile, side: side, lineNumber: lineNumber });
+    }
+    else {
+        return React__namespace.createElement(_DiffSplitHunkLineGitLab, { index: index, diffFile: diffFile, side: side, lineNumber: lineNumber });
+    }
+};
 const DiffSplitHunkLine$1 = ({ index, diffFile, side, lineNumber, }) => {
     const currentHunk = diffFile.getSplitHunkLine(index);
     const currentIsShow = currentHunk &&
@@ -2418,8 +2517,8 @@ const DiffSplitHunkLine$1 = ({ index, diffFile, side, lineNumber, }) => {
 
 const DiffSplitAddWidget = ({ side, className, lineNumber, onWidgetClick, onOpenAddWidget, }) => {
     return (React__namespace.createElement("div", { className: "diff-add-widget-wrapper" + (className ? " " + className : ""), style: {
-            width: "calc(var(--diff-font-size--) * 1.4)",
-            height: "calc(var(--diff-font-size--) * 1.4)",
+            width: `calc(var(${diffFontSizeName}) * 1.4)`,
+            height: `calc(var(${diffFontSizeName}) * 1.4)`,
         } },
         React__namespace.createElement("button", { className: "diff-add-widget w-full h-full invisible cursor-pointer rounded-md flex items-center justify-center transition-transform origin-center group-hover:visible hover:scale-110", style: {
                 color: `var(${addWidgetColorName})`,
@@ -2433,8 +2532,8 @@ const DiffSplitAddWidget = ({ side, className, lineNumber, onWidgetClick, onOpen
 };
 const DiffUnifiedAddWidget = ({ lineNumber, side, onWidgetClick, onOpenAddWidget, }) => {
     return (React__namespace.createElement("div", { className: "diff-add-widget-wrapper absolute left-[100%] top-[1px] translate-x-[-50%]", style: {
-            width: "calc(var(--diff-font-size--) * 1.4)",
-            height: "calc(var(--diff-font-size--) * 1.4)",
+            width: `calc(var(${diffFontSizeName}) * 1.4)`,
+            height: `calc(var(${diffFontSizeName}) * 1.4)`,
         } },
         React__namespace.createElement("button", { className: "diff-add-widget w-full h-full invisible cursor-pointer rounded-md flex items-center justify-center transition-transform origin-center group-hover:visible hover:scale-110", style: {
                 color: `var(${addWidgetColorName})`,
@@ -2447,6 +2546,12 @@ const DiffUnifiedAddWidget = ({ lineNumber, side, onWidgetClick, onOpenAddWidget
             } }, "+")));
 };
 
+const DiffNoNewLine = () => {
+    return (React__namespace.createElement("svg", { "aria-label": "No newline at end of file", role: "img", viewBox: "0 0 16 16", version: "1.1", fill: "currentColor" },
+        React__namespace.createElement("path", { d: "M4.25 7.25a.75.75 0 0 0 0 1.5h7.5a.75.75 0 0 0 0-1.5h-7.5Z" }),
+        React__namespace.createElement("path", { d: "M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0Zm-1.5 0a6.5 6.5 0 1 0-13 0 6.5 6.5 0 0 0 13 0Z" })));
+};
+
 const temp = {};
 const formatStringToCamelCase = (str) => {
     const splitted = str.split("-");
@@ -2471,38 +2576,46 @@ const getStyleObjectFromString = memoFunc((str) => {
     });
     return style;
 });
-const DiffString = ({ rawLine, diffLine, operator, }) => {
+const DiffString = ({ rawLine, diffLine, operator, enableWrap, }) => {
     const range = diffLine === null || diffLine === void 0 ? void 0 : diffLine.range;
     if (range) {
         const str1 = rawLine.slice(0, range.location);
         const str2 = rawLine.slice(range.location, range.location + range.length);
         const str3 = rawLine.slice(range.location + range.length);
-        const isNewLineSymbolChanged = range.isNewLineSymbolChanged;
+        const isLast = str2.includes("\n");
+        const _str2 = isLast ? str2.replace("\n", "") : str2;
+        const isNewLineSymbolChanged = range.newLineSymbol;
         return (React__namespace.createElement("span", { className: "diff-line-content-raw" },
             React__namespace.createElement("span", { "data-range-start": range.location, "data-range-end": range.location + range.length },
                 str1,
                 React__namespace.createElement("span", { "data-diff-highlight": true, className: "rounded-[0.2em]", style: {
                         backgroundColor: operator === "add" ? `var(${addContentHighlightBGName})` : `var(${delContentHighlightBGName})`,
-                    } }, isNewLineSymbolChanged
-                    ? str2 === "\r"
-                        ? "␍"
-                        : str2 === "\n"
-                            ? "␊"
-                            : str2 === "\r\n"
+                    } }, isLast
+                    ? `${_str2}${isNewLineSymbolChanged === exports.NewLineSymbol.LF
+                        ? "␊"
+                        : isNewLineSymbolChanged === exports.NewLineSymbol.CR
+                            ? "␍"
+                            : isNewLineSymbolChanged === exports.NewLineSymbol.CRLF
                                 ? "␍␊"
-                                : str2
+                                : ""}`
                     : str2),
-                str3)));
+                str3),
+            isNewLineSymbolChanged === exports.NewLineSymbol.NEWLINE && diffLine.noTrailingNewLine && (React__namespace.createElement("span", { "data-no-newline-at-end-of-file": true, className: enableWrap ? "block text-red-500" : "inline-block align-middle text-red-500", style: {
+                    width: `var(${diffFontSizeName})`,
+                    height: `var(${diffFontSizeName})`,
+                } },
+                React__namespace.createElement(DiffNoNewLine, null)))));
     }
     return React__namespace.createElement("span", { className: "diff-line-content-raw" }, rawLine);
 };
-const DiffSyntax = ({ rawLine, diffLine, operator, syntaxLine, }) => {
+const DiffSyntax = ({ rawLine, diffLine, operator, syntaxLine, enableWrap, }) => {
     var _a, _b;
     if (!syntaxLine) {
         return React__namespace.createElement(DiffString, { rawLine: rawLine, diffLine: diffLine, operator: operator });
     }
     const range = diffLine === null || diffLine === void 0 ? void 0 : diffLine.range;
     if (range) {
+        const isNewLineSymbolChanged = range.newLineSymbol;
         return (React__namespace.createElement("span", { className: "diff-line-syntax-raw" },
             React__namespace.createElement("span", { "data-range-start": range.location, "data-range-end": range.location + range.length }, (_a = syntaxLine.nodeList) === null || _a === void 0 ? void 0 : _a.map(({ node, wrapper }, index) => {
                 var _a, _b, _c, _d, _e, _f;
@@ -2517,27 +2630,33 @@ const DiffSyntax = ({ rawLine, diffLine, operator, syntaxLine, }) => {
                     const str3 = node.value.slice(index1 + range.length);
                     const isStart = str1.length || range.location === node.startIndex;
                     const isEnd = str3.length || node.endIndex === range.location + range.length - 1;
-                    const isNewLineSymbolChanged = range.isNewLineSymbolChanged;
+                    const isLast = str2.includes("\n");
+                    const _str2 = isLast ? str2.replace("\n", "") : str2;
                     return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_e = (_d = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _d === void 0 ? void 0 : _d.className) === null || _e === void 0 ? void 0 : _e.join(" "), style: getStyleObjectFromString(((_f = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _f === void 0 ? void 0 : _f.style) || "") },
                         str1,
                         React__namespace.createElement("span", { "data-diff-highlight": true, style: {
                                 backgroundColor: operator === "add" ? `var(${addContentHighlightBGName})` : `var(${delContentHighlightBGName})`,
                                 borderTopLeftRadius: isStart ? "0.2em" : undefined,
                                 borderBottomLeftRadius: isStart ? "0.2em" : undefined,
-                                borderTopRightRadius: isEnd ? "0.2em" : undefined,
-                                borderBottomRightRadius: isEnd ? "0.2em" : undefined,
-                            } }, isNewLineSymbolChanged
-                            ? str2 === "\r"
-                                ? "␍"
-                                : str2 === "\n"
-                                    ? "␊"
-                                    : str2 === "\r\n"
+                                borderTopRightRadius: isEnd || isLast ? "0.2em" : undefined,
+                                borderBottomRightRadius: isEnd || isLast ? "0.2em" : undefined,
+                            } }, isLast
+                            ? `${_str2}${isNewLineSymbolChanged === exports.NewLineSymbol.LF
+                                ? "␊"
+                                : isNewLineSymbolChanged === exports.NewLineSymbol.CR
+                                    ? "␍"
+                                    : isNewLineSymbolChanged === exports.NewLineSymbol.CRLF
                                         ? "␍␊"
-                                        : str2
+                                        : ""}`
                             : str2),
                         str3));
                 }
-            }))));
+            })),
+            isNewLineSymbolChanged === exports.NewLineSymbol.NEWLINE && diffLine.noTrailingNewLine && (React__namespace.createElement("span", { "data-no-newline-at-end-of-file": true, className: enableWrap ? "block text-red-500" : "inline-block align-middle text-red-500", style: {
+                    width: `var(${diffFontSizeName})`,
+                    height: `var(${diffFontSizeName})`,
+                } },
+                React__namespace.createElement(DiffNoNewLine, null)))));
     }
     return (React__namespace.createElement("span", { className: "diff-line-syntax-raw" }, (_b = syntaxLine === null || syntaxLine === void 0 ? void 0 : syntaxLine.nodeList) === null || _b === void 0 ? void 0 : _b.map(({ node, wrapper }, index) => {
         var _a, _b, _c;
@@ -2554,7 +2673,7 @@ const DiffContent = ({ diffLine, rawLine, syntaxLine, enableWrap, enableHighligh
             wordBreak: enableWrap ? "break-all" : "initial",
         } },
         React__namespace.createElement("span", { "data-operator": isAdded ? "+" : isDelete ? "-" : undefined, className: "diff-line-content-operator inline-block w-[1.5em] ml-[-1.5em] indent-[0.2em] select-none" }, isAdded ? "+" : isDelete ? "-" : " "),
-        enableHighlight && syntaxLine && !isMaxLineLengthToIgnoreSyntax ? (React__namespace.createElement(DiffSyntax, { operator: isAdded ? "add" : isDelete ? "del" : undefined, rawLine: rawLine, diffLine: diffLine, syntaxLine: syntaxLine })) : (React__namespace.createElement(DiffString, { operator: isAdded ? "add" : isDelete ? "del" : undefined, rawLine: rawLine, diffLine: diffLine }))));
+        enableHighlight && syntaxLine && !isMaxLineLengthToIgnoreSyntax ? (React__namespace.createElement(DiffSyntax, { operator: isAdded ? "add" : isDelete ? "del" : undefined, rawLine: rawLine, diffLine: diffLine, syntaxLine: syntaxLine, enableWrap: enableWrap })) : (React__namespace.createElement(DiffString, { operator: isAdded ? "add" : isDelete ? "del" : undefined, rawLine: rawLine, diffLine: diffLine, enableWrap: enableWrap }))));
 };
 
 const DiffWidgetContext = React.createContext(null);
@@ -2698,21 +2817,21 @@ const DiffSplitViewNormal = React.memo(({ diffFile }) => {
     });
     const width = Math.max(40, _width + 25);
     return (React__namespace.createElement("div", { className: "split-diff-view split-diff-view-wrap w-full flex basis-[50%]" },
-        React__namespace.createElement("div", { className: "old-diff-table-wrapper overflow-auto w-full scrollbar-hide scrollbar-disable", ref: ref1, style: {
+        React__namespace.createElement("div", { className: "old-diff-table-wrapper overflow-x-auto overflow-y-hidden w-full scrollbar-hide scrollbar-disable", ref: ref1, style: {
                 // @ts-ignore
                 [asideWidth]: `${Math.round(width)}px`,
                 overscrollBehaviorX: "none",
                 fontFamily: "Menlo, Consolas, monospace",
-                fontSize: "var(--diff-font-size--)",
+                fontSize: `var(${diffFontSizeName})`,
             } },
             React__namespace.createElement(DiffSplitViewTable, { side: exports.SplitSide.old, diffFile: diffFile })),
-        React__namespace.createElement("div", { className: "diff-split-line w-[1.5px] bg-[#ccc]" }),
-        React__namespace.createElement("div", { className: "new-diff-table-wrapper overflow-auto w-full scrollbar-hide scrollbar-disable", ref: ref2, style: {
+        React__namespace.createElement("div", { className: "diff-split-line w-[1.5px] bg-[rgb(222,222,222)]" }),
+        React__namespace.createElement("div", { className: "new-diff-table-wrapper overflow-x-auto overflow-y-hidden w-full scrollbar-hide scrollbar-disable", ref: ref2, style: {
                 // @ts-ignore
                 [asideWidth]: `${Math.round(width)}px`,
                 overscrollBehaviorX: "none",
                 fontFamily: "Menlo, Consolas, monospace",
-                fontSize: "var(--diff-font-size--)",
+                fontSize: `var(${diffFontSizeName})`,
             } },
             React__namespace.createElement(DiffSplitViewTable, { side: exports.SplitSide.new, diffFile: diffFile }))));
 });
@@ -2737,7 +2856,7 @@ const _DiffSplitExtendLine = ({ index, diffFile, lineNumber, oldLineExtend, newL
                     onUpdate: diffFile.notifyAll,
                 }))))) : (React__namespace.createElement("td", { className: "diff-line-extend-old-placeholder p-0 select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002"))),
-        newLineExtend ? (React__namespace.createElement("td", { className: "diff-line-extend-new-content p-0 border-l-[1px] border-l-[#ccc]", colSpan: 2 },
+        newLineExtend ? (React__namespace.createElement("td", { className: "diff-line-extend-new-content p-0 border-l-[1px] border-l-[rgb(222,222,222)]", colSpan: 2 },
             React__namespace.createElement("div", { className: "diff-line-extend-wrapper" }, (newLineExtend === null || newLineExtend === void 0 ? void 0 : newLineExtend.data) &&
                 (renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
                     diffFile,
@@ -2745,7 +2864,7 @@ const _DiffSplitExtendLine = ({ index, diffFile, lineNumber, oldLineExtend, newL
                     lineNumber: newLine.lineNumber,
                     data: newLineExtend.data,
                     onUpdate: diffFile.notifyAll,
-                }))))) : (React__namespace.createElement("td", { className: "diff-line-extend-new-placeholder p-0 border-l-[1px] border-l-[#ccc] select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
+                }))))) : (React__namespace.createElement("td", { className: "diff-line-extend-new-placeholder p-0 border-l-[1px] border-l-[rgb(222,222,222)] select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002")))));
 };
 const DiffSplitExtendLine = ({ index, diffFile, lineNumber, }) => {
@@ -2768,7 +2887,7 @@ const DiffSplitExtendLine = ({ index, diffFile, lineNumber, }) => {
     return (React__namespace.createElement(_DiffSplitExtendLine, { index: index, diffFile: diffFile, lineNumber: lineNumber, oldLineExtend: oldLineExtend, newLineExtend: newLineExtend }));
 };
 
-const DiffSplitHunkLine = ({ index, diffFile, lineNumber, }) => {
+const DiffSplitHunkLineGitHub = ({ index, diffFile, lineNumber, }) => {
     var _a;
     const currentHunk = diffFile.getSplitHunkLine(index);
     const expandEnabled = diffFile.getExpandEnabled();
@@ -2801,6 +2920,66 @@ const DiffSplitHunkLine = ({ index, diffFile, lineNumber, }) => {
                     color: `var(${hunkContentColorName})`,
                 } }, ((_a = currentHunk.splitInfo) === null || _a === void 0 ? void 0 : _a.plainText) || currentHunk.text))));
 };
+const DiffSplitHunkLineGitLab = ({ index, diffFile, lineNumber, }) => {
+    var _a, _b;
+    const currentHunk = diffFile.getSplitHunkLine(index);
+    const expandEnabled = diffFile.getExpandEnabled();
+    const couldExpand = expandEnabled && currentHunk && currentHunk.splitInfo;
+    const isExpandAll = currentHunk &&
+        currentHunk.splitInfo &&
+        currentHunk.splitInfo.endHiddenIndex - currentHunk.splitInfo.startHiddenIndex < composeLen;
+    const currentIsShow = currentHunk &&
+        currentHunk.splitInfo &&
+        currentHunk.splitInfo.startHiddenIndex < currentHunk.splitInfo.endHiddenIndex;
+    const currentIsPureHunk = currentHunk && diffFile._getIsPureDiffRender() && !currentHunk.splitInfo;
+    const isFirstLine = currentHunk && currentHunk.index === 0;
+    const isLastLine = currentHunk && currentHunk.isLast;
+    if (!currentIsShow && !currentIsPureHunk)
+        return null;
+    return (React__namespace.createElement("tr", { "data-line": `${lineNumber}-hunk`, "data-state": "hunk", className: "diff-line diff-line-hunk" },
+        React__namespace.createElement("td", { className: "diff-line-hunk-action p-[1px] w-[1%] min-w-[40px] select-none relative", style: {
+                backgroundColor: `var(${hunkLineNumberBGName})`,
+                color: `var(${plainLineNumberColorName})`,
+            } }, couldExpand ? (isFirstLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+            React__namespace.createElement(ExpandUp, { className: "fill-current" }))) : isLastLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand Down", "data-title": "Expand Down", onClick: () => diffFile.onSplitHunkExpand("down", index) },
+            React__namespace.createElement(ExpandDown, { className: "fill-current" }))) : isExpandAll ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand All", "data-title": "Expand All", onClick: () => diffFile.onSplitHunkExpand("all", index) },
+            React__namespace.createElement(ExpandAll, { className: "fill-current" }))) : (React__namespace.createElement(React__namespace.Fragment, null,
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Down", "data-title": "Expand Down", onClick: () => diffFile.onSplitHunkExpand("down", index) },
+                React__namespace.createElement(ExpandDown, { className: "fill-current" })),
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+                React__namespace.createElement(ExpandUp, { className: "fill-current" }))))) : (React__namespace.createElement("div", { className: "min-h-[28px]" }, "\u2002"))),
+        React__namespace.createElement("td", { className: "diff-line-hunk-content pr-[10px] align-middle", style: { backgroundColor: `var(${hunkContentBGName})` } },
+            React__namespace.createElement("div", { className: "pl-[1.5em]", style: {
+                    color: `var(${hunkContentColorName})`,
+                } }, ((_a = currentHunk.splitInfo) === null || _a === void 0 ? void 0 : _a.plainText) || currentHunk.text)),
+        React__namespace.createElement("td", { className: "diff-line-hunk-action p-[1px] w-[1%] min-w-[40px] select-none relative border-l-[1px] border-l-[rgb(222,222,222)]", style: {
+                backgroundColor: `var(${hunkLineNumberBGName})`,
+                color: `var(${plainLineNumberColorName})`,
+            } }, couldExpand ? (isFirstLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+            React__namespace.createElement(ExpandUp, { className: "fill-current" }))) : isLastLine ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand Down", "data-title": "Expand Down", onClick: () => diffFile.onSplitHunkExpand("down", index) },
+            React__namespace.createElement(ExpandDown, { className: "fill-current" }))) : isExpandAll ? (React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[6px] cursor-pointer rounded-[2px]", title: "Expand All", "data-title": "Expand All", onClick: () => diffFile.onSplitHunkExpand("all", index) },
+            React__namespace.createElement(ExpandAll, { className: "fill-current" }))) : (React__namespace.createElement(React__namespace.Fragment, null,
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Down", "data-title": "Expand Down", onClick: () => diffFile.onSplitHunkExpand("down", index) },
+                React__namespace.createElement(ExpandDown, { className: "fill-current" })),
+            React__namespace.createElement("button", { className: "w-full diff-widget-tooltip hover:bg-blue-300 flex justify-center items-center py-[2px] cursor-pointer rounded-[2px]", title: "Expand Up", "data-title": "Expand Up", onClick: () => diffFile.onSplitHunkExpand("up", index) },
+                React__namespace.createElement(ExpandUp, { className: "fill-current" }))))) : (React__namespace.createElement("div", { className: "min-h-[28px]" }, "\u2002"))),
+        React__namespace.createElement("td", { className: "diff-line-hunk-content pr-[10px] align-middle", style: { backgroundColor: `var(${hunkContentBGName})` } },
+            React__namespace.createElement("div", { className: "pl-[1.5em]", style: {
+                    color: `var(${hunkContentColorName})`,
+                } }, ((_b = currentHunk.splitInfo) === null || _b === void 0 ? void 0 : _b.plainText) || currentHunk.text))));
+};
+const DiffSplitHunkLine = ({ index, diffFile, lineNumber, }) => {
+    const { useDiffContext } = useDiffViewContext();
+    const diffViewMode = useDiffContext(React__namespace.useCallback((s) => s.mode, []));
+    if (diffViewMode === exports.DiffModeEnum.SplitGitHub ||
+        diffViewMode === exports.DiffModeEnum.Split ||
+        diffViewMode === exports.DiffModeEnum.Unified) {
+        return React__namespace.createElement(DiffSplitHunkLineGitHub, { index: index, diffFile: diffFile, lineNumber: lineNumber });
+    }
+    else {
+        return React__namespace.createElement(DiffSplitHunkLineGitLab, { index: index, diffFile: diffFile, lineNumber: lineNumber });
+    }
+};
 
 const _DiffSplitLine = ({ index, diffFile, lineNumber }) => {
     var _a, _b;
@@ -2836,12 +3015,12 @@ const _DiffSplitLine = ({ index, diffFile, lineNumber }) => {
                 React__namespace.createElement(DiffContent, { enableWrap: true, diffFile: diffFile, rawLine: oldLine.value, diffLine: oldLine.diff, syntaxLine: oldSyntaxLine, enableHighlight: enableHighlight })))) : (React__namespace.createElement("td", { className: "diff-line-old-placeholder select-none", "data-side": exports.SplitSide[exports.SplitSide.old], style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002"))),
         hasNewLine ? (React__namespace.createElement(React__namespace.Fragment, null,
-            React__namespace.createElement("td", { className: "diff-line-new-num group relative pl-[10px] pr-[10px] text-right align-top select-none w-[1%] min-w-[40px] border-l-[1px] border-l-[#ccc]", "data-side": exports.SplitSide[exports.SplitSide.new], style: { backgroundColor: newLineNumberBG, color: `var(${plainLineNumberColorName})` } },
+            React__namespace.createElement("td", { className: "diff-line-new-num group relative pl-[10px] pr-[10px] text-right align-top select-none w-[1%] min-w-[40px] border-l-[1px] border-l-[rgb(222,222,222)]", "data-side": exports.SplitSide[exports.SplitSide.new], style: { backgroundColor: newLineNumberBG, color: `var(${plainLineNumberColorName})` } },
                 hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: newLine.lineNumber, side: exports.SplitSide.new, diffFile: diffFile, onWidgetClick: (...props) => { var _a; return (_a = onAddWidgetClick.current) === null || _a === void 0 ? void 0 : _a.call(onAddWidgetClick, ...props); }, className: "absolute left-[100%] translate-x-[-50%] z-[1]", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
                 React__namespace.createElement("span", { "data-line-num": newLine.lineNumber, style: { opacity: hasChange ? undefined : 0.5 } }, newLine.lineNumber)),
             React__namespace.createElement("td", { className: "diff-line-new-content group relative pr-[10px] align-top", "data-side": exports.SplitSide[exports.SplitSide.new], style: { backgroundColor: newLineContentBG } },
                 hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: newLine.lineNumber, side: exports.SplitSide.new, diffFile: diffFile, onWidgetClick: (...props) => { var _a; return (_a = onAddWidgetClick.current) === null || _a === void 0 ? void 0 : _a.call(onAddWidgetClick, ...props); }, className: "absolute right-[100%] translate-x-[50%] z-[1] select-none", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
-                React__namespace.createElement(DiffContent, { enableWrap: true, diffFile: diffFile, rawLine: newLine.value || "", diffLine: newLine.diff, syntaxLine: newSyntaxLine, enableHighlight: enableHighlight })))) : (React__namespace.createElement("td", { className: "diff-line-new-placeholder select-none border-l-[1px] border-l-[#ccc]", style: { backgroundColor: `var(${emptyBGName})` }, "data-side": exports.SplitSide[exports.SplitSide.new], colSpan: 2 },
+                React__namespace.createElement(DiffContent, { enableWrap: true, diffFile: diffFile, rawLine: newLine.value || "", diffLine: newLine.diff, syntaxLine: newSyntaxLine, enableHighlight: enableHighlight })))) : (React__namespace.createElement("td", { className: "diff-line-new-placeholder select-none border-l-[1px] border-l-[rgb(222,222,222)]", style: { backgroundColor: `var(${emptyBGName})` }, "data-side": exports.SplitSide[exports.SplitSide.new], colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002")))));
 };
 const DiffSplitLine = ({ index, diffFile, lineNumber, }) => {
@@ -2870,13 +3049,13 @@ const _DiffSplitWidgetLine = ({ index, diffFile, lineNumber, oldLineWidget, newL
                 onClose: () => setWidget({}),
             })))) : (React__namespace.createElement("td", { className: "diff-line-widget-old-placeholder p-0 select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002"))),
-        newLineWidget ? (React__namespace.createElement("td", { className: "diff-line-widget-new-content p-0 border-l-[1px] border-l-[#ccc]", colSpan: 2 },
+        newLineWidget ? (React__namespace.createElement("td", { className: "diff-line-widget-new-content p-0 border-l-[1px] border-l-[rgb(222,222,222)]", colSpan: 2 },
             React__namespace.createElement("div", { className: "diff-line-widget-wrapper" }, renderWidgetLine === null || renderWidgetLine === void 0 ? void 0 : renderWidgetLine({
                 diffFile,
                 side: exports.SplitSide.new,
                 lineNumber: newLine.lineNumber,
                 onClose: () => setWidget({}),
-            })))) : (React__namespace.createElement("td", { className: "diff-line-widget-new-placeholder p-0 border-l-[1px] border-l-[#ccc] select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
+            })))) : (React__namespace.createElement("td", { className: "diff-line-widget-new-placeholder p-0 border-l-[1px] border-l-[rgb(222,222,222)] select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002")))));
 };
 const DiffSplitWidgetLine = ({ index, diffFile, lineNumber, }) => {
@@ -2894,7 +3073,7 @@ const DiffSplitWidgetLine = ({ index, diffFile, lineNumber, }) => {
 
 const Style = ({ useSelector, id, }) => {
     const splitRef = useSelector((s) => s.splitRef);
-    return (React__namespace.createElement("style", null, splitRef === exports.SplitSide.old
+    return (React__namespace.createElement("style", { "data-select-style": true }, splitRef === exports.SplitSide.old
         ? `#${id} td[data-side="${exports.SplitSide[exports.SplitSide.new]}"] {user-select: none}`
         : splitRef === exports.SplitSide.new
             ? `#${id} td[data-side="${exports.SplitSide[exports.SplitSide.old]}"] {user-select: none}`
@@ -2943,7 +3122,7 @@ const DiffSplitViewWrap = React.memo(({ diffFile }) => {
     return (React__namespace.createElement("div", { className: "split-diff-view split-diff-view-normal w-full" },
         React__namespace.createElement("div", { className: "diff-table-wrapper w-full", style: {
                 fontFamily: "Menlo, Consolas, monospace",
-                fontSize: "var(--diff-font-size--)",
+                fontSize: `var(${diffFontSizeName})`,
             } },
             React__namespace.createElement(Style, { useSelector: splitSideInfo, id: `diff-root${diffFile.getId()}` }),
             React__namespace.createElement("table", { className: "diff-table border-collapse table-fixed w-full" },
@@ -3252,11 +3431,11 @@ const DiffUnifiedView = React.memo(({ diffFile }) => {
     const lines = getUnifiedContentLine(diffFile);
     return (React__namespace.createElement(DiffWidgetContext.Provider, { value: contextValue },
         React__namespace.createElement("div", { className: "unified-diff-view w-full" },
-            React__namespace.createElement("div", { className: "unified-diff-table-wrapper overflow-auto w-full scrollbar-hide scrollbar-disable", style: {
+            React__namespace.createElement("div", { className: "unified-diff-table-wrapper overflow-x-auto overflow-y-hidden w-full scrollbar-hide scrollbar-disable", style: {
                     // @ts-ignore
                     [asideWidth]: `${Math.round(width)}px`,
                     fontFamily: "Menlo, Consolas, monospace",
-                    fontSize: "var(--diff-font-size--)",
+                    fontSize: `var(${diffFontSizeName})`,
                 } },
                 React__namespace.createElement("table", { className: "unified-diff-table border-collapse w-full" },
                     React__namespace.createElement("colgroup", null,
@@ -3386,12 +3565,12 @@ const _InternalDiffView = (props) => {
     ]);
     const value = React.useMemo(() => ({ useDiffContext }), [useDiffContext]);
     return (React__namespace.createElement(DiffViewContext.Provider, { value: value },
-        React__namespace.createElement("div", { className: "diff-tailwindcss-wrapper", "data-component": "git-diff-view", "data-version": `${"0.0.9"}`, "data-highlighter": diffFile._getHighlighterName() },
+        React__namespace.createElement("div", { className: "diff-tailwindcss-wrapper", "data-component": "git-diff-view", "data-version": `${"0.0.11"}`, "data-highlighter": diffFile._getHighlighterName() },
             React__namespace.createElement("div", { className: "diff-style-root", style: {
                     // @ts-ignore
                     [diffFontSizeName]: diffViewFontSize + "px",
                 } },
-                React__namespace.createElement("div", { id: `diff-root${diffFileId}`, className: "diff-view-wrapper" + (className ? ` ${className}` : ""), style: style }, diffViewMode === exports.DiffModeEnum.Split ? (React__namespace.createElement(DiffSplitView, { diffFile: diffFile })) : (React__namespace.createElement(DiffUnifiedView, { diffFile: diffFile })))))));
+                React__namespace.createElement("div", { id: `diff-root${diffFileId}`, className: "diff-view-wrapper" + (className ? ` ${className}` : ""), style: style }, diffViewMode & exports.DiffModeEnum.Split ? (React__namespace.createElement(DiffSplitView, { diffFile: diffFile })) : (React__namespace.createElement(DiffUnifiedView, { diffFile: diffFile })))))));
 };
 const InternalDiffView = React.memo(_InternalDiffView);
 const DiffViewWithRef = (props, ref) => {
@@ -3435,11 +3614,11 @@ const DiffViewWithRef = (props, ref) => {
     React.useImperativeHandle(ref, () => ({ getDiffFileInstance: () => diffFile }), [diffFile]);
     if (!diffFile)
         return null;
-    return (React__namespace.createElement(InternalDiffView, Object.assign({ key: diffFile.getId() }, restProps, { diffFile: diffFile, diffViewFontSize: restProps.diffViewFontSize || 14 })));
+    return (React__namespace.createElement(InternalDiffView, Object.assign({ key: diffFile.getId() }, restProps, { diffFile: diffFile, diffViewMode: restProps.diffViewMode || exports.DiffModeEnum.SplitGitHub, diffViewFontSize: restProps.diffViewFontSize || 14 })));
 };
 const DiffView = React.forwardRef(DiffViewWithRef);
 DiffView.displayName = "DiffView";
-const version = "0.0.9";
+const version = "0.0.11";
 
 exports.DefaultDiffExpansionStep = DefaultDiffExpansionStep;
 exports.DiffFile = DiffFile;
@@ -3451,6 +3630,7 @@ exports._cacheMap = _cacheMap;
 exports.assertNever = assertNever;
 exports.checkDiffLineIncludeChange = checkDiffLineIncludeChange;
 exports.composeLen = composeLen;
+exports.diffFontSizeName = diffFontSizeName;
 exports.getDiffRange = getDiffRange;
 exports.getFile = getFile;
 exports.getHunkHeaderExpansionType = getHunkHeaderExpansionType;