Skip to content

Commit 1a610c1

Browse files
RzoDevRzoDev
committed
1st up
0 parents  commit 1a610c1

File tree

9 files changed

+227
-0
lines changed

9 files changed

+227
-0
lines changed

‎LICENSE‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
The MIT License (MIT)
2+
Copyright (c) 2023 Yuvraj Chauhan
3+
4+
Permission is hereby granted, free of charge, to any person obtaining a copy
5+
of this software and associated documentation files (the "Software"), to deal
6+
in the Software without restriction, including without limitation the rights
7+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
8+
copies of the Software, and to permit persons to whom the Software is
9+
furnished to do so, subject to the following conditions:
10+
11+
The above copyright notice and this permission notice shall be included in all
12+
copies or substantial portions of the Software.
13+
14+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
15+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
16+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
17+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
18+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
19+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
20+
SOFTWARE.

‎README.md‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
# NgxCompareObject [![npm version](https://badge.fury.io/js/ngx-compare-object.svg)](https://badge.fury.io/js/ngx-cam-shoot) [![Build Status](https://api.travis-ci.com/rzodev/ngx-compare-object.svg?branch=main)](https://app.travis-ci.com/github/rzodev/ngx-compare-object) [![Support](https://img.shields.io/badge/Support-Angular%2018%2B-blue.svg?style=flat-square)]() [![License](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](https://github.com/RzoDev/ngx-compare-object/blob/main/LICENSE.md)
2+
3+
An Angular Class tool to compare an initial object with another modified version of itself.
4+
5+
## Usage
6+
7+
1. Install via npm
8+
9+
`npm i ngx-compare-object`
10+
11+
2. Import
12+
13+
```typescript
14+
import { NgxCompareObject } from 'ngx-compare-object';
15+
```
16+
17+
3. Usage example
18+
19+
```html
20+
<form [formGroup]="form">
21+
<div>
22+
<h2>Edit user</h2>
23+
</div>
24+
<div>
25+
<label>First name</label>
26+
<input type="text" formControlName="firtname">
27+
</div>
28+
<div>
29+
<label>Last name</label>
30+
<input type="text" formControlName="lastname">
31+
</div>
32+
<div>
33+
<label>Email</label>
34+
<input type="text" formControlName="email">
35+
</div>
36+
<div>
37+
<button type="button" [disabled]="!hasChanges()" (click)="restore()">Cancel</button>
38+
<button type="button" [disabled]="!hasChanges()" (click)="submitUser()">Submit</button>
39+
</div>
40+
</form>
41+
```
42+
43+
```typescript
44+
private fb = inject(FormBuilder);
45+
private route = inject(ActivatedRoute);
46+
47+
private co!: CompareObject;
48+
form: FormGroup;
49+
private @Input() id: string;
50+
51+
ngOnInit(){
52+
if(this.id){
53+
this.getInfo(this.id);
54+
}
55+
}
56+
57+
private getInfo(id: string){
58+
this.http.get('https://example.com/users/'+id)
59+
.subcribe((response)=>{
60+
this.initForm(response.user);
61+
})
62+
}
63+
64+
private initForm(user: IUser){
65+
this.form = this.fb.group({
66+
firstname: [user.firstname, Validators.required],
67+
lastname: [user.lastname, Validators.required],
68+
email: [user.email, Validators.required]
69+
});
70+
71+
const originalForm = this.form.value();
72+
73+
this.co = new CompareObject(originalForm);
74+
}
75+
76+
hasChanges(): boolean{
77+
const form = this.form.value();
78+
return !this.co.isSame(form);
79+
}
80+
private restore(){
81+
this.form.reset(this.co.getOriginal());
82+
}
83+
84+
submitUser(){
85+
if(this.hasChanges()){
86+
//do something
87+
}
88+
}
89+
cancelSubmit(){
90+
this.restore();
91+
}
92+
```

‎ng-package.json‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
3+
"dest": "../../dist/ngx-compare-object",
4+
"lib": {
5+
"entryFile": "src/public-api.ts"
6+
}
7+
}

‎package.json‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"name": "ngx-compare-object",
3+
"version": "1.19.0",
4+
"author": "Rzo! <[email protected]> (https://github.com/RzoDev)",
5+
"description": "An Angular Class tool to compare an initial object with another modified version of itself.",
6+
"repository": {
7+
"type": "git",
8+
"url": "git+https://github.com/RzoDev/ngx-compare-object.git"
9+
},
10+
"bugs": {
11+
"url": "https://github.com/RzoDev/ngx-compare-object/issues"
12+
},
13+
"homepage": "https://github.com/RzoDev/ngx-compare-object",
14+
"keywords": [
15+
"Angular",
16+
"Angular 19",
17+
"Compare object"
18+
],
19+
"license":"MIT",
20+
"peerDependencies": {
21+
"@angular/common": "^19.2.0",
22+
"@angular/core": "^19.2.0"
23+
},
24+
"dependencies": {
25+
"tslib": "^2.3.0"
26+
},
27+
"sideEffects": false,
28+
29+
"publishConfig": {
30+
"registry": "https://registry.npmjs.org"
31+
}
32+
}

‎src/lib/ngx-compare-object.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
2+
export class NgxCompareObject<T> {
3+
4+
private _obj: string;
5+
6+
/**
7+
* Set initial object to compare
8+
* @param initialObject
9+
*/
10+
constructor(initialObject: T){
11+
this._obj = JSON.stringify(initialObject);
12+
}
13+
14+
/**
15+
* Compare if passed object is same to the initial object
16+
* @param object
17+
* @returns boolean
18+
*/
19+
isSame(object: object): boolean{
20+
return this._obj==JSON.stringify(object);
21+
}
22+
23+
/**
24+
* Returns the original object
25+
* @returns T
26+
*/
27+
getOriginal(): T{
28+
return JSON.parse(this._obj);
29+
}
30+
}

‎src/public-api.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/*
2+
* Public API Surface of ngx-compare-object
3+
*/
4+
5+
export * from './lib/ngx-compare-object';

‎tsconfig.lib.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
2+
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
3+
{
4+
"extends": "../../tsconfig.json",
5+
"compilerOptions": {
6+
"outDir": "../../out-tsc/lib",
7+
"declaration": true,
8+
"declarationMap": true,
9+
"inlineSources": true,
10+
"types": []
11+
},
12+
"exclude": [
13+
"**/*.spec.ts"
14+
]
15+
}

‎tsconfig.lib.prod.json‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
2+
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
3+
{
4+
"extends": "./tsconfig.lib.json",
5+
"compilerOptions": {
6+
"declarationMap": false
7+
},
8+
"angularCompilerOptions": {
9+
"compilationMode": "partial"
10+
}
11+
}

‎tsconfig.spec.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
2+
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
3+
{
4+
"extends": "../../tsconfig.json",
5+
"compilerOptions": {
6+
"outDir": "../../out-tsc/spec",
7+
"types": [
8+
"jasmine"
9+
]
10+
},
11+
"include": [
12+
"**/*.spec.ts",
13+
"**/*.d.ts"
14+
]
15+
}

0 commit comments

Comments
 (0)