@ng-bootstrap/ng-bootstrap
Version:
Angular powered Bootstrap
123 lines • 12.3 kB
JavaScript
import { Directive, ElementRef, EventEmitter, inject, Input, NgZone, Output } from '@angular/core';
import { ngbRunTransition } from '../util/transition/ngbTransition';
import { ngbCollapsingTransition } from '../util/transition/ngbCollapseTransition';
import { NgbCollapseConfig } from './collapse-config';
import * as i0 from "@angular/core";
/**
* A directive to provide a simple way of hiding and showing elements on the
* page.
*/
export class NgbCollapse {
constructor() {
this._config = inject(NgbCollapseConfig);
this._element = inject(ElementRef);
this._zone = inject(NgZone);
/**
* If `true`, collapse will be animated.
*
* Animation is triggered only when clicked on triggering element
* or via the `.toggle()` function
*
* @since 8.0.0
*/
this.animation = this._config.animation;
/**
* Flag used to track if the collapse setter is invoked during initialization
* or not. This distinction is made in order to avoid running the transition during initialization.
*/
this._afterInit = false;
this._isCollapsed = false;
this.ngbCollapseChange = new EventEmitter();
/**
* If `true`, will collapse horizontally.
*
* @since 13.1.0
*/
this.horizontal = this._config.horizontal;
/**
* An event emitted when the collapse element is shown, after the transition.
* It has no payload.
*
* @since 8.0.0
*/
this.shown = new EventEmitter();
/**
* An event emitted when the collapse element is hidden, after the transition.
* It has no payload.
*
* @since 8.0.0
*/
this.hidden = new EventEmitter();
}
/**
* If `true`, will collapse the element or show it otherwise.
*/
set collapsed(isCollapsed) {
if (this._isCollapsed !== isCollapsed) {
this._isCollapsed = isCollapsed;
if (this._afterInit) {
this._runTransitionWithEvents(isCollapsed, this.animation);
}
}
}
ngOnInit() {
this._runTransition(this._isCollapsed, false);
this._afterInit = true;
}
/**
* Triggers collapsing programmatically.
*
* If there is a collapsing transition running already, it will be reversed.
* If the animations are turned off this happens synchronously.
*
* @since 8.0.0
*/
toggle(open = this._isCollapsed) {
this.collapsed = !open;
this.ngbCollapseChange.next(this._isCollapsed);
}
_runTransition(collapsed, animation) {
return ngbRunTransition(this._zone, this._element.nativeElement, ngbCollapsingTransition, {
animation,
runningTransition: 'stop',
context: { direction: collapsed ? 'hide' : 'show', dimension: this.horizontal ? 'width' : 'height' },
});
}
_runTransitionWithEvents(collapsed, animation) {
this._runTransition(collapsed, animation).subscribe(() => {
if (collapsed) {
this.hidden.emit();
}
else {
this.shown.emit();
}
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0", ngImport: i0, type: NgbCollapse, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.0", type: NgbCollapse, isStandalone: true, selector: "[ngbCollapse]", inputs: { animation: "animation", collapsed: ["ngbCollapse", "collapsed"], horizontal: "horizontal" }, outputs: { ngbCollapseChange: "ngbCollapseChange", shown: "shown", hidden: "hidden" }, host: { properties: { "class.collapse-horizontal": "horizontal" } }, exportAs: ["ngbCollapse"], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0", ngImport: i0, type: NgbCollapse, decorators: [{
type: Directive,
args: [{
selector: '[ngbCollapse]',
exportAs: 'ngbCollapse',
standalone: true,
host: {
'[class.collapse-horizontal]': 'horizontal',
},
}]
}], propDecorators: { animation: [{
type: Input
}], collapsed: [{
type: Input,
args: ['ngbCollapse']
}], ngbCollapseChange: [{
type: Output
}], horizontal: [{
type: Input
}], shown: [{
type: Output
}], hidden: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGFwc2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29sbGFwc2UvY29sbGFwc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsWUFBWSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFVLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSwwQ0FBMEMsQ0FBQztBQUNuRixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQzs7QUFFdEQ7OztHQUdHO0FBU0gsTUFBTSxPQUFPLFdBQVc7SUFSeEI7UUFTUyxZQUFPLEdBQUcsTUFBTSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDcEMsYUFBUSxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsQ0FBQztRQUM5QixVQUFLLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBRS9COzs7Ozs7O1dBT0c7UUFDTSxjQUFTLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUM7UUFFNUM7OztXQUdHO1FBQ0ssZUFBVSxHQUFHLEtBQUssQ0FBQztRQUVuQixpQkFBWSxHQUFHLEtBQUssQ0FBQztRQWVuQixzQkFBaUIsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBRTFEOzs7O1dBSUc7UUFDTSxlQUFVLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxVQUFVLENBQUM7UUFFOUM7Ozs7O1dBS0c7UUFDTyxVQUFLLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUUzQzs7Ozs7V0FLRztRQUNPLFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUSxDQUFDO0tBcUM1QztJQXpFQTs7T0FFRztJQUNILElBQ0ksU0FBUyxDQUFDLFdBQW9CO1FBQ2pDLElBQUksSUFBSSxDQUFDLFlBQVksS0FBSyxXQUFXLEVBQUU7WUFDdEMsSUFBSSxDQUFDLFlBQVksR0FBRyxXQUFXLENBQUM7WUFDaEMsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO2dCQUNwQixJQUFJLENBQUMsd0JBQXdCLENBQUMsV0FBVyxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQzthQUMzRDtTQUNEO0lBQ0YsQ0FBQztJQTJCRCxRQUFRO1FBQ1AsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsWUFBWSxFQUFFLEtBQUssQ0FBQyxDQUFDO1FBQzlDLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0lBQ3hCLENBQUM7SUFFRDs7Ozs7OztPQU9HO0lBQ0gsTUFBTSxDQUFDLE9BQWdCLElBQUksQ0FBQyxZQUFZO1FBQ3ZDLElBQUksQ0FBQyxTQUFTLEdBQUcsQ0FBQyxJQUFJLENBQUM7UUFDdkIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUM7SUFDaEQsQ0FBQztJQUVPLGNBQWMsQ0FBQyxTQUFrQixFQUFFLFNBQWtCO1FBQzVELE9BQU8sZ0JBQWdCLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsUUFBUSxDQUFDLGFBQWEsRUFBRSx1QkFBdUIsRUFBRTtZQUN6RixTQUFTO1lBQ1QsaUJBQWlCLEVBQUUsTUFBTTtZQUN6QixPQUFPLEVBQUUsRUFBRSxTQUFTLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxRQUFRLEVBQUU7U0FDcEcsQ0FBQyxDQUFDO0lBQ0osQ0FBQztJQUVPLHdCQUF3QixDQUFDLFNBQWtCLEVBQUUsU0FBa0I7UUFDdEUsSUFBSSxDQUFDLGNBQWMsQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDLENBQUMsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUN4RCxJQUFJLFNBQVMsRUFBRTtnQkFDZCxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxDQUFDO2FBQ25CO2lCQUFNO2dCQUNOLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7YUFDbEI7UUFDRixDQUFDLENBQUMsQ0FBQztJQUNKLENBQUM7OEdBL0ZXLFdBQVc7a0dBQVgsV0FBVzs7MkZBQVgsV0FBVztrQkFSdkIsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsZUFBZTtvQkFDekIsUUFBUSxFQUFFLGFBQWE7b0JBQ3ZCLFVBQVUsRUFBRSxJQUFJO29CQUNoQixJQUFJLEVBQUU7d0JBQ0wsNkJBQTZCLEVBQUUsWUFBWTtxQkFDM0M7aUJBQ0Q7OEJBY1MsU0FBUztzQkFBakIsS0FBSztnQkFjRixTQUFTO3NCQURaLEtBQUs7dUJBQUMsYUFBYTtnQkFVVixpQkFBaUI7c0JBQTFCLE1BQU07Z0JBT0UsVUFBVTtzQkFBbEIsS0FBSztnQkFRSSxLQUFLO3NCQUFkLE1BQU07Z0JBUUcsTUFBTTtzQkFBZixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBFdmVudEVtaXR0ZXIsIGluamVjdCwgSW5wdXQsIE5nWm9uZSwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IG5nYlJ1blRyYW5zaXRpb24gfSBmcm9tICcuLi91dGlsL3RyYW5zaXRpb24vbmdiVHJhbnNpdGlvbic7XG5pbXBvcnQgeyBuZ2JDb2xsYXBzaW5nVHJhbnNpdGlvbiB9IGZyb20gJy4uL3V0aWwvdHJhbnNpdGlvbi9uZ2JDb2xsYXBzZVRyYW5zaXRpb24nO1xuaW1wb3J0IHsgTmdiQ29sbGFwc2VDb25maWcgfSBmcm9tICcuL2NvbGxhcHNlLWNvbmZpZyc7XG5cbi8qKlxuICogQSBkaXJlY3RpdmUgdG8gcHJvdmlkZSBhIHNpbXBsZSB3YXkgb2YgaGlkaW5nIGFuZCBzaG93aW5nIGVsZW1lbnRzIG9uIHRoZVxuICogcGFnZS5cbiAqL1xuQERpcmVjdGl2ZSh7XG5cdHNlbGVjdG9yOiAnW25nYkNvbGxhcHNlXScsXG5cdGV4cG9ydEFzOiAnbmdiQ29sbGFwc2UnLFxuXHRzdGFuZGFsb25lOiB0cnVlLFxuXHRob3N0OiB7XG5cdFx0J1tjbGFzcy5jb2xsYXBzZS1ob3Jpem9udGFsXSc6ICdob3Jpem9udGFsJyxcblx0fSxcbn0pXG5leHBvcnQgY2xhc3MgTmdiQ29sbGFwc2UgaW1wbGVtZW50cyBPbkluaXQge1xuXHRwcml2YXRlIF9jb25maWcgPSBpbmplY3QoTmdiQ29sbGFwc2VDb25maWcpO1xuXHRwcml2YXRlIF9lbGVtZW50ID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuXHRwcml2YXRlIF96b25lID0gaW5qZWN0KE5nWm9uZSk7XG5cblx0LyoqXG5cdCAqIElmIGB0cnVlYCwgY29sbGFwc2Ugd2lsbCBiZSBhbmltYXRlZC5cblx0ICpcblx0ICogQW5pbWF0aW9uIGlzIHRyaWdnZXJlZCBvbmx5IHdoZW4gY2xpY2tlZCBvbiB0cmlnZ2VyaW5nIGVsZW1lbnRcblx0ICogb3IgdmlhIHRoZSBgLnRvZ2dsZSgpYCBmdW5jdGlvblxuXHQgKlxuXHQgKiBAc2luY2UgOC4wLjBcblx0ICovXG5cdEBJbnB1dCgpIGFuaW1hdGlvbiA9IHRoaXMuX2NvbmZpZy5hbmltYXRpb247XG5cblx0LyoqXG5cdCAqIEZsYWcgdXNlZCB0byB0cmFjayBpZiB0aGUgY29sbGFwc2Ugc2V0dGVyIGlzIGludm9rZWQgZHVyaW5nIGluaXRpYWxpemF0aW9uXG5cdCAqIG9yIG5vdC4gVGhpcyBkaXN0aW5jdGlvbiBpcyBtYWRlIGluIG9yZGVyIHRvIGF2b2lkIHJ1bm5pbmcgdGhlIHRyYW5zaXRpb24gZHVyaW5nIGluaXRpYWxpemF0aW9uLlxuXHQgKi9cblx0cHJpdmF0ZSBfYWZ0ZXJJbml0ID0gZmFsc2U7XG5cblx0cHJpdmF0ZSBfaXNDb2xsYXBzZWQgPSBmYWxzZTtcblxuXHQvKipcblx0ICogSWYgYHRydWVgLCB3aWxsIGNvbGxhcHNlIHRoZSBlbGVtZW50IG9yIHNob3cgaXQgb3RoZXJ3aXNlLlxuXHQgKi9cblx0QElucHV0KCduZ2JDb2xsYXBzZScpXG5cdHNldCBjb2xsYXBzZWQoaXNDb2xsYXBzZWQ6IGJvb2xlYW4pIHtcblx0XHRpZiAodGhpcy5faXNDb2xsYXBzZWQgIT09IGlzQ29sbGFwc2VkKSB7XG5cdFx0XHR0aGlzLl9pc0NvbGxhcHNlZCA9IGlzQ29sbGFwc2VkO1xuXHRcdFx0aWYgKHRoaXMuX2FmdGVySW5pdCkge1xuXHRcdFx0XHR0aGlzLl9ydW5UcmFuc2l0aW9uV2l0aEV2ZW50cyhpc0NvbGxhcHNlZCwgdGhpcy5hbmltYXRpb24pO1xuXHRcdFx0fVxuXHRcdH1cblx0fVxuXG5cdEBPdXRwdXQoKSBuZ2JDb2xsYXBzZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuXHQvKipcblx0ICogSWYgYHRydWVgLCB3aWxsIGNvbGxhcHNlIGhvcml6b250YWxseS5cblx0ICpcblx0ICogQHNpbmNlIDEzLjEuMFxuXHQgKi9cblx0QElucHV0KCkgaG9yaXpvbnRhbCA9IHRoaXMuX2NvbmZpZy5ob3Jpem9udGFsO1xuXG5cdC8qKlxuXHQgKiBBbiBldmVudCBlbWl0dGVkIHdoZW4gdGhlIGNvbGxhcHNlIGVsZW1lbnQgaXMgc2hvd24sIGFmdGVyIHRoZSB0cmFuc2l0aW9uLlxuXHQgKiBJdCBoYXMgbm8gcGF5bG9hZC5cblx0ICpcblx0ICogQHNpbmNlIDguMC4wXG5cdCAqL1xuXHRAT3V0cHV0KCkgc2hvd24gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG5cblx0LyoqXG5cdCAqIEFuIGV2ZW50IGVtaXR0ZWQgd2hlbiB0aGUgY29sbGFwc2UgZWxlbWVudCBpcyBoaWRkZW4sIGFmdGVyIHRoZSB0cmFuc2l0aW9uLlxuXHQgKiBJdCBoYXMgbm8gcGF5bG9hZC5cblx0ICpcblx0ICogQHNpbmNlIDguMC4wXG5cdCAqL1xuXHRAT3V0cHV0KCkgaGlkZGVuID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXG5cdG5nT25Jbml0KCkge1xuXHRcdHRoaXMuX3J1blRyYW5zaXRpb24odGhpcy5faXNDb2xsYXBzZWQsIGZhbHNlKTtcblx0XHR0aGlzLl9hZnRlckluaXQgPSB0cnVlO1xuXHR9XG5cblx0LyoqXG5cdCAqIFRyaWdnZXJzIGNvbGxhcHNpbmcgcHJvZ3JhbW1hdGljYWxseS5cblx0ICpcblx0ICogSWYgdGhlcmUgaXMgYSBjb2xsYXBzaW5nIHRyYW5zaXRpb24gcnVubmluZyBhbHJlYWR5LCBpdCB3aWxsIGJlIHJldmVyc2VkLlxuXHQgKiBJZiB0aGUgYW5pbWF0aW9ucyBhcmUgdHVybmVkIG9mZiB0aGlzIGhhcHBlbnMgc3luY2hyb25vdXNseS5cblx0ICpcblx0ICogQHNpbmNlIDguMC4wXG5cdCAqL1xuXHR0b2dnbGUob3BlbjogYm9vbGVhbiA9IHRoaXMuX2lzQ29sbGFwc2VkKSB7XG5cdFx0dGhpcy5jb2xsYXBzZWQgPSAhb3Blbjtcblx0XHR0aGlzLm5nYkNvbGxhcHNlQ2hhbmdlLm5leHQodGhpcy5faXNDb2xsYXBzZWQpO1xuXHR9XG5cblx0cHJpdmF0ZSBfcnVuVHJhbnNpdGlvbihjb2xsYXBzZWQ6IGJvb2xlYW4sIGFuaW1hdGlvbjogYm9vbGVhbikge1xuXHRcdHJldHVybiBuZ2JSdW5UcmFuc2l0aW9uKHRoaXMuX3pvbmUsIHRoaXMuX2VsZW1lbnQubmF0aXZlRWxlbWVudCwgbmdiQ29sbGFwc2luZ1RyYW5zaXRpb24sIHtcblx0XHRcdGFuaW1hdGlvbixcblx0XHRcdHJ1bm5pbmdUcmFuc2l0aW9uOiAnc3RvcCcsXG5cdFx0XHRjb250ZXh0OiB7IGRpcmVjdGlvbjogY29sbGFwc2VkID8gJ2hpZGUnIDogJ3Nob3cnLCBkaW1lbnNpb246IHRoaXMuaG9yaXpvbnRhbCA/ICd3aWR0aCcgOiAnaGVpZ2h0JyB9LFxuXHRcdH0pO1xuXHR9XG5cblx0cHJpdmF0ZSBfcnVuVHJhbnNpdGlvbldpdGhFdmVudHMoY29sbGFwc2VkOiBib29sZWFuLCBhbmltYXRpb246IGJvb2xlYW4pIHtcblx0XHR0aGlzLl9ydW5UcmFuc2l0aW9uKGNvbGxhcHNlZCwgYW5pbWF0aW9uKS5zdWJzY3JpYmUoKCkgPT4ge1xuXHRcdFx0aWYgKGNvbGxhcHNlZCkge1xuXHRcdFx0XHR0aGlzLmhpZGRlbi5lbWl0KCk7XG5cdFx0XHR9IGVsc2Uge1xuXHRcdFx0XHR0aGlzLnNob3duLmVtaXQoKTtcblx0XHRcdH1cblx0XHR9KTtcblx0fVxufVxuIl19