@asi-ngtools/lib
Version:
This project is a little components library, simple to use, which will help you to simplify your project.
87 lines (86 loc) • 6.69 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { Component, Input, ContentChild, Output, EventEmitter } from '@angular/core';
import { trigger, style, animate, transition } from '@angular/animations';
import { AsiComponentTemplateCollapseHeaderDef } from '../common/asi-component-template';
export class AsiCollapseComponent {
constructor() {
/**
* Is collapsed
*/
this.collapsed = true;
/**
* is enabled/disabled
*/
this.disabled = false;
/**
* Event emitted with the collapse status change
*/
this.onCollapse = new EventEmitter();
this.state = 'collapsed';
}
/**
* @return {?}
*/
toggleCollapse() {
this.collapsed = !this.collapsed;
this.state = (this.collapsed) ? 'collapsed' : 'notcollapsed';
this.onCollapse.emit(this.collapsed);
}
}
AsiCollapseComponent.decorators = [
{ type: Component, args: [{
selector: 'asi-collapse',
host: { 'class': 'asi-component asi-collapse' },
template: "<button type=\"button\" class=\"collapse-header\" [disabled]=\"disabled\" (click)=\"toggleCollapse()\">\r\n <span *ngIf=\"headerDef == null\">\r\n {{label | translate }}\r\n </span>\r\n <ng-template *ngIf=\"headerDef != null\" [ngTemplateOutlet]=\"headerDef.template\" [ngTemplateOutletContext]=\"{$implicit : {collapsed : collapsed, disabled : disabled}}\"></ng-template>\r\n</button>\r\n<div class=\"collapse-panel\" *ngIf=\"!collapsed\" [@reveal]>\r\n <ng-content></ng-content>\r\n</div>",
animations: [
trigger('reveal', [
transition('void => *', [
style({ height: 0 }),
animate('250ms ease-in-out', style({ height: '*' }))
]),
transition('* => void', [
animate('250ms ease-in-out', style({ height: 0 }))
])
])
]
}] }
];
/** @nocollapse */
AsiCollapseComponent.ctorParameters = () => [];
AsiCollapseComponent.propDecorators = {
label: [{ type: Input }],
collapsed: [{ type: Input }],
disabled: [{ type: Input }],
onCollapse: [{ type: Output }],
headerDef: [{ type: ContentChild, args: [AsiComponentTemplateCollapseHeaderDef,] }]
};
if (false) {
/**
* Collapse label
* @type {?}
*/
AsiCollapseComponent.prototype.label;
/**
* Is collapsed
* @type {?}
*/
AsiCollapseComponent.prototype.collapsed;
/**
* is enabled/disabled
* @type {?}
*/
AsiCollapseComponent.prototype.disabled;
/**
* Event emitted with the collapse status change
* @type {?}
*/
AsiCollapseComponent.prototype.onCollapse;
/** @type {?} */
AsiCollapseComponent.prototype.headerDef;
/** @type {?} */
AsiCollapseComponent.prototype.state;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNpLWNvbGxhcHNlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0Bhc2ktbmd0b29scy9saWIvIiwic291cmNlcyI6WyJsaWIvY29tcG9uZW50cy9hc2ktY29sbGFwc2UvYXNpLWNvbGxhcHNlLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDckYsT0FBTyxFQUFHLE9BQU8sRUFBRyxLQUFLLEVBQUcsT0FBTyxFQUFHLFVBQVUsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQzlFLE9BQU8sRUFBRSxxQ0FBcUMsRUFBRSxNQUFNLGtDQUFrQyxDQUFDO0FBa0J6RixNQUFNO0lBZ0JKOzs7O3lCQVhxQixJQUFJOzs7O3dCQUVMLEtBQUs7Ozs7MEJBR0YsSUFBSSxZQUFZLEVBQVc7cUJBSTFDLFdBQVc7S0FHbEI7Ozs7SUFFRCxjQUFjO1FBQ1osSUFBSSxDQUFDLFNBQVMsR0FBRyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUM7UUFDakMsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxjQUFjLENBQUM7UUFDN0QsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0tBQ3RDOzs7WUF2Q0YsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxjQUFjO2dCQUN4QixJQUFJLEVBQUUsRUFBRSxPQUFPLEVBQUUsNEJBQTRCLEVBQUU7Z0JBQy9DLDZmQUE0QztnQkFDNUMsVUFBVSxFQUFFO29CQUNWLE9BQU8sQ0FBQyxRQUFRLEVBQUU7d0JBQ2hCLFVBQVUsQ0FBQyxXQUFXLEVBQUU7NEJBQ3RCLEtBQUssQ0FBQyxFQUFDLE1BQU0sRUFBRSxDQUFDLEVBQUMsQ0FBQzs0QkFDbEIsT0FBTyxDQUFDLG1CQUFtQixFQUFFLEtBQUssQ0FBQyxFQUFDLE1BQU0sRUFBRSxHQUFHLEVBQUMsQ0FBQyxDQUFDO3lCQUNuRCxDQUFDO3dCQUNGLFVBQVUsQ0FBQyxXQUFXLEVBQUU7NEJBQ3RCLE9BQU8sQ0FBQyxtQkFBbUIsRUFBRSxLQUFLLENBQUMsRUFBQyxNQUFNLEVBQUUsQ0FBQyxFQUFDLENBQUMsQ0FBQzt5QkFDakQsQ0FBQztxQkFDSCxDQUFDO2lCQUNIO2FBQ0Y7Ozs7O29CQUlFLEtBQUs7d0JBRUwsS0FBSzt1QkFFTCxLQUFLO3lCQUdMLE1BQU07d0JBRU4sWUFBWSxTQUFDLHFDQUFxQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIENvbnRlbnRDaGlsZCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgIHRyaWdnZXIsICBzdHlsZSwgIGFuaW1hdGUsICB0cmFuc2l0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XHJcbmltcG9ydCB7IEFzaUNvbXBvbmVudFRlbXBsYXRlQ29sbGFwc2VIZWFkZXJEZWYgfSBmcm9tICcuLi9jb21tb24vYXNpLWNvbXBvbmVudC10ZW1wbGF0ZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2FzaS1jb2xsYXBzZScsXHJcbiAgaG9zdDogeyAnY2xhc3MnOiAnYXNpLWNvbXBvbmVudCBhc2ktY29sbGFwc2UnIH0sXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2FzaS1jb2xsYXBzZS5jb21wb25lbnQuaHRtbCcsXHJcbiAgYW5pbWF0aW9uczogW1xyXG4gICAgdHJpZ2dlcigncmV2ZWFsJywgW1xyXG4gICAgICB0cmFuc2l0aW9uKCd2b2lkID0+IConLCBbXHJcbiAgICAgICAgc3R5bGUoe2hlaWdodDogMH0pLFxyXG4gICAgICAgIGFuaW1hdGUoJzI1MG1zIGVhc2UtaW4tb3V0Jywgc3R5bGUoe2hlaWdodDogJyonfSkpXHJcbiAgICAgIF0pLFxyXG4gICAgICB0cmFuc2l0aW9uKCcqID0+IHZvaWQnLCBbXHJcbiAgICAgICAgYW5pbWF0ZSgnMjUwbXMgZWFzZS1pbi1vdXQnLCBzdHlsZSh7aGVpZ2h0OiAwfSkpXHJcbiAgICAgIF0pXHJcbiAgICBdKVxyXG4gIF1cclxufSlcclxuZXhwb3J0IGNsYXNzIEFzaUNvbGxhcHNlQ29tcG9uZW50ICB7XHJcblxyXG4gIC8qKiBDb2xsYXBzZSBsYWJlbCAqL1xyXG4gIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmc7XHJcbiAgLyoqIElzIGNvbGxhcHNlZCAgKi9cclxuICBASW5wdXQoKSBjb2xsYXBzZWQgPSB0cnVlO1xyXG4gIC8qKiBpcyBlbmFibGVkL2Rpc2FibGVkICovXHJcbiAgQElucHV0KCkgZGlzYWJsZWQgPSBmYWxzZTtcclxuXHJcbiAgLyoqIEV2ZW50IGVtaXR0ZWQgd2l0aCB0aGUgY29sbGFwc2Ugc3RhdHVzIGNoYW5nZSAqL1xyXG4gIEBPdXRwdXQoKSBvbkNvbGxhcHNlID0gbmV3IEV2ZW50RW1pdHRlcjxCb29sZWFuPigpO1xyXG5cclxuICBAQ29udGVudENoaWxkKEFzaUNvbXBvbmVudFRlbXBsYXRlQ29sbGFwc2VIZWFkZXJEZWYpIGhlYWRlckRlZjogQXNpQ29tcG9uZW50VGVtcGxhdGVDb2xsYXBzZUhlYWRlckRlZjtcclxuXHJcbiAgc3RhdGUgPSAnY29sbGFwc2VkJztcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7XHJcbiAgfVxyXG5cclxuICB0b2dnbGVDb2xsYXBzZSgpIHtcclxuICAgIHRoaXMuY29sbGFwc2VkID0gIXRoaXMuY29sbGFwc2VkO1xyXG4gICAgdGhpcy5zdGF0ZSA9ICh0aGlzLmNvbGxhcHNlZCkgPyAnY29sbGFwc2VkJyA6ICdub3Rjb2xsYXBzZWQnO1xyXG4gICAgdGhpcy5vbkNvbGxhcHNlLmVtaXQodGhpcy5jb2xsYXBzZWQpO1xyXG4gIH1cclxufVxyXG4iXX0=