@ng-bootstrap/ng-bootstrap
Version:
Angular powered Bootstrap
46 lines • 5.5 kB
JavaScript
import { inject, Injectable } from '@angular/core';
import { DOCUMENT } from '@angular/common';
import * as i0 from "@angular/core";
/**
* Utility to handle the scrollbar.
*
* It allows to hide the scrollbar and compensate the lack of a vertical scrollbar
* by adding an equivalent padding on the right of the body, and to revert this change.
*/
export class ScrollBar {
constructor() {
this._document = inject(DOCUMENT);
}
/**
* To be called to hide a potential vertical scrollbar:
* - if a scrollbar is there and has a width greater than 0, adds some compensation
* padding to the body to keep the same layout as when the scrollbar is there
* - adds overflow: hidden
*
* @return a callback used to revert the change
*/
hide() {
const scrollbarWidth = Math.abs(window.innerWidth - this._document.documentElement.clientWidth);
const body = this._document.body;
const bodyStyle = body.style;
const { overflow, paddingRight } = bodyStyle;
if (scrollbarWidth > 0) {
const actualPadding = parseFloat(window.getComputedStyle(body).paddingRight);
bodyStyle.paddingRight = `${actualPadding + scrollbarWidth}px`;
}
bodyStyle.overflow = 'hidden';
return () => {
if (scrollbarWidth > 0) {
bodyStyle.paddingRight = paddingRight;
}
bodyStyle.overflow = overflow;
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0", ngImport: i0, type: ScrollBar, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.0", ngImport: i0, type: ScrollBar, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0", ngImport: i0, type: ScrollBar, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsYmFyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL3V0aWwvc2Nyb2xsYmFyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ25ELE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7QUFLM0M7Ozs7O0dBS0c7QUFFSCxNQUFNLE9BQU8sU0FBUztJQUR0QjtRQUVTLGNBQVMsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLENBQUM7S0EyQnJDO0lBekJBOzs7Ozs7O09BT0c7SUFDSCxJQUFJO1FBQ0gsTUFBTSxjQUFjLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxNQUFNLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsZUFBZSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQ2hHLE1BQU0sSUFBSSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDO1FBQ2pDLE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUM7UUFDN0IsTUFBTSxFQUFFLFFBQVEsRUFBRSxZQUFZLEVBQUUsR0FBRyxTQUFTLENBQUM7UUFDN0MsSUFBSSxjQUFjLEdBQUcsQ0FBQyxFQUFFO1lBQ3ZCLE1BQU0sYUFBYSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLENBQUMsWUFBWSxDQUFDLENBQUM7WUFDN0UsU0FBUyxDQUFDLFlBQVksR0FBRyxHQUFHLGFBQWEsR0FBRyxjQUFjLElBQUksQ0FBQztTQUMvRDtRQUNELFNBQVMsQ0FBQyxRQUFRLEdBQUcsUUFBUSxDQUFDO1FBQzlCLE9BQU8sR0FBRyxFQUFFO1lBQ1gsSUFBSSxjQUFjLEdBQUcsQ0FBQyxFQUFFO2dCQUN2QixTQUFTLENBQUMsWUFBWSxHQUFHLFlBQVksQ0FBQzthQUN0QztZQUNELFNBQVMsQ0FBQyxRQUFRLEdBQUcsUUFBUSxDQUFDO1FBQy9CLENBQUMsQ0FBQztJQUNILENBQUM7OEdBM0JXLFNBQVM7a0hBQVQsU0FBUyxjQURJLE1BQU07OzJGQUNuQixTQUFTO2tCQURyQixVQUFVO21CQUFDLEVBQUUsVUFBVSxFQUFFLE1BQU0sRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGluamVjdCwgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRE9DVU1FTlQgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG4vKiogVHlwZSBmb3IgdGhlIGNhbGxiYWNrIHVzZWQgdG8gcmV2ZXJ0IHRoZSBzY3JvbGxiYXIuICovXG5leHBvcnQgdHlwZSBTY3JvbGxiYXJSZXZlcnRlciA9ICgpID0+IHZvaWQ7XG5cbi8qKlxuICogVXRpbGl0eSB0byBoYW5kbGUgdGhlIHNjcm9sbGJhci5cbiAqXG4gKiBJdCBhbGxvd3MgdG8gaGlkZSB0aGUgc2Nyb2xsYmFyIGFuZCBjb21wZW5zYXRlIHRoZSBsYWNrIG9mIGEgdmVydGljYWwgc2Nyb2xsYmFyXG4gKiBieSBhZGRpbmcgYW4gZXF1aXZhbGVudCBwYWRkaW5nIG9uIHRoZSByaWdodCBvZiB0aGUgYm9keSwgYW5kIHRvIHJldmVydCB0aGlzIGNoYW5nZS5cbiAqL1xuQEluamVjdGFibGUoeyBwcm92aWRlZEluOiAncm9vdCcgfSlcbmV4cG9ydCBjbGFzcyBTY3JvbGxCYXIge1xuXHRwcml2YXRlIF9kb2N1bWVudCA9IGluamVjdChET0NVTUVOVCk7XG5cblx0LyoqXG5cdCAqIFRvIGJlIGNhbGxlZCB0byBoaWRlIGEgcG90ZW50aWFsIHZlcnRpY2FsIHNjcm9sbGJhcjpcblx0ICogLSBpZiBhIHNjcm9sbGJhciBpcyB0aGVyZSBhbmQgaGFzIGEgd2lkdGggZ3JlYXRlciB0aGFuIDAsIGFkZHMgc29tZSBjb21wZW5zYXRpb25cblx0ICogcGFkZGluZyB0byB0aGUgYm9keSB0byBrZWVwIHRoZSBzYW1lIGxheW91dCBhcyB3aGVuIHRoZSBzY3JvbGxiYXIgaXMgdGhlcmVcblx0ICogLSBhZGRzIG92ZXJmbG93OiBoaWRkZW5cblx0ICpcblx0ICogQHJldHVybiBhIGNhbGxiYWNrIHVzZWQgdG8gcmV2ZXJ0IHRoZSBjaGFuZ2Vcblx0ICovXG5cdGhpZGUoKTogU2Nyb2xsYmFyUmV2ZXJ0ZXIge1xuXHRcdGNvbnN0IHNjcm9sbGJhcldpZHRoID0gTWF0aC5hYnMod2luZG93LmlubmVyV2lkdGggLSB0aGlzLl9kb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuY2xpZW50V2lkdGgpO1xuXHRcdGNvbnN0IGJvZHkgPSB0aGlzLl9kb2N1bWVudC5ib2R5O1xuXHRcdGNvbnN0IGJvZHlTdHlsZSA9IGJvZHkuc3R5bGU7XG5cdFx0Y29uc3QgeyBvdmVyZmxvdywgcGFkZGluZ1JpZ2h0IH0gPSBib2R5U3R5bGU7XG5cdFx0aWYgKHNjcm9sbGJhcldpZHRoID4gMCkge1xuXHRcdFx0Y29uc3QgYWN0dWFsUGFkZGluZyA9IHBhcnNlRmxvYXQod2luZG93LmdldENvbXB1dGVkU3R5bGUoYm9keSkucGFkZGluZ1JpZ2h0KTtcblx0XHRcdGJvZHlTdHlsZS5wYWRkaW5nUmlnaHQgPSBgJHthY3R1YWxQYWRkaW5nICsgc2Nyb2xsYmFyV2lkdGh9cHhgO1xuXHRcdH1cblx0XHRib2R5U3R5bGUub3ZlcmZsb3cgPSAnaGlkZGVuJztcblx0XHRyZXR1cm4gKCkgPT4ge1xuXHRcdFx0aWYgKHNjcm9sbGJhcldpZHRoID4gMCkge1xuXHRcdFx0XHRib2R5U3R5bGUucGFkZGluZ1JpZ2h0ID0gcGFkZGluZ1JpZ2h0O1xuXHRcdFx0fVxuXHRcdFx0Ym9keVN0eWxlLm92ZXJmbG93ID0gb3ZlcmZsb3c7XG5cdFx0fTtcblx0fVxufVxuIl19