Skip to content

Commit 256c6e7

Browse files
fix a error
1 parent 457b4a4 commit 256c6e7

File tree

5 files changed

+15
-6
lines changed

5 files changed

+15
-6
lines changed

README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,12 @@ a React/Vue component to show the `git diff`/`file diff` result, just like Githu
77
## Demo ---- git-diff / file-diff
88
[git-mode](https://mrwangjusttodo.github.io/git-diff-view/?type=try&tab=git)
99

10+
![git mode](gitMode.png)
11+
1012
[file-mode](https://mrwangjusttodo.github.io/git-diff-view/?type=try&tab=file)
1113

14+
![file mode](fileMode.png)
15+
1216
## Packages
1317

1418
| Package | Version |
@@ -31,6 +35,7 @@ a React/Vue component to show the `git diff`/`file diff` result, just like Githu
3135
![Screenshot](2.png)
3236
![Screenshot](3.png)
3337

38+
3439
## Features
3540

3641
+ [x] Show the `git diff` result

fileMode.png

337 KB
Loading

gitMode.png

314 KB
Loading

packages/core/src/diff-file.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -627,11 +627,11 @@ export class DiffFile {
627627
prevHunkLine.splitInfo = {
628628
...prevHunkLine.hunkInfo,
629629

630-
startHiddenIndex: 0,
630+
startHiddenIndex: 1,
631631
endHiddenIndex: prevHunkLine.hunkInfo.newStartIndex,
632632
plainText: prevHunkLine.text,
633633

634-
_startHiddenIndex: 0,
634+
_startHiddenIndex: 1,
635635
_endHiddenIndex: prevHunkLine.hunkInfo.newStartIndex,
636636
_plainText: prevHunkLine.text,
637637
};
@@ -799,11 +799,11 @@ export class DiffFile {
799799
prevHunkLine.unifiedInfo = {
800800
...prevHunkLine.hunkInfo,
801801

802-
startHiddenIndex: 0,
802+
startHiddenIndex: 1,
803803
endHiddenIndex: prevHunkLine.hunkInfo.newStartIndex,
804804
plainText: prevHunkLine.text,
805805

806-
_startHiddenIndex: 0,
806+
_startHiddenIndex: 1,
807807
_endHiddenIndex: prevHunkLine.hunkInfo.newStartIndex,
808808
_plainText: prevHunkLine.text,
809809
};

ui/react-example/src/PlayGround.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -104,9 +104,13 @@ const _PlayGroundFileDiff = ({ onClick }: { onClick: () => void }) => {
104104

105105
const [lang2, setLang2] = useState("ts");
106106

107-
const [file1, setFile1] = useState("foo bar baz");
107+
const [file1, setFile1] = useState(
108+
'import { createLowlight, all } from "lowlight";\n\nimport { processAST, type SyntaxLine } from "./processAST";\n\nconst lowlight = createLowlight(all);\n\n// !SEE https://github.com/highlightjs/highlightjs-vue\n\nlowlight.register("vue", function hljsDefineVue(hljs) {\n return {\n subLanguage: "xml",\n contains: [\n hljs.COMMENT("\x3C!--", "-->", {\n relevance: 10,\n }),\n {\n begin: /^(\\s*)(\x3Cscript>)/gm,\n end: /^(\\s*)(<\\/script>)/gm,\n subLanguage: "javascript",\n excludeBegin: true,\n excludeEnd: true,\n },\n {\n begin: /^(?:\\s*)(?:\x3Cscript\\s+lang=(["\'])ts\\1>)/gm,\n end: /^(\\s*)(<\\/script>)/gm,\n subLanguage: "typescript",\n excludeBegin: true,\n excludeEnd: true,\n },\n {\n begin: /^(\\s*)(<style(\\s+scoped)?>)/gm,\n end: /^(\\s*)(<\\/style>)/gm,\n subLanguage: "css",\n excludeBegin: true,\n excludeEnd: true,\n },\n {\n begin: /^(?:\\s*)(?:<style(?:\\s+scoped)?\\s+lang=(["\'])(?:s[ca]ss)\\1(?:\\s+scoped)?>)/gm,\n end: /^(\\s*)(<\\/style>)/gm,\n subLanguage: "scss",\n excludeBegin: true,\n excludeEnd: true,\n },\n {\n begin: /^(?:\\s*)(?:<style(?:\\s+scoped)?\\s+lang=(["\'])stylus\\1(?:\\s+scoped)?>)/gm,\n end: /^(\\s*)(<\\/style>)/gm,\n subLanguage: "stylus",\n excludeBegin: true,\n excludeEnd: true,\n },\n ],\n };\n});\n\nexport type DiffAST = ReturnType<typeof lowlight.highlight>;\n\nexport type DiffHighlighter = {\n name: string;\n maxLineToIgnoreSyntax: number;\n setMaxLineToIgnoreSyntax: (v: number) => void;\n ignoreSyntaxHighlightList: (string | RegExp)[];\n setIgnoreSyntaxHighlightList: (v: (string | RegExp)[]) => void;\n getAST: (raw: string, fileName?: string, lang?: string) => DiffAST;\n processAST: (ast: DiffAST) => { syntaxFileObject: Record<number, SyntaxLine>; syntaxFileLineNumber: number };\n hasRegisteredCurrentLang: (lang: string) => boolean;\n getHighlighterEngine: () => typeof lowlight;\n};\n\nconst instance = { name: "lowlight" };\n\nlet _maxLineToIgnoreSyntax = 2000;\n\nconst _ignoreSyntaxHighlightList: (string | RegExp)[] = [];\n\nObject.defineProperty(instance, "maxLineToIgnoreSyntax", {\n get: () => _maxLineToIgnoreSyntax,\n});\n\nObject.defineProperty(instance, "setMaxLineToIgnoreSyntax", {\n value: (v: number) => {\n _maxLineToIgnoreSyntax = v;\n },\n});\n\nObject.defineProperty(instance, "ignoreSyntaxHighlightList", {\n get: () => _ignoreSyntaxHighlightList,\n});\n\nObject.defineProperty(instance, "setIgnoreSyntaxHighlightList", {\n value: (v: (string | RegExp)[]) => {\n _ignoreSyntaxHighlightList.length = 0;\n _ignoreSyntaxHighlightList.push(...v);\n },\n});\n\nObject.defineProperty(instance, "getAST", {\n value: (raw: string, fileName?: string, lang?: string) => {\n let hasRegisteredLang = true;\n\n if (!lowlight.registered(lang)) {\n __DEV__ && console.warn(`not support current lang: ${lang} yet`);\n hasRegisteredLang = false;\n }\n\n if (\n fileName &&\n highlighter.ignoreSyntaxHighlightList.some((item) =>\n item instanceof RegExp ? item.test(fileName) : fileName === item\n )\n ) {\n __DEV__ &&\n console.warn(\n `ignore syntax for current file, because the fileName is in the ignoreSyntaxHighlightList: ${fileName}`\n );\n return;\n }\n\n if (hasRegisteredLang) {\n return lowlight.highlight(lang, raw);\n } else {\n return lowlight.highlightAuto(raw);\n }\n },\n});\n\nObject.defineProperty(instance, "processAST", {\n value: (ast: DiffAST) => {\n return processAST(ast);\n },\n});\n\nObject.defineProperty(instance, "hasRegisteredCurrentLang", {\n value: (lang: string) => {\n return lowlight.registered(lang);\n },\n});\n\nexport { processAST } from "./processAST";\n\nexport const versions = __VERSION__;\n\nexport const highlighter: DiffHighlighter = instance as DiffHighlighter;\n'
109+
);
108110

109-
const [file2, setFile2] = useState("foo xbr baz");
111+
const [file2, setFile2] = useState(
112+
'import { getHighlighter } from "shiki";\n\nimport { processAST, type SyntaxLine } from "./processAST";\n\nimport type { codeToHast } from "shiki";\n\nexport type DiffAST = DePromise<ReturnType<typeof codeToHast>>;\n\nexport type DiffHighlighter = {\n name: string;\n maxLineToIgnoreSyntax: number;\n setMaxLineToIgnoreSyntax: (v: number) => void;\n ignoreSyntaxHighlightList: (string | RegExp)[];\n setIgnoreSyntaxHighlightList: (v: (string | RegExp)[]) => void;\n getAST: (raw: string, fileName?: string, lang?: string) => DiffAST;\n processAST: (ast: DiffAST) => { syntaxFileObject: Record<number, SyntaxLine>; syntaxFileLineNumber: number };\n hasRegisteredCurrentLang: (lang: string) => boolean;\n getHighlighterEngine: () => DePromise<ReturnType<typeof getHighlighter>> | null;\n};\n\nlet internal: DePromise<ReturnType<typeof getHighlighter>> | null = null;\n\nconst getDefaultHighlighter = async () =>\n await getHighlighter({\n themes: ["github-light", "github-dark"],\n langs: [\n "cpp",\n "java",\n "javascript",\n "css",\n "c#",\n "c",\n "c++",\n "vue",\n "vue-html",\n "astro",\n "bash",\n "make",\n "markdown",\n "makefile",\n "bat",\n "cmake",\n "cmd",\n "csv",\n "docker",\n "dockerfile",\n "go",\n "python",\n "html",\n "jsx",\n "tsx",\n "typescript",\n "sql",\n "xml",\n "sass",\n "ssh-config",\n "kotlin",\n "json",\n "swift",\n "txt",\n "diff",\n ],\n });\n\nconst instance = { name: "shiki" };\n\nlet _maxLineToIgnoreSyntax = 2000;\n\nconst _ignoreSyntaxHighlightList: (string | RegExp)[] = [];\n\nObject.defineProperty(instance, "maxLineToIgnoreSyntax", {\n get: () => _maxLineToIgnoreSyntax,\n});\n\nObject.defineProperty(instance, "setMaxLineToIgnoreSyntax", {\n value: (v: number) => {\n _maxLineToIgnoreSyntax = v;\n },\n});\n\nObject.defineProperty(instance, "ignoreSyntaxHighlightList", {\n get: () => _ignoreSyntaxHighlightList,\n});\n\nObject.defineProperty(instance, "setIgnoreSyntaxHighlightList", {\n value: (v: (string | RegExp)[]) => {\n _ignoreSyntaxHighlightList.length = 0;\n _ignoreSyntaxHighlightList.push(...v);\n },\n});\n\nObject.defineProperty(instance, "getAST", {\n value: (raw: string, fileName?: string, lang?: string) => {\n if (\n fileName &&\n highlighter.ignoreSyntaxHighlightList.some((item) =>\n item instanceof RegExp ? item.test(fileName) : fileName === item\n )\n ) {\n __DEV__ &&\n console.warn(\n `ignore syntax for current file, because the fileName is in the ignoreSyntaxHighlightList: ${fileName}`\n );\n return;\n }\n\n try {\n return internal?.codeToHast(raw, { lang: lang, theme: "github-light", mergeWhitespaces: false });\n } catch (e) {\n if (__DEV__) {\n console.error(e);\n } else {\n console.log((e as Error).message);\n }\n return;\n }\n },\n});\n\nObject.defineProperty(instance, "processAST", {\n value: (ast: DiffAST) => {\n return processAST(ast);\n },\n});\n\nObject.defineProperty(instance, "hasRegisteredCurrentLang", {\n value: (lang: string) => {\n return internal?.getLanguage(lang) !== undefined;\n },\n});\n\nObject.defineProperty(instance, "getHighlighterEngine", {\n value: () => {\n return internal;\n },\n});\n\nconst highlighter: DiffHighlighter = instance as DiffHighlighter;\n\nexport const highlighterReady = new Promise<DiffHighlighter>((r) => {\n if (internal) {\n r(highlighter);\n } else {\n getDefaultHighlighter()\n .then((i) => {\n internal = i;\n })\n .then(() => r(highlighter));\n }\n});\n\nexport { processAST } from "./processAST";\n\nexport const versions = __VERSION__;\n\nexport * from "shiki";\n'
113+
);
110114

111115
const [diffInstance, setDiffInstance] = useState<DiffFile>();
112116

0 commit comments

Comments
 (0)