diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts
index 1f25ab47..5d83e1fa 100644
--- a/sharedComponents/input/input.component.ts
+++ b/sharedComponents/input/input.component.ts
@@ -23,14 +23,22 @@ import {properties} from "../../../../environments/environment";
import {ClickEvent} from "../../utils/click/click-outside-or-esc.directive";
import {element} from "protractor";
-export type InputType = 'text' | 'URL' | 'logoURL' | 'autocomplete' | 'autocomplete_soft' | 'textarea' | 'select' | 'chips';
+export type InputType =
+ 'text'
+ | 'URL'
+ | 'logoURL'
+ | 'autocomplete'
+ | 'autocomplete_soft'
+ | 'textarea'
+ | 'select'
+ | 'chips';
export interface Option {
icon?: string,
iconClass?: string,
value: any,
label: string,
- tooltip?: string,
+ tooltip?: string,
disabled?: boolean,
hidden?: boolean
}
@@ -112,7 +120,7 @@ declare var UIkit;
visibleChips - 1"
class="chip">
-
{{getLabel(chip.value)}}
0;
}
- if(this.type === "select") {
+ if (this.type === "select") {
if (this.optionsArray.length > this.optionsBreakpoint) {
this.type = 'autocomplete';
this.showOptionsOnEmpty = true;
@@ -317,11 +325,11 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
@HostListener('window:keydown.arrowLeft', ['$event'])
arrowLeft(event: KeyboardEvent) {
- if(this.focused) {
+ if (this.focused) {
event.preventDefault();
- if(this.activeElement.getValue()) {
+ if (this.activeElement.getValue()) {
let index = this.chips.toArray().indexOf(this.activeElement.getValue());
- if(index > 0) {
+ if (index > 0) {
this.activeElement.next(this.chips.get(index - 1));
return;
}
@@ -331,11 +339,11 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
@HostListener('window:keydown.arrowRight', ['$event'])
arrowRight(event: KeyboardEvent) {
- if(this.focused) {
+ if (this.focused) {
event.preventDefault();
- if(this.activeElement.getValue()) {
+ if (this.activeElement.getValue()) {
let index = this.chips.toArray().indexOf(this.activeElement.getValue());
- if(index < this.chips.length - 1) {
+ if (index < this.chips.length - 1) {
this.activeElement.next(this.chips.get(index + 1));
return;
}
@@ -355,7 +363,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
} else {
this.focus(false, event);
}
- if(this.extendEnter) {
+ if (this.extendEnter) {
this.extendEnter();
}
}
@@ -389,7 +397,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
this.activeElement.subscribe(element => {
- if(element) {
+ if (element) {
element.nativeElement.scrollIntoView({behavior: 'smooth'});
}
})
@@ -404,7 +412,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
if (changes.value) {
this.formControl.setValue(this.value);
}
- if(changes.validators) {
+ if (changes.validators) {
this.updateValidators();
}
if (changes.formControl || changes.validators || changes.options) {
@@ -508,7 +516,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
updateValidators() {
- if(this.formAsArray) {
+ if (this.formAsArray) {
this.formAsArray.controls.forEach(control => {
control.setValidators(this.validators);
control.updateValueAndValidity();
@@ -548,15 +556,33 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
add(event, addChips = false) {
- if (addChips && this.searchControl.value && this.searchControl.valid) {
- if (event && event.stopPropagation) {
- event.stopPropagation();
- }
- this.formAsArray.push(new UntypedFormControl(this.searchControl.value, this.validators));
- this.formAsArray.markAsDirty();
+ if (addChips && this.searchControl.value) {
+ this.splitSearchControl();
+ } else if (!this.focused) {
this.searchControl.setValue('');
+ }
+ }
+
+ splitSearchControl() {
+ let values = [this.searchControl.value];
+ this.separators.forEach(separator => {
+ values = ([] as string[]).concat(...values.map(value => {
+ if (Array.isArray(value)) {
+ return ([] as string[]).concat(...value.map(element => element.split(separator)));
+ } else {
+ return value.split(separator);
+ }
+ }));
+ });
+ values.forEach(value => {
+ let control = new UntypedFormControl(value.trim(), this.validators);
+ if (control.valid) {
+ this.formAsArray.push(control);
+ this.formAsArray.markAsDirty();
+ }
+ });
+ if (this.formAsArray.dirty) {
this.activeElement.next(this.chips.last);
- } else if(!this.focused) {
this.searchControl.setValue('');
}
}
@@ -565,8 +591,8 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
let option = this.optionsArray.find(option => HelperFunctions.equals(option.value, value));
return (option) ? option.label : (value);
}
-
- getTooltip(value: any): string {
+
+ getTooltip(value: any): string {
let option = this.optionsArray.find(option => HelperFunctions.equals(option.value, value));
return (option) ? (option.tooltip ? option.tooltip : option.label) : (value);
}