Skip to content

Commit b4e6877

Browse files
MrWangJustToDoMrWangJustToDo
committed
fix height sync
1 parent 71e8328 commit b4e6877

17 files changed

+41
-58
lines changed

‎packages/core/package.json

Lines changed: 2 additions & 2 deletions
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.15",
6+
"version": "0.0.16",
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.15",
55+
"@git-diff-view/lowlight": "^0.0.16",
5656
"highlight.js": "^11.9.0",
5757
"lowlight": "^3.1.0"
5858
},

‎packages/file/package.json

Lines changed: 2 additions & 2 deletions
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.15",
6+
"version": "0.0.16",
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.15",
55+
"@git-diff-view/core": "^0.0.16",
5656
"diff": "^5.2.0",
5757
"highlight.js": "^11.9.0",
5858
"lowlight": "^3.1.0"

‎packages/lowlight/package.json

Lines changed: 1 addition & 1 deletion
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.15",
6+
"version": "0.0.16",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [

‎packages/react/package.json

Lines changed: 2 additions & 2 deletions
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.15",
6+
"version": "0.0.16",
77
"main": "index.js",
88
"types": "index.d.ts",
99
"files": [
@@ -60,7 +60,7 @@
6060
"react diff component"
6161
],
6262
"dependencies": {
63-
"@git-diff-view/core": "^0.0.15",
63+
"@git-diff-view/core": "^0.0.16",
6464
"@types/hast": "^3.0.0",
6565
"highlight.js": "^11.9.0",
6666
"lowlight": "^3.1.0",

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

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,17 +35,15 @@ const _DiffSplitExtendLine = ({
3535

3636
const currentLineNumber = side === SplitSide.old ? oldLine.lineNumber : newLine.lineNumber;
3737

38-
const otherSide = side === SplitSide.old ? SplitSide.new : SplitSide.old;
39-
4038
useSyncHeight({
4139
selector: `tr[data-line="${lineNumber}-extend"]`,
42-
side: currentExtend ? SplitSide[side] : SplitSide[otherSide],
43-
enable: side === SplitSide.new && typeof renderExtendLine === "function",
40+
side: SplitSide[side],
41+
enable: !!currentExtend?.data && typeof renderExtendLine === "function",
4442
});
4543

4644
const width = useDomWidth({
4745
selector: side === SplitSide.old ? ".old-diff-table-wrapper" : ".new-diff-table-wrapper",
48-
enable: !!currentExtend && typeof renderExtendLine === "function",
46+
enable: !!currentExtend?.data && typeof renderExtendLine === "function",
4947
});
5048

5149
if (!renderExtendLine) return null;

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -159,8 +159,8 @@ const _DiffSplitHunkLineGitLab = ({
159159

160160
useSyncHeight({
161161
selector: `tr[data-line="${lineNumber}-hunk"]`,
162-
side: SplitSide[SplitSide.old],
163-
enable: side === SplitSide.new,
162+
side: SplitSide[side],
163+
enable: true,
164164
});
165165

166166
const couldExpand = expandEnabled && currentHunk && currentHunk.splitInfo;

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

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,16 +25,14 @@ const _DiffSplitWidgetLine = ({
2525
currentWidget: boolean;
2626
setWidget: (props: { side?: SplitSide; lineNumber?: number }) => void;
2727
}) => {
28-
const otherSide = side === SplitSide.old ? SplitSide.new : SplitSide.old;
29-
3028
const { useDiffContext } = useDiffViewContext();
3129

3230
const renderWidgetLine = useDiffContext(React.useCallback((s) => s.renderWidgetLine, []));
3331

3432
useSyncHeight({
3533
selector: `tr[data-line="${lineNumber}-widget"]`,
36-
side: currentWidget ? SplitSide[side] : SplitSide[otherSide],
37-
enable: side === SplitSide.new && typeof renderWidgetLine === "function",
34+
side: SplitSide[side],
35+
enable: currentWidget && typeof renderWidgetLine === "function",
3836
});
3937

4038
const width = useDomWidth({

‎packages/react/src/components/v2/DiffSplitExtendLineNormal_v2.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,17 +35,15 @@ const _DiffSplitExtendLine = ({
3535

3636
const currentLineNumber = side === SplitSide.old ? oldLine.lineNumber : newLine.lineNumber;
3737

38-
const otherSide = side === SplitSide.old ? SplitSide.new : SplitSide.old;
39-
4038
useSyncHeight({
4139
selector: `div[data-state="extend"][data-line="${lineNumber}-extend"]`,
42-
side: currentExtend ? SplitSide[side] : SplitSide[otherSide],
43-
enable: side === SplitSide.new && typeof renderExtendLine === "function",
40+
side: SplitSide[side],
41+
enable: !!currentExtend?.data && typeof renderExtendLine === "function",
4442
});
4543

4644
const width = useDomWidth({
4745
selector: side === SplitSide.old ? ".old-diff-table-wrapper" : ".new-diff-table-wrapper",
48-
enable: !!currentExtend && typeof renderExtendLine === "function",
46+
enable: !!currentExtend?.data && typeof renderExtendLine === "function",
4947
});
5048

5149
if (!renderExtendLine) return null;

‎packages/react/src/components/v2/DiffSplitHunkLineNormal_v2.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -149,8 +149,8 @@ const _DiffSplitHunkLineGitLab = ({
149149

150150
useSyncHeight({
151151
selector: `div[data-state="hunk"][data-line="${lineNumber}-hunk"]`,
152-
side: SplitSide[SplitSide.old],
153-
enable: side === SplitSide.new,
152+
side: SplitSide[side],
153+
enable: true,
154154
});
155155

156156
const couldExpand = expandEnabled && currentHunk && currentHunk.splitInfo;

‎packages/react/src/components/v2/DiffSplitWidgetLineNormal_v2.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,16 +25,14 @@ const _DiffSplitWidgetLine = ({
2525
currentWidget: boolean;
2626
setWidget: (props: { side?: SplitSide; lineNumber?: number }) => void;
2727
}) => {
28-
const otherSide = side === SplitSide.old ? SplitSide.new : SplitSide.old;
29-
3028
const { useDiffContext } = useDiffViewContext();
3129

3230
const renderWidgetLine = useDiffContext(React.useCallback((s) => s.renderWidgetLine, []));
3331

3432
useSyncHeight({
3533
selector: `div[data-state="widget"][data-line="${lineNumber}-widget"]`,
36-
side: currentWidget ? SplitSide[side] : SplitSide[otherSide],
37-
enable: side === SplitSide.new && typeof renderWidgetLine === "function",
34+
side: SplitSide[side],
35+
enable: currentWidget && typeof renderWidgetLine === "function",
3836
});
3937

4038
const width = useDomWidth({

‎packages/react/src/hooks/useSyncHeight.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useDiffViewContext } from "../components/DiffViewContext";
44

55
import { useSafeLayout } from "./useSafeLayout";
66

7+
// TODO
78
export const useSyncHeight = ({ selector, side, enable }: { selector: string; side: string; enable: boolean }) => {
89
const { useDiffContext } = useDiffViewContext();
910

@@ -21,16 +22,15 @@ export const useSyncHeight = ({ selector, side, enable }: { selector: string; si
2122

2223
const target = ele1.getAttribute("data-side") === side ? ele1 : ele2;
2324

24-
const synced = ele1.getAttribute("data-side") !== side ? ele1 : ele2;
25-
2625
const cb = () => {
2726
ele1.style.height = "auto";
2827
ele2.style.height = "auto";
2928
const rect1 = ele1.getBoundingClientRect();
3029
const rect2 = ele2.getBoundingClientRect();
3130
if (rect1.height !== rect2.height) {
3231
const maxHeight = Math.max(rect1.height, rect2.height);
33-
synced.style.height = maxHeight + "px";
32+
ele1.style.height = maxHeight + "px";
33+
ele2.style.height = maxHeight + "px";
3434
ele1.setAttribute("data-sync-height", String(maxHeight));
3535
ele2.setAttribute("data-sync-height", String(maxHeight));
3636
} else {

‎packages/shiki/package.json

Lines changed: 1 addition & 1 deletion
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.15",
6+
"version": "0.0.16",
77
"types": "index.d.ts",
88
"type": "module",
99
"files": [

‎packages/vue/package.json

Lines changed: 2 additions & 2 deletions
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.15",
6+
"version": "0.0.16",
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.15",
52+
"@git-diff-view/core": "^0.0.16",
5353
"@types/hast": "^3.0.0",
5454
"highlight.js": "^11.9.0",
5555
"lowlight": "^3.1.0"

‎packages/vue/src/components/DiffSplitExtendLineNormal.tsx

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,6 @@ export const DiffSplitExtendLine = defineComponent(
1818

1919
const currentSide = computed(() => SplitSide[props.side]);
2020

21-
const otherSide = computed(() =>
22-
props.side === SplitSide.old ? SplitSide[SplitSide.new] : SplitSide[SplitSide.old]
23-
);
24-
2521
const lineSelector = computed(() => `tr[data-line="${props.lineNumber}-extend"]`);
2622

2723
const wrapperSelector = computed(() =>
@@ -66,16 +62,14 @@ export const DiffSplitExtendLine = defineComponent(
6662
)
6763
);
6864

69-
const currentSideIsNew = computed(() => props.side === SplitSide.new && currentIsShow.value);
70-
7165
const currentEnable = computed(
7266
() => (props.side === SplitSide.old ? !!oldLineExtend.value : !!newLineExtend.value) && currentIsShow.value
7367
);
7468

7569
useSyncHeight({
7670
selector: lineSelector,
77-
side: currentExtend.value ? currentSide : otherSide,
78-
enable: currentSideIsNew,
71+
side: currentSide,
72+
enable: currentIsShow,
7973
});
8074

8175
const width = useDomWidth({

‎packages/vue/src/components/DiffSplitHunkLineNormal.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -205,9 +205,9 @@ const DiffSplitHunkLineGitLab = defineComponent(
205205
currentHunk.value.splitInfo.startHiddenIndex < currentHunk.value.splitInfo.endHiddenIndex
206206
);
207207

208-
const currentSyncHeightSide = computed(() => SplitSide[SplitSide.old]);
208+
const currentSyncHeightSide = computed(() => SplitSide[props.side]);
209209

210-
const currentEnableSyncHeight = computed(() => props.side === SplitSide.new && currentIsShow.value);
210+
const currentEnableSyncHeight = computed(() => currentIsShow.value);
211211

212212
useSyncHeight({
213213
selector: lineSelector,

‎packages/vue/src/components/DiffSplitWidgetLineNormal.tsx

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -50,25 +50,22 @@ export const DiffSplitWidgetLine = defineComponent(
5050
props.side === SplitSide.old ? ".old-diff-table-wrapper" : ".new-diff-table-wrapper"
5151
);
5252

53-
const otherSide = computed(() => (props.side === SplitSide.old ? SplitSide.new : SplitSide.old));
53+
const observeSide = computed(() => SplitSide[props.side]);
5454

55-
const observeSide = computed(() => (currentWidget.value ? SplitSide[props.side] : SplitSide[otherSide.value]));
56-
57-
const currentIsShow = computed(() => !!oldLineWidget.value || !!newLineWidget.value);
55+
const currentIsShow = computed(
56+
() => (!!oldLineWidget.value || !!newLineWidget.value) && !currentLine.value.isHidden && !!slots.widget
57+
);
5858

5959
const currentWidget = computed(
60-
() =>
61-
(props.side === SplitSide.old ? oldLineWidget.value : newLineWidget.value) &&
62-
!!currentIsShow.value &&
63-
!!slots.widget
60+
() => (props.side === SplitSide.old ? oldLineWidget.value : newLineWidget.value) && !!currentIsShow.value
6461
);
6562

6663
const onCloseWidget = () => setWidget({});
6764

6865
useSyncHeight({
6966
selector: lineSelector,
7067
side: observeSide,
71-
enable: currentWidget,
68+
enable: currentIsShow,
7269
});
7370

7471
const width = useDomWidth({
@@ -77,7 +74,7 @@ export const DiffSplitWidgetLine = defineComponent(
7774
});
7875

7976
return () => {
80-
if (!currentIsShow.value || !slots.widget) return null;
77+
if (!currentIsShow.value) return null;
8178

8279
return (
8380
<tr

‎packages/vue/src/hooks/useSyncHeight.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useId } from "../context";
44

55
import { useIsMounted } from "./useIsMounted";
66

7+
// TODO
78
export const useSyncHeight = ({
89
selector,
910
side,
@@ -31,16 +32,15 @@ export const useSyncHeight = ({
3132

3233
const target = ele1.getAttribute("data-side") === side.value ? ele1 : ele2;
3334

34-
const synced = ele1.getAttribute("data-side") !== side.value ? ele1 : ele2;
35-
3635
const cb = () => {
3736
ele1.style.height = "auto";
3837
ele2.style.height = "auto";
3938
const rect1 = ele1.getBoundingClientRect();
4039
const rect2 = ele2.getBoundingClientRect();
4140
if (rect1.height !== rect2.height) {
4241
const maxHeight = Math.max(rect1.height, rect2.height);
43-
synced.style.height = maxHeight + "px";
42+
ele1.style.height = maxHeight + "px";
43+
ele2.style.height = maxHeight + "px";
4444
ele1.setAttribute("data-sync-height", String(maxHeight));
4545
ele2.setAttribute("data-sync-height", String(maxHeight));
4646
} else {

0 commit comments

Comments
 (0)