all files / component/chips/ chips.component.ts

87.69% Statements 57/65
84% Branches 21/25
70.59% Functions 12/17
86.67% Lines 52/60
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145                                                              37×   37×   37× 37×   37×       37× 37×             18×       99×       47×       113×                             47×                             223×     146×     92×     92× 20× 72× 12× 60× 54× 54×              
/*
 *  @license
 *  Copyright Hôpitaux Universitaires de Genève. All Rights Reserved.
 *
 *  Use of this source code is governed by an Apache-2.0 license that can be
 *  found in the LICENSE file at https://github.com/DSI-HUG/dejajs-components/blob/master/LICENSE
 */
 
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { Component, ContentChild, EventEmitter, HostBinding, Input, Optional, Output, Self } from '@angular/core';
import { ControlValueAccessor, NgControl } from '@angular/forms';
 
const noop = () => { };
 
export interface IDejaChipsComponentCloseEvent extends CustomEvent {
    item: any;
    index: number;
}
 
@Component({
    selector: 'deja-chips',
    styles: [
        require('./chips.component.scss'),
    ],
    template: require('./chips.component.html'),
})
export class DejaChipsComponent implements ControlValueAccessor {
    /** Retourne ou definit la liste des éléments. */
    @Input() public _items: any[];
 
    /** Retourne ou definit le champ à utiliser comme texte. */
    @Input() public textField: string;
 
    /** Template d'élément si définit extérieurement au composant */
    @Input() public itemTemplateExternal: any;
 
    /** Template de control d'insertion si définit extérieurement au composant */
    @Input() public insertTemplateExternal: any;
 
    /** Lecture seule */
    @Input() public readonly = false;
 
    @Output() public close = new EventEmitter<IDejaChipsComponentCloseEvent>();
 
    protected onTouchedCallback: () => void = noop;
    protected onChangeCallback: (_: any) => void = noop;
 
    @HostBinding('attr.disabled') private _disabled: boolean = null;
 
    @ContentChild('itemTemplate') private itemTemplateInternal: any;
 
    @ContentChild('insertTemplate') private insertTemplateInternal: any;
 
    constructor(@Self() @Optional() public _control: NgControl) {
        Iif (this._control) {
            this._control.valueAccessor = this;
        }
    }
 
    /** Retourne ou definit si le selecteur est desactivé. */
    @Input()
    public set disabled(value: boolean | string) {
        this._disabled = coerceBooleanProperty(value) || null;
    }
 
    public get disabled() {
        return this._disabled;
    }
 
    @Input()
    public set items(value: any[]) {
        this.writeValue(value);
    }
 
    public get items(): any[] {
        return this._items;
    }
 
    // ************* ControlValueAccessor Implementation **************
    // set accessor including call the onchange callback
    public set value(value: any[]) {
        this.writeValue(value);
        this.onChangeCallback(value);
    }
 
    // get accessor
    public get value(): any[] {
        return this._items;
    }
 
    // From ControlValueAccessor interface
    public writeValue(value: any[]) {
        this._items = value;
    }
 
    // From ControlValueAccessor interface
    public registerOnChange(fn: any) {
        this.onChangeCallback = fn;
    }
 
    // From ControlValueAccessor interface
    public registerOnTouched(fn: any) {
        this.onTouchedCallback = fn;
    }
 
    public setDisabledState(isDisabled: boolean) {
        this.disabled = isDisabled;
    }
    // ************* End of ControlValueAccessor Implementation **************
 
    public get itemTemplate() {
        return this.itemTemplateExternal || this.itemTemplateInternal;
    }
 
    public get insertTemplate() {
        return this.insertTemplateExternal || this.insertTemplateInternal;
    }
 
    public getTextValue(value: any) {
        Iif (!value) {
            return '';
        } else {
            if (this.textField && value.model && value.model[this.textField] !== undefined) {
                return value.model[this.textField];
            } else if (this.textField && value[this.textField] !== undefined) {
                return value[this.textField];
            } else if (value.displayName) {
                return typeof value.displayName === 'string' ? value.displayName : value.displayName();
            } else Eif (typeof value.toString === 'function') {
                return value.toString();
            }
        }
    }
 
    public onClose(item: any, index: number) {
        const event = new CustomEvent('DejaChipsCloseEvent', {}) as IDejaChipsComponentCloseEvent;
        event.item = item;
        event.index = index;
        this.items.splice(index, 1);
        this.onChangeCallback(this.items);
        this.close.emit(event);
    }
}