ngx-tempusdominus-bootstrap/esm2015/ngx-tempusdominus-bootstrap.js

Angular2+ directive for tempus dominus bootstrap library.

import { Directive, ElementRef, Input, EventEmitter, Output, forwardRef, ChangeDetectorRef, KeyValueDiffers, HostListener, HostBinding, Inject, ContentChild, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import * as moment from 'moment';
import { CommonModule } from '@angular/common';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
 */
/** @type {?} */
const _moment = moment;
class NgTempusdominusBootstrapInputDirective {
    /**
     * @param {?} changeDetector
     * @param {?} el
     * @param {?} differs
     */
    constructor(changeDetector, el, differs) {
        this.changeDetector = changeDetector;
        this.el = el;
        this.differs = differs;
        this._options = {};
        this.click = new EventEmitter();
        this._onTouched = () => {
        };
        this._onChange = () => {
        };
        this.dpinitialized = false;
        /** @type {?} */
        const $parent = $(el.nativeElement.parentNode);
        this.inputOnly = !$parent.hasClass('input-group');
        this.dpElement = $parent.hasClass('input-group') ? $parent : $(el.nativeElement);
    }
    /**
     * @param {?} value
     * @return {?}
     */
    set options(value) {
        if (value !== null) {
            this._options = value;
        }
    }
    /**
     * @return {?}
     */
    get options() {
        return this._options;
    }
    /**
     * @return {?}
     */
    onBlur() {
        this._onTouched();
    }
    /**
     * @return {?}
     */
    onFocus() {
        if (this.inputOnly) {
            this.dpElement.datetimepicker('toggle');
        }
    }
    /**
     * For click outside of input, for input only
     * @param {?} event event object
     * @return {?}
     */
    outsideClick(event) {
        if (event) {
            /** @type {?} */
            const targetElement = event.target;
            if (!targetElement || !this.inputOnly || this.options.inline) {
                return;
            }
            /** @type {?} */
            const clickedInside = this.el.nativeElement.contains(targetElement);
            if (!clickedInside) {
                this.dpElement.datetimepicker('hide');
            }
        }
    }
    /**
     * @return {?}
     */
    get value() {
        return this._value || null;
    }
    /**
     * @param {?} val
     * @return {?}
     */
    set value(val) {
        this._value = val;
        this._onChange(val);
        if (val) {
            this._onTouched();
        }
        this.changeDetector.markForCheck();
    }
    /**
     * @param {?} value
     * @return {?}
     */
    writeValue(value) {
        // if we have a previous value and current value is falsy
        // clear the picker
        if (this._value && !value) {
            this.value = null;
            this.dpElement.datetimepicker('clear');
        }
        this.value = value;
        this.setDpValue(value);
    }
    /**
     * @param {?} fn
     * @return {?}
     */
    registerOnChange(fn) {
        this._onChange = fn;
    }
    /**
     * @param {?} fn
     * @return {?}
     */
    registerOnTouched(fn) {
        this._onTouched = fn;
    }
    /**
     * @param {?} val
     * @return {?}
     */
    setDpValue(val) {
        if (!this.dpinitialized) {
            return;
        }
        if (val) {
            this.dpElement.datetimepicker('date', this.value);
        }
    }
    /**
     * @param {?} isDisabled
     * @return {?}
     */
    setDisabledState(isDisabled) {
        if (isDisabled) {
            this.dpElement.datetimepicker('disable');
            return;
        }
        this.dpElement.datetimepicker('enable');
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        this.dpinitialized = true;
        this.dpElement.datetimepicker(this.options);
        this.dpElement.on('change.datetimepicker', (e) => {
            if (e.date && e.date !== this.value) {
                this.value = e.date || null;
            }
            else {
                /** @type {?} */
                const date = _moment(e.target.value, this.options.format);
                if (date.isValid()) {
                    this.value = date;
                }
            }
        });
        this.dpElement.on('click', () => {
            this.click.emit();
        });
        this.optionsDiffer = this.differs.find(this.options).create();
    }
    /**
     * @return {?}
     */
    ngDoCheck() {
        if (this.dpinitialized) {
            /** @type {?} */
            const changes = this.optionsDiffer.diff(this.options);
            if (changes) {
                $.map(this.options, (value, key) => {
                    this.dpElement.datetimepicker(key, value);
                });
            }
        }
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        this.dpElement.datetimepicker('destroy');
    }
    /**
     * @return {?}
     */
    toggle() {
        this.dpElement.datetimepicker('toggle');
    }
}
NgTempusdominusBootstrapInputDirective.decorators = [
    { type: Directive, args: [{
                selector: '[NgTempusdominusBootstrapInput]',
                exportAs: 'NgTempusdominusBootstrapInput',
                providers: [
                    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NgTempusdominusBootstrapInputDirective), multi: true }
                ]
            },] },
];
/** @nocollapse */
NgTempusdominusBootstrapInputDirective.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: ElementRef },
    { type: KeyValueDiffers }
];
NgTempusdominusBootstrapInputDirective.propDecorators = {
    options: [{ type: Input }],
    click: [{ type: Output }],
    onBlur: [{ type: HostListener, args: ['blur',] }],
    onFocus: [{ type: HostListener, args: ['focus',] }],
    outsideClick: [{ type: HostListener, args: ['document:click', ['$event'],] }]
};
/**
 * Allows the datepicker to be toggled via click.
 *
 */
class NgTempusdominusBootstrapToggleDirective {
    /**
     * @param {?} tempusDominus
     * @param {?} elementRef
     */
    constructor(tempusDominus, elementRef) {
        this.tempusDominus = tempusDominus;
        this.cursor = 'pointer';
    }
    /**
     * @return {?}
     */
    click() {
        this.toggleOpen();
    }
    /**
     * @return {?}
     */
    toggleOpen() {
        this.tempusDominus.toggle();
    }
}
NgTempusdominusBootstrapToggleDirective.decorators = [
    { type: Directive, args: [{
                selector: '[NgTempusdominusBootstrapToggle]'
            },] },
];
/** @nocollapse */
NgTempusdominusBootstrapToggleDirective.ctorParameters = () => [
    { type: undefined, decorators: [{ type: Inject, args: [forwardRef(() => NgTempusdominusBootstrapDirective),] }] },
    { type: ElementRef }
];
NgTempusdominusBootstrapToggleDirective.propDecorators = {
    cursor: [{ type: HostBinding, args: ['style.cursor',] }],
    click: [{ type: HostListener, args: ['click',] }]
};
/**
 * Container
 *
 */
class NgTempusdominusBootstrapDirective {
    /**
     * @param {?} el
     */
    constructor(el) {
        this.el = el;
    }
    /**
     * For click outside of container,
     * @param {?} event event object
     * @param {?} targetElement target element object
     * @return {?}
     */
    outsideClick(event, targetElement) {
        if (!targetElement) {
            return;
        }
        /** @type {?} */
        const clickedInside = this.el.nativeElement.contains(targetElement);
        if (!clickedInside) {
            this._input.dpElement.datetimepicker('hide');
        }
    }
    /**
     * @return {?}
     */
    toggle() {
        this._input.toggle();
    }
}
NgTempusdominusBootstrapDirective.decorators = [
    { type: Directive, args: [{
                selector: '[NgTempusdominusBootstrap]'
            },] },
];
/** @nocollapse */
NgTempusdominusBootstrapDirective.ctorParameters = () => [
    { type: ElementRef }
];
NgTempusdominusBootstrapDirective.propDecorators = {
    _input: [{ type: ContentChild, args: [NgTempusdominusBootstrapInputDirective,] }],
    outsideClick: [{ type: HostListener, args: ['document:click', ['$event', '$event.target'],] }]
};

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
 */
class NgTempusdominusBootstrapModule {
}
NgTempusdominusBootstrapModule.decorators = [
    { type: NgModule, args: [{
                imports: [
                    CommonModule,
                    FormsModule
                ],
                declarations: [
                    NgTempusdominusBootstrapDirective,
                    NgTempusdominusBootstrapToggleDirective,
                    NgTempusdominusBootstrapInputDirective,
                ],
                exports: [
                    NgTempusdominusBootstrapDirective,
                    NgTempusdominusBootstrapToggleDirective,
                    NgTempusdominusBootstrapInputDirective
                ]
            },] },
];

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
 */
/**
 * Generated bundle index. Do not edit.
 */

export { NgTempusdominusBootstrapModule, NgTempusdominusBootstrapToggleDirective, NgTempusdominusBootstrapDirective, NgTempusdominusBootstrapInputDirective };
//# sourceMappingURL=ngx-tempusdominus-bootstrap.js.map