moh-common-lib
Version:
A library of Angular components, services, and styles for B.C. Government Ministry of Health (MoH).
84 lines • 7.77 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, Output, EventEmitter, forwardRef } from '@angular/core';
import { ControlContainer, NgForm } from '@angular/forms';
import { scrollToError } from '../../../helpers/scroll-helpers';
var FormActionBarComponent = /** @class */ (function () {
function FormActionBarComponent() {
this.submitLabel = 'Continue';
this.canContinue = true;
this.isLoading = false;
this.defaultColor = true;
this.btnClick = new EventEmitter();
this.scrollToErrorsOnSubmit = true;
}
/**
* @return {?}
*/
FormActionBarComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
};
/**
* @param {?} $event
* @return {?}
*/
FormActionBarComponent.prototype.onClick = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (!this.isLoading && this.canContinue) {
this.btnClick.emit($event);
if (this.scrollToErrorsOnSubmit) {
// Scroll to error after 50ms, give time for errors to display etc.
// This timeout is outside of Angular change detection.
setTimeout(scrollToError, 50);
}
}
$event.stopPropagation();
return false;
};
FormActionBarComponent.decorators = [
{ type: Component, args: [{
selector: 'common-form-action-bar',
template: "<div class=\"form-action-bar form-bar\" [ngClass]=\"{disabled: !canContinue}\">\r\n <button class=\"btn btn-lg {{defaultColor ? 'btn-primary' : 'btn-secondary' }} submit\"\r\n (click)=\"onClick($event)\"\r\n [ngClass]=\"{disabled: !canContinue || isLoading}\">\r\n <ng-container *ngIf=\"!isLoading; else loadingSpinner\"> {{submitLabel}} </ng-container>\r\n \r\n </button>\r\n</div>\r\n\r\n<ng-template #loadingSpinner>\r\n <i class=\"fa fa-spinner fa-pulse fa-fw\"></i>\r\n</ng-template>",
// TODO: Figure out why this is required.
viewProviders: [{ provide: ControlContainer, useExisting: forwardRef((/**
* @return {?}
*/
function () { return NgForm; })) }],
styles: [".form-action-bar{display:flex;justify-content:flex-end;padding:1em;background-color:#cdd9e4;transition:background-color .3s;position:-webkit-sticky;position:-moz-sticky;position:-ms-sticky;position:-o-sticky;position:sticky;bottom:0;z-index:10;left:5rem;right:5rem}.form-action-bar.disabled{background-color:#d5d9dd}@media (max-width:991.98px){.form-action-bar{left:2.5rem;right:2.5rem}}.submit{min-width:240px}@media (max-width:767.98px){.form-action-bar{width:calc(100% + 30px);margin-left:-15px}.submit{min-width:100%}}.btn{white-space:normal!important;word-wrap:break-word}.btn-secondary.disabled{color:#000}"]
}] }
];
/** @nocollapse */
FormActionBarComponent.ctorParameters = function () { return []; };
FormActionBarComponent.propDecorators = {
submitLabel: [{ type: Input }],
canContinue: [{ type: Input }],
isLoading: [{ type: Input }],
defaultColor: [{ type: Input }],
btnClick: [{ type: Output }],
scrollToErrorsOnSubmit: [{ type: Input }]
};
return FormActionBarComponent;
}());
export { FormActionBarComponent };
if (false) {
/** @type {?} */
FormActionBarComponent.prototype.submitLabel;
/** @type {?} */
FormActionBarComponent.prototype.canContinue;
/** @type {?} */
FormActionBarComponent.prototype.isLoading;
/** @type {?} */
FormActionBarComponent.prototype.defaultColor;
/** @type {?} */
FormActionBarComponent.prototype.btnClick;
/** @type {?} */
FormActionBarComponent.prototype.scrollToErrorsOnSubmit;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1hY3Rpb24tYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL21vaC1jb21tb24tbGliLyIsInNvdXJjZXMiOlsibGliL2NvbXBvbmVudHMvZm9ybS1hY3Rpb24tYmFyL2Zvcm0tYWN0aW9uLWJhci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNGLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUMxRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFFaEU7SUFnQkU7UUFSUyxnQkFBVyxHQUFXLFVBQVUsQ0FBQztRQUNqQyxnQkFBVyxHQUFZLElBQUksQ0FBQztRQUM1QixjQUFTLEdBQVksS0FBSyxDQUFDO1FBQzNCLGlCQUFZLEdBQVksSUFBSSxDQUFDO1FBQzVCLGFBQVEsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUV2RCwyQkFBc0IsR0FBWSxJQUFJLENBQUM7SUFFaEMsQ0FBQzs7OztJQUVqQix5Q0FBUTs7O0lBQVI7SUFDQSxDQUFDOzs7OztJQUVELHdDQUFPOzs7O0lBQVAsVUFBUSxNQUFNO1FBQ1osSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUN2QyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztZQUUzQixJQUFJLElBQUksQ0FBQyxzQkFBc0IsRUFBRTtnQkFDL0IsbUVBQW1FO2dCQUNuRSx1REFBdUQ7Z0JBQ3ZELFVBQVUsQ0FBQyxhQUFhLEVBQUUsRUFBRSxDQUFDLENBQUM7YUFDL0I7U0FDRjtRQUNELE1BQU0sQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN6QixPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7O2dCQWpDRixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLHdCQUF3QjtvQkFDbEMsNmhCQUErQzs7b0JBRy9DLGFBQWEsRUFBRSxDQUFFLEVBQUUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLFdBQVcsRUFBRSxVQUFVOzs7NEJBQUMsY0FBTSxPQUFBLE1BQU0sRUFBTixDQUFNLEVBQUUsRUFBRSxDQUFFOztpQkFDekY7Ozs7OzhCQUVFLEtBQUs7OEJBQ0wsS0FBSzs0QkFDTCxLQUFLOytCQUNMLEtBQUs7MkJBQ0wsTUFBTTt5Q0FFTixLQUFLOztJQW9CUiw2QkFBQztDQUFBLEFBbENELElBa0NDO1NBM0JZLHNCQUFzQjs7O0lBQ2pDLDZDQUEwQzs7SUFDMUMsNkNBQXFDOztJQUNyQywyQ0FBb0M7O0lBQ3BDLDhDQUFzQzs7SUFDdEMsMENBQWdFOztJQUVoRSx3REFBZ0QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBmb3J3YXJkUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbnRyb2xDb250YWluZXIsIE5nRm9ybSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgc2Nyb2xsVG9FcnJvciB9IGZyb20gJy4uLy4uLy4uL2hlbHBlcnMvc2Nyb2xsLWhlbHBlcnMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdjb21tb24tZm9ybS1hY3Rpb24tYmFyJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vZm9ybS1hY3Rpb24tYmFyLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9mb3JtLWFjdGlvbi1iYXIuY29tcG9uZW50LnNjc3MnXSxcclxuICAvLyBUT0RPOiBGaWd1cmUgb3V0IHdoeSB0aGlzIGlzIHJlcXVpcmVkLlxyXG4gIHZpZXdQcm92aWRlcnM6IFsgeyBwcm92aWRlOiBDb250cm9sQ29udGFpbmVyLCB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBOZ0Zvcm0gKSB9IF1cclxufSlcclxuZXhwb3J0IGNsYXNzIEZvcm1BY3Rpb25CYXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHN1Ym1pdExhYmVsOiBzdHJpbmcgPSAnQ29udGludWUnO1xyXG4gIEBJbnB1dCgpIGNhbkNvbnRpbnVlOiBib29sZWFuID0gdHJ1ZTtcclxuICBASW5wdXQoKSBpc0xvYWRpbmc6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoKSBkZWZhdWx0Q29sb3I6IGJvb2xlYW4gPSB0cnVlO1xyXG4gIEBPdXRwdXQoKSBidG5DbGljazogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuXHJcbiAgQElucHV0KCkgc2Nyb2xsVG9FcnJvcnNPblN1Ym1pdDogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIGNvbnN0cnVjdG9yKCkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gIH1cclxuXHJcbiAgb25DbGljaygkZXZlbnQpIHtcclxuICAgIGlmICghdGhpcy5pc0xvYWRpbmcgJiYgdGhpcy5jYW5Db250aW51ZSkge1xyXG4gICAgICB0aGlzLmJ0bkNsaWNrLmVtaXQoJGV2ZW50KTtcclxuXHJcbiAgICAgIGlmICh0aGlzLnNjcm9sbFRvRXJyb3JzT25TdWJtaXQpIHtcclxuICAgICAgICAvLyBTY3JvbGwgdG8gZXJyb3IgYWZ0ZXIgNTBtcywgZ2l2ZSB0aW1lIGZvciBlcnJvcnMgdG8gZGlzcGxheSBldGMuXHJcbiAgICAgICAgLy8gVGhpcyB0aW1lb3V0IGlzIG91dHNpZGUgb2YgQW5ndWxhciBjaGFuZ2UgZGV0ZWN0aW9uLlxyXG4gICAgICAgIHNldFRpbWVvdXQoc2Nyb2xsVG9FcnJvciwgNTApO1xyXG4gICAgICB9XHJcbiAgICB9XHJcbiAgICAkZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XHJcbiAgICByZXR1cm4gZmFsc2U7XHJcbiAgfVxyXG59XHJcbiJdfQ==