Skip to content

Commit 4846599

Browse files
MrWangJustToDoMrWangJustToDo
committed
wip
1 parent 3c7b301 commit 4846599

File tree

10 files changed

+135
-26
lines changed

10 files changed

+135
-26
lines changed

‎packages/core/index.d.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -277,8 +277,10 @@ export declare class DiffLine {
277277
changes?: IRange;
278278
diffChanges?: DiffRange;
279279
plainTemplate?: string;
280+
plainTemplateMode?: "fast-diff" | "relative";
280281
syntaxTemplate?: string;
281-
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, syntaxTemplate?: string);
282+
syntaxTemplateMode?: "fast-diff" | "relative";
283+
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, plainTemplateMode?: "fast-diff" | "relative", syntaxTemplate?: string, syntaxTemplateMode?: "fast-diff" | "relative");
282284
withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine;
283285
isIncludeableLine(): boolean;
284286
equals(other: DiffLine): boolean;
@@ -441,6 +443,11 @@ export declare const getPlainDiffTemplate: ({ diffLine, rawLine, operator, }: {
441443
rawLine: string;
442444
operator: "add" | "del";
443445
}) => void;
446+
export declare const getPlainDiffTemplateByFastDiff: ({ diffLine, rawLine, operator, }: {
447+
diffLine: DiffLine;
448+
rawLine: string;
449+
operator: "add" | "del";
450+
}) => void;
444451
export declare const getPlainLineTemplate: (line: string) => string;
445452
export declare const getSplitContentLines: (diffFile: DiffFile) => DiffSplitContentLineItem[];
446453
export declare const getSplitLines: (diffFile: DiffFile) => DiffSplitLineItem[];

‎packages/core/src/parse/diff-line.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,9 @@ export class DiffLine {
2222
public changes?: IRange,
2323
public diffChanges?: DiffRange,
2424
public plainTemplate?: string,
25-
public syntaxTemplate?: string
25+
public plainTemplateMode?: "fast-diff" | "relative",
26+
public syntaxTemplate?: string,
27+
public syntaxTemplateMode?: "fast-diff" | "relative",
2628
) {}
2729

2830
public withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine {

‎packages/core/src/parse/diff-tool.ts‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -123,8 +123,16 @@ export const getDiffRange = (
123123
deletion.changes = delRange;
124124
}
125125
if (!addition.plainTemplate || !deletion.plainTemplate) {
126-
getPlainDiffTemplate({ diffLine: addition, rawLine: getAdditionRaw(addition.newLineNumber), operator: "add" });
127-
getPlainDiffTemplate({ diffLine: deletion, rawLine: getDeletionRaw(deletion.oldLineNumber), operator: "del" });
126+
getPlainDiffTemplate({
127+
diffLine: addition,
128+
rawLine: getAdditionRaw(addition.newLineNumber),
129+
operator: "add",
130+
});
131+
getPlainDiffTemplate({
132+
diffLine: deletion,
133+
rawLine: getDeletionRaw(deletion.oldLineNumber),
134+
operator: "del",
135+
});
128136
}
129137
if (!addition.syntaxTemplate || !deletion.syntaxTemplate) {
130138
getSyntaxDiffTemplate({
@@ -138,11 +146,6 @@ export const getDiffRange = (
138146
operator: "del",
139147
});
140148
}
141-
142-
// TODO! support word diff
143-
// const { addRange: _addRange, delRange: _delRange } = diffChanges(_addition, _deletion);
144-
// addition.diffChanges = _addRange;
145-
// deletion.diffChanges = _delRange;
146149
}
147150
}
148151
};

‎packages/core/src/parse/template.ts‎

Lines changed: 79 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export const getPlainDiffTemplate = ({
1919
rawLine: string;
2020
operator: "add" | "del";
2121
}) => {
22-
if (diffLine.plainTemplate) return;
22+
if (diffLine.plainTemplate && diffLine.plainTemplateMode === "relative") return;
2323

2424
const changes = diffLine.changes;
2525

@@ -28,22 +28,78 @@ export const getPlainDiffTemplate = ({
2828
const transform = isTransformEnabled() ? processTransformTemplateContent : defaultTransform;
2929

3030
const range = changes.range;
31+
3132
const str1 = rawLine.slice(0, range.location);
33+
3234
const str2 = rawLine.slice(range.location, range.location + range.length);
35+
3336
const str3 = rawLine.slice(range.location + range.length);
37+
3438
const isLast = str2.includes("\n");
35-
const _str2 = isLast ? str2.replace("\n", "").replace("\r", "") : str2;
39+
3640
const isNewLineSymbolChanged = changes.newLineSymbol;
3741

38-
const template = `<span data-range-start="${range.location}" data-range-end="${
39-
range.location + range.length
40-
}">${transform(str1)}<span data-diff-highlight style="background-color: var(${operator === "add" ? addContentHighlightBGName : delContentHighlightBGName});border-radius: 0.2em;">${
41-
isLast
42-
? `${transform(_str2)}<span data-newline-symbol>${getSymbol(isNewLineSymbolChanged)}</span>`
43-
: transform(str2)
44-
}</span>${transform(str3)}</span>`;
42+
let template = `<span data-range-start="${range.location}" data-range-end="${range.location + range.length}">`;
43+
44+
template += transform(str1);
45+
46+
template += `<span data-diff-highlight style="background-color: var(${operator === "add" ? addContentHighlightBGName : delContentHighlightBGName});border-radius: 0.2em;">`;
47+
48+
template += isLast
49+
? `${transform(str2)}<span data-newline-symbol>${getSymbol(isNewLineSymbolChanged)}</span>`
50+
: transform(str2);
51+
52+
template += `</span>`;
53+
54+
template += transform(str3);
55+
56+
template += `</span>`;
57+
58+
diffLine.plainTemplate = template;
59+
60+
diffLine.plainTemplateMode = "relative";
61+
};
62+
63+
export const getPlainDiffTemplateByFastDiff = ({
64+
diffLine,
65+
rawLine,
66+
operator,
67+
}: {
68+
diffLine: DiffLine;
69+
rawLine: string;
70+
operator: "add" | "del";
71+
}) => {
72+
const changes = diffLine.diffChanges;
73+
74+
if (!changes || !changes.hasLineChange || !rawLine) return;
75+
76+
const transform = isTransformEnabled() ? processTransformTemplateContent : defaultTransform;
77+
78+
let template = ``;
79+
80+
changes.range.forEach(({ type, str, location, length }, index, array) => {
81+
const isLatest = index === array.length - 1;
82+
if (type === 0) {
83+
template += `<span>${transform(str)}`;
84+
template +=
85+
isLatest && changes.newLineSymbol
86+
? `<span data-newline-symbol data-diff-highlight style="background-color: var(${operator === "add" ? addContentHighlightBGName : delContentHighlightBGName});border-radius: 0.2em;">${getSymbol(changes.newLineSymbol)}</span>`
87+
: "";
88+
template += `</span>`;
89+
} else {
90+
template += `<span data-range-start="${location}" data-range-end="${location + length}">`;
91+
template += `<span data-diff-highlight style="background-color: var(${operator === "add" ? addContentHighlightBGName : delContentHighlightBGName});border-radius: 0.2em;">${transform(str)}`;
92+
template +=
93+
isLatest && changes.newLineSymbol
94+
? `<span data-newline-symbol data-diff-highlight>${getSymbol(changes.newLineSymbol)}</span>`
95+
: "";
96+
template += `</span></span>`;
97+
}
98+
});
4599

46100
diffLine.plainTemplate = template;
101+
102+
diffLine.plainTemplateMode = "fast-diff";
47103
};
48104

49105
export const getSyntaxDiffTemplate = ({
@@ -55,7 +111,9 @@ export const getSyntaxDiffTemplate = ({
55111
syntaxLine: SyntaxLineWithTemplate;
56112
operator: "add" | "del";
57113
}) => {
58-
if (diffLine.syntaxTemplate || !syntaxLine) return;
114+
if (!syntaxLine) return;
115+
116+
if (diffLine.syntaxTemplate && diffLine.syntaxTemplateMode === "relative") return;
59117

60118
const changes = diffLine.changes;
61119

@@ -74,21 +132,28 @@ export const getSyntaxDiffTemplate = ({
74132
)?.join(" ")}" style="${wrapper?.properties?.style || ""}">${transform(node.value)}</span>`;
75133
} else {
76134
const index1 = range.location - node.startIndex;
135+
77136
const index2 = index1 < 0 ? 0 : index1;
137+
78138
const str1 = node.value.slice(0, index2);
139+
79140
const str2 = node.value.slice(index2, index1 + range.length);
141+
80142
const str3 = node.value.slice(index1 + range.length);
143+
81144
const isStart = str1.length || range.location === node.startIndex;
145+
82146
const isEnd = str3.length || node.endIndex === range.location + range.length - 1;
147+
83148
const isLast = str2.includes("\n");
84-
const _str2 = isLast ? str2.replace("\n", "").replace("\r", "") : str2;
149+
85150
template += `<span data-start="${node.startIndex}" data-end="${node.endIndex}" class="${(
86151
wrapper?.properties?.className || []
87152
)?.join(
88153
" "
89154
)}" style="${wrapper?.properties?.style || ""}">${transform(str1)}<span data-diff-highlight style="background-color: var(${operator === "add" ? addContentHighlightBGName : delContentHighlightBGName});border-top-left-radius: ${isStart ? "0.2em" : "0"};border-bottom-left-radius: ${isStart ? "0.2em" : "0"};border-top-right-radius: ${isEnd || isLast ? "0.2em" : "0"};border-bottom-right-radius: ${isEnd || isLast ? "0.2em" : "0"}">${
90155
isLast
91-
? `${transform(_str2)}<span data-newline-symbol>${getSymbol(changes.newLineSymbol)}</span>`
156+
? `${transform(str2)}<span data-newline-symbol>${getSymbol(changes.newLineSymbol)}</span>`
92157
: transform(str2)
93158
}</span>${transform(str3)}</span>`;
94159
}
@@ -97,6 +162,8 @@ export const getSyntaxDiffTemplate = ({
97162
template += "</span>";
98163

99164
diffLine.syntaxTemplate = template;
165+
166+
diffLine.syntaxTemplateMode = "relative";
100167
};
101168

102169
export const getSyntaxLineTemplate = (line: SyntaxLine) => {

‎packages/file/index.d.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,8 +276,10 @@ export declare class DiffLine {
276276
changes?: IRange;
277277
diffChanges?: DiffRange;
278278
plainTemplate?: string;
279+
plainTemplateMode?: "fast-diff" | "relative";
279280
syntaxTemplate?: string;
280-
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, syntaxTemplate?: string);
281+
syntaxTemplateMode?: "fast-diff" | "relative";
282+
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, plainTemplateMode?: "fast-diff" | "relative", syntaxTemplate?: string, syntaxTemplateMode?: "fast-diff" | "relative");
281283
withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine;
282284
isIncludeableLine(): boolean;
283285
equals(other: DiffLine): boolean;
@@ -440,6 +442,11 @@ export declare const getPlainDiffTemplate: ({ diffLine, rawLine, operator, }: {
440442
rawLine: string;
441443
operator: "add" | "del";
442444
}) => void;
445+
export declare const getPlainDiffTemplateByFastDiff: ({ diffLine, rawLine, operator, }: {
446+
diffLine: DiffLine;
447+
rawLine: string;
448+
operator: "add" | "del";
449+
}) => void;
443450
export declare const getPlainLineTemplate: (line: string) => string;
444451
export declare const getSplitContentLines: (diffFile: DiffFile) => DiffSplitContentLineItem[];
445452
export declare const getSplitLines: (diffFile: DiffFile) => DiffSplitLineItem[];

‎packages/react/index.d.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,8 +276,10 @@ export declare class DiffLine {
276276
changes?: IRange;
277277
diffChanges?: DiffRange;
278278
plainTemplate?: string;
279+
plainTemplateMode?: "fast-diff" | "relative";
279280
syntaxTemplate?: string;
280-
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, syntaxTemplate?: string);
281+
syntaxTemplateMode?: "fast-diff" | "relative";
282+
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, plainTemplateMode?: "fast-diff" | "relative", syntaxTemplate?: string, syntaxTemplateMode?: "fast-diff" | "relative");
281283
withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine;
282284
isIncludeableLine(): boolean;
283285
equals(other: DiffLine): boolean;
@@ -440,6 +442,11 @@ export declare const getPlainDiffTemplate: ({ diffLine, rawLine, operator, }: {
440442
rawLine: string;
441443
operator: "add" | "del";
442444
}) => void;
445+
export declare const getPlainDiffTemplateByFastDiff: ({ diffLine, rawLine, operator, }: {
446+
diffLine: DiffLine;
447+
rawLine: string;
448+
operator: "add" | "del";
449+
}) => void;
443450
export declare const getPlainLineTemplate: (line: string) => string;
444451
export declare const getSplitContentLines: (diffFile: DiffFile) => DiffSplitContentLineItem[];
445452
export declare const getSplitLines: (diffFile: DiffFile) => DiffSplitLineItem[];

‎packages/solid/index.d.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,8 +276,10 @@ export declare class DiffLine {
276276
changes?: IRange;
277277
diffChanges?: DiffRange;
278278
plainTemplate?: string;
279+
plainTemplateMode?: "fast-diff" | "relative";
279280
syntaxTemplate?: string;
280-
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, syntaxTemplate?: string);
281+
syntaxTemplateMode?: "fast-diff" | "relative";
282+
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, plainTemplateMode?: "fast-diff" | "relative", syntaxTemplate?: string, syntaxTemplateMode?: "fast-diff" | "relative");
281283
withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine;
282284
isIncludeableLine(): boolean;
283285
equals(other: DiffLine): boolean;
@@ -440,6 +442,11 @@ export declare const getPlainDiffTemplate: ({ diffLine, rawLine, operator, }: {
440442
rawLine: string;
441443
operator: "add" | "del";
442444
}) => void;
445+
export declare const getPlainDiffTemplateByFastDiff: ({ diffLine, rawLine, operator, }: {
446+
diffLine: DiffLine;
447+
rawLine: string;
448+
operator: "add" | "del";
449+
}) => void;
443450
export declare const getPlainLineTemplate: (line: string) => string;
444451
export declare const getSplitContentLines: (diffFile: DiffFile) => DiffSplitContentLineItem[];
445452
export declare const getSplitLines: (diffFile: DiffFile) => DiffSplitLineItem[];

‎packages/svelte/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
"dev": "vite dev",
66
"build": "npm run prepack",
77
"preview": "vite preview",
8+
"prepack": "svelte-kit sync && svelte-package",
89
"prepare": "svelte-kit sync || echo ''",
910
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
1011
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",

‎packages/vue/index.d.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,8 +276,10 @@ export declare class DiffLine {
276276
changes?: IRange;
277277
diffChanges?: DiffRange;
278278
plainTemplate?: string;
279+
plainTemplateMode?: "fast-diff" | "relative";
279280
syntaxTemplate?: string;
280-
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, syntaxTemplate?: string);
281+
syntaxTemplateMode?: "fast-diff" | "relative";
282+
constructor(text: string, type: DiffLineType, originalLineNumber: number | null, oldLineNumber: number | null, newLineNumber: number | null, noTrailingNewLine?: boolean, changes?: IRange, diffChanges?: DiffRange, plainTemplate?: string, plainTemplateMode?: "fast-diff" | "relative", syntaxTemplate?: string, syntaxTemplateMode?: "fast-diff" | "relative");
281283
withNoTrailingNewLine(noTrailingNewLine: boolean): DiffLine;
282284
isIncludeableLine(): boolean;
283285
equals(other: DiffLine): boolean;
@@ -440,6 +442,11 @@ export declare const getPlainDiffTemplate: ({ diffLine, rawLine, operator, }: {
440442
rawLine: string;
441443
operator: "add" | "del";
442444
}) => void;
445+
export declare const getPlainDiffTemplateByFastDiff: ({ diffLine, rawLine, operator, }: {
446+
diffLine: DiffLine;
447+
rawLine: string;
448+
operator: "add" | "del";
449+
}) => void;
443450
export declare const getPlainLineTemplate: (line: string) => string;
444451
export declare const getSplitContentLines: (diffFile: DiffFile) => DiffSplitContentLineItem[];
445452
export declare const getSplitLines: (diffFile: DiffFile) => DiffSplitLineItem[];

‎ui/solid-example/src/App.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ function App() {
4040
worker.addEventListener("message", (e: MessageEvent<MessageData>) => {
4141
const { data, bundle } = e.data;
4242
const instance = DiffFile.createInstance(data || {}, bundle);
43-
instance.disableTemplate();
43+
// instance.disableTemplate();
44+
console.log(instance);
4445
setDiffFile(instance);
4546
});
4647

0 commit comments

Comments
 (0)