angular2-collapsible
Version:
Angular collapsible component styled with Materialize CSS.
145 lines (143 loc) • 11.6 kB
JavaScript
/**
* @fileoverview added by tsickle
* Generated from: lib/collapsible-body/collapsible-body.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, ElementRef, HostBinding, Output, EventEmitter } from '@angular/core';
import { CollapsibleService } from '../services/collapsible.service';
import { CollapsibleEventService } from '../services/collapsible-event.service';
import { CollapsibleAnimationsService } from '../services/collapsible-animations.service';
export class CollapsibleBodyComponent {
/**
* @param {?} el
* @param {?} collapsibleService
* @param {?} eventService
*/
constructor(el, collapsibleService, eventService) {
this.el = el;
this.collapsibleService = collapsibleService;
this.eventService = eventService;
this.toggleState = new EventEmitter();
}
/**
* @return {?}
*/
ngOnInit() {
this.eventService.toggleCollapsibleItem$.subscribe((/**
* @return {?}
*/
() => {
this.toggleCollapsibleItem();
}));
}
/**
* @return {?}
*/
hasContent() {
for (const child of this.el.nativeElement.childNodes) {
if (((/** @type {?} */ (child))).tagName != null) {
return true;
}
}
return false;
}
/**
* @return {?}
*/
toggleCollapsibleItem() {
// toggle body's state only if it has any childs
if (this.hasContent()) {
if (this.collapsibleService.getType() === 'accordion') {
/** @type {?} */
const tempExpanded = this.expanded;
this.collapsibleService.collapseAll();
this.expanded = tempExpanded;
}
this.expanded = !this.expanded;
this.expandedState = this.expanded.toString();
// emit 'toggleState' event
this.toggleState.emit(this.expanded);
}
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (this.hasContent()) {
for (const key of Object.keys(changes)) {
if (key === 'expanded' &&
changes.expanded.currentValue != null) {
// this.expanded = changes.expanded.currentValue;
this.expandedState = this.expanded.toString();
}
}
}
}
// Makes sure we don't have a memory leak by destroying the
// Subscription when our component is destroyed
/**
* @return {?}
*/
ngOnDestroy() {
this.eventService.unsubscribe();
}
}
CollapsibleBodyComponent.decorators = [
{ type: Component, args: [{
selector: 'collapsible-body',
template: `<ng-content></ng-content>`,
animations: CollapsibleAnimationsService.collapsibleBodyAnimations('collapsibleBodyState'),
styles: [`
:host {
display: block;
border-bottom: 1px solid #ddd;
box-sizing: border-box;
padding: 2rem;
}
.side-nav :host {
padding: 0;
}
.side-nav :host,
.side-nav.fixed :host {
border: 0;
background-color: #fff;
}
`]
}] }
];
/** @nocollapse */
CollapsibleBodyComponent.ctorParameters = () => [
{ type: ElementRef },
{ type: CollapsibleService },
{ type: CollapsibleEventService }
];
CollapsibleBodyComponent.propDecorators = {
expandedState: [{ type: HostBinding, args: ['@collapsibleBodyState',] }],
expanded: [{ type: Input }],
toggleState: [{ type: Output }]
};
if (false) {
/** @type {?} */
CollapsibleBodyComponent.prototype.expandedState;
/** @type {?} */
CollapsibleBodyComponent.prototype.expanded;
/** @type {?} */
CollapsibleBodyComponent.prototype.toggleState;
/**
* @type {?}
* @private
*/
CollapsibleBodyComponent.prototype.el;
/**
* @type {?}
* @private
*/
CollapsibleBodyComponent.prototype.collapsibleService;
/**
* @type {?}
* @private
*/
CollapsibleBodyComponent.prototype.eventService;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGFwc2libGUtYm9keS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9hbmd1bGFyMi1jb2xsYXBzaWJsZS8iLCJzb3VyY2VzIjpbImxpYi9jb2xsYXBzaWJsZS1ib2R5L2NvbGxhcHNpYmxlLWJvZHkuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUNILFNBQVMsRUFFVCxLQUFLLEVBQUUsVUFBVSxFQUFFLFdBQVcsRUFDOUIsTUFBTSxFQUFFLFlBQVksRUFDdkIsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDckUsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDaEYsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sNENBQTRDLENBQUM7QUF5QjFGLE1BQU0sT0FBTyx3QkFBd0I7Ozs7OztJQVFqQyxZQUNZLEVBQWMsRUFDZCxrQkFBc0MsRUFDdEMsWUFBcUM7UUFGckMsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUNkLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFDdEMsaUJBQVksR0FBWixZQUFZLENBQXlCO1FBTHZDLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQUtDLENBQUM7Ozs7SUFFdEQsUUFBUTtRQUNKLElBQUksQ0FBQyxZQUFZLENBQUMsc0JBQXNCLENBQUMsU0FBUzs7O1FBQUMsR0FBRyxFQUFFO1lBQ3BELElBQUksQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO1FBQ2pDLENBQUMsRUFBQyxDQUFDO0lBQ1AsQ0FBQzs7OztJQUVELFVBQVU7UUFDTixLQUFLLE1BQU0sS0FBSyxJQUFJLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLFVBQVUsRUFBRTtZQUNsRCxJQUFJLENBQUMsbUJBQVMsS0FBSyxFQUFBLENBQUMsQ0FBQyxPQUFPLElBQUksSUFBSSxFQUFFO2dCQUNsQyxPQUFPLElBQUksQ0FBQzthQUNmO1NBQ0o7UUFDRCxPQUFPLEtBQUssQ0FBQztJQUNqQixDQUFDOzs7O0lBRUQscUJBQXFCO1FBQ2pCLGdEQUFnRDtRQUNoRCxJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUUsRUFBRTtZQUNuQixJQUFJLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxPQUFPLEVBQUUsS0FBSyxXQUFXLEVBQUU7O3NCQUM3QyxZQUFZLEdBQUcsSUFBSSxDQUFDLFFBQVE7Z0JBQ2xDLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxXQUFXLEVBQUUsQ0FBQztnQkFDdEMsSUFBSSxDQUFDLFFBQVEsR0FBRyxZQUFZLENBQUM7YUFDaEM7WUFDRCxJQUFJLENBQUMsUUFBUSxHQUFHLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQztZQUMvQixJQUFJLENBQUMsYUFBYSxHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxFQUFFLENBQUM7WUFFOUMsMkJBQTJCO1lBQzNCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUN4QztJQUNMLENBQUM7Ozs7O0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQzlCLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRSxFQUFFO1lBQ25CLEtBQUssTUFBTSxHQUFHLElBQUksTUFBTSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsRUFBRTtnQkFDcEMsSUFBSSxHQUFHLEtBQUssVUFBVTtvQkFDbEIsT0FBTyxDQUFDLFFBQVEsQ0FBQyxZQUFZLElBQUksSUFBSSxFQUFFO29CQUN2QyxpREFBaUQ7b0JBQ2pELElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLEVBQUUsQ0FBQztpQkFDakQ7YUFDSjtTQUNKO0lBQ0wsQ0FBQzs7Ozs7O0lBSUQsV0FBVztRQUNQLElBQUksQ0FBQyxZQUFZLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDcEMsQ0FBQzs7O1lBbkZKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUsa0JBQWtCO2dCQUM1QixRQUFRLEVBQUUsMkJBQTJCO2dCQW1CckMsVUFBVSxFQUFFLDRCQUE0QixDQUFDLHlCQUF5QixDQUFDLHNCQUFzQixDQUFDO3lCQWxCakY7Ozs7Ozs7Ozs7Ozs7Ozs7O0tBaUJSO2FBRUo7Ozs7WUE5QlUsVUFBVTtZQUlaLGtCQUFrQjtZQUNsQix1QkFBdUI7Ozs0QkEyQjNCLFdBQVcsU0FBQyx1QkFBdUI7dUJBR25DLEtBQUs7MEJBRUwsTUFBTTs7OztJQUxQLGlEQUNzQjs7SUFFdEIsNENBQTJCOztJQUUzQiwrQ0FBb0Q7Ozs7O0lBR2hELHNDQUFzQjs7Ozs7SUFDdEIsc0RBQThDOzs7OztJQUM5QyxnREFBNkMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gICAgQ29tcG9uZW50LFxyXG4gICAgT25Jbml0LCBPbkRlc3Ryb3ksIE9uQ2hhbmdlcywgU2ltcGxlQ2hhbmdlcyxcclxuICAgIElucHV0LCBFbGVtZW50UmVmLCBIb3N0QmluZGluZyxcclxuICAgIE91dHB1dCwgRXZlbnRFbWl0dGVyXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5pbXBvcnQgeyBDb2xsYXBzaWJsZVNlcnZpY2UgfSBmcm9tICcuLi9zZXJ2aWNlcy9jb2xsYXBzaWJsZS5zZXJ2aWNlJztcclxuaW1wb3J0IHsgQ29sbGFwc2libGVFdmVudFNlcnZpY2UgfSBmcm9tICcuLi9zZXJ2aWNlcy9jb2xsYXBzaWJsZS1ldmVudC5zZXJ2aWNlJztcclxuaW1wb3J0IHsgQ29sbGFwc2libGVBbmltYXRpb25zU2VydmljZSB9IGZyb20gJy4uL3NlcnZpY2VzL2NvbGxhcHNpYmxlLWFuaW1hdGlvbnMuc2VydmljZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnY29sbGFwc2libGUtYm9keScsXHJcbiAgICB0ZW1wbGF0ZTogYDxuZy1jb250ZW50PjwvbmctY29udGVudD5gLFxyXG4gICAgc3R5bGVzOiBbYFxyXG4gICAgICAgIDpob3N0IHtcclxuICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XHJcbiAgICAgICAgICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZGRkO1xyXG4gICAgICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xyXG4gICAgICAgICAgICBwYWRkaW5nOiAycmVtO1xyXG4gICAgICAgIH1cclxuXHJcbiAgICAgICAgLnNpZGUtbmF2IDpob3N0IHtcclxuICAgICAgICAgICAgcGFkZGluZzogMDtcclxuICAgICAgICB9XHJcblxyXG4gICAgICAgIC5zaWRlLW5hdiA6aG9zdCxcclxuICAgICAgICAuc2lkZS1uYXYuZml4ZWQgOmhvc3Qge1xyXG4gICAgICAgICAgICBib3JkZXI6IDA7XHJcbiAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XHJcbiAgICAgICAgfVxyXG4gICAgYF0sXHJcbiAgICBhbmltYXRpb25zOiBDb2xsYXBzaWJsZUFuaW1hdGlvbnNTZXJ2aWNlLmNvbGxhcHNpYmxlQm9keUFuaW1hdGlvbnMoJ2NvbGxhcHNpYmxlQm9keVN0YXRlJylcclxufSlcclxuZXhwb3J0IGNsYXNzIENvbGxhcHNpYmxlQm9keUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzLCBPbkRlc3Ryb3kge1xyXG4gICAgQEhvc3RCaW5kaW5nKCdAY29sbGFwc2libGVCb2R5U3RhdGUnKVxyXG4gICAgZXhwYW5kZWRTdGF0ZTogc3RyaW5nO1xyXG5cclxuICAgIEBJbnB1dCgpIGV4cGFuZGVkOiBib29sZWFuO1xyXG5cclxuICAgIEBPdXRwdXQoKSB0b2dnbGVTdGF0ZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcclxuXHJcbiAgICBjb25zdHJ1Y3RvcihcclxuICAgICAgICBwcml2YXRlIGVsOiBFbGVtZW50UmVmLFxyXG4gICAgICAgIHByaXZhdGUgY29sbGFwc2libGVTZXJ2aWNlOiBDb2xsYXBzaWJsZVNlcnZpY2UsXHJcbiAgICAgICAgcHJpdmF0ZSBldmVudFNlcnZpY2U6IENvbGxhcHNpYmxlRXZlbnRTZXJ2aWNlKSB7IH1cclxuXHJcbiAgICBuZ09uSW5pdCgpIHtcclxuICAgICAgICB0aGlzLmV2ZW50U2VydmljZS50b2dnbGVDb2xsYXBzaWJsZUl0ZW0kLnN1YnNjcmliZSgoKSA9PiB7XHJcbiAgICAgICAgICAgIHRoaXMudG9nZ2xlQ29sbGFwc2libGVJdGVtKCk7XHJcbiAgICAgICAgfSk7XHJcbiAgICB9XHJcblxyXG4gICAgaGFzQ29udGVudCgpOiBib29sZWFuIHtcclxuICAgICAgICBmb3IgKGNvbnN0IGNoaWxkIG9mIHRoaXMuZWwubmF0aXZlRWxlbWVudC5jaGlsZE5vZGVzKSB7XHJcbiAgICAgICAgICAgIGlmICgoPEVsZW1lbnQ+Y2hpbGQpLnRhZ05hbWUgIT0gbnVsbCkge1xyXG4gICAgICAgICAgICAgICAgcmV0dXJuIHRydWU7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICAgcmV0dXJuIGZhbHNlO1xyXG4gICAgfVxyXG5cclxuICAgIHRvZ2dsZUNvbGxhcHNpYmxlSXRlbSgpIHtcclxuICAgICAgICAvLyB0b2dnbGUgYm9keSdzIHN0YXRlIG9ubHkgaWYgaXQgaGFzIGFueSBjaGlsZHNcclxuICAgICAgICBpZiAodGhpcy5oYXNDb250ZW50KCkpIHtcclxuICAgICAgICAgICAgaWYgKHRoaXMuY29sbGFwc2libGVTZXJ2aWNlLmdldFR5cGUoKSA9PT0gJ2FjY29yZGlvbicpIHtcclxuICAgICAgICAgICAgICAgIGNvbnN0IHRlbXBFeHBhbmRlZCA9IHRoaXMuZXhwYW5kZWQ7XHJcbiAgICAgICAgICAgICAgICB0aGlzLmNvbGxhcHNpYmxlU2VydmljZS5jb2xsYXBzZUFsbCgpO1xyXG4gICAgICAgICAgICAgICAgdGhpcy5leHBhbmRlZCA9IHRlbXBFeHBhbmRlZDtcclxuICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICB0aGlzLmV4cGFuZGVkID0gIXRoaXMuZXhwYW5kZWQ7XHJcbiAgICAgICAgICAgIHRoaXMuZXhwYW5kZWRTdGF0ZSA9IHRoaXMuZXhwYW5kZWQudG9TdHJpbmcoKTtcclxuXHJcbiAgICAgICAgICAgIC8vIGVtaXQgJ3RvZ2dsZVN0YXRlJyBldmVudFxyXG4gICAgICAgICAgICB0aGlzLnRvZ2dsZVN0YXRlLmVtaXQodGhpcy5leHBhbmRlZCk7XHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG5cclxuICAgIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcclxuICAgICAgICBpZiAodGhpcy5oYXNDb250ZW50KCkpIHtcclxuICAgICAgICAgICAgZm9yIChjb25zdCBrZXkgb2YgT2JqZWN0LmtleXMoY2hhbmdlcykpIHtcclxuICAgICAgICAgICAgICAgIGlmIChrZXkgPT09ICdleHBhbmRlZCcgJiZcclxuICAgICAgICAgICAgICAgICAgICBjaGFuZ2VzLmV4cGFuZGVkLmN1cnJlbnRWYWx1ZSAhPSBudWxsKSB7XHJcbiAgICAgICAgICAgICAgICAgICAgLy8gdGhpcy5leHBhbmRlZCA9IGNoYW5nZXMuZXhwYW5kZWQuY3VycmVudFZhbHVlO1xyXG4gICAgICAgICAgICAgICAgICAgIHRoaXMuZXhwYW5kZWRTdGF0ZSA9IHRoaXMuZXhwYW5kZWQudG9TdHJpbmcoKTtcclxuICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgfVxyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICAvLyBNYWtlcyBzdXJlIHdlIGRvbid0IGhhdmUgYSBtZW1vcnkgbGVhayBieSBkZXN0cm95aW5nIHRoZVxyXG4gICAgLy8gU3Vic2NyaXB0aW9uIHdoZW4gb3VyIGNvbXBvbmVudCBpcyBkZXN0cm95ZWRcclxuICAgIG5nT25EZXN0cm95KCkge1xyXG4gICAgICAgIHRoaXMuZXZlbnRTZXJ2aWNlLnVuc3Vic2NyaWJlKCk7XHJcbiAgICB9XHJcblxyXG59XHJcbiJdfQ==