|
3 | 3 | </p>
|
4 | 4 | <br/>
|
5 | 5 |
|
6 |
| -[](https://travis-ci.com/praneshr/react-diff-viewer) |
7 |
| -[](https://badge.fury.io/js/react-diff-viewer) |
8 |
| -[](https://github.com/praneshr/react-diff-viewer/blob/master/LICENSE) |
| 6 | +[](https://badge.fury.io/js/@alexbruf%2Freact-diff-viewer) |
| 7 | +[](https://github.com/alexbruf/react-diff-viewer/blob/master/LICENSE) |
9 | 8 |
|
10 | 9 | A simple and beautiful text diff viewer component made with [Diff](https://github.com/kpdecker/jsdiff) and [React](https://reactjs.org).
|
11 | 10 |
|
12 | 11 | Inspired from Github diff viewer, it includes features like split view, inline view, word diff, line highlight and more. It is highly customizable and it supports almost all languages.
|
13 | 12 |
|
14 | 13 | **React 18/19 Compatible**
|
15 | 14 |
|
16 |
| -This version of `react-diff-viewer` is compatible with React v18 and v19, utilizing functional components and hooks internally. |
17 |
| - |
18 |
| -Check [here](https://github.com/praneshr/react-diff-viewer/tree/v2.0) for v2.0 |
| 15 | +This version of `@alexbruf/react-diff-viewer` is compatible with React v18 and v19, utilizing functional components and hooks internally. |
19 | 16 |
|
20 | 17 | ## Install
|
21 | 18 |
|
22 | 19 | ```bash
|
23 |
| -yarn add react-diff-viewer |
| 20 | +yarn add @alexbruf/react-diff-viewer |
24 | 21 |
|
25 | 22 | # or
|
26 | 23 |
|
27 |
| -npm i react-diff-viewer |
| 24 | +npm i @alexbruf/react-diff-viewer |
28 | 25 | ```
|
29 | 26 |
|
30 | 27 | ## Usage
|
31 | 28 |
|
32 | 29 | ```javascript
|
33 | 30 | import React from 'react';
|
34 |
| -import ReactDiffViewer from 'react-diff-viewer'; |
| 31 | +import ReactDiffViewer from '@alexbruf/react-diff-viewer'; |
35 | 32 |
|
36 | 33 | const oldCode = `
|
37 | 34 | const a = 10
|
@@ -70,7 +67,7 @@ export default App;
|
70 | 67 | | newValue | `string` | `''` | New value as string. |
|
71 | 68 | | splitView | `boolean` | `true` | Switch between `unified` and `split` view. |
|
72 | 69 | | disableWordDiff | `boolean` | `false` | Show and hide word diff in a diff line. |
|
73 |
| -| 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. | |
| 70 | +| compareMethod | `DiffMethod` | `DiffMethod.CHARS` | JsDiff text diff method used for diffing strings. Check out the [guide](https://github.com/alexbruf/react-diff-viewer/tree/master#text-block-diff-comparison) to use different methods. | |
74 | 71 | | hideLineNumbers | `boolean` | `false` | Show and hide line numbers. |
|
75 | 72 | | renderContent | `function` | `undefined` | Render Prop API to render code in the diff viewer. Helpful for [syntax highlighting](#syntax-highlighting) |
|
76 | 73 | | onLineNumberClick | `function` | `undefined` | Event handler for line number click. `(lineId: string) => void` |
|
@@ -106,7 +103,7 @@ An example using [Prism JS](https://prismjs.com)
|
106 | 103 |
|
107 | 104 | ```javascript
|
108 | 105 | import React, { useCallback } from 'react';
|
109 |
| -import ReactDiffViewer from 'react-diff-viewer'; |
| 106 | +import ReactDiffViewer from '@alexbruf/react-diff-viewer'; |
110 | 107 |
|
111 | 108 | const oldCode = `
|
112 | 109 | const a = 10
|
@@ -174,7 +171,7 @@ enum DiffMethod {
|
174 | 171 |
|
175 | 172 | ```javascript
|
176 | 173 | import React from 'react';
|
177 |
| -import ReactDiffViewer, { DiffMethod } from 'react-diff-viewer'; |
| 174 | +import ReactDiffViewer, { DiffMethod } from '@alexbruf/react-diff-viewer'; |
178 | 175 |
|
179 | 176 | const oldCode = `
|
180 | 177 | {
|
@@ -298,7 +295,7 @@ For keys other than `variables`, the value can either be an object or string int
|
298 | 295 |
|
299 | 296 | ```javascript
|
300 | 297 | import React, { useCallback } from 'react';
|
301 |
| -import ReactDiffViewer from 'react-diff-viewer'; |
| 298 | +import ReactDiffViewer from '@alexbruf/react-diff-viewer'; |
302 | 299 |
|
303 | 300 | const oldCode = `
|
304 | 301 | const a = 10
|
|
0 commit comments