@git-diff-view/react 0.0.8 → 0.0.10

package/dist/cjs/index.development.js

@@ -107,34 +107,83 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var _Cache_keyArray, _Cache_maxLength;
-class Cache extends Map {
-    constructor() {
-        super(...arguments);
-        _Cache_keyArray.set(this, []);
-        _Cache_maxLength.set(this, 30);
-    }
-    setMaxLength(length) {
-        __classPrivateFieldSet(this, _Cache_maxLength, length, "f");
-        this._checkLength();
-    }
-    set(key, value) {
-        if (this.has(key))
-            return this;
-        __classPrivateFieldGet(this, _Cache_keyArray, "f").push(key);
-        this._checkLength();
-        return super.set(key, value);
-    }
-    _checkLength() {
-        while (__classPrivateFieldGet(this, _Cache_keyArray, "f").length > __classPrivateFieldGet(this, _Cache_maxLength, "f")) {
-            const key = __classPrivateFieldGet(this, _Cache_keyArray, "f").shift();
-            this.delete(key);
-        }
-    }
-}
-_Cache_keyArray = new WeakMap(), _Cache_maxLength = new WeakMap();
+const processAST = (ast) => {
+    let lineNumber = 1;
+    const syntaxObj = {};
+    const loopAST = (nodes, wrapper) => {
+        nodes.forEach((node) => {
+            if (node.type === "text") {
+                if (node.value.indexOf("\n") === -1) {
+                    const valueLength = node.value.length;
+                    if (!syntaxObj[lineNumber]) {
+                        node.startIndex = 0;
+                        node.endIndex = valueLength - 1;
+                        const item = {
+                            value: node.value,
+                            lineNumber,
+                            valueLength,
+                            nodeList: [{ node, wrapper }],
+                        };
+                        syntaxObj[lineNumber] = item;
+                    }
+                    else {
+                        node.startIndex = syntaxObj[lineNumber].valueLength;
+                        node.endIndex = node.startIndex + valueLength - 1;
+                        syntaxObj[lineNumber].value += node.value;
+                        syntaxObj[lineNumber].valueLength += valueLength;
+                        syntaxObj[lineNumber].nodeList.push({ node, wrapper });
+                    }
+                    node.lineNumber = lineNumber;
+                    return;
+                }
+                const lines = node.value.split("\n");
+                node.children = node.children || [];
+                for (let i = 0; i < lines.length; i++) {
+                    const _value = i === lines.length - 1 ? lines[i] : lines[i] + "\n";
+                    const _lineNumber = i === 0 ? lineNumber : ++lineNumber;
+                    const _valueLength = _value.length;
+                    const _node = {
+                        type: "text",
+                        value: _value,
+                        startIndex: Infinity,
+                        endIndex: Infinity,
+                        lineNumber: _lineNumber,
+                    };
+                    if (!syntaxObj[_lineNumber]) {
+                        _node.startIndex = 0;
+                        _node.endIndex = _valueLength - 1;
+                        const item = {
+                            value: _value,
+                            lineNumber: _lineNumber,
+                            valueLength: _valueLength,
+                            nodeList: [{ node: _node, wrapper }],
+                        };
+                        syntaxObj[_lineNumber] = item;
+                    }
+                    else {
+                        _node.startIndex = syntaxObj[_lineNumber].valueLength;
+                        _node.endIndex = _node.startIndex + _valueLength - 1;
+                        syntaxObj[_lineNumber].value += _value;
+                        syntaxObj[_lineNumber].valueLength += _valueLength;
+                        syntaxObj[_lineNumber].nodeList.push({ node: _node, wrapper });
+                    }
+                    node.children.push(_node);
+                }
+                node.lineNumber = lineNumber;
+                return;
+            }
+            if (node.children) {
+                loopAST(node.children, node);
+                node.lineNumber = lineNumber;
+            }
+        });
+    };
+    loopAST(ast.children);
+    return { syntaxFileObject: syntaxObj, syntaxFileLineNumber: lineNumber };
+};
 
 const lowlight = lowlight$1.createLowlight(lowlight$1.all);
+// !SEE https://github.com/highlightjs/highlightjs-vue
 lowlight.register("vue", function hljsDefineVue(hljs) {
     return {
         subLanguage: "xml",
@@ -180,50 +229,95 @@ lowlight.register("vue", function hljsDefineVue(hljs) {
         ],
     };
 });
-const highlighter = lowlight;
-let _autoDetectLang = true;
+const instance = { name: "lowlight" };
 let _maxLineToIgnoreSyntax = 2000;
 const _ignoreSyntaxHighlightList = [];
-Object.defineProperty(highlighter, "maxLineToIgnoreSyntax", {
+Object.defineProperty(instance, "maxLineToIgnoreSyntax", {
     get: () => _maxLineToIgnoreSyntax,
 });
-Object.defineProperty(highlighter, "setMaxLineToIgnoreSyntax", {
+Object.defineProperty(instance, "setMaxLineToIgnoreSyntax", {
     value: (v) => {
         _maxLineToIgnoreSyntax = v;
     },
 });
-Object.defineProperty(highlighter, "autoDetectLang", {
-    get: () => _autoDetectLang,
-});
-Object.defineProperty(highlighter, "setAutoDetectLang", {
-    value: (v) => {
-        _autoDetectLang = v;
-    },
-});
-Object.defineProperty(highlighter, "ignoreSyntaxHighlightList", {
+Object.defineProperty(instance, "ignoreSyntaxHighlightList", {
     get: () => _ignoreSyntaxHighlightList,
 });
-Object.defineProperty(highlighter, "setIgnoreSyntaxHighlightList", {
+Object.defineProperty(instance, "setIgnoreSyntaxHighlightList", {
     value: (v) => {
         _ignoreSyntaxHighlightList.length = 0;
         _ignoreSyntaxHighlightList.push(...v);
     },
 });
+Object.defineProperty(instance, "getAST", {
+    value: (raw, fileName, lang) => {
+        let hasRegisteredLang = true;
+        if (!lowlight.registered(lang)) {
+            console.warn(`not support current lang: ${lang} yet`);
+            hasRegisteredLang = false;
+        }
+        if (fileName &&
+            highlighter.ignoreSyntaxHighlightList.some((item) => item instanceof RegExp ? item.test(fileName) : fileName === item)) {
+            console.warn(`ignore syntax for current file, because the fileName is in the ignoreSyntaxHighlightList: ${fileName}`);
+            return;
+        }
+        if (hasRegisteredLang) {
+            return lowlight.highlight(lang, raw);
+        }
+        else {
+            return lowlight.highlightAuto(raw);
+        }
+    },
+});
+Object.defineProperty(instance, "processAST", {
+    value: (ast) => {
+        return processAST(ast);
+    },
+});
+const highlighter = instance;
 
-var _File_instances, _File_doAST, _File_doCheck;
+var _Cache_keyArray, _Cache_maxLength;
+class Cache extends Map {
+    constructor() {
+        super(...arguments);
+        _Cache_keyArray.set(this, []);
+        _Cache_maxLength.set(this, 30);
+    }
+    setMaxLength(length) {
+        __classPrivateFieldSet(this, _Cache_maxLength, length, "f");
+        this._checkLength();
+    }
+    set(key, value) {
+        if (this.has(key))
+            return this;
+        __classPrivateFieldGet(this, _Cache_keyArray, "f").push(key);
+        this._checkLength();
+        return super.set(key, value);
+    }
+    _checkLength() {
+        while (__classPrivateFieldGet(this, _Cache_keyArray, "f").length > __classPrivateFieldGet(this, _Cache_maxLength, "f")) {
+            const key = __classPrivateFieldGet(this, _Cache_keyArray, "f").shift();
+            this.delete(key);
+        }
+    }
+}
+_Cache_keyArray = new WeakMap(), _Cache_maxLength = new WeakMap();
+
+var _File_instances, _File_doCheck;
 const map = new Cache();
+const devKey = "@git-diff-cache";
 map.setMaxLength(50);
 map.name = "@git-diff-view/core";
 if (typeof globalThis !== "undefined") {
-    if (Array.isArray(globalThis.__diff_cache__)) {
-        globalThis.__diff_cache__ = globalThis.__diff_cache__.filter((i) => i !== map);
-        if (globalThis.__diff_cache__.length > 0) {
+    if (Array.isArray(globalThis[devKey])) {
+        globalThis[devKey] = globalThis[devKey].filter((i) => i !== map);
+        if (globalThis[devKey].length > 0) {
             console.warn("there are multiple instance of @git-diff-view/core in the one environment!");
         }
-        globalThis.__diff_cache__.push(map);
+        globalThis[devKey].push(map);
     }
     else {
-        globalThis.__diff_cache__ = [map];
+        globalThis[devKey] = [map];
     }
 }
 class File {
@@ -239,38 +333,25 @@ class File {
         this.maxLineNumber = 0;
         Object.defineProperty(this, "__v_skip", { value: true });
     }
-    doSyntax({ autoDetectLang, registerHighlighter, }) {
+    doSyntax({ registerHighlighter }) {
         if (!this.raw || this.hasDoSyntax)
             return;
-        let hasRegisteredLang = true;
         const _highlighter = registerHighlighter || highlighter;
         if (this.syntaxLength) {
             console.error("current file already doSyntax before!");
             return;
         }
-        if (!_highlighter.registered(this.lang)) {
-            hasRegisteredLang = false;
-            if (!autoDetectLang) {
-                console.warn(`not support current lang: ${this.lang} yet`);
-                return;
-            }
-        }
         if (this.rawLength > _highlighter.maxLineToIgnoreSyntax) {
             console.warn(`ignore syntax for current file, because the rawLength is too long: ${this.rawLength}`);
             return;
         }
-        if (this.fileName &&
-            _highlighter.ignoreSyntaxHighlightList.some((item) => item instanceof RegExp ? item.test(this.fileName) : this.fileName === item)) {
-            console.warn(`ignore syntax for current file, because the fileName is in the ignoreSyntaxHighlightList: ${this.fileName}`);
+        this.ast = _highlighter.getAST(this.raw, this.fileName, this.lang);
+        if (!this.ast)
             return;
-        }
-        if (hasRegisteredLang) {
-            this.ast = _highlighter.highlight(this.lang, this.raw);
-        }
-        else {
-            this.ast = _highlighter.highlightAuto(this.raw);
-        }
-        __classPrivateFieldGet(this, _File_instances, "m", _File_doAST).call(this);
+        const { syntaxFileObject, syntaxFileLineNumber } = _highlighter.processAST(this.ast);
+        this.syntaxFile = syntaxFileObject;
+        this.syntaxLength = syntaxFileLineNumber;
+        this.highlighterName = _highlighter.name;
         {
             __classPrivateFieldGet(this, _File_instances, "m", _File_doCheck).call(this);
         }
@@ -298,81 +379,7 @@ class File {
         this.hasDoRaw = true;
     }
 }
-_File_instances = new WeakSet(), _File_doAST = function _File_doAST() {
-    const ast = this.ast;
-    let lineNumber = 1;
-    const syntaxObj = this.syntaxFile;
-    const loopAST = (nodes, wrapper) => {
-        nodes.forEach((node) => {
-            if (node.type === "text") {
-                if (node.value.indexOf("\n") === -1) {
-                    const valueLength = node.value.length;
-                    if (!syntaxObj[lineNumber]) {
-                        node.startIndex = 0;
-                        node.endIndex = valueLength - 1;
-                        const item = {
-                            value: node.value,
-                            lineNumber,
-                            valueLength,
-                            nodeList: [{ node, wrapper }],
-                        };
-                        syntaxObj[lineNumber] = item;
-                    }
-                    else {
-                        node.startIndex = syntaxObj[lineNumber].valueLength;
-                        node.endIndex = node.startIndex + valueLength - 1;
-                        syntaxObj[lineNumber].value += node.value;
-                        syntaxObj[lineNumber].valueLength += valueLength;
-                        syntaxObj[lineNumber].nodeList.push({ node, wrapper });
-                    }
-                    node.lineNumber = lineNumber;
-                    return;
-                }
-                const lines = node.value.split("\n");
-                node.children = node.children || [];
-                for (let i = 0; i < lines.length; i++) {
-                    const _value = i === lines.length - 1 ? lines[i] : lines[i] + "\n";
-                    const _lineNumber = i === 0 ? lineNumber : ++lineNumber;
-                    const _valueLength = _value.length;
-                    const _node = {
-                        type: "text",
-                        value: _value,
-                        startIndex: Infinity,
-                        endIndex: Infinity,
-                        lineNumber: _lineNumber,
-                    };
-                    if (!syntaxObj[_lineNumber]) {
-                        _node.startIndex = 0;
-                        _node.endIndex = _valueLength - 1;
-                        const item = {
-                            value: _value,
-                            lineNumber: _lineNumber,
-                            valueLength: _valueLength,
-                            nodeList: [{ node: _node, wrapper }],
-                        };
-                        syntaxObj[_lineNumber] = item;
-                    }
-                    else {
-                        _node.startIndex = syntaxObj[_lineNumber].valueLength;
-                        _node.endIndex = _node.startIndex + _valueLength - 1;
-                        syntaxObj[_lineNumber].value += _value;
-                        syntaxObj[_lineNumber].valueLength += _valueLength;
-                        syntaxObj[_lineNumber].nodeList.push({ node: _node, wrapper });
-                    }
-                    node.children.push(_node);
-                }
-                node.lineNumber = lineNumber;
-                return;
-            }
-            if (node.children) {
-                loopAST(node.children, node);
-                node.lineNumber = lineNumber;
-            }
-        });
-    };
-    loopAST(ast.children);
-    this.syntaxLength = lineNumber;
-}, _File_doCheck = function _File_doCheck() {
+_File_instances = new WeakSet(), _File_doCheck = function _File_doCheck() {
     if (this.rawLength && this.syntaxLength) {
         if (this.rawLength !== this.syntaxLength) {
             console.warn("the rawLength not match for the syntaxLength");
@@ -385,7 +392,7 @@ _File_instances = new WeakSet(), _File_doAST = function _File_doAST() {
     }
 };
 const getFile = (raw, lang, fileName) => {
-    const key = raw + "--" + "0.0.8" + "--" + lang;
+    const key = raw + "--" + "0.0.10" + "--" + lang;
     if (map.has(key))
         return map.get(key);
     const file = new File(raw, lang, fileName);
@@ -394,6 +401,12 @@ 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";
+})(exports.NewLineSymbol || (exports.NewLineSymbol = {}));
 const maxLength = 1000;
 /** Get the maximum position in the range. */
 function rangeMax(range) {
@@ -430,12 +443,12 @@ function relativeChanges(stringA, stringB) {
             stringARange: {
                 location: _stringA.length,
                 length: stringA.length - _stringA.length,
-                isNewLineSymbolChanged: true,
+                newLineSymbol: 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: bEndStr === "\r\n" ? exports.NewLineSymbol.CRLF : bEndStr.endsWith("\r") ? exports.NewLineSymbol.CR : exports.NewLineSymbol.LF,
             },
         };
     }
@@ -683,7 +696,7 @@ const getDiffRange = (additions, deletions) => {
 };
 
 /* eslint-disable max-lines */
-// NODE: ALL of the Diff parse logic from desktop, SEE https://github.com/desktop/desktop
+// !NOTE: ALL of the diff parse logic copy from desktop, SEE https://github.com/desktop/desktop
 // https://en.wikipedia.org/wiki/Diff_utility
 //
 // @@ -l,s +l,s @@ optional section heading
@@ -1013,7 +1026,9 @@ class DiffParser {
 }
 const parseInstance = new DiffParser();
 
-var _DiffFile_instances, _DiffFile_oldFileResult, _DiffFile_newFileResult, _DiffFile_diffListResults, _DiffFile_diffLines, _DiffFile_oldFileDiffLines, _DiffFile_newFileDiffLines, _DiffFile_oldFileLines, _DiffFile_newFileLines, _DiffFile_oldFileSyntaxLines, _DiffFile_newFileSyntaxLines, _DiffFile_oldFilePlaceholderLines, _DiffFile_newFilePlaceholderLines, _DiffFile_splitLeftLines, _DiffFile_splitRightLines, _DiffFile_splitHunksLines, _DiffFile_unifiedLines, _DiffFile_unifiedHunksLines, _DiffFile_listeners, _DiffFile_hasInitRaw, _DiffFile_hasInitSyntax, _DiffFile_hasBuildSplit, _DiffFile_hasBuildUnified, _DiffFile_updateCount, _DiffFile_composeByDiff, _DiffFile_id, _DiffFile_clonedInstance, _DiffFile_doDiff, _DiffFile_doFile, _DiffFile_composeRaw, _DiffFile_composeFile, _DiffFile_composeDiff, _DiffFile_composeSyntax, _DiffFile_getOldDiffLine, _DiffFile_getNewDiffLine, _DiffFile_getOldRawLine, _DiffFile_getNewRawLine;
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+/* eslint-disable max-lines */
+var _DiffFile_instances, _DiffFile_oldFileResult, _DiffFile_newFileResult, _DiffFile_diffListResults, _DiffFile_diffLines, _DiffFile_oldFileDiffLines, _DiffFile_newFileDiffLines, _DiffFile_oldFileLines, _DiffFile_newFileLines, _DiffFile_oldFileSyntaxLines, _DiffFile_newFileSyntaxLines, _DiffFile_oldFilePlaceholderLines, _DiffFile_newFilePlaceholderLines, _DiffFile_splitLeftLines, _DiffFile_splitRightLines, _DiffFile_splitHunksLines, _DiffFile_unifiedLines, _DiffFile_unifiedHunksLines, _DiffFile_listeners, _DiffFile_hasInitRaw, _DiffFile_hasInitSyntax, _DiffFile_hasBuildSplit, _DiffFile_hasBuildUnified, _DiffFile_updateCount, _DiffFile_composeByDiff, _DiffFile_highlighterName, _DiffFile_id, _DiffFile_clonedInstance, _DiffFile_doDiff, _DiffFile_doFile, _DiffFile_composeRaw, _DiffFile_composeFile, _DiffFile_composeDiff, _DiffFile_composeSyntax, _DiffFile_getOldDiffLine, _DiffFile_getNewDiffLine, _DiffFile_getOldRawLine, _DiffFile_getNewRawLine;
 const composeLen = 40;
 const idSet = new Set();
 class DiffFile {
@@ -1054,7 +1069,8 @@ class DiffFile {
         _DiffFile_hasBuildUnified.set(this, false);
         _DiffFile_updateCount.set(this, 0);
         _DiffFile_composeByDiff.set(this, false);
-        this._version_ = "0.0.8";
+        _DiffFile_highlighterName.set(this, void 0);
+        this._version_ = "0.0.10";
         this._oldFileContent = "";
         this._oldFileLang = "";
         this._newFileContent = "";
@@ -1314,6 +1330,7 @@ class DiffFile {
             const splitLineLength = this.splitLineLength;
             const unifiedLineLength = this.unifiedLineLength;
             const composeByDiff = __classPrivateFieldGet(this, _DiffFile_composeByDiff, "f");
+            const highlighterName = __classPrivateFieldGet(this, _DiffFile_highlighterName, "f");
             const hasCollapsed = this.hasCollapsed;
             // split
             const splitLeftLines = __classPrivateFieldGet(this, _DiffFile_splitLeftLines, "f");
@@ -1343,6 +1360,7 @@ class DiffFile {
                 splitHunkLines,
                 unifiedLines,
                 unifiedHunkLines,
+                highlighterName,
                 composeByDiff,
                 hasCollapsed,
                 version,
@@ -1354,6 +1372,7 @@ class DiffFile {
             __classPrivateFieldSet(this, _DiffFile_hasBuildSplit, data.hasBuildSplit, "f");
             __classPrivateFieldSet(this, _DiffFile_hasBuildUnified, data.hasBuildUnified, "f");
             __classPrivateFieldSet(this, _DiffFile_composeByDiff, data.composeByDiff, "f");
+            __classPrivateFieldSet(this, _DiffFile_highlighterName, data.highlighterName, "f");
             __classPrivateFieldSet(this, _DiffFile_oldFileLines, data.oldFileLines, "f");
             __classPrivateFieldSet(this, _DiffFile_oldFileDiffLines, data.oldFileDiffLines, "f");
             __classPrivateFieldSet(this, _DiffFile_oldFileSyntaxLines, data.oldFileSyntaxLines, "f");
@@ -1375,6 +1394,7 @@ class DiffFile {
             }
             this.notifyAll();
         };
+        this._getHighlighterName = () => __classPrivateFieldGet(this, _DiffFile_highlighterName, "f");
         this._getIsPureDiffRender = () => __classPrivateFieldGet(this, _DiffFile_composeByDiff, "f");
         this._addClonedInstance = (instance) => {
             const updateFunc = () => {
@@ -1483,10 +1503,12 @@ class DiffFile {
         __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_composeFile).call(this);
         __classPrivateFieldSet(this, _DiffFile_hasInitRaw, true, "f");
     }
-    initSyntax({ autoDetectLang, registerHighlighter, } = {}) {
+    initSyntax({ registerHighlighter } = {}) {
+        var _a, _b;
         if (__classPrivateFieldGet(this, _DiffFile_hasInitSyntax, "f"))
             return;
-        __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_composeSyntax).call(this, { registerHighlighter, autoDetectLang });
+        __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_composeSyntax).call(this, { registerHighlighter });
+        __classPrivateFieldSet(this, _DiffFile_highlighterName, ((_a = __classPrivateFieldGet(this, _DiffFile_oldFileResult, "f")) === null || _a === void 0 ? void 0 : _a.highlighterName) || ((_b = __classPrivateFieldGet(this, _DiffFile_newFileResult, "f")) === null || _b === void 0 ? void 0 : _b.highlighterName) || __classPrivateFieldGet(this, _DiffFile_highlighterName, "f"), "f");
         __classPrivateFieldSet(this, _DiffFile_hasInitSyntax, true, "f");
     }
     init() {
@@ -1764,7 +1786,7 @@ class DiffFile {
         this.notifyAll();
     }
 }
-_DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap(), _DiffFile_diffListResults = new WeakMap(), _DiffFile_diffLines = new WeakMap(), _DiffFile_oldFileDiffLines = new WeakMap(), _DiffFile_newFileDiffLines = new WeakMap(), _DiffFile_oldFileLines = new WeakMap(), _DiffFile_newFileLines = new WeakMap(), _DiffFile_oldFileSyntaxLines = new WeakMap(), _DiffFile_newFileSyntaxLines = new WeakMap(), _DiffFile_oldFilePlaceholderLines = new WeakMap(), _DiffFile_newFilePlaceholderLines = new WeakMap(), _DiffFile_splitLeftLines = new WeakMap(), _DiffFile_splitRightLines = new WeakMap(), _DiffFile_splitHunksLines = new WeakMap(), _DiffFile_unifiedLines = new WeakMap(), _DiffFile_unifiedHunksLines = new WeakMap(), _DiffFile_listeners = new WeakMap(), _DiffFile_hasInitRaw = new WeakMap(), _DiffFile_hasInitSyntax = new WeakMap(), _DiffFile_hasBuildSplit = new WeakMap(), _DiffFile_hasBuildUnified = new WeakMap(), _DiffFile_updateCount = new WeakMap(), _DiffFile_composeByDiff = new WeakMap(), _DiffFile_id = new WeakMap(), _DiffFile_clonedInstance = new WeakMap(), _DiffFile_instances = new WeakSet(), _DiffFile_doDiff = function _DiffFile_doDiff() {
+_DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap(), _DiffFile_diffListResults = new WeakMap(), _DiffFile_diffLines = new WeakMap(), _DiffFile_oldFileDiffLines = new WeakMap(), _DiffFile_newFileDiffLines = new WeakMap(), _DiffFile_oldFileLines = new WeakMap(), _DiffFile_newFileLines = new WeakMap(), _DiffFile_oldFileSyntaxLines = new WeakMap(), _DiffFile_newFileSyntaxLines = new WeakMap(), _DiffFile_oldFilePlaceholderLines = new WeakMap(), _DiffFile_newFilePlaceholderLines = new WeakMap(), _DiffFile_splitLeftLines = new WeakMap(), _DiffFile_splitRightLines = new WeakMap(), _DiffFile_splitHunksLines = new WeakMap(), _DiffFile_unifiedLines = new WeakMap(), _DiffFile_unifiedHunksLines = new WeakMap(), _DiffFile_listeners = new WeakMap(), _DiffFile_hasInitRaw = new WeakMap(), _DiffFile_hasInitSyntax = new WeakMap(), _DiffFile_hasBuildSplit = new WeakMap(), _DiffFile_hasBuildUnified = new WeakMap(), _DiffFile_updateCount = new WeakMap(), _DiffFile_composeByDiff = new WeakMap(), _DiffFile_highlighterName = new WeakMap(), _DiffFile_id = new WeakMap(), _DiffFile_clonedInstance = new WeakMap(), _DiffFile_instances = new WeakSet(), _DiffFile_doDiff = function _DiffFile_doDiff() {
     if (!this._diffList)
         return;
     __classPrivateFieldSet(this, _DiffFile_diffListResults, this._diffList.map((s) => parseInstance.parse(s)), "f");
@@ -1840,7 +1862,11 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
                 oldLineNumber = newDiffLine.oldLineNumber ? newDiffLine.oldLineNumber + 1 : oldLineNumber;
             }
             else {
-                newFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldRawLine).call(this, oldLineNumber++);
+                const oldDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldDiffLine).call(this, oldLineNumber);
+                if (!oldDiffLine) {
+                    newFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getOldRawLine).call(this, oldLineNumber);
+                }
+                oldLineNumber++;
             }
         }
         if (newFileContent === this._oldFileContent)
@@ -1859,7 +1885,11 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
                 newLineNumber = oldDiffLine.newLineNumber ? oldDiffLine.newLineNumber + 1 : newLineNumber;
             }
             else {
-                oldFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewRawLine).call(this, newLineNumber++);
+                const newDiffLine = __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewDiffLine).call(this, newLineNumber);
+                if (!newDiffLine) {
+                    oldFileContent += __classPrivateFieldGet(this, _DiffFile_instances, "m", _DiffFile_getNewRawLine).call(this, newLineNumber);
+                }
+                newLineNumber++;
             }
         }
         if (oldFileContent === this._newFileContent)
@@ -1959,11 +1989,11 @@ _DiffFile_oldFileResult = new WeakMap(), _DiffFile_newFileResult = new WeakMap()
             __classPrivateFieldGet(this, _DiffFile_newFileDiffLines, "f")[item.newLineNumber] = item;
         }
     });
-}, _DiffFile_composeSyntax = function _DiffFile_composeSyntax({ autoDetectLang, registerHighlighter, }) {
+}, _DiffFile_composeSyntax = function _DiffFile_composeSyntax({ registerHighlighter }) {
     var _a, _b, _c, _d;
-    (_a = __classPrivateFieldGet(this, _DiffFile_oldFileResult, "f")) === null || _a === void 0 ? void 0 : _a.doSyntax({ autoDetectLang, registerHighlighter });
+    (_a = __classPrivateFieldGet(this, _DiffFile_oldFileResult, "f")) === null || _a === void 0 ? void 0 : _a.doSyntax({ registerHighlighter });
     __classPrivateFieldSet(this, _DiffFile_oldFileSyntaxLines, (_b = __classPrivateFieldGet(this, _DiffFile_oldFileResult, "f")) === null || _b === void 0 ? void 0 : _b.syntaxFile, "f");
-    (_c = __classPrivateFieldGet(this, _DiffFile_newFileResult, "f")) === null || _c === void 0 ? void 0 : _c.doSyntax({ autoDetectLang, registerHighlighter });
+    (_c = __classPrivateFieldGet(this, _DiffFile_newFileResult, "f")) === null || _c === void 0 ? void 0 : _c.doSyntax({ registerHighlighter });
     __classPrivateFieldSet(this, _DiffFile_newFileSyntaxLines, (_d = __classPrivateFieldGet(this, _DiffFile_newFileResult, "f")) === null || _d === void 0 ? void 0 : _d.syntaxFile, "f");
 }, _DiffFile_getOldDiffLine = function _DiffFile_getOldDiffLine(lineNumber) {
     var _a;
@@ -2060,7 +2090,7 @@ const getUnifiedContentLine = (diffFile) => {
     return lines.filter((line) => line.type === exports.DiffFileLineType.content);
 };
 
-const versions = "0.0.8";
+const versions = "0.0.10";
 
 const useUnmount = (cb, deps) => {
     const ref = React.useRef(cb);
@@ -2158,14 +2188,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(() => {
@@ -2241,14 +2275,11 @@ const getLineNumberBG = (isAdded, isDelete, hasDiff) => {
                 : `var(${expandContentBGName})`;
 };
 
-const _DiffSplitExtendLine$1 = ({ index, diffFile, side, lineNumber, }) => {
-    var _a, _b;
+const _DiffSplitExtendLine$1 = ({ index, diffFile, oldLineExtend, newLineExtend, side, lineNumber, }) => {
     const { useDiffContext } = useDiffViewContext();
-    const { extendData, renderExtendLine } = useDiffContext(React__namespace.useCallback((s) => ({ extendData: s.extendData, renderExtendLine: s.renderExtendLine }), []));
     const oldLine = diffFile.getSplitLeftLine(index);
     const newLine = diffFile.getSplitRightLine(index);
-    const oldLineExtend = (_a = extendData === null || extendData === void 0 ? void 0 : extendData.oldFile) === null || _a === void 0 ? void 0 : _a[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber];
-    const newLineExtend = (_b = extendData === null || extendData === void 0 ? void 0 : extendData.newFile) === null || _b === void 0 ? void 0 : _b[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber];
+    const renderExtendLine = useDiffContext(React__namespace.useCallback((s) => s.renderExtendLine, []));
     const currentExtend = side === exports.SplitSide.old ? oldLineExtend : newLineExtend;
     const currentLineNumber = side === exports.SplitSide.old ? oldLine.lineNumber : newLine.lineNumber;
     const otherSide = side === exports.SplitSide.old ? exports.SplitSide.new : exports.SplitSide.old;
@@ -2265,6 +2296,7 @@ const _DiffSplitExtendLine$1 = ({ index, diffFile, side, lineNumber, }) => {
         return null;
     return (React__namespace.createElement("tr", { "data-line": `${lineNumber}-extend`, "data-state": "extend", "data-side": exports.SplitSide[side], className: "diff-line diff-line-extend" }, currentExtend ? (React__namespace.createElement("td", { className: `diff-line-extend-${exports.SplitSide[side]}-content p-0`, colSpan: 2 },
         React__namespace.createElement("div", { className: "diff-line-extend-wrapper sticky left-0", style: { width } }, width > 0 &&
+            (currentExtend === null || currentExtend === void 0 ? void 0 : currentExtend.data) &&
             (renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
                 diffFile,
                 side,
@@ -2278,14 +2310,21 @@ const DiffSplitExtendLine$1 = ({ index, diffFile, side, lineNumber, }) => {
     const { useDiffContext } = useDiffViewContext();
     const oldLine = diffFile.getSplitLeftLine(index);
     const newLine = diffFile.getSplitRightLine(index);
-    const hasExtend = useDiffContext(React__namespace.useCallback((s) => { var _a, _b, _c, _d; return ((_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber]) || ((_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]); }, [oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber, newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]));
+    const { oldLineExtend, newLineExtend } = useDiffContext(React__namespace.useCallback((s) => {
+        var _a, _b, _c, _d;
+        return ({
+            oldLineExtend: (_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber],
+            newLineExtend: (_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber],
+        });
+    }, [oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber, newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]));
+    const hasExtend = (oldLineExtend === null || oldLineExtend === void 0 ? void 0 : oldLineExtend.data) || (newLineExtend === null || newLineExtend === void 0 ? void 0 : newLineExtend.data);
     // if the expand action not enabled, the `isHidden` property will never change
     const enableExpand = diffFile.getExpandEnabled();
     const currentLine = side === exports.SplitSide.old ? oldLine : newLine;
     const currentIsShow = hasExtend && (!currentLine.isHidden || !enableExpand);
     if (!currentIsShow)
         return null;
-    return React__namespace.createElement(_DiffSplitExtendLine$1, { index: index, diffFile: diffFile, side: side, lineNumber: lineNumber });
+    return (React__namespace.createElement(_DiffSplitExtendLine$1, { side: side, index: index, diffFile: diffFile, lineNumber: lineNumber, oldLineExtend: oldLineExtend, newLineExtend: newLineExtend }));
 };
 
 const ExpandDown = ({ className }) => {
@@ -2331,9 +2370,21 @@ const syncScroll = (left, right) => {
         right.onscroll = null;
     };
 };
+// eslint-disable-next-line @typescript-eslint/ban-types
+const memoFunc = (func) => {
+    const cache = {};
+    return ((key) => {
+        if (cache[key]) {
+            return cache[key];
+        }
+        const result = func(key);
+        cache[key] = result;
+        return result;
+    });
+};
 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();
@@ -2372,6 +2423,50 @@ 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();
+    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 &&
@@ -2388,7 +2483,7 @@ const DiffSplitAddWidget = ({ side, className, lineNumber, onWidgetClick, onOpen
             width: "calc(var(--diff-font-size--) * 1.4)",
             height: "calc(var(--diff-font-size--) * 1.4)",
         } },
-        React__namespace.createElement("button", { className: "diff-add-widget w-0 h-0 overflow-hidden cursor-pointer rounded-md flex items-center justify-center transition-transform origin-center group-hover:w-full group-hover:h-full hover:scale-110", style: {
+        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})`,
                 zIndex: 1,
                 fontSize: `1.2em`,
@@ -2403,7 +2498,7 @@ const DiffUnifiedAddWidget = ({ lineNumber, side, onWidgetClick, onOpenAddWidget
             width: "calc(var(--diff-font-size--) * 1.4)",
             height: "calc(var(--diff-font-size--) * 1.4)",
         } },
-        React__namespace.createElement("button", { className: "diff-add-widget overflow-hidden cursor-pointer rounded-md w-0 h-0 flex items-center justify-center transition-transform origin-center group-hover:w-full group-hover:h-full hover:scale-110", style: {
+        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})`,
                 zIndex: 1,
                 fontSize: `1.2em`,
@@ -2414,26 +2509,50 @@ const DiffUnifiedAddWidget = ({ lineNumber, side, onWidgetClick, onOpenAddWidget
             } }, "+")));
 };
 
+const temp = {};
+const formatStringToCamelCase = (str) => {
+    const splitted = str.split("-");
+    if (splitted.length === 1)
+        return splitted[0];
+    return (splitted[0] +
+        splitted
+            .slice(1)
+            .map((word) => word[0].toUpperCase() + word.slice(1))
+            .join(""));
+};
+const getStyleObjectFromString = memoFunc((str) => {
+    if (!str)
+        return temp;
+    const style = {};
+    str.split(";").forEach((el) => {
+        const [property, value] = el.split(":");
+        if (!property)
+            return;
+        const formattedProperty = formatStringToCamelCase(property.trim());
+        style[formattedProperty] = value.trim();
+    });
+    return style;
+});
 const DiffString = ({ rawLine, diffLine, operator, }) => {
     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"
-                                ? "␍␊"
-                                : str2
+                    } }, isLast
+                    ? `${_str2}${isNewLineSymbolChanged === exports.NewLineSymbol.LF
+                        ? "␊"
+                        : isNewLineSymbolChanged === exports.NewLineSymbol.CR
+                            ? "␍"
+                            : "␍␊"}`
                     : str2),
                 str3)));
     }
@@ -2448,9 +2567,9 @@ const DiffSyntax = ({ rawLine, diffLine, operator, syntaxLine, }) => {
     if (range) {
         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;
+                var _a, _b, _c, _d, _e, _f;
                 if (node.endIndex < range.location || range.location + range.length < node.startIndex) {
-                    return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_b = (_a = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.join(" ") }, node.value));
+                    return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_b = (_a = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.join(" "), style: getStyleObjectFromString(((_c = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _c === void 0 ? void 0 : _c.style) || "") }, node.value));
                 }
                 else {
                     const index1 = range.location - node.startIndex;
@@ -2460,31 +2579,31 @@ 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;
-                    return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_d = (_c = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _c === void 0 ? void 0 : _c.className) === null || _d === void 0 ? void 0 : _d.join(" ") },
+                    const isLast = str2.includes("\n");
+                    const _str2 = isLast ? str2.replace("\n", "") : str2;
+                    const isNewLineSymbolChanged = range.newLineSymbol;
+                    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"
-                                        ? "␍␊"
-                                        : str2
+                                borderTopRightRadius: isEnd || isLast ? "0.2em" : undefined,
+                                borderBottomRightRadius: isEnd || isLast ? "0.2em" : undefined,
+                            } }, isLast
+                            ? `${_str2}${isNewLineSymbolChanged === exports.NewLineSymbol.LF
+                                ? "␊"
+                                : isNewLineSymbolChanged === exports.NewLineSymbol.CR
+                                    ? "␍"
+                                    : "␍␊"}`
                             : str2),
                         str3));
                 }
             }))));
     }
     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;
-        return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_b = (_a = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.join(" ") }, node.value));
+        var _a, _b, _c;
+        return (React__namespace.createElement("span", { key: index, "data-start": node.startIndex, "data-end": node.endIndex, className: (_b = (_a = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.join(" "), style: getStyleObjectFromString(((_c = wrapper === null || wrapper === void 0 ? void 0 : wrapper.properties) === null || _c === void 0 ? void 0 : _c.style) || "") }, node.value));
     })));
 };
 const DiffContent = ({ diffLine, rawLine, syntaxLine, enableWrap, enableHighlight, }) => {
@@ -2522,7 +2641,7 @@ const _DiffSplitLine$1 = ({ index, diffFile, lineNumber, side, }) => {
         onAddWidgetClick: s.onAddWidgetClick,
     }), []));
     const { useWidget } = useDiffWidgetContext();
-    const { setWidget } = useWidget.getReadonlyState();
+    const setWidget = useWidget.getReadonlyState().setWidget;
     const contentBG = getContentBG(isAdded, isDelete, hasDiff);
     const lineNumberBG = getLineNumberBG(isAdded, isDelete, hasDiff);
     const syntaxLine = getCurrentSyntaxLine(currentLine.lineNumber);
@@ -2534,7 +2653,7 @@ const _DiffSplitLine$1 = ({ index, diffFile, lineNumber, side, }) => {
                 minWidth: `var(${asideWidth})`,
                 maxWidth: `var(${asideWidth})`,
             } },
-            hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: currentLine.lineNumber, side: side, diffFile: diffFile, onWidgetClick: onAddWidgetClick, className: "absolute left-[100%] translate-x-[-50%] z-[1]", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
+            hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: currentLine.lineNumber, side: side, 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": currentLine.lineNumber, style: { opacity: hasChange ? undefined : 0.5 } }, currentLine.lineNumber)),
         React__namespace.createElement("td", { className: `diff-line-${exports.SplitSide[side]}-content pr-[10px] align-top`, style: { backgroundColor: contentBG } },
             React__namespace.createElement(DiffContent, { enableWrap: false, diffFile: diffFile, rawLine: currentLine.value, diffLine: currentLine.diff, syntaxLine: syntaxLine, enableHighlight: enableHighlight })))) : (React__namespace.createElement("td", { className: `diff-line-${exports.SplitSide[side]}-placeholder select-none`, style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
@@ -2634,13 +2753,14 @@ const DiffSplitViewNormal = React.memo(({ diffFile }) => {
             return;
         return syncScroll(left, right);
     }, []);
+    const font = React__namespace.useMemo(() => ({ fontSize: fontSize + "px", fontFamily: "Menlo, Consolas, monospace" }), [fontSize]);
     const _width = useTextWidth({
         text: splitLineLength.toString(),
-        font: { fontSize: fontSize + "px", fontFamily: "Menlo, Consolas, monospace" },
+        font,
     });
     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",
@@ -2648,8 +2768,8 @@ const DiffSplitViewNormal = React.memo(({ diffFile }) => {
                 fontSize: "var(--diff-font-size--)",
             } },
             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",
@@ -2660,51 +2780,57 @@ const DiffSplitViewNormal = React.memo(({ diffFile }) => {
 });
 DiffSplitViewNormal.displayName = "DiffSplitViewNormal";
 
-const _DiffSplitExtendLine = ({ index, diffFile, lineNumber, }) => {
-    var _a, _b;
+const _DiffSplitExtendLine = ({ index, diffFile, lineNumber, oldLineExtend, newLineExtend, }) => {
     const { useDiffContext } = useDiffViewContext();
-    // 需要显示的时候才进行方法订阅，可以大幅度提高性能
-    const { extendData, renderExtendLine } = useDiffContext(React__namespace.useCallback((s) => ({ extendData: s.extendData, renderExtendLine: s.renderExtendLine }), []));
     const oldLine = diffFile.getSplitLeftLine(index);
     const newLine = diffFile.getSplitRightLine(index);
-    const oldLineExtend = (_a = extendData === null || extendData === void 0 ? void 0 : extendData.oldFile) === null || _a === void 0 ? void 0 : _a[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber];
-    const newLineExtend = (_b = extendData === null || extendData === void 0 ? void 0 : extendData.newFile) === null || _b === void 0 ? void 0 : _b[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber];
+    // 需要显示的时候才进行方法订阅，可以大幅度提高性能
+    const renderExtendLine = useDiffContext(React__namespace.useCallback((s) => s.renderExtendLine, []));
     if (!renderExtendLine)
         return null;
     return (React__namespace.createElement("tr", { "data-line": `${lineNumber}-extend`, "data-state": "extend", className: "diff-line diff-line-extend" },
         oldLineExtend ? (React__namespace.createElement("td", { className: "diff-line-extend-old-content p-0", colSpan: 2 },
-            React__namespace.createElement("div", { className: "diff-line-extend-wrapper" }, renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
-                diffFile,
-                side: exports.SplitSide.old,
-                lineNumber: oldLine.lineNumber,
-                data: oldLineExtend.data,
-                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("div", { className: "diff-line-extend-wrapper" }, (oldLineExtend === null || oldLineExtend === void 0 ? void 0 : oldLineExtend.data) &&
+                (renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
+                    diffFile,
+                    side: exports.SplitSide.old,
+                    lineNumber: oldLine.lineNumber,
+                    data: oldLineExtend.data,
+                    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 },
-            React__namespace.createElement("div", { className: "diff-line-extend-wrapper" }, renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
-                diffFile,
-                side: exports.SplitSide.new,
-                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 },
+        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,
+                    side: exports.SplitSide.new,
+                    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-[rgb(222,222,222)] select-none", style: { backgroundColor: `var(${emptyBGName})` }, colSpan: 2 },
             React__namespace.createElement("span", null, "\u2002")))));
 };
 const DiffSplitExtendLine = ({ index, diffFile, lineNumber, }) => {
     const { useDiffContext } = useDiffViewContext();
     const oldLine = diffFile.getSplitLeftLine(index);
     const newLine = diffFile.getSplitRightLine(index);
-    const hasExtend = useDiffContext(React__namespace.useCallback((s) => { var _a, _b, _c, _d; return ((_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber]) || ((_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]); }, [oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber, newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]));
+    const { oldLineExtend, newLineExtend } = useDiffContext(React__namespace.useCallback((s) => {
+        var _a, _b, _c, _d;
+        return ({
+            oldLineExtend: (_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber],
+            newLineExtend: (_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber],
+        });
+    }, [oldLine === null || oldLine === void 0 ? void 0 : oldLine.lineNumber, newLine === null || newLine === void 0 ? void 0 : newLine.lineNumber]));
+    const hasExtend = (oldLineExtend === null || oldLineExtend === void 0 ? void 0 : oldLineExtend.data) || (newLineExtend === null || newLineExtend === void 0 ? void 0 : newLineExtend.data);
     // if the expand action not enabled, the `isHidden` property will never change
     const enableExpand = diffFile.getExpandEnabled();
     const currentIsShow = hasExtend && ((!(oldLine === null || oldLine === void 0 ? void 0 : oldLine.isHidden) && !(newLine === null || newLine === void 0 ? void 0 : newLine.isHidden)) || !enableExpand);
     if (!currentIsShow)
         return null;
-    return React__namespace.createElement(_DiffSplitExtendLine, { index: index, diffFile: diffFile, lineNumber: 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();
@@ -2721,7 +2847,7 @@ const DiffSplitHunkLine = ({ index, diffFile, lineNumber, }) => {
     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", style: {
+        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) },
@@ -2737,6 +2863,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;
@@ -2755,7 +2941,7 @@ const _DiffSplitLine = ({ index, diffFile, lineNumber }) => {
         onAddWidgetClick: s.onAddWidgetClick,
     }), []));
     const { useWidget } = useDiffWidgetContext();
-    const { setWidget } = useWidget.getReadonlyState();
+    const setWidget = useWidget.getReadonlyState().setWidget;
     const hasOldLine = !!oldLine.lineNumber;
     const hasNewLine = !!newLine.lineNumber;
     const oldLineContentBG = getContentBG(false, oldLineIsDelete, hasDiff);
@@ -2765,19 +2951,19 @@ const _DiffSplitLine = ({ index, diffFile, lineNumber }) => {
     return (React__namespace.createElement("tr", { "data-line": lineNumber, "data-state": hasDiff ? "diff" : "plain", className: "diff-line" },
         hasOldLine ? (React__namespace.createElement(React__namespace.Fragment, null,
             React__namespace.createElement("td", { className: "diff-line-old-num group relative pl-[10px] pr-[10px] text-right align-top select-none w-[1%] min-w-[40px]", "data-side": exports.SplitSide[exports.SplitSide.old], style: { backgroundColor: oldLineNumberBG, color: `var(${plainLineNumberColorName})` } },
-                hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: oldLine.lineNumber, side: exports.SplitSide.old, diffFile: diffFile, onWidgetClick: onAddWidgetClick, className: "absolute left-[100%] translate-x-[-50%] z-[1]", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
+                hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: oldLine.lineNumber, side: exports.SplitSide.old, 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": oldLine.lineNumber, style: { opacity: hasChange ? undefined : 0.5 } }, oldLine.lineNumber)),
             React__namespace.createElement("td", { className: "diff-line-old-content group relative pr-[10px] align-top", "data-side": exports.SplitSide[exports.SplitSide.old], style: { backgroundColor: oldLineContentBG } },
-                hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: oldLine.lineNumber, side: exports.SplitSide.old, diffFile: diffFile, onWidgetClick: onAddWidgetClick, className: "absolute right-[100%] translate-x-[50%] z-[1] select-none", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
+                hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: oldLine.lineNumber, side: exports.SplitSide.old, 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: 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})` } },
-                hasDiff && enableAddWidget && (React__namespace.createElement(DiffSplitAddWidget, { index: index, lineNumber: newLine.lineNumber, side: exports.SplitSide.new, diffFile: diffFile, onWidgetClick: onAddWidgetClick, className: "absolute left-[100%] translate-x-[-50%] z-[1]", onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber: lineNumber, side: side }) })),
+            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: onAddWidgetClick, 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 },
+                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-[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, }) => {
@@ -2788,15 +2974,13 @@ const DiffSplitLine = ({ index, diffFile, lineNumber, }) => {
     return React__namespace.createElement(_DiffSplitLine, { index: index, diffFile: diffFile, lineNumber: lineNumber });
 };
 
-const _DiffSplitWidgetLine = ({ index, diffFile, lineNumber, }) => {
+const _DiffSplitWidgetLine = ({ index, diffFile, lineNumber, oldLineWidget, newLineWidget, }) => {
     const { useWidget } = useDiffWidgetContext();
-    const { widgetLineNumber, widgetSide, setWidget } = useWidget(React__namespace.useCallback((s) => ({ widgetLineNumber: s.widgetLineNumber, widgetSide: s.widgetSide, setWidget: s.setWidget }), []));
+    const setWidget = useWidget.getReadonlyState().setWidget;
     const { useDiffContext } = useDiffViewContext();
     const renderWidgetLine = useDiffContext(React__namespace.useCallback((s) => s.renderWidgetLine, []));
     const oldLine = diffFile.getSplitLeftLine(index);
     const newLine = diffFile.getSplitRightLine(index);
-    const oldLineWidget = oldLine.lineNumber && widgetSide === exports.SplitSide.old && widgetLineNumber === oldLine.lineNumber;
-    const newLineWidget = newLine.lineNumber && widgetSide === exports.SplitSide.new && widgetLineNumber === newLine.lineNumber;
     if (!renderWidgetLine)
         return null;
     return (React__namespace.createElement("tr", { "data-line": `${lineNumber}-widget`, "data-state": "widget", className: "diff-line diff-line-widget" },
@@ -2808,13 +2992,13 @@ const _DiffSplitWidgetLine = ({ index, diffFile, lineNumber, }) => {
                 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, }) => {
@@ -2827,12 +3011,12 @@ const DiffSplitWidgetLine = ({ index, diffFile, lineNumber, }) => {
     const currentIsShow = oldLineWidget || newLineWidget;
     if (!currentIsShow)
         return null;
-    return React__namespace.createElement(_DiffSplitWidgetLine, { index: index, diffFile: diffFile, lineNumber: lineNumber });
+    return (React__namespace.createElement(_DiffSplitWidgetLine, { index: index, diffFile: diffFile, lineNumber: lineNumber, oldLineWidget: oldLineWidget, newLineWidget: newLineWidget }));
 };
 
 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}`
@@ -2871,9 +3055,10 @@ const DiffSplitViewWrap = React.memo(({ diffFile }) => {
             }
         }
     }, [setSelectSide]);
+    const font = React.useMemo(() => ({ fontSize: fontSize + "px", fontFamily: "Menlo, Consolas, monospace" }), [fontSize]);
     const _width = useTextWidth({
         text: splitLineLength.toString(),
-        font: { fontSize: fontSize + "px", fontFamily: "Menlo, Consolas, monospace" },
+        font,
     });
     const width = Math.max(40, _width + 25);
     const lines = getSplitContentLines(diffFile);
@@ -2922,7 +3107,6 @@ const DiffSplitView = React.memo(({ diffFile }) => {
         return { widgetSide, widgetLineNumber, setWidget };
     }), [useDiffContext]);
     const contextValue = React.useMemo(() => ({ useWidget }), [useWidget]);
-    shim.useSyncExternalStore(diffFile.subscribe, diffFile.getUpdateCount);
     React.useEffect(() => {
         const { setWidget } = useWidget.getReadonlyState();
         setWidget({});
@@ -2931,12 +3115,10 @@ const DiffSplitView = React.memo(({ diffFile }) => {
 });
 DiffSplitView.displayName = "DiffSplitView";
 
-const _DiffUnifiedExtendLine = ({ index, diffFile, lineNumber, }) => {
+const _DiffUnifiedExtendLine = ({ index, diffFile, lineNumber, oldLineExtend, newLineExtend, }) => {
     const { useDiffContext } = useDiffViewContext();
     const renderExtendLine = useDiffContext(React.useCallback((s) => s.renderExtendLine, []));
     const unifiedItem = diffFile.getUnifiedLine(index);
-    const oldExtend = useDiffContext(React.useCallback((s) => { var _a, _b; return (_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.oldLineNumber]; }, [unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.oldLineNumber]));
-    const newExtend = useDiffContext(React.useCallback((s) => { var _a, _b; return (_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.newFile) === null || _b === void 0 ? void 0 : _b[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.newLineNumber]; }, [unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.newLineNumber]));
     const width = useDomWidth({
         selector: ".unified-diff-table-wrapper",
         enable: typeof renderExtendLine === "function",
@@ -2947,31 +3129,38 @@ const _DiffUnifiedExtendLine = ({ index, diffFile, lineNumber, }) => {
         React__namespace.createElement("td", { className: "diff-line-extend-content align-top p-0", colSpan: 2 },
             React__namespace.createElement("div", { className: "diff-line-extend-wrapper sticky left-0", style: { width } },
                 width > 0 &&
-                    oldExtend &&
+                    (oldLineExtend === null || oldLineExtend === void 0 ? void 0 : oldLineExtend.data) &&
                     (renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
                         diffFile,
                         side: exports.SplitSide.old,
                         lineNumber: unifiedItem.oldLineNumber,
-                        data: oldExtend.data,
+                        data: oldLineExtend.data,
                         onUpdate: diffFile.notifyAll,
                     })),
                 width > 0 &&
-                    newExtend &&
+                    (newLineExtend === null || newLineExtend === void 0 ? void 0 : newLineExtend.data) &&
                     (renderExtendLine === null || renderExtendLine === void 0 ? void 0 : renderExtendLine({
                         diffFile,
                         side: exports.SplitSide.new,
                         lineNumber: unifiedItem.newLineNumber,
-                        data: newExtend.data,
+                        data: newLineExtend.data,
                         onUpdate: diffFile.notifyAll,
                     }))))));
 };
 const DiffUnifiedExtendLine = ({ index, diffFile, lineNumber, }) => {
     const { useDiffContext } = useDiffViewContext();
     const unifiedItem = diffFile.getUnifiedLine(index);
-    const hasExtend = useDiffContext(React.useCallback((s) => { var _a, _b, _c, _d; return ((_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.oldLineNumber]) || ((_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.newLineNumber]); }, [unifiedItem.oldLineNumber, unifiedItem.newLineNumber]));
+    const { oldLineExtend, newLineExtend } = useDiffContext(React.useCallback((s) => {
+        var _a, _b, _c, _d;
+        return ({
+            oldLineExtend: (_b = (_a = s.extendData) === null || _a === void 0 ? void 0 : _a.oldFile) === null || _b === void 0 ? void 0 : _b[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.oldLineNumber],
+            newLineExtend: (_d = (_c = s.extendData) === null || _c === void 0 ? void 0 : _c.newFile) === null || _d === void 0 ? void 0 : _d[unifiedItem === null || unifiedItem === void 0 ? void 0 : unifiedItem.newLineNumber],
+        });
+    }, [unifiedItem.oldLineNumber, unifiedItem.newLineNumber]));
+    const hasExtend = (oldLineExtend === null || oldLineExtend === void 0 ? void 0 : oldLineExtend.data) || (newLineExtend === null || newLineExtend === void 0 ? void 0 : newLineExtend.data);
     if (!hasExtend || !unifiedItem || unifiedItem.isHidden || !unifiedItem.diff)
         return null;
-    return React__namespace.createElement(_DiffUnifiedExtendLine, { index: index, diffFile: diffFile, lineNumber: lineNumber });
+    return (React__namespace.createElement(_DiffUnifiedExtendLine, { index: index, diffFile: diffFile, lineNumber: lineNumber, oldLineExtend: oldLineExtend, newLineExtend: newLineExtend }));
 };
 
 const _DiffUnifiedHunkLine = ({ index, diffFile, lineNumber, }) => {
@@ -3063,7 +3252,7 @@ const _DiffUnifiedLine = React.memo(({ index, diffFile, lineNumber }) => {
         onAddWidgetClick: s.onAddWidgetClick,
     }), []));
     const { useWidget } = useDiffWidgetContext();
-    const { setWidget } = useWidget.getReadonlyState();
+    const setWidget = useWidget.getReadonlyState().setWidget;
     const hasDiff = unifiedLine.diff;
     const hasChange = checkDiffLineIncludeChange(unifiedLine.diff);
     const rawLine = unifiedLine.value || "";
@@ -3077,10 +3266,10 @@ const _DiffUnifiedLine = React.memo(({ index, diffFile, lineNumber }) => {
             : undefined;
     if (hasChange) {
         if (unifiedLine.oldLineNumber) {
-            return (React__namespace.createElement(DiffUnifiedOldLine, { index: lineNumber, enableWrap: enableWrap, diffFile: diffFile, rawLine: rawLine, diffLine: diffLine, setWidget: setWidget, syntaxLine: syntaxLine, enableHighlight: enableHighlight, enableAddWidget: enableAddWidget, onAddWidgetClick: onAddWidgetClick, lineNumber: unifiedLine.oldLineNumber }));
+            return (React__namespace.createElement(DiffUnifiedOldLine, { index: lineNumber, enableWrap: enableWrap, diffFile: diffFile, rawLine: rawLine, diffLine: diffLine, setWidget: setWidget, syntaxLine: syntaxLine, enableHighlight: enableHighlight, enableAddWidget: enableAddWidget, lineNumber: unifiedLine.oldLineNumber, onAddWidgetClick: (...props) => { var _a; return (_a = onAddWidgetClick.current) === null || _a === void 0 ? void 0 : _a.call(onAddWidgetClick, ...props); } }));
         }
         else {
-            return (React__namespace.createElement(DiffUnifiedNewLine, { index: lineNumber, enableWrap: enableWrap, rawLine: rawLine, diffLine: diffLine, diffFile: diffFile, setWidget: setWidget, syntaxLine: syntaxLine, enableHighlight: enableHighlight, enableAddWidget: enableAddWidget, onAddWidgetClick: onAddWidgetClick, lineNumber: unifiedLine.newLineNumber }));
+            return (React__namespace.createElement(DiffUnifiedNewLine, { index: lineNumber, enableWrap: enableWrap, rawLine: rawLine, diffLine: diffLine, diffFile: diffFile, setWidget: setWidget, syntaxLine: syntaxLine, enableHighlight: enableHighlight, enableAddWidget: enableAddWidget, lineNumber: unifiedLine.newLineNumber, onAddWidgetClick: (...props) => { var _a; return (_a = onAddWidgetClick.current) === null || _a === void 0 ? void 0 : _a.call(onAddWidgetClick, ...props); } }));
         }
     }
     else {
@@ -3092,7 +3281,7 @@ const _DiffUnifiedLine = React.memo(({ index, diffFile, lineNumber }) => {
                     minWidth: `calc(calc(var(${asideWidth}) + 5px) * 2)`,
                     backgroundColor: hasDiff ? `var(${plainLineNumberBGName})` : `var(${expandContentBGName})`,
                 } },
-                enableAddWidget && hasDiff && (React__namespace.createElement(DiffUnifiedAddWidget, { index: index, diffFile: diffFile, lineNumber: unifiedLine.newLineNumber, side: exports.SplitSide.new, onWidgetClick: onAddWidgetClick, onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber, side }) })),
+                enableAddWidget && hasDiff && (React__namespace.createElement(DiffUnifiedAddWidget, { index: index, diffFile: diffFile, lineNumber: unifiedLine.newLineNumber, side: exports.SplitSide.new, onWidgetClick: (...props) => { var _a; return (_a = onAddWidgetClick.current) === null || _a === void 0 ? void 0 : _a.call(onAddWidgetClick, ...props); }, onOpenAddWidget: (lineNumber, side) => setWidget({ lineNumber, side }) })),
                 React__namespace.createElement("div", { className: "flex opacity-[0.5]" },
                     React__namespace.createElement("span", { "data-line-old-num": unifiedLine.oldLineNumber, className: "inline-block w-[50%]" }, unifiedLine.oldLineNumber),
                     React__namespace.createElement("span", { className: "w-[10px] shrink-0" }),
@@ -3185,7 +3374,7 @@ 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",
@@ -3264,8 +3453,9 @@ const _InternalDiffView = (props) => {
         const setRenderWidgetLine = (_renderWidgetLine) => (renderWidgetLine.value = _renderWidgetLine);
         const renderExtendLine = reactivityStore.ref(props.renderExtendLine);
         const setRenderExtendLine = (_renderExtendLine) => (renderExtendLine.value = _renderExtendLine);
-        const onAddWidgetClick = reactivityStore.ref(props.onAddWidgetClick);
-        const setOnAddWidgetClick = (_onAddWidgetClick) => (onAddWidgetClick.value = _onAddWidgetClick);
+        // 避免无意义的订阅
+        const onAddWidgetClick = reactivityStore.ref(reactivityStore.markRaw({ current: props.onAddWidgetClick }));
+        const setOnAddWidgetClick = (_onAddWidgetClick) => (onAddWidgetClick.value.current = _onAddWidgetClick.current);
         return {
             id,
             setId,
@@ -3300,7 +3490,7 @@ const _InternalDiffView = (props) => {
         diffViewWrap !== enableWrap && setEnableWrap(diffViewWrap);
         extendData && setExtendData(extendData);
         diffViewFontSize && diffViewFontSize !== fontSize && setFontSize(diffViewFontSize);
-        onAddWidgetClick !== _onAddWidgetClick && setOnAddWidgetClick(onAddWidgetClick);
+        onAddWidgetClick !== _onAddWidgetClick.current && setOnAddWidgetClick({ current: onAddWidgetClick });
         renderExtendLine !== _renderExtendLine && setRenderExtendLine(renderExtendLine);
         renderWidgetLine !== _renderWidgetLine && setRenderWidgetLine(renderWidgetLine);
     }, [
@@ -3318,16 +3508,16 @@ 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.8"}` },
+        React__namespace.createElement("div", { className: "diff-tailwindcss-wrapper", "data-component": "git-diff-view", "data-version": `${"0.0.10"}`, "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) => {
-    const { registerHighlighter, autoDetectLang, data, diffFile: _diffFile } = props, restProps = __rest(props, ["registerHighlighter", "autoDetectLang", "data", "diffFile"]);
+    const { registerHighlighter, data, diffFile: _diffFile } = props, restProps = __rest(props, ["registerHighlighter", "data", "diffFile"]);
     const diffFile = React.useMemo(() => {
         var _a, _b, _c, _d, _e, _f;
         if (_diffFile) {
@@ -3351,10 +3541,10 @@ const DiffViewWithRef = (props, ref) => {
         if (!diffFile)
             return;
         if (props.diffViewHighlight) {
-            diffFile.initSyntax({ autoDetectLang, registerHighlighter });
+            diffFile.initSyntax({ registerHighlighter });
             diffFile.notifyAll();
         }
-    }, [diffFile, props.diffViewHighlight, autoDetectLang, registerHighlighter]);
+    }, [diffFile, props.diffViewHighlight, registerHighlighter]);
     React.useEffect(() => {
         if (_diffFile && diffFile) {
             _diffFile._addClonedInstance(diffFile);
@@ -3367,11 +3557,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.8";
+const version = "0.0.10";
 
 exports.DefaultDiffExpansionStep = DefaultDiffExpansionStep;
 exports.DiffFile = DiffFile;
@@ -3395,6 +3585,7 @@ exports.getUnifiedLines = getUnifiedLines;
 exports.hasRelativeChange = hasRelativeChange;
 exports.highlighter = highlighter;
 exports.numIterator = numIterator;
+exports.processAST = processAST;
 exports.relativeChanges = relativeChanges;
 exports.useDiffViewContext = useDiffViewContext;
 exports.version = version;