nd-gui
Version:
UI components for NetDocuments
99 lines (93 loc) • 3.68 kB
JavaScript
import { Component, Input, Output, ChangeDetectionStrategy, EventEmitter, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
class ButtonComponent {
constructor() {
/**
* The type of button to be shown, either primary, secondary, or mutli
*/
this.type = "primary";
/**
* The text that should appear as the buttons label
*/
this.label = "OK";
/**
* Flag that indicates if the button should be disabled or not
*/
this.disabled = false;
this.buttonClickEvent = new EventEmitter();
}
/**
* @return {?}
*/
ngOnInit() {
// Ensure the value passed in for type is one of the three allow options
if (this.type !== "primary" && this.type !== "secondary" && this.type !== "multi") {
this.type = "primary";
}
}
/**
* @param {?} e
* @return {?}
*/
clickEvent(e) {
if (!this.disabled) {
this.buttonClickEvent.emit(e);
}
}
}
ButtonComponent.decorators = [
{ type: Component, args: [{
selector: 'nd-button',
template: `<input type="button"
[attr.id]="Id"
class="nd-button {{type}}"
[ngClass]="classList"
[class.disabled]="disabled"
(click)="clickEvent($event)"
[value]="label"/>
<ng-content></ng-content>
`,
styles: [`:host{margin:8px 20px 8px 8px;display:inline-block;position:relative}.nd-button{width:110px;height:38px;border-radius:1px;padding-left:15px;padding-right:15px;border:none;color:#fff;text-align:center;text-decoration:none;text-overflow:ellipsis;overflow:hidden;display:inline-block;font-size:12px;font-weight:600;cursor:pointer;outline:0}.nd-button:active,.nd-button:focus{outline:0}.nd-button.disabled{cursor:default}.nd-button.primary{background-color:#225582}.nd-button.primary:hover{background-color:#39668e}.nd-button.primary:active{background-color:#1e4c74}.nd-button.primary.disabled{background-color:#6488a7;color:#225582}.nd-button.secondary{background-color:#979797}.nd-button.secondary:hover{background-color:#a1a1a1}.nd-button.secondary:active{background-color:#878787}.nd-button.secondary.disabled{background-color:#b6b6b6;color:#979797}.nd-button.multi{background-color:#fff;color:#e66e25;border:1px solid #e66e25}.nd-button.multi:hover{background-color:#e66e25;color:#fff}.nd-button.multi:active{background-color:#d86722}.nd-button.multi.disabled{background-color:#ed9966;color:#e66e25;border-color:#ed9966}`],
changeDetection: ChangeDetectionStrategy.OnPush
},] },
];
/** @nocollapse */
ButtonComponent.ctorParameters = () => [];
ButtonComponent.propDecorators = {
type: [{ type: Input }],
label: [{ type: Input }],
disabled: [{ type: Input }],
classList: [{ type: Input }],
Id: [{ type: Input }],
buttonClickEvent: [{ type: Output, args: ["onClick",] }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
class ndButttonModule {
}
ndButttonModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule],
declarations: [ButtonComponent],
exports: [ButtonComponent]
},] },
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
/**
* Generated bundle index. Do not edit.
*/
export { ndButttonModule, ButtonComponent };
//# sourceMappingURL=nd-gui-button.js.map