{"_id":"@alexis3020/ngx-text-diff","_rev":"1-16d8d365e45acd9db48755a536be7561","name":"@alexis3020/ngx-text-diff","dist-tags":{"latest":"0.6.8"},"versions":{"0.6.7":{"name":"@alexis3020/ngx-text-diff","version":"0.6.7","keywords":["Angular","Library","Google","Diff"],"author":{"name":"Alexis Holguin","email":"holguinalexis30@gmail.com"},"license":"MIT","_id":"@alexis3020/ngx-text-diff@0.6.7","maintainers":[{"name":"alexis3020","email":"holguinalexis30@gmail.com"}],"homepage":"https://github.com/MoraHol/ngx-text-diff#readme","bugs":{"url":"https://github.com/MoraHol/ngx-text-diff/issues"},"dist":{"shasum":"7e73b588eb317be5cb8a7cec4d42738868ac6415","tarball":"https://registry.npmjs.org/@alexis3020/ngx-text-diff/-/ngx-text-diff-0.6.7.tgz","fileCount":27,"integrity":"sha512-d5TF847mAzWzhPH3WBKuVL87vfTwZW5lzK+ejHV+I1ZD6ICjtd868pRxEMpfDQLGh3iQx2+f0IC5BjrpWeKOfg==","signatures":[{"sig":"MEUCIDwg0nNRY/UgpGtQ4KpynNHmjfrQpNAKZmeVCqFUr4bOAiEA6UfcDpa+MOuD8YAg6jId3dOnVWwyPKPwIYO+ZuuD6jQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":46309},"gitHead":"000cd4f3ba2496cf7005c4cc3d4f2b2429619087","private":false,"_npmUser":{"name":"alexis3020","email":"holguinalexis30@gmail.com"},"repository":{"url":"git+https://github.com/MoraHol/ngx-text-diff.git","type":"git"},"_npmVersion":"10.2.4","description":"A Text Diff component for Angular.","directories":{},"_nodeVersion":"18.19.1","dependencies":{"tslib":"^2.0.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.5.5","@angular/cdk":">=6.0.0","@angular/core":">=6.0.0","@angular/forms":">=6.0.0","@angular/common":">=6.0.0","diff-match-patch":"^1.0.4"},"_npmOperationalInternal":{"tmp":"tmp/ngx-text-diff_0.6.7_1739992148074_0.8267864666301916","host":"s3://npm-registry-packages-npm-production"}},"0.6.8":{"name":"@alexis3020/ngx-text-diff","version":"0.6.8","description":"A Text Diff component for Angular.","private":false,"keywords":["Angular","Library","Google","Diff"],"license":"MIT","author":{"name":"Alexis Holguin","email":"holguinalexis30@gmail.com"},"repository":{"type":"git","url":"git+https://github.com/MoraHol/ngx-text-diff.git"},"dependencies":{"tslib":"^2.0.0"},"peerDependencies":{"@angular/common":">=6.0.0","diff-match-patch":"^1.0.4","@angular/core":">=6.0.0","@angular/forms":">=6.0.0","@angular/cdk":">=6.0.0","rxjs":"^7.5.5"},"module":"fesm2015/alexis3020-ngx-text-diff.mjs","es2020":"fesm2020/alexis3020-ngx-text-diff.mjs","esm2020":"esm2020/alexis3020-ngx-text-diff.mjs","fesm2020":"fesm2020/alexis3020-ngx-text-diff.mjs","fesm2015":"fesm2015/alexis3020-ngx-text-diff.mjs","typings":"index.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","esm2020":"./esm2020/alexis3020-ngx-text-diff.mjs","es2020":"./fesm2020/alexis3020-ngx-text-diff.mjs","es2015":"./fesm2015/alexis3020-ngx-text-diff.mjs","node":"./fesm2015/alexis3020-ngx-text-diff.mjs","default":"./fesm2020/alexis3020-ngx-text-diff.mjs"}},"sideEffects":false,"_id":"@alexis3020/ngx-text-diff@0.6.8","gitHead":"000cd4f3ba2496cf7005c4cc3d4f2b2429619087","bugs":{"url":"https://github.com/MoraHol/ngx-text-diff/issues"},"homepage":"https://github.com/MoraHol/ngx-text-diff#readme","_nodeVersion":"18.19.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-Li59VcSO+D7KPNVMswKx1O3xNUeGG2omqncZUEjSf2BkQ8y7XSt7NwzOGIkP5SJu8JC0GxiKpVBp0/vVPfjvCQ==","shasum":"8c919e83d483df878e7f134938d8889dbf5d8a94","tarball":"https://registry.npmjs.org/@alexis3020/ngx-text-diff/-/ngx-text-diff-0.6.8.tgz","fileCount":30,"unpackedSize":374727,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIFBHlm0KlruL/5oK2pUZxKvCpF9fbylb+SKKEI3835NPAiEA+42a64kIuNlhU4d7KhJRyClUmn2bF6ABkbx+x/Rw7ro="}]},"_npmUser":{"name":"alexis3020","email":"holguinalexis30@gmail.com"},"directories":{},"maintainers":[{"name":"alexis3020","email":"holguinalexis30@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ngx-text-diff_0.6.8_1739995484090_0.5672344276544761"},"_hasShrinkwrap":false}},"time":{"created":"2025-02-19T19:09:07.961Z","modified":"2025-02-19T20:04:44.563Z","0.6.7":"2025-02-19T19:09:08.290Z","0.6.8":"2025-02-19T20:04:44.398Z"},"bugs":{"url":"https://github.com/MoraHol/ngx-text-diff/issues"},"author":{"name":"Alexis Holguin","email":"holguinalexis30@gmail.com"},"license":"MIT","homepage":"https://github.com/MoraHol/ngx-text-diff#readme","keywords":["Angular","Library","Google","Diff"],"repository":{"type":"git","url":"git+https://github.com/MoraHol/ngx-text-diff.git"},"description":"A Text Diff component for Angular.","maintainers":[{"name":"alexis3020","email":"holguinalexis30@gmail.com"}],"readme":"# ngx-text-diff\r\n- A simple text diff `component` to be used with Angular and based on `google diff match patch` library.\r\n\r\n## Dependencies\r\n - diff-match-patch : ^1.0.4\r\n\r\n## Required Packages\r\nThese packages will not be auto-installed and must be installed in addition to this library.\r\n - @angular/common >= 6.0.0\r\n - @angular/core >= 6.0.0\r\n - @angular/forms >= 6.0.0\r\n - @angular/cdk >= 6.0.0 (used for scrolling synchronization)\r\n\r\n## Demo\r\n[Ngx Text Diff Demo](https://ngx-text-diff.herokuapp.com/home)\r\n\r\n## Installation\r\n`npm i ngx-text-diff`\r\n\r\n## API\r\n`module: NgxTextDiffModule`  \r\n`component: NgxTextDiffComponent`  \r\n`selector: td-ngx-text-diff`\r\n\r\n### Inputs\r\n| Input                | Type              | Required                        | Description                                                                                     |\r\n| -------------------- | ----------------- | ------------------------------- | ----------------------------------------------------------------------------------------------- |\r\n| left                 | string            | Yes                             | First text to be compared                                                                       |\r\n| right                | string            | Yes                             | Second text to be compared                                                                      |\r\n| diffContent          | Observable        | Optional                        | `DiffContent` observable                                                                        |\r\n| format               | `DiffTableFormat` | Optional, default: `SideBySide` | Possible values:<br> -`SideBySide`<br> -`LineByLine`                                            |\r\n| loading              | boolean           | Optional, default: `false`      | Possible values:<br> -`true`: shows an loading spinner.<br>- `false`: hides the loading spinner |\r\n| hideMatchingLines    | boolean           | Optional, default: `false`      | Possible values:<br> -`true`: Only shows lines with differences.<br>- `false`: shows all lines  |\r\n| showToolbar          | boolean           | Optional, default: `true`       | Possible values:<br> -`true`: shows the toolbar.<br>- `false`: hides the format toolbar         |\r\n| showBtnToolbar       | boolean           | Optional, default: `true`       | Possible values:<br> -`true`: shows the format toolbar.<br>- `false`: hides the format toolbar  |\r\n| outerContainerClass  | any               | Optional                        | `ngClass` object for the outer div                                                              |\r\n| outerContainerStyle  | any               | Optional                        | `ngStyle` object for the outer style                                                            |\r\n| toolbarClass         | any               | Optional                        | `ngClass` object for the toolbar div                                                            |\r\n| toolbarStyle         | any               | Optional                        | `ngStyle` object for the toolbar style                                                          |\r\n| compareRowsClass     | any               | Optional                        | `ngClass` object for the div surrounding the table rows                                         |\r\n| compareRowsStyle     | any               | Optional                        | `ngStyle` object for the div surrounding the table rows                                         |\r\n| synchronizeScrolling | boolean           | Optional, default: `true`       | Possible values:<br> -`true`: Scrolls both tables together.<br>- `false`: Scrolls individually  |\r\n\r\n### Output\r\n| Input          | Type        | Required | Description                             |\r\n| -------------- | ----------- | -------- | --------------------------------------- |\r\n| compareResults | DiffResults | Optional | Event fired when comparison is executed |\r\n\r\n### Custom Objects\r\n``` typescript\r\nexport interface DiffContent {\r\n  leftContent: string;\r\n  rightContent: string;\r\n}\r\n\r\nexport type DiffTableFormat = 'SideBySide' | 'LineByLine';\r\n\r\nexport interface DiffResults {\r\n  hasDiff: boolean;\r\n  diffsCount: number;\r\n  rowsWithDiff: {\r\n    leftLineNumber?: number;\r\n    rightLineNumber?: number;\r\n    numDiffs: number;\r\n  }[];\r\n}\r\n```\r\n\r\n## Usage\r\n1. Register the `NgxTextDiffModule` in a module, for example app module.\r\n``` typescript\r\nimport { BrowserModule } from '@angular/platform-browser';\r\nimport { NgModule } from '@angular/core';\r\nimport { ScrollDispatchModule } from '@angular/cdk/scrolling';\r\n\r\nimport { AppComponent } from './app.component';\r\nimport { NgxTextDiffModule } from 'ngx-text-diff';\r\n\r\n@NgModule({\r\n  declarations: [AppComponent],\r\n  imports: [BrowserModule, ScrollDispatchModule, NgxTextDiffModule],\r\n  providers: [],\r\n  bootstrap: [AppComponent]\r\n})\r\nexport class AppModule {}\r\n```\r\n\r\n``` typescript\r\nimport { Component, OnInit } from '@angular/core';\r\nimport { DiffContent, DiffResults } from 'ngx-text-diff/lib/ngx-text-diff.model';\r\n\r\n@Component({\r\n  selector: 'app-home',\r\n  templateUrl: './home.component.html',\r\n  styleUrls: []\r\n})\r\nexport class HomeComponent implements OnInit {\r\n  left = `some text to\\nbe compared!`\r\n  right = `A changed\\n version \\n of the text to\\nbe compared!`\r\n\r\n  constructor() {}\r\n\r\n  ngOnInit() {\r\n  }\r\n\r\n  onCompareResults(diffResults: DiffResults) {\r\n    console.log('diffResults', diffResults);\r\n  }\r\n}\r\n\r\n```\r\n\r\n``` html\r\n<td-ngx-text-diff\r\n  [left]=\"left\"\r\n  [right]=\"right\"\r\n  (compareResults)=\"onCompareResults($event)\"\r\n>\r\n```\r\n\r\n## Build the NgxTextDiff module\r\n\r\nRun `ng build ngx-text-diff` to build the library. The build artifacts will be stored in the `dist/ngx-text-diff` directory.\r\n\r\n## Credits\r\n\r\nThis project is based on [google diff match patch](https://github.com/google/diff-match-patch).\r\n","readmeFilename":"README.md"}