Skip to content

Commit 1546cd8

Browse files
committed
up
0 parents  commit 1546cd8

10 files changed

+300
-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: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
# ngx-list-manager [![npm version](https://badge.fury.io/js/ngx-list-manager.svg)](https://badge.fury.io/js/ngx-list-manager) [![Build Status](https://api.travis-ci.com/rzodev/ngx-list-manager.svg?branch=main)](https://app.travis-ci.com/github/rzodev/ngx-list-manager) [![Support](https://img.shields.io/badge/Support-Angular%2019%2B-blue.svg)]() [![License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/RzoDev/ngx-list-manager/blob/main/LICENSE.md)
2+
3+
An Angular Service tool to manage lists efficiently.
4+
5+
## Prerequisites
6+
7+
- Angular: `>=19.2.0`
8+
9+
10+
## Usage
11+
12+
1. Install via npm
13+
14+
`npm i ngx-list-manager`
15+
16+
2. Import
17+
18+
```typescript
19+
import { NgxListManager } from 'ngx-list-manager';
20+
```
21+
22+
3. Usage example: In a table component that send events when rows are selected.
23+
24+
```html
25+
<div class="table-info">
26+
<span>Items selected: </span><span [innerText]="getList().length"></span>
27+
<button (click)="openModal()">View selected</button>
28+
<button (click)="clearSelectedItems()">Clear selected</button>
29+
</div>
30+
<div class="table-container">
31+
<app-table-component [data]="tableData" (sendCheck)="receiveItem($event)" (sendChecks)="receiveItems($event)"/>
32+
</div>
33+
34+
<modal>
35+
<modal-title>Items selected</modal-title>
36+
<modal-body>
37+
<div><span>Items selected: </span><span [innerText]="getList().length"></span></div>
38+
@for(let item of items; track item.id; let i = $index){
39+
<div class="row">
40+
<div class="col">#{{i+1}}</div>
41+
<div class="col" [innerText]="item.name"></div>
42+
<div class="col">
43+
<button (click)="removeItemIndex(i)">Remove</button>
44+
</div>
45+
<div>
46+
}
47+
</modal-body>
48+
<modal-footer>
49+
<button (click)="closeModal()">Close</button>
50+
</modal-footer>
51+
</modal>
52+
```
53+
54+
```typescript
55+
export interface IData{
56+
id: string;
57+
name: string;
58+
...
59+
}
60+
export interface ITableRow{
61+
selected: boolean;
62+
data: IData;
63+
...
64+
}
65+
66+
...
67+
68+
listManager = new NgxListManager<IData>();
69+
70+
receiveItem(item: ITableRow){
71+
this.listManager.insertOrRemove(item.data,item.selected);
72+
}
73+
receiveItems(items: ITableRow[]){
74+
items.forEach((item: ITableRow)=>{
75+
this.listManager.insertOrRemove(item.data,item.selected);
76+
})
77+
}
78+
79+
removeItemIndex(index: number){
80+
this.listManager.removeIndex(index);
81+
}
82+
clearSelectedItems(){
83+
this.listManager.clear();
84+
}
85+
getList(): IData[]{
86+
return this.listManager.list();
87+
}
88+
```

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-list-manager",
4+
"lib": {
5+
"entryFile": "src/public-api.ts"
6+
}
7+
}

package.json

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "ngx-list-manager",
3+
"version": "1.19.1",
4+
"author": "Rzo! <[email protected]> (https://github.com/RzoDev)",
5+
"description": "An Angular Service tool to manage lists efficiently.",
6+
"repository": {
7+
"type": "git",
8+
"url": "git+https://github.com/RzoDev/ngx-list-manager.git"
9+
},
10+
"bugs": {
11+
"url": "https://github.com/RzoDev/ngx-list-manager/issues"
12+
},
13+
"homepage": "https://github.com/RzoDev/ngx-list-manager",
14+
"keywords": [
15+
"Angular",
16+
"Angular 19",
17+
"List manager"
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+
"publishConfig": {
29+
"registry": "https://registry.npmjs.org"
30+
}
31+
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { TestBed } from '@angular/core/testing';
2+
3+
import { NgxListManager } from './ngx-list-manager.service';
4+
5+
describe('NgxListManagerService', () => {
6+
let service: NgxListManager<any>;
7+
8+
beforeEach(() => {
9+
TestBed.configureTestingModule({});
10+
service = TestBed.inject(NgxListManager);
11+
});
12+
13+
it('should be created', () => {
14+
expect(service).toBeTruthy();
15+
});
16+
});
Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
import { Injectable } from '@angular/core';
2+
3+
@Injectable({
4+
providedIn: 'root'
5+
})
6+
export class NgxListManager<T> {
7+
8+
/**
9+
* A variable that contains the elements of the list.
10+
*/
11+
private _list: T[] = [];
12+
13+
/**
14+
* Returns a boolean value indicating if the item passed exists on the list.
15+
* @param item A item value.
16+
* @returns A boolean value..
17+
*/
18+
private exists(item: T): boolean{
19+
return this._list.some((e)=>JSON.stringify(e)===JSON.stringify(item));
20+
}
21+
22+
/**
23+
* Insert or remove using the boolean param insert as flag, the passed element will be inserted if insert parameter is true and it does not alredy exist, or deleted if it is false and exists on the list.
24+
* @param item A item value to insert or remove from the list.
25+
* @param insert A boolean value.
26+
*/
27+
insertOrRemove(item: T, insert: boolean){
28+
const exists = this.exists(item);
29+
if(insert && !exists){
30+
this.insert(item);
31+
}else if(!insert && exists){
32+
this.remove(item);
33+
}
34+
}
35+
36+
/**
37+
* Insert a new element into the list if it doesn't already exist. If force parameter is true, the element will be inserted.
38+
* @param item A item value to insert.
39+
* @param force A boolean value. (default = false)
40+
*/
41+
insert(item: T, force: boolean = false){
42+
const exists = this.exists(item);
43+
if(!exists || force){
44+
this._list.push(item);
45+
}
46+
}
47+
48+
/**
49+
* Delete an item that match with the passed element.
50+
* @param item
51+
*/
52+
remove(item: T){
53+
const exists = this.exists(item);
54+
if(exists){
55+
this._list = this._list.filter((e)=>e!==item);
56+
}
57+
}
58+
59+
/**
60+
* Delete an item at passed position.
61+
* @param item
62+
*/
63+
removeIndex(index: number){
64+
const exists =this._list[index];
65+
if(exists){
66+
this._list = this._list.filter((e,i)=>i!==index);
67+
}
68+
}
69+
70+
/**
71+
* Assign a complete list.
72+
* @param list
73+
*/
74+
assign(list: T[]){
75+
this._list = list;
76+
}
77+
78+
/**
79+
* Clear the list.
80+
*/
81+
clear(){
82+
this._list = [];
83+
}
84+
85+
/**
86+
* Return the complete list.
87+
* @returns List that contains all elements added.
88+
*/
89+
list(): T[]{
90+
return this._list;
91+
}
92+
}

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-list-manager
3+
*/
4+
5+
export * from './lib/ngx-list-manager.service';

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)