react-diff-viewer-continued 3.2.5 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/.all-contributorsrc +9 -0
  2. package/CHANGELOG.md +19 -0
  3. package/README.md +9 -7
  4. package/package.json +38 -38
  5. package/tsconfig.json +3 -2
  6. package/webpack.config.js +1 -1
  7. package/lib/compute-lines.d.ts +0 -54
  8. package/lib/compute-lines.js +0 -201
  9. package/lib/index.d.ts +0 -148
  10. package/lib/index.js +0 -342
  11. package/lib/styles.d.ts +0 -81
  12. package/lib/styles.js +0 -287
  13. package/tsconfig.examples.json +0 -14
package/.all-contributorsrc CHANGED
@@ -23,6 +23,15 @@
23
23
  "contributions": [
24
24
  "code"
25
25
  ]
26
+ },
27
+ {
28
+ "login": "KimBiYam",
29
+ "name": "Chang Hyun Kim",
30
+ "avatar_url": "https://avatars.githubusercontent.com/u/59679962?v=4",
31
+ "profile": "http://kimbiyam.me",
32
+ "contributions": [
33
+ "code"
34
+ ]
26
35
  }
27
36
  ],
28
37
  "contributorsPerLine": 7,
package/CHANGELOG.md CHANGED
@@ -1,3 +1,22 @@
1
+ # [3.3.0](https://github.com/aeolun/react-diff-viewer-continued/compare/v3.2.6...v3.3.0) (2023-10-17)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * update dependencies and correct zero width extraLines (fixes [#29](https://github.com/aeolun/react-diff-viewer-continued/issues/29)) ([c4b317a](https://github.com/aeolun/react-diff-viewer-continued/commit/c4b317af31935740dd9fe8ac526ceb8fd63db6a9))
7
+
8
+
9
+ ### Features
10
+
11
+ * add ability to always show certain lines ([896eb32](https://github.com/aeolun/react-diff-viewer-continued/commit/896eb323389cec2055abc7dede40adcbcbf6b506))
12
+
13
+ ## [3.2.6](https://github.com/aeolun/react-diff-viewer-continued/compare/v3.2.5...v3.2.6) (2023-03-02)
14
+
15
+
16
+ ### Bug Fixes
17
+
18
+ * release for chore fix ([9775afa](https://github.com/aeolun/react-diff-viewer-continued/commit/9775afac2388942d97c839954186eb5b4fd64c3c))
19
+
1
20
  ## [3.2.5](https://github.com/aeolun/react-diff-viewer-continued/compare/v3.2.4...v3.2.5) (2023-01-23)
2
21
 
3
22
 
package/README.md CHANGED
@@ -3,7 +3,7 @@
3
3
  <br/>
4
4
 
5
5
  <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
6
- [![All Contributors](https://img.shields.io/badge/all_contributors-2-orange.svg?style=flat)](#contributors)
6
+ [![All Contributors](https://img.shields.io/badge/all_contributors-3-orange.svg?style=flat-square)](#contributors-)
7
7
  <!-- ALL-CONTRIBUTORS-BADGE:END -->
8
8
 
9
9
  [![npm version](https://img.shields.io/npm/v/react-diff-viewer-continued)](https://www.npmjs.com/package/react-diff-viewer-continued)
@@ -68,17 +68,18 @@ class Diff extends PureComponent {
68
68
  ## Props
69
69
 
70
70
  | Prop | Type | Default | Description |
71
- | ------------------------- | ------------------------- | ------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
72
- | oldValue | `string | Object` | `''` | Old value as string (or Object if using `diffJson`). |
73
- | newValue | `string | Object` | `''` | New value as string (or Object if using `diffJson`). |
71
+ |---------------------------|---------------------------|--------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
72
+ | oldValue | `string | Object` | `''` | Old value as string (or Object if using `diffJson`). |
73
+ | newValue | `string | Object` | `''` | New value as string (or Object if using `diffJson`). |
74
74
  | splitView | `boolean` | `true` | Switch between `unified` and `split` view. |
75
75
  | disableWordDiff | `boolean` | `false` | Show and hide word diff in a diff line. |
76
76
  | compareMethod | `DiffMethod` | `DiffMethod.CHARS` | JsDiff text diff method used for diffing strings. Check out the [guide](https://github.com/praneshr/react-diff-viewer/tree/v3.0.0#text-block-diff-comparison) to use different methods. |
77
77
  | renderGutter | `(diffData) => ReactNode` | `undefined` | Function that can be used to render an extra gutter with various information next to the line number. |
78
78
  | hideLineNumbers | `boolean` | `false` | Show and hide line numbers. |
79
+ | alwaysShowLines | `string[]` | `[]` | List of lines to always be shown, regardless of diff status. Line number are prefixed with `L` and `R` for the left and right section of the diff viewer, respectively. For example, `L-20` means 20th line in the left pane. `extraLinesSurroundingDiff` applies to these lines as well. |
79
80
  | renderContent | `function` | `undefined` | Render Prop API to render code in the diff viewer. Helpful for [syntax highlighting](#syntax-highlighting) |
80
81
  | onLineNumberClick | `function` | `undefined` | Event handler for line number click. `(lineId: string) => void` |
81
- | highlightLines | `array[string]` | `[]` | List of lines to be highlighted. Works together with `onLineNumberClick`. Line number are prefixed with `L` and `R` for the left and right section of the diff viewer, respectively. For example, `L-20` means 20th line in the left pane. To highlight a range of line numbers, pass the prefixed line number as an array. For example, `[L-2, L-3, L-4, L-5]` will highlight the lines `2-5` in the left pane. |
82
+ | highlightLines | `string[]` | `[]` | List of lines to be highlighted. Works together with `onLineNumberClick`. Line number are prefixed with `L` and `R` for the left and right section of the diff viewer, respectively. For example, `L-20` means 20th line in the left pane. To highlight a range of line numbers, pass the prefixed line number as an array. For example, `[L-2, L-3, L-4, L-5]` will highlight the lines `2-5` in the left pane. |
82
83
  | showDiffOnly | `boolean` | `true` | Shows only the diffed lines and folds the unchanged lines |
83
84
  | extraLinesSurroundingDiff | `number` | `3` | Number of extra unchanged lines surrounding the diff. Works along with `showDiffOnly`. |
84
85
  | codeFoldMessageRenderer | `function` | `Expand {number} of lines ...` | Render Prop API to render code fold message. |
@@ -376,8 +377,9 @@ Check package.json for more build scripts.
376
377
  <table>
377
378
  <tbody>
378
379
  <tr>
379
- <td align="center"><a href="https://github.com/ericmorgan1"><img src="https://avatars.githubusercontent.com/u/10346191?v=4?s=100" width="100px;" alt="Eric M."/><br /><sub><b>Eric M.</b></sub></a><br /><a href="https://github.com/Aeolun/react-diff-viewer-continued/commits?author=ericmorgan1" title="Code">💻</a></td>
380
- <td align="center"><a href="https://github.com/spyroid"><img src="https://avatars.githubusercontent.com/u/844495?v=4?s=100" width="100px;" alt="Andrei Kovalevsky"/><br /><sub><b>Andrei Kovalevsky</b></sub></a><br /><a href="https://github.com/Aeolun/react-diff-viewer-continued/commits?author=spyroid" title="Code">💻</a></td>
380
+ <td align="center" valign="top" width="14.28%"><a href="https://github.com/ericmorgan1"><img src="https://avatars.githubusercontent.com/u/10346191?v=4?s=100" width="100px;" alt="Eric M."/><br /><sub><b>Eric M.</b></sub></a><br /><a href="https://github.com/Aeolun/react-diff-viewer-continued/commits?author=ericmorgan1" title="Code">💻</a></td>
381
+ <td align="center" valign="top" width="14.28%"><a href="https://github.com/spyroid"><img src="https://avatars.githubusercontent.com/u/844495?v=4?s=100" width="100px;" alt="Andrei Kovalevsky"/><br /><sub><b>Andrei Kovalevsky</b></sub></a><br /><a href="https://github.com/Aeolun/react-diff-viewer-continued/commits?author=spyroid" title="Code">💻</a></td>
382
+ <td align="center" valign="top" width="14.28%"><a href="http://kimbiyam.me"><img src="https://avatars.githubusercontent.com/u/59679962?v=4?s=100" width="100px;" alt="Chang Hyun Kim"/><br /><sub><b>Chang Hyun Kim</b></sub></a><br /><a href="https://github.com/Aeolun/react-diff-viewer-continued/commits?author=KimBiYam" title="Code">💻</a></td>
381
383
  </tr>
382
384
  </tbody>
383
385
  </table>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-diff-viewer-continued",
3
- "version": "3.2.5",
3
+ "version": "3.3.0",
4
4
  "private": false,
5
5
  "description": "Continuation of a simple and beautiful text diff viewer component made with diff and React",
6
6
  "keywords": [
@@ -35,60 +35,60 @@
35
35
  "prettier": "prettier --write ."
36
36
  },
37
37
  "dependencies": {
38
- "classnames": "^2.3.1",
38
+ "@emotion/css": "^11.11.2",
39
+ "classnames": "^2.3.2",
39
40
  "diff": "^5.1.0",
40
- "emotion": "^10.0.27",
41
41
  "memoize-one": "^6.0.0",
42
42
  "prop-types": "^15.8.1"
43
43
  },
44
44
  "devDependencies": {
45
- "@babel/core": "^7.18.6",
46
- "@babel/preset-env": "^7.18.6",
47
- "@babel/preset-react": "^7.18.6",
48
- "@babel/preset-typescript": "^7.18.6",
45
+ "@babel/core": "^7.23.2",
46
+ "@babel/preset-env": "^7.23.2",
47
+ "@babel/preset-react": "^7.22.15",
48
+ "@babel/preset-typescript": "^7.23.2",
49
49
  "@semantic-release/changelog": "6.0.1",
50
50
  "@semantic-release/git": "10.0.1",
51
51
  "@testing-library/react": "^13.4.0",
52
- "@types/diff": "^5.0.2",
53
- "@types/expect": "^1.20.3",
52
+ "@types/diff": "^5.0.6",
53
+ "@types/expect": "^1.20.4",
54
54
  "@types/memoize-one": "^4.1.1",
55
- "@types/mocha": "^5.2.5",
56
- "@types/node": "^12.0.12",
55
+ "@types/mocha": "^5.2.7",
56
+ "@types/node": "^12.20.55",
57
57
  "@types/prop-types": "15.7.5",
58
- "@types/react": "^16.4.14",
59
- "@types/react-dom": "^16.0.8",
60
- "@types/webpack": "^4.4.13",
61
- "@typescript-eslint/eslint-plugin": "^5.30.5",
62
- "@typescript-eslint/parser": "^5.30.5",
63
- "css-loader": "^6.7.1",
64
- "eslint": "^8.19.0",
58
+ "@types/react": "^16.14.49",
59
+ "@types/react-dom": "^16.9.20",
60
+ "@types/webpack": "^4.41.34",
61
+ "@typescript-eslint/eslint-plugin": "^5.62.0",
62
+ "@typescript-eslint/parser": "^5.62.0",
63
+ "css-loader": "^6.8.1",
64
+ "eslint": "^8.51.0",
65
65
  "eslint-config-airbnb": "^19.0.4",
66
- "eslint-plugin-import": "^2.26.0",
67
- "eslint-plugin-jsx-a11y": "^6.6.0",
68
- "eslint-plugin-react": "^7.30.1",
66
+ "eslint-plugin-import": "^2.28.1",
67
+ "eslint-plugin-jsx-a11y": "^6.7.1",
68
+ "eslint-plugin-react": "^7.33.2",
69
69
  "eslint-plugin-react-hooks": "^4.6.0",
70
- "expect": "^28.1.1",
70
+ "expect": "^28.1.3",
71
71
  "file-loader": "^6.2.0",
72
72
  "gh-pages": "^4.0.0",
73
- "html-webpack-plugin": "^5.5.0",
74
- "jest": "^28.1.2",
75
- "jest-environment-jsdom": "^28.1.2",
76
- "mini-css-extract-plugin": "^2.6.1",
77
- "mocha": "^10.0.0",
78
- "prettier": "^2.7.1",
73
+ "html-webpack-plugin": "^5.5.3",
74
+ "jest": "^28.1.3",
75
+ "jest-environment-jsdom": "^28.1.3",
76
+ "mini-css-extract-plugin": "^2.7.6",
77
+ "mocha": "^10.2.0",
78
+ "prettier": "^2.8.8",
79
79
  "raw-loader": "^4.0.2",
80
- "react": "^18.0.0",
81
- "react-dom": "^18.0.0",
82
- "sass": "^1.53.0",
83
- "sass-loader": "^13.0.2",
84
- "semantic-release": "^19.0.3",
80
+ "react": "^18.2.0",
81
+ "react-dom": "^18.2.0",
82
+ "sass": "^1.69.3",
83
+ "sass-loader": "^13.3.2",
84
+ "semantic-release": "^19.0.5",
85
85
  "spy": "^1.0.0",
86
- "ts-loader": "^9.3.1",
87
- "ts-node": "^10.8.2",
88
- "typescript": "^4.7.4",
89
- "webpack": "^5.73.0",
86
+ "ts-loader": "^9.5.0",
87
+ "ts-node": "^10.9.1",
88
+ "typescript": "^5.2.2",
89
+ "webpack": "^5.89.0",
90
90
  "webpack-cli": "^4.10.0",
91
- "webpack-dev-server": "^4.9.3"
91
+ "webpack-dev-server": "^4.15.1"
92
92
  },
93
93
  "peerDependencies": {
94
94
  "react": "^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",
package/tsconfig.json CHANGED
@@ -1,16 +1,17 @@
1
1
  {
2
2
  "compilerOptions": {
3
3
  "experimentalDecorators": true,
4
- "jsx": "react",
4
+ "jsx": "react-jsx",
5
5
  "module": "commonjs",
6
6
  "moduleResolution": "node",
7
7
  "noImplicitAny": true,
8
+ "esModuleInterop": true,
8
9
  "target": "es2015",
9
10
  "declaration": true,
10
11
  "downlevelIteration": true,
11
12
  "lib": ["es2017", "dom"],
12
13
  "types": ["jest", "node"]
13
14
  },
14
- "include": ["./src/*"],
15
+ "include": ["src/", "examples/"],
15
16
  "exclude": ["node_modules"]
16
17
  }
package/webpack.config.js CHANGED
@@ -29,7 +29,7 @@ module.exports = {
29
29
  {
30
30
  loader: 'ts-loader',
31
31
  options: {
32
- configFile: 'tsconfig.examples.json',
32
+ configFile: 'tsconfig.json',
33
33
  },
34
34
  },
35
35
  ],
package/lib/compute-lines.d.ts DELETED
@@ -1,54 +0,0 @@
1
- export declare enum DiffType {
2
- DEFAULT = 0,
3
- ADDED = 1,
4
- REMOVED = 2,
5
- CHANGED = 3
6
- }
7
- export declare enum DiffMethod {
8
- CHARS = "diffChars",
9
- WORDS = "diffWords",
10
- WORDS_WITH_SPACE = "diffWordsWithSpace",
11
- LINES = "diffLines",
12
- TRIMMED_LINES = "diffTrimmedLines",
13
- SENTENCES = "diffSentences",
14
- CSS = "diffCss",
15
- JSON = "diffJson"
16
- }
17
- export interface DiffInformation {
18
- value?: string | DiffInformation[];
19
- lineNumber?: number;
20
- type?: DiffType;
21
- }
22
- export interface LineInformation {
23
- left?: DiffInformation;
24
- right?: DiffInformation;
25
- }
26
- export interface ComputedLineInformation {
27
- lineInformation: LineInformation[];
28
- diffLines: number[];
29
- }
30
- export interface ComputedDiffInformation {
31
- left?: DiffInformation[];
32
- right?: DiffInformation[];
33
- }
34
- export interface JsDiffChangeObject {
35
- added?: boolean;
36
- removed?: boolean;
37
- value?: string;
38
- }
39
- /**
40
- * [TODO]: Think about moving common left and right value assignment to a
41
- * common place. Better readability?
42
- *
43
- * Computes line wise information based in the js diff information passed. Each
44
- * line contains information about left and right section. Left side denotes
45
- * deletion and right side denotes addition.
46
- *
47
- * @param oldString Old string to compare.
48
- * @param newString New string to compare with old string.
49
- * @param disableWordDiff Flag to enable/disable word diff.
50
- * @param lineCompareMethod JsDiff text diff method from https://github.com/kpdecker/jsdiff/tree/v4.0.1#api
51
- * @param linesOffset line number to start counting from
52
- */
53
- declare const computeLineInformation: (oldString: string | Object, newString: string | Object, disableWordDiff?: boolean, lineCompareMethod?: string, linesOffset?: number) => ComputedLineInformation;
54
- export { computeLineInformation };
package/lib/compute-lines.js DELETED
@@ -1,201 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.computeLineInformation = exports.DiffMethod = exports.DiffType = void 0;
4
- const diff = require("diff");
5
- const jsDiff = diff;
6
- var DiffType;
7
- (function (DiffType) {
8
- DiffType[DiffType["DEFAULT"] = 0] = "DEFAULT";
9
- DiffType[DiffType["ADDED"] = 1] = "ADDED";
10
- DiffType[DiffType["REMOVED"] = 2] = "REMOVED";
11
- DiffType[DiffType["CHANGED"] = 3] = "CHANGED";
12
- })(DiffType = exports.DiffType || (exports.DiffType = {}));
13
- // See https://github.com/kpdecker/jsdiff/tree/v4.0.1#api for more info on the below JsDiff methods
14
- var DiffMethod;
15
- (function (DiffMethod) {
16
- DiffMethod["CHARS"] = "diffChars";
17
- DiffMethod["WORDS"] = "diffWords";
18
- DiffMethod["WORDS_WITH_SPACE"] = "diffWordsWithSpace";
19
- DiffMethod["LINES"] = "diffLines";
20
- DiffMethod["TRIMMED_LINES"] = "diffTrimmedLines";
21
- DiffMethod["SENTENCES"] = "diffSentences";
22
- DiffMethod["CSS"] = "diffCss";
23
- DiffMethod["JSON"] = "diffJson";
24
- })(DiffMethod = exports.DiffMethod || (exports.DiffMethod = {}));
25
- /**
26
- * Splits diff text by new line and computes final list of diff lines based on
27
- * conditions.
28
- *
29
- * @param value Diff text from the js diff module.
30
- */
31
- const constructLines = (value) => {
32
- if (value === '')
33
- return [];
34
- const lines = value.replace(/\n$/, '').split('\n');
35
- return lines;
36
- };
37
- /**
38
- * Computes word diff information in the line.
39
- * [TODO]: Consider adding options argument for JsDiff text block comparison
40
- *
41
- * @param oldValue Old word in the line.
42
- * @param newValue New word in the line.
43
- * @param compareMethod JsDiff text diff method from https://github.com/kpdecker/jsdiff/tree/v4.0.1#api
44
- */
45
- const computeDiff = (oldValue, newValue, compareMethod = DiffMethod.CHARS) => {
46
- const diffArray = jsDiff[compareMethod](oldValue, newValue);
47
- const computedDiff = {
48
- left: [],
49
- right: [],
50
- };
51
- diffArray.forEach(({ added, removed, value }) => {
52
- const diffInformation = {};
53
- if (added) {
54
- diffInformation.type = DiffType.ADDED;
55
- diffInformation.value = value;
56
- computedDiff.right.push(diffInformation);
57
- }
58
- if (removed) {
59
- diffInformation.type = DiffType.REMOVED;
60
- diffInformation.value = value;
61
- computedDiff.left.push(diffInformation);
62
- }
63
- if (!removed && !added) {
64
- diffInformation.type = DiffType.DEFAULT;
65
- diffInformation.value = value;
66
- computedDiff.right.push(diffInformation);
67
- computedDiff.left.push(diffInformation);
68
- }
69
- return diffInformation;
70
- });
71
- return computedDiff;
72
- };
73
- /**
74
- * [TODO]: Think about moving common left and right value assignment to a
75
- * common place. Better readability?
76
- *
77
- * Computes line wise information based in the js diff information passed. Each
78
- * line contains information about left and right section. Left side denotes
79
- * deletion and right side denotes addition.
80
- *
81
- * @param oldString Old string to compare.
82
- * @param newString New string to compare with old string.
83
- * @param disableWordDiff Flag to enable/disable word diff.
84
- * @param lineCompareMethod JsDiff text diff method from https://github.com/kpdecker/jsdiff/tree/v4.0.1#api
85
- * @param linesOffset line number to start counting from
86
- */
87
- const computeLineInformation = (oldString, newString, disableWordDiff = false, lineCompareMethod = DiffMethod.CHARS, linesOffset = 0) => {
88
- let diffArray = [];
89
- // Use diffLines for strings, and diffJson for objects...
90
- if (typeof oldString === 'string' && typeof newString === 'string') {
91
- diffArray = diff.diffLines(oldString.trimRight(), newString.trimRight(), {
92
- newlineIsToken: false,
93
- ignoreWhitespace: false,
94
- ignoreCase: false,
95
- });
96
- }
97
- else {
98
- diffArray = diff.diffJson(oldString, newString);
99
- }
100
- let rightLineNumber = linesOffset;
101
- let leftLineNumber = linesOffset;
102
- let lineInformation = [];
103
- let counter = 0;
104
- const diffLines = [];
105
- const ignoreDiffIndexes = [];
106
- const getLineInformation = (value, diffIndex, added, removed, evaluateOnlyFirstLine) => {
107
- const lines = constructLines(value);
108
- return lines
109
- .map((line, lineIndex) => {
110
- const left = {};
111
- const right = {};
112
- if (ignoreDiffIndexes.includes(`${diffIndex}-${lineIndex}`) ||
113
- (evaluateOnlyFirstLine && lineIndex !== 0)) {
114
- return undefined;
115
- }
116
- if (added || removed) {
117
- let countAsChange = true;
118
- if (removed) {
119
- leftLineNumber += 1;
120
- left.lineNumber = leftLineNumber;
121
- left.type = DiffType.REMOVED;
122
- left.value = line || ' ';
123
- // When the current line is of type REMOVED, check the next item in
124
- // the diff array whether it is of type ADDED. If true, the current
125
- // diff will be marked as both REMOVED and ADDED. Meaning, the
126
- // current line is a modification.
127
- const nextDiff = diffArray[diffIndex + 1];
128
- if (nextDiff && nextDiff.added) {
129
- const nextDiffLines = constructLines(nextDiff.value)[lineIndex];
130
- if (nextDiffLines) {
131
- const nextDiffLineInfo = getLineInformation(nextDiffLines, diffIndex, true, false, true);
132
- const { value: rightValue, lineNumber, type, } = nextDiffLineInfo[0].right;
133
- // When identified as modification, push the next diff to ignore
134
- // list as the next value will be added in this line computation as
135
- // right and left values.
136
- ignoreDiffIndexes.push(`${diffIndex + 1}-${lineIndex}`);
137
- right.lineNumber = lineNumber;
138
- if (left.value === rightValue) {
139
- // The new value is exactly the same as the old
140
- countAsChange = false;
141
- right.type = 0;
142
- left.type = 0;
143
- right.value = rightValue;
144
- }
145
- else {
146
- right.type = type;
147
- // Do char level diff and assign the corresponding values to the
148
- // left and right diff information object.
149
- if (disableWordDiff) {
150
- right.value = rightValue;
151
- }
152
- else {
153
- const computedDiff = computeDiff(line, rightValue, lineCompareMethod);
154
- right.value = computedDiff.right;
155
- left.value = computedDiff.left;
156
- }
157
- }
158
- }
159
- }
160
- }
161
- else {
162
- rightLineNumber += 1;
163
- right.lineNumber = rightLineNumber;
164
- right.type = DiffType.ADDED;
165
- right.value = line;
166
- }
167
- if (countAsChange && !evaluateOnlyFirstLine) {
168
- if (!diffLines.includes(counter)) {
169
- diffLines.push(counter);
170
- }
171
- }
172
- }
173
- else {
174
- leftLineNumber += 1;
175
- rightLineNumber += 1;
176
- left.lineNumber = leftLineNumber;
177
- left.type = DiffType.DEFAULT;
178
- left.value = line;
179
- right.lineNumber = rightLineNumber;
180
- right.type = DiffType.DEFAULT;
181
- right.value = line;
182
- }
183
- if (!evaluateOnlyFirstLine) {
184
- counter += 1;
185
- }
186
- return { right, left };
187
- })
188
- .filter(Boolean);
189
- };
190
- diffArray.forEach(({ added, removed, value }, index) => {
191
- lineInformation = [
192
- ...lineInformation,
193
- ...getLineInformation(value, index, added, removed),
194
- ];
195
- });
196
- return {
197
- lineInformation,
198
- diffLines,
199
- };
200
- };
201
- exports.computeLineInformation = computeLineInformation;
package/lib/index.d.ts DELETED
@@ -1,148 +0,0 @@
1
- import * as React from 'react';
2
- import * as PropTypes from 'prop-types';
3
- import { DiffInformation, DiffMethod, DiffType, LineInformation } from './compute-lines';
4
- import { ReactDiffViewerStyles, ReactDiffViewerStylesOverride } from './styles';
5
- export declare enum LineNumberPrefix {
6
- LEFT = "L",
7
- RIGHT = "R"
8
- }
9
- export interface ReactDiffViewerProps {
10
- oldValue: string | Object;
11
- newValue: string | Object;
12
- splitView?: boolean;
13
- linesOffset?: number;
14
- disableWordDiff?: boolean;
15
- compareMethod?: DiffMethod;
16
- extraLinesSurroundingDiff?: number;
17
- hideLineNumbers?: boolean;
18
- showDiffOnly?: boolean;
19
- renderContent?: (source: string) => JSX.Element;
20
- codeFoldMessageRenderer?: (totalFoldedLines: number, leftStartLineNumber: number, rightStartLineNumber: number) => JSX.Element;
21
- onLineNumberClick?: (lineId: string, event: React.MouseEvent<HTMLTableCellElement>) => void;
22
- renderGutter?: (data: {
23
- lineNumber: number;
24
- type: DiffType;
25
- prefix: LineNumberPrefix;
26
- value: string | DiffInformation[];
27
- additionalLineNumber: number;
28
- additionalPrefix: LineNumberPrefix;
29
- styles: ReactDiffViewerStyles;
30
- }) => JSX.Element;
31
- highlightLines?: string[];
32
- styles?: ReactDiffViewerStylesOverride;
33
- useDarkTheme?: boolean;
34
- leftTitle?: string | JSX.Element;
35
- rightTitle?: string | JSX.Element;
36
- }
37
- export interface ReactDiffViewerState {
38
- expandedBlocks?: number[];
39
- }
40
- declare class DiffViewer extends React.Component<ReactDiffViewerProps, ReactDiffViewerState> {
41
- private styles;
42
- static defaultProps: ReactDiffViewerProps;
43
- static propTypes: {
44
- oldValue: PropTypes.Validator<any>;
45
- newValue: PropTypes.Validator<any>;
46
- splitView: PropTypes.Requireable<boolean>;
47
- disableWordDiff: PropTypes.Requireable<boolean>;
48
- compareMethod: PropTypes.Requireable<DiffMethod>;
49
- renderContent: PropTypes.Requireable<(...args: any[]) => any>;
50
- renderGutter: PropTypes.Requireable<(...args: any[]) => any>;
51
- onLineNumberClick: PropTypes.Requireable<(...args: any[]) => any>;
52
- extraLinesSurroundingDiff: PropTypes.Requireable<number>;
53
- styles: PropTypes.Requireable<object>;
54
- hideLineNumbers: PropTypes.Requireable<boolean>;
55
- showDiffOnly: PropTypes.Requireable<boolean>;
56
- highlightLines: PropTypes.Requireable<string[]>;
57
- leftTitle: PropTypes.Requireable<string | PropTypes.ReactElementLike>;
58
- rightTitle: PropTypes.Requireable<string | PropTypes.ReactElementLike>;
59
- linesOffset: PropTypes.Requireable<number>;
60
- };
61
- constructor(props: ReactDiffViewerProps);
62
- /**
63
- * Resets code block expand to the initial stage. Will be exposed to the parent component via
64
- * refs.
65
- */
66
- resetCodeBlocks: () => boolean;
67
- /**
68
- * Pushes the target expanded code block to the state. During the re-render,
69
- * this value is used to expand/fold unmodified code.
70
- */
71
- private onBlockExpand;
72
- /**
73
- * Computes final styles for the diff viewer. It combines the default styles with the user
74
- * supplied overrides. The computed styles are cached with performance in mind.
75
- *
76
- * @param styles User supplied style overrides.
77
- */
78
- private computeStyles;
79
- /**
80
- * Returns a function with clicked line number in the closure. Returns an no-op function when no
81
- * onLineNumberClick handler is supplied.
82
- *
83
- * @param id Line id of a line.
84
- */
85
- private onLineNumberClickProxy;
86
- /**
87
- * Maps over the word diff and constructs the required React elements to show word diff.
88
- *
89
- * @param diffArray Word diff information derived from line information.
90
- * @param renderer Optional renderer to format diff words. Useful for syntax highlighting.
91
- */
92
- private renderWordDiff;
93
- /**
94
- * Maps over the line diff and constructs the required react elements to show line diff. It calls
95
- * renderWordDiff when encountering word diff. This takes care of both inline and split view line
96
- * renders.
97
- *
98
- * @param lineNumber Line number of the current line.
99
- * @param type Type of diff of the current line.
100
- * @param prefix Unique id to prefix with the line numbers.
101
- * @param value Content of the line. It can be a string or a word diff array.
102
- * @param additionalLineNumber Additional line number to be shown. Useful for rendering inline
103
- * diff view. Right line number will be passed as additionalLineNumber.
104
- * @param additionalPrefix Similar to prefix but for additional line number.
105
- */
106
- private renderLine;
107
- /**
108
- * Generates lines for split view.
109
- *
110
- * @param obj Line diff information.
111
- * @param obj.left Life diff information for the left pane of the split view.
112
- * @param obj.right Life diff information for the right pane of the split view.
113
- * @param index React key for the lines.
114
- */
115
- private renderSplitView;
116
- /**
117
- * Generates lines for inline view.
118
- *
119
- * @param obj Line diff information.
120
- * @param obj.left Life diff information for the added section of the inline view.
121
- * @param obj.right Life diff information for the removed section of the inline view.
122
- * @param index React key for the lines.
123
- */
124
- renderInlineView: ({ left, right }: LineInformation, index: number) => JSX.Element;
125
- /**
126
- * Returns a function with clicked block number in the closure.
127
- *
128
- * @param id Cold fold block id.
129
- */
130
- private onBlockClickProxy;
131
- /**
132
- * Generates cold fold block. It also uses the custom message renderer when available to show
133
- * cold fold messages.
134
- *
135
- * @param num Number of skipped lines between two blocks.
136
- * @param blockNumber Code fold block id.
137
- * @param leftBlockLineNumber First left line number after the current code fold block.
138
- * @param rightBlockLineNumber First right line number after the current code fold block.
139
- */
140
- private renderSkippedLineIndicator;
141
- /**
142
- * Generates the entire diff view.
143
- */
144
- private renderDiff;
145
- render: () => JSX.Element;
146
- }
147
- export default DiffViewer;
148
- export { ReactDiffViewerStylesOverride, DiffMethod };