ngx-tags-input-box
Version:
A tags input is a UI component which allows the user to insert multiple entries as tags into an input field. Also known as Tagging/Tokenizing system. You can find this system on most major websites.
1 lines • 6.71 kB
Source Map (JSON)
{"version":3,"file":"ngx-tags-input-box.mjs","sources":["../../../projects/ngx-tags-input-box/src/lib/ngx-tags-input-box.service.ts","../../../projects/ngx-tags-input-box/src/lib/ngx-tags/ngx-tags.component.ts","../../../projects/ngx-tags-input-box/src/lib/ngx-tags/ngx-tags.component.html","../../../projects/ngx-tags-input-box/src/public-api.ts","../../../projects/ngx-tags-input-box/src/ngx-tags-input-box.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class NgxTagsInputBoxService {\n\n constructor() { }\n}\n","import { Component, EventEmitter, Input } from '@angular/core';\n\ntype mode = \"primary\" | \"success\" | \"danger\" | \"info\" | \"warning\" | \"light\";\n\n@Component({\n selector: 'ngx-tags-input',\n templateUrl: './ngx-tags.component.html',\n styleUrls: ['./ngx-tags.component.css'],\n standalone: true,\n imports: []\n})\nexport class NgxTagsComponent {\n tagsChange: EventEmitter<any>;\n @Input() limit: number = 25;\n @Input() mode: mode;\n @Input() placeholder: string;\n @Input() tags: any[];\n @Input() rounded: boolean = false;\n @Input() disabled: boolean = false;\n @Input() distinct: boolean = true;\n\n public color: string;\n constructor() {\n this.tagsChange = new EventEmitter();\n this.tags = [];\n }\n\n ngOnInit() {\n this.limit = this.limit || 25;\n this.placeholder = this.placeholder + `( Maximum ${this.limit} )` || `Add tags ( Maximum ${this.limit} )`;\n if (this.mode === 'success') {\n this.color = 'green';\n } else if (this.mode === 'primary') {\n this.color = '#0d47a1';\n } else if (this.mode === 'danger') {\n this.color = 'crimson';\n } else if (this.mode === 'warning') {\n this.color = '#ff9800';\n } else if (this.mode === 'info') {\n this.color = 'cornflowerblue';\n } else if (this.mode === 'light') {\n this.color = 'gray';\n } else {\n this.color = 'cornflowerblue';\n }\n }\n\n add(e: any) {\n let tagString: string = e.target.value;\n if (this.tags.length < this.limit - 1) {\n if (this.distinct && !this.tags.includes(tagString)) {\n this.tags.push(e.target.value);\n\n e.target.value = '';\n this.tagsChange.emit(this.tags);\n }\n }\n else {\n this.tags[this.limit - 1] = e.target.value;\n }\n }\n\n remove(i: number) {\n this.tags.splice(i, 1);\n }\n}\n","<div class=\"ngx-tag-container\">\n <input type=\"text\" class=\"ngx-tags-input\" [disabled]=\"disabled\" [class.ngx-tags-input-rounded]=\"rounded\"\n (change)=\"add($event)\" [style.borderColor]=\"color\" [placeholder]=\"placeholder\" />\n <div class=\"ngx-tags-extra\">\n <div>\n @for (item of tags; track item; let i = $index) {\n <span class=\"ngx-tags-label\" [class.ngx-tags-label-rounded]=\"rounded\" [style.backgroundColor]=\"color\">\n {{ item }} <span (click)=\"remove(i)\" class=\"ngx-tag-remove\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 384 512\">\n <path fill=\"white\"\n d=\"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\" />\n </svg>\n </span>\n </span>\n }\n </div>\n </div>\n</div>","/*\n * Public API Surface of ngx-tags-input-box\n */\n\nexport * from './lib/ngx-tags-input-box.service';\nexport * from './lib/ngx-tags/ngx-tags.component';\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}