Skip to content

Commit 9b79a72

Browse files
MrWangJustToDoMrWangJustToDo
committed
highlighter optimize
1 parent e6c7243 commit 9b79a72

22 files changed

+295
-43
lines changed

‎packages/core/index.d.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ declare class File$1 {
1818
syntaxFile: Record<number, SyntaxLine>;
1919
hasDoSyntax: boolean;
2020
syntaxLength?: number;
21-
highlighterName?: string;
21+
highlighterName?: DiffHighlighter["name"];
22+
highlighterType?: DiffHighlighter["type"];
2223
maxLineNumber: number;
2324
static createInstance(data: File$1): File$1;
2425
constructor(raw: string, lang: string, fileName?: string);
@@ -522,6 +523,7 @@ export interface UnifiedLineItem {
522523
export type DiffAST = ReturnType<typeof lowlight.highlight>;
523524
export type DiffHighlighter = {
524525
name: string;
526+
type: "class" | "style" | string;
525527
maxLineToIgnoreSyntax: number;
526528
setMaxLineToIgnoreSyntax: (v: number) => void;
527529
ignoreSyntaxHighlightList: (string | RegExp)[];

‎packages/core/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/core",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [
@@ -52,7 +52,7 @@
5252
"diff parse"
5353
],
5454
"dependencies": {
55-
"@git-diff-view/lowlight": "^0.0.17",
55+
"@git-diff-view/lowlight": "^0.0.18",
5656
"highlight.js": "^11.9.0",
5757
"lowlight": "^3.1.0",
5858
"fast-diff": "^1.3.0"

‎packages/core/src/file.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,9 @@ export class File {
4141

4242
syntaxLength?: number;
4343

44-
highlighterName?: string;
44+
highlighterName?: DiffHighlighter["name"];
45+
46+
highlighterType?: DiffHighlighter["type"];
4547

4648
maxLineNumber: number = 0;
4749

@@ -64,6 +66,8 @@ export class File {
6466

6567
file.highlighterName = data?.highlighterName;
6668

69+
file.highlighterType = data?.highlighterType;
70+
6771
file.maxLineNumber = data?.maxLineNumber;
6872

6973
return file;
@@ -110,6 +114,8 @@ export class File {
110114

111115
this.highlighterName = finalHighlighter.name;
112116

117+
this.highlighterType = finalHighlighter.type;
118+
113119
if (__DEV__) {
114120
this.#doCheck();
115121
}
@@ -181,7 +187,7 @@ export const getFile = (raw: string, lang: string, theme: "light" | "dark", file
181187
if (map.has(otherThemeKey)) {
182188
const cacheFile = map.get(otherThemeKey);
183189
// 基于className的ast不需要重新生成
184-
if (cacheFile.highlighterName === highlighter.name) {
190+
if (cacheFile.highlighterType === 'class') {
185191
return cacheFile;
186192
}
187193
}

‎packages/file/index.d.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ declare class File$1 {
1818
syntaxFile: Record<number, SyntaxLine>;
1919
hasDoSyntax: boolean;
2020
syntaxLength?: number;
21-
highlighterName?: string;
21+
highlighterName?: DiffHighlighter["name"];
22+
highlighterType?: DiffHighlighter["type"];
2223
maxLineNumber: number;
2324
static createInstance(data: File$1): File$1;
2425
constructor(raw: string, lang: string, fileName?: string);
@@ -521,6 +522,7 @@ export interface UnifiedLineItem {
521522
export type DiffAST = ReturnType<typeof lowlight.highlight>;
522523
export type DiffHighlighter = {
523524
name: string;
525+
type: "class" | "style" | string;
524526
maxLineToIgnoreSyntax: number;
525527
setMaxLineToIgnoreSyntax: (v: number) => void;
526528
ignoreSyntaxHighlightList: (string | RegExp)[];

‎packages/file/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/file",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [
@@ -52,7 +52,7 @@
5252
"diff parse"
5353
],
5454
"dependencies": {
55-
"@git-diff-view/core": "^0.0.17",
55+
"@git-diff-view/core": "^0.0.18",
5656
"diff": "^5.2.0",
5757
"highlight.js": "^11.9.0",
5858
"lowlight": "^3.1.0",

‎packages/lowlight/index.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ declare const lowlight: {
4242
export type DiffAST = ReturnType<typeof lowlight.highlight>;
4343
export type DiffHighlighter = {
4444
name: string;
45+
type: "class" | "style" | string;
4546
maxLineToIgnoreSyntax: number;
4647
setMaxLineToIgnoreSyntax: (v: number) => void;
4748
ignoreSyntaxHighlightList: (string | RegExp)[];

‎packages/lowlight/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/lowlight",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [

‎packages/lowlight/src/index.ts

+3
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ export type DiffAST = ReturnType<typeof lowlight.highlight>;
5656

5757
export type DiffHighlighter = {
5858
name: string;
59+
type: "class" | "style" | string;
5960
maxLineToIgnoreSyntax: number;
6061
setMaxLineToIgnoreSyntax: (v: number) => void;
6162
ignoreSyntaxHighlightList: (string | RegExp)[];
@@ -135,6 +136,8 @@ Object.defineProperty(instance, "hasRegisteredCurrentLang", {
135136
},
136137
});
137138

139+
Object.defineProperty(instance, "type", { value: "class" });
140+
138141
export { processAST } from "./processAST";
139142

140143
export const versions = __VERSION__;

‎packages/react/index.d.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ declare class File$1 {
1818
syntaxFile: Record<number, SyntaxLine>;
1919
hasDoSyntax: boolean;
2020
syntaxLength?: number;
21-
highlighterName?: string;
21+
highlighterName?: DiffHighlighter["name"];
22+
highlighterType?: DiffHighlighter["type"];
2223
maxLineNumber: number;
2324
static createInstance(data: File$1): File$1;
2425
constructor(raw: string, lang: string, fileName?: string);
@@ -521,6 +522,7 @@ export interface UnifiedLineItem {
521522
export type DiffAST = ReturnType<typeof lowlight.highlight>;
522523
export type DiffHighlighter = {
523524
name: string;
525+
type: "class" | "style" | string;
524526
maxLineToIgnoreSyntax: number;
525527
setMaxLineToIgnoreSyntax: (v: number) => void;
526528
ignoreSyntaxHighlightList: (string | RegExp)[];

‎packages/react/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/react",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [
@@ -61,7 +61,7 @@
6161
"react diff component"
6262
],
6363
"dependencies": {
64-
"@git-diff-view/core": "^0.0.17",
64+
"@git-diff-view/core": "^0.0.18",
6565
"@types/hast": "^3.0.0",
6666
"fast-diff": "^1.3.0",
6767
"highlight.js": "^11.9.0",

‎packages/react/postcss.config.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,9 @@ module.exports = {
1313
}
1414
if (filePath.includes("node_modules")) {
1515
if (filePath.includes("dark.css")) {
16-
return `${prefix}[data-theme="dark"] ${selector}`;
16+
return `${prefix}[data-theme="dark"] .diff-line-syntax-raw ${selector}`;
1717
} else {
18-
return `${prefix}[data-theme="light"] ${selector}`;
18+
return `${prefix}[data-theme="light"] .diff-line-syntax-raw ${selector}`;
1919
}
2020
} else {
2121
return prefixedSelector;

‎packages/react/src/components/DiffContent.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { diffFontSizeName, memoFunc } from "./tools";
88
const temp = {};
99

1010
const formatStringToCamelCase = (str: string) => {
11+
if (str.startsWith('--')) return str;
1112
const splitted = str.split("-");
1213
if (splitted.length === 1) return splitted[0];
1314
return (

‎packages/react/src/tailwind.css

+9
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@
2525
color: black;
2626
}
2727

28+
.diff-style-root .diff-line-syntax-raw *,
29+
[data-theme="light"] .diff-line-syntax-raw * {
30+
color: var(--diff-view-light, inherit);
31+
}
32+
2833
[data-theme="dark"] .diff-style-root {
2934
--diff-border--: #3d444d;
3035
--diff-add-content--: #14261f;
@@ -48,6 +53,10 @@
4853
color: white;
4954
}
5055

56+
[data-theme="dark"] .diff-line-syntax-raw * {
57+
color: var(--diff-view-dark, inherit);
58+
}
59+
5160
table,
5261
tr,
5362
td {

‎packages/shiki/index.d.ts

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// Generated by dts-bundle-generator v9.5.1
22

3-
import { codeToHast, getHighlighter } from 'shiki';
3+
import { codeToHast, createHighlighter } from 'shiki';
44

55
export type SyntaxNode = {
66
type: string;
@@ -31,6 +31,7 @@ export type DePromise<T> = T extends Promise<infer U> ? DePromise<U> : T;
3131
export type DiffAST = DePromise<ReturnType<typeof codeToHast>>;
3232
export type DiffHighlighter = {
3333
name: string;
34+
type: "class" | "style" | string;
3435
maxLineToIgnoreSyntax: number;
3536
setMaxLineToIgnoreSyntax: (v: number) => void;
3637
ignoreSyntaxHighlightList: (string | RegExp)[];
@@ -41,15 +42,15 @@ export type DiffHighlighter = {
4142
syntaxFileLineNumber: number;
4243
};
4344
hasRegisteredCurrentLang: (lang: string) => boolean;
44-
getHighlighterEngine: () => DePromise<ReturnType<typeof getHighlighter>> | null;
45+
getHighlighterEngine: () => DePromise<ReturnType<typeof createHighlighter>> | null;
4546
};
4647
export declare const highlighterReady: Promise<DiffHighlighter>;
4748
export declare const versions: string;
4849
export * from "shiki";
4950

5051
export {
5152
codeToHast,
52-
getHighlighter,
53+
createHighlighter,
5354
};
5455

5556
export {};

‎packages/shiki/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/shiki",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"types": "index.d.ts",
88
"type": "module",
99
"files": [
@@ -44,6 +44,6 @@
4444
"virtual dom highlight"
4545
],
4646
"dependencies": {
47-
"shiki": "^1.7.0"
47+
"shiki": "^1.22.0"
4848
}
4949
}

‎packages/shiki/src/index.ts

+14-6
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { getHighlighter } from "shiki";
1+
import { createHighlighter } from "shiki";
22

33
import { processAST, type SyntaxLine } from "./processAST";
44

@@ -10,20 +10,21 @@ export type DiffAST = DePromise<ReturnType<typeof codeToHast>>;
1010

1111
export type DiffHighlighter = {
1212
name: string;
13+
type: "class" | "style" | string;
1314
maxLineToIgnoreSyntax: number;
1415
setMaxLineToIgnoreSyntax: (v: number) => void;
1516
ignoreSyntaxHighlightList: (string | RegExp)[];
1617
setIgnoreSyntaxHighlightList: (v: (string | RegExp)[]) => void;
1718
getAST: (raw: string, fileName?: string, lang?: string, theme?: "light" | "dark") => DiffAST;
1819
processAST: (ast: DiffAST) => { syntaxFileObject: Record<number, SyntaxLine>; syntaxFileLineNumber: number };
1920
hasRegisteredCurrentLang: (lang: string) => boolean;
20-
getHighlighterEngine: () => DePromise<ReturnType<typeof getHighlighter>> | null;
21+
getHighlighterEngine: () => DePromise<ReturnType<typeof createHighlighter>> | null;
2122
};
2223

23-
let internal: DePromise<ReturnType<typeof getHighlighter>> | null = null;
24+
let internal: DePromise<ReturnType<typeof createHighlighter>> | null = null;
2425

2526
const getDefaultHighlighter = async () =>
26-
await getHighlighter({
27+
await createHighlighter({
2728
themes: ["github-light", "github-dark"],
2829
langs: [
2930
"cpp",
@@ -92,7 +93,7 @@ Object.defineProperty(instance, "setIgnoreSyntaxHighlightList", {
9293
});
9394

9495
Object.defineProperty(instance, "getAST", {
95-
value: (raw: string, fileName?: string, lang?: string, theme?: "light" | "dark") => {
96+
value: (raw: string, fileName?: string, lang?: string) => {
9697
if (
9798
fileName &&
9899
highlighter.ignoreSyntaxHighlightList.some((item) =>
@@ -109,7 +110,12 @@ Object.defineProperty(instance, "getAST", {
109110
try {
110111
return internal?.codeToHast(raw, {
111112
lang: lang,
112-
theme: theme === "dark" ? "github-dark" : "github-light",
113+
themes: {
114+
dark: "github-dark",
115+
light: "github-light",
116+
},
117+
cssVariablePrefix: "--diff-view-",
118+
defaultColor: false,
113119
mergeWhitespaces: false,
114120
});
115121
} catch (e) {
@@ -141,6 +147,8 @@ Object.defineProperty(instance, "getHighlighterEngine", {
141147
},
142148
});
143149

150+
Object.defineProperty(instance, "type", { value: "class" });
151+
144152
const highlighter: DiffHighlighter = instance as DiffHighlighter;
145153

146154
export const highlighterReady = new Promise<DiffHighlighter>((r) => {

‎packages/vue/index.d.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ declare class File$1 {
1818
syntaxFile: Record<number, SyntaxLine>;
1919
hasDoSyntax: boolean;
2020
syntaxLength?: number;
21-
highlighterName?: string;
21+
highlighterName?: DiffHighlighter["name"];
22+
highlighterType?: DiffHighlighter["type"];
2223
maxLineNumber: number;
2324
static createInstance(data: File$1): File$1;
2425
constructor(raw: string, lang: string, fileName?: string);
@@ -521,6 +522,7 @@ export interface UnifiedLineItem {
521522
export type DiffAST = ReturnType<typeof lowlight.highlight>;
522523
export type DiffHighlighter = {
523524
name: string;
525+
type: "class" | "style" | string;
524526
maxLineToIgnoreSyntax: number;
525527
setMaxLineToIgnoreSyntax: (v: number) => void;
526528
ignoreSyntaxHighlightList: (string | RegExp)[];

‎packages/vue/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"description": "@git-diff-view/vue",
44
"author": "MrWangJustToDo",
55
"license": "MIT",
6-
"version": "0.0.17",
6+
"version": "0.0.18",
77
"main": "index.js",
88
"type": "module",
99
"types": "index.d.ts",
@@ -49,7 +49,7 @@
4949
"vue diff component"
5050
],
5151
"dependencies": {
52-
"@git-diff-view/core": "^0.0.17",
52+
"@git-diff-view/core": "^0.0.18",
5353
"@types/hast": "^3.0.0",
5454
"highlight.js": "^11.9.0",
5555
"lowlight": "^3.1.0",

‎packages/vue/postcss.config.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@ export default {
99
}
1010
if (filePath.includes("node_modules")) {
1111
if (filePath.includes("github.css")) {
12-
return `${prefix}[data-theme="light"] ${selector}`;
12+
return `${prefix}[data-theme="light"] .diff-line-syntax-raw ${selector}`;
1313
} else if (filePath.includes("github-dark.css")) {
14-
return `${prefix}[data-theme="dark"] ${selector}`;
14+
return `${prefix}[data-theme="dark"] .diff-line-syntax-raw ${selector}`;
1515
}
1616
} else {
1717
return prefixedSelector;

0 commit comments

Comments
 (0)