@libs-ui/components-scroll-overlay 0.2.5

package/README.md

@@ -0,0 +1,3 @@
+# scroll-overlay
+
+This library was generated with [Nx](https://nx.dev).

package/esm2022/index.mjs

@@ -0,0 +1,3 @@
+export * from './scroll-overlay.directive';
+export * from './scroll.interface';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvc2Nyb2xsLW92ZXJsYXkvc3JjL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUM7QUFDM0MsY0FBYyxvQkFBb0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc2Nyb2xsLW92ZXJsYXkuZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vc2Nyb2xsLmludGVyZmFjZSc7Il19

package/esm2022/libs-ui-components-scroll-overlay.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlicy11aS1jb21wb25lbnRzLXNjcm9sbC1vdmVybGF5LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL3Njcm9sbC1vdmVybGF5L3NyYy9saWJzLXVpLWNvbXBvbmVudHMtc2Nyb2xsLW92ZXJsYXkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLFNBQVMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/esm2022/scroll-overlay.directive.mjs

@@ -0,0 +1,228 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { Directive, ElementRef, Renderer2, effect, inject, input, output } from "@angular/core";
+import { Subject, fromEvent, takeUntil, tap } from "rxjs";
+import * as i0 from "@angular/core";
+export class LibsUIComponentsScrollOverlayDirective {
+    /* PROPERTY */
+    styles = () => `
+      .scrollbar-track-X {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        height: 8px;
+        pointer-events: none;
+        visibility: hidden;
+        opacity: 0;
+        transition: opacity 0.3s ease, visibility 0.3s ease;
+      }
+
+      .scrollbar-thumb-X {
+        height: 100%;
+        background-color: #CDD0D6;
+        border-radius: 4px;
+        cursor: pointer;
+        transition: background-color 0.3s;
+        pointer-events: auto;
+        position: absolute;
+      }
+      
+      .scrollbar-track-Y {
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 8px;
+        pointer-events: none;
+        visibility: hidden;
+        opacity: 0;
+        transition: opacity 0.3s ease, visibility 0.3s ease;
+      }
+
+      .scrollbar-thumb-Y {
+        width: 100%;
+        background-color: #CDD0D6;
+        border-radius: 4px;
+        cursor: pointer;
+        transition: background-color 0.3s;
+        pointer-events: auto;
+        position: absolute;
+      }
+
+      .scrollbar-thumb:hover {
+        background-color: #9CA2AD;
+      }
+  `;
+    subsX;
+    subsY;
+    scrollbarWidth;
+    scrollbarColor;
+    onDestroy = new Subject();
+    trackX = document.createElement('div');
+    thumbX = document.createElement('div');
+    trackY = document.createElement('div');
+    thumbY = document.createElement('div');
+    divContainer = document.createElement('div');
+    /* INPUT */
+    options = input(Object.assign({}));
+    /* OUTPUT */
+    outScrollX = output();
+    outScrollY = output();
+    outScrollTop = output();
+    outScrollBottom = output();
+    /* INJECT */
+    element = inject(ElementRef);
+    render2 = inject(Renderer2);
+    constructor() {
+        effect(() => {
+            this.scrollbarWidth = this.options()?.scrollbarWidth || 8; // Chiều rộng thanh cuộn
+            this.scrollbarColor = this.options()?.scrollbarColor || '#CDD0D6'; // Màu sắc thanh cuộn
+            if (this.options()?.scrollX !== 'hidden') {
+                this.subsX?.unsubscribe();
+                this.createScrollbar('X', this.trackX, this.thumbX);
+                this.bindEventsScrollBar('X', this.trackX);
+            }
+            if (this.options()?.scrollY !== 'hidden') {
+                this.subsY?.unsubscribe();
+                this.createScrollbar('Y', this.trackY, this.thumbY);
+                this.bindEventsScrollBar('Y', this.trackY);
+            }
+        });
+    }
+    /* FUNCTIONS*/
+    get Element() {
+        return this.element.nativeElement;
+    }
+    createScrollbar(scrollDirection, trackEl, thumbEl) {
+        const idStyleTag = "#id-style-tag-custom-scroll-overlay";
+        const styleElCustomScrollOverlay = document.getElementById(idStyleTag);
+        if (!styleElCustomScrollOverlay) {
+            const styleEl = document.createElement('style');
+            styleEl.setAttribute('id', idStyleTag);
+            styleEl.innerHTML = this.styles();
+            document.head.append(styleEl);
+        }
+        const stylesProperty = {
+            "box-sizing": "border-box",
+            "scrollbar-width": "none",
+            "scrollbar-color": "transparent transparent",
+            "overflow": "hidden",
+            "overflow-x": `${this.options()?.scrollX || 'scroll'}`,
+            "overflow-y": `${this.options()?.scrollY || 'scroll'}`
+        };
+        Object.keys(stylesProperty).forEach(key => {
+            this.render2.setStyle(this.Element, key, stylesProperty[key], 1);
+        });
+        trackEl.classList.add(`scrollbar-track-${scrollDirection}`);
+        trackEl.style.height = `${this.scrollbarWidth}px`;
+        thumbEl.classList.add(`scrollbar-thumb-${scrollDirection}`);
+        thumbEl.style.backgroundColor = this.scrollbarColor;
+        trackEl.appendChild(thumbEl);
+        this.Element.appendChild(trackEl);
+        if (!this.divContainer.style.position) {
+            this.Element.parentElement.insertBefore(this.divContainer, this.Element);
+            this.divContainer.style.position = 'relative';
+        }
+        this.divContainer.append(this.Element);
+        this.updateScrollbarSize(scrollDirection);
+    }
+    bindEventsScrollBar(scrollDirection, trackEl) {
+        let scrollLeft = this.Element.scrollLeft;
+        let scrollTop = this.Element.scrollTop;
+        const subs = fromEvent(this.Element, 'scroll').pipe(tap((event) => {
+            const target = this.Element;
+            if (scrollDirection === 'X') {
+                if (target.scrollLeft && (target.scrollLeft + target.offsetWidth >= target.scrollWidth)) {
+                    target.scrollLeft = target.scrollWidth - target.offsetWidth - (target.offsetWidth - target.clientWidth);
+                }
+                if (target.scrollLeft !== scrollLeft) {
+                    this.outScrollX.emit(event);
+                }
+                scrollLeft = target.scrollLeft;
+                this.updateScrollbarPosition(scrollDirection);
+                return;
+            }
+            if (target.scrollTop === scrollTop) {
+                return;
+            }
+            this.updateScrollbarPosition(scrollDirection);
+            scrollTop = target.scrollTop;
+            this.outScrollY.emit(event);
+            if (target.scrollTop === 0) {
+                return this.outScrollTop.emit(event);
+            }
+            if (target.scrollHeight <= target.scrollTop + target.offsetHeight + 3) {
+                return this.outScrollBottom.emit(event);
+            }
+        }), takeUntil(this.onDestroy)).subscribe();
+        subs.add(fromEvent(this.Element, 'resize').pipe(tap(this.updateScrollbarSize.bind(this, scrollDirection)), takeUntil(this.onDestroy)).subscribe());
+        subs.add(fromEvent(this.Element, 'mouseenter').pipe(tap(() => {
+            trackEl.style.visibility = 'visible';
+            trackEl.style.opacity = '1';
+            this.updateScrollbarSize(scrollDirection);
+        }), takeUntil(this.onDestroy)).subscribe());
+        subs.add(fromEvent(this.Element, 'mouseleave').pipe(tap(() => {
+            trackEl.style.visibility = 'hidden';
+            trackEl.style.opacity = '0';
+        }), takeUntil(this.onDestroy)).subscribe());
+        if (scrollDirection === 'X') {
+            this.subsX = subs;
+            return;
+        }
+        if (scrollDirection === 'Y') {
+            this.subsY = subs;
+            return;
+        }
+    }
+    updateScrollbarSize(scrollDirection) {
+        if (scrollDirection === 'X') {
+            const containerWidth = this.Element.offsetWidth;
+            const contentWidth = this.Element.scrollWidth;
+            const thumbWidth = (containerWidth / contentWidth) * (containerWidth - this.thumbX.offsetWidth);
+            this.thumbX.style.width = `${thumbWidth}px`;
+            this.trackX.style.display = 'none';
+            if (containerWidth > thumbWidth) {
+                this.trackX.style.display = 'block';
+            }
+            this.updateScrollbarPosition(scrollDirection);
+            return;
+        }
+        const containerHeight = this.Element.offsetHeight;
+        const contentHeight = this.Element.scrollHeight;
+        const thumbHeight = (containerHeight / contentHeight) * (containerHeight - this.thumbY.offsetHeight);
+        this.thumbY.style.height = `${thumbHeight}px`;
+        this.trackY.style.display = 'block';
+        if (thumbHeight >= containerHeight) {
+            this.trackY.style.display = 'none';
+        }
+        this.updateScrollbarPosition('Y');
+    }
+    updateScrollbarPosition(scrollDirection) {
+        if (scrollDirection === 'X') {
+            const containerWidth = this.Element.offsetWidth;
+            const contentWidth = this.Element.scrollWidth;
+            const scrollLeft = this.Element.scrollLeft;
+            const thumbPosition = (scrollLeft / (contentWidth - containerWidth)) * (containerWidth - this.thumbX.offsetWidth);
+            this.thumbX.style.left = `${thumbPosition}px`;
+            return;
+        }
+        const containerHeight = this.Element.offsetHeight;
+        const contentHeight = this.Element.scrollHeight;
+        const scrollTop = this.Element.scrollTop;
+        const thumbPosition = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - this.thumbY.offsetHeight);
+        this.thumbY.style.top = `${thumbPosition}px`;
+    }
+    ngOnDestroy() {
+        this.onDestroy.next();
+        this.onDestroy.complete();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUIComponentsScrollOverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: LibsUIComponentsScrollOverlayDirective, isStandalone: true, selector: "[LibsUIComponentsScrollOverlayDirective]", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outScrollX: "outScrollX", outScrollY: "outScrollY", outScrollTop: "outScrollTop", outScrollBottom: "outScrollBottom" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUIComponentsScrollOverlayDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[LibsUIComponentsScrollOverlayDirective]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsLW92ZXJsYXkuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL3Njcm9sbC1vdmVybGF5L3NyYy9zY3JvbGwtb3ZlcmxheS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsdURBQXVEO0FBQ3ZELE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFhLFNBQVMsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDM0csT0FBTyxFQUFFLE9BQU8sRUFBZ0IsU0FBUyxFQUFFLFNBQVMsRUFBRSxHQUFHLEVBQUUsTUFBTSxNQUFNLENBQUM7O0FBT3hFLE1BQU0sT0FBTyxzQ0FBc0M7SUFDakQsY0FBYztJQUNHLE1BQU0sR0FBRyxHQUFHLEVBQUUsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQThDL0IsQ0FBQztJQUNNLEtBQUssQ0FBZ0I7SUFDckIsS0FBSyxDQUFnQjtJQUNyQixjQUFjLENBQVU7SUFDeEIsY0FBYyxDQUFVO0lBQ2YsU0FBUyxHQUFHLElBQUksT0FBTyxFQUFRLENBQUM7SUFDaEMsTUFBTSxHQUFnQixRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3BELE1BQU0sR0FBZ0IsUUFBUSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNwRCxNQUFNLEdBQWdCLFFBQVEsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDcEQsTUFBTSxHQUFnQixRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3BELFlBQVksR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBRTlELFdBQVc7SUFDWCxPQUFPLEdBQUcsS0FBSyxDQUFvQyxNQUFNLENBQUMsTUFB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QUFhLElBQUksQ0FBQztZQUU5QyxPQUFPO1FBQ1QsQ0FBQztRQUNELE1BQU0sZUFBZSxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxDQUFDO1FBQ2xELE1BQU0sYUFBYSxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxDQUFDO1FBQ2hELE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsU0FBUyxDQUFDO1FBQ3pDLE1BQU0sYUFBYSxHQUFHLENBQUMsU0FBUyxHQUFHLENBQUMsYUFBYSxHQUFHLGVBQWUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxlQUFlLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxZQUFZLENBQUMsQ0FBQztRQUVySCxJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxHQUFHLEdBQUcsR0FBRyxhQUFhLElBQUksQ0FBQztJQUMvQyxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDdEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUM1QixDQUFDO3dHQXpQVSxzQ0FBc0M7NEZBQXRDLHNDQUFzQzs7NEZBQXRDLHNDQUFzQztrQkFMbEQsU0FBUzttQkFBQztvQkFDVCw4REFBOEQ7b0JBQzlELFFBQVEsRUFBRSwwQ0FBMEM7b0JBQ3BELFVBQVUsRUFBRSxJQUFJO2lCQUNqQiIsInNvdXJjZXNDb250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnkgKi9cbmltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgT25EZXN0cm95LCBSZW5kZXJlcjIsIGVmZmVjdCwgaW5qZWN0LCBpbnB1dCwgb3V0cHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IFN1YmplY3QsIFN1YnNjcmlwdGlvbiwgZnJvbUV2ZW50LCB0YWtlVW50aWwsIHRhcCB9IGZyb20gXCJyeGpzXCI7XG5pbXBvcnQgeyBJU2Nyb2xsT3ZlcmxheU9wdGlvbnMsIFRZUEVfU0NST0xMX0RJUkVDVElPTiB9IGZyb20gXCIuL3Njcm9sbC5pbnRlcmZhY2VcIjtcbkBEaXJlY3RpdmUoe1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2RpcmVjdGl2ZS1zZWxlY3RvclxuICBzZWxlY3RvcjogJ1tMaWJzVUlDb21wb25lbnRzU2Nyb2xsT3ZlcmxheURpcmVjdGl2ZV0nLFxuICBzdGFuZGFsb25lOiB0cnVlXG59KVxuZXhwb3J0IGNsYXNzIExpYnNVSUNvbXBvbmVudHNTY3JvbGxPdmVybGF5RGlyZWN0aXZlIGltcGxlbWVudHMgT25EZXN0cm95IHtcbiAgLyogUFJPUEVSVFkgKi9cbiAgcHJpdmF0ZSByZWFkb25seSBzdHlsZXMgPSAoKSA9PiBgXG4gICAgICAuc2Nyb2xsYmFyLXRyYWNrLVgge1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgIGJvdHRvbTogMDtcbiAgICAgICAgbGVmdDogMDtcbiAgICAgICAgaGVpZ2h0OiA4cHg7XG4gICAgICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgICAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgIHRyYW5zaXRpb246IG9wYWNpdHkgMC4zcyBlYXNlLCB2aXNpYmlsaXR5IDAuM3MgZWFzZTtcbiAgICAgIH1cblxuICAgICAgLnNjcm9sbGJhci10aHVtYi1YIHtcbiAgICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjQ0REMEQ2O1xuICAgICAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgdHJhbnNpdGlvbjogYmFja2dyb3VuZC1jb2xvciAwLjNzO1xuICAgICAgICBwb2ludGVyLWV2ZW50czogYXV0bztcbiAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgfVxuICAgICAgXG4gICAgICAuc2Nyb2xsYmFyLXRyYWNrLVkge1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgIHRvcDogMDtcbiAgICAgICAgcmlnaHQ6IDA7XG4gICAgICAgIHdpZHRoOiA4cHg7XG4gICAgICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgICAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgIHRyYW5zaXRpb246IG9wYWNpdHkgMC4zcyBlYXNlLCB2aXNpYmlsaXR5IDAuM3MgZWFzZTtcbiAgICAgIH1cblxuICAgICAgLnNjcm9sbGJhci10aHVtYi1ZIHtcbiAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6ICNDREQwRDY7XG4gICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgICAgICAgY3Vyc29yOiBwb2ludGVyO1xuICAgICAgICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDAuM3M7XG4gICAgICAgIHBvaW50ZXItZXZlbnRzOiBhdXRvO1xuICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB9XG5cbiAgICAgIC5zY3JvbGxiYXItdGh1bWI6aG92ZXIge1xuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjOUNBMkFEO1xuICAgICAgfVxuICBgO1xuICBwcml2YXRlIHN1YnNYPzogU3Vic2NyaXB0aW9uO1xuICBwcml2YXRlIHN1YnNZPzogU3Vic2NyaXB0aW9uO1xuICBwcml2YXRlIHNjcm9sbGJhcldpZHRoITogbnVtYmVyO1xuICBwcml2YXRlIHNjcm9sbGJhckNvbG9yITogc3RyaW5nO1xuICBwcml2YXRlIHJlYWRvbmx5IG9uRGVzdHJveSA9IG5ldyBTdWJqZWN0PHZvaWQ+KCk7XG4gIHByaXZhdGUgcmVhZG9ubHkgdHJhY2tYOiBIVE1MRWxlbWVudCA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICBwcml2YXRlIHJlYWRvbmx5IHRodW1iWDogSFRNTEVsZW1lbnQgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgcHJpdmF0ZSByZWFkb25seSB0cmFja1k6IEhUTUxFbGVtZW50ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnZGl2Jyk7XG4gIHByaXZhdGUgcmVhZG9ubHkgdGh1bWJZOiBIVE1MRWxlbWVudCA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICBwcml2YXRlIHJlYWRvbmx5IGRpdkNvbnRhaW5lciA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuXG4gIC8qIElOUFVUICovXG4gIG9wdGlvbnMgPSBpbnB1dDxJU2Nyb2xsT3ZlcmxheU9wdGlvbnMgfCB1bmRlZmluZWQ+KE9iamVjdC5hc3NpZ24oe30pKTtcblxuICAvKiBPVVRQVVQgKi9cbiAgcmVhZG9ubHkgb3V0U2Nyb2xsWCA9IG91dHB1dDxFdmVudD4oKTtcbiAgcmVhZG9ubHkgb3V0U2Nyb2xsWSA9IG91dHB1dDxFdmVudD4oKTtcbiAgcmVhZG9ubHkgb3V0U2Nyb2xsVG9wID0gb3V0cHV0PEV2ZW50PigpO1xuICByZWFkb25seSBvdXRTY3JvbGxCb3R0b20gPSBvdXRwdXQ8RXZlbnQ+KCk7XG5cbiAgLyogSU5KRUNUICovXG4gIHByaXZhdGUgZWxlbWVudCA9IGluamVjdChFbGVtZW50UmVmKTtcbiAgcHJpdmF0ZSByZW5kZXIyID0gaW5qZWN0KFJlbmRlcmVyMik7XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgZWZmZWN0KCgpID0+IHtcbiAgICAgIHRoaXMuc2Nyb2xsYmFyV2lkdGggPSB0aGlzLm9wdGlvbnMoKT8uc2Nyb2xsYmFyV2lkdGggfHwgODsgLy8gQ2hp4buBdSBy4buZbmcgdGhhbmggY3Xhu5luXG4gICAgICB0aGlzLnNjcm9sbGJhckNvbG9yID0gdGhpcy5vcHRpb25zKCk/LnNjcm9sbGJhckNvbG9yIHx8ICcjQ0REMEQ2JzsgLy8gTcOgdSBz4bqvYyB0aGFuaCBjdeG7mW5cblxuICAgICAgaWYgKHRoaXMub3B0aW9ucygpPy5zY3JvbGxYICE9PSAnaGlkZGVuJykge1xuICAgICAgICB0aGlzLnN1YnNYPy51bnN1YnNjcmliZSgpO1xuICAgICAgICB0aGlzLmNyZWF0ZVNjcm9sbGJhcignWCcsIHRoaXMudHJhY2tYLCB0aGlzLnRodW1iWCk7XG4gICAgICAgIHRoaXMuYmluZEV2ZW50c1Njcm9sbEJhcignWCcsIHRoaXMudHJhY2tYKTtcbiAgICAgIH1cbiAgICAgIGlmICh0aGlzLm9wdGlvbnMoKT8uc2Nyb2xsWSAhPT0gJ2hpZGRlbicpIHtcbiAgICAgICAgdGhpcy5zdWJzWT8udW5zdWJzY3JpYmUoKTtcbiAgICAgICAgdGhpcy5jcmVhdGVTY3JvbGxiYXIoJ1knLCB0aGlzLnRyYWNrWSwgdGhpcy50aHVtYlkpO1xuICAgICAgICB0aGlzLmJpbmRFdmVudHNTY3JvbGxCYXIoJ1knLCB0aGlzLnRyYWNrWSk7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cblxuICAvKiBGVU5DVElPTlMqL1xuICBwcml2YXRlIGdldCBFbGVtZW50KCkge1xuICAgIHJldHVybiB0aGlzLmVsZW1lbnQubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIHByaXZhdGUgY3JlYXRlU2Nyb2xsYmFyKHNjcm9sbERpcmVjdGlvbjogVFlQRV9TQ1JPTExfRElSRUNUSU9OLCB0cmFja0VsOiBIVE1MRWxlbWVudCwgdGh1bWJFbDogSFRNTEVsZW1lbnQpIHtcbiAgICBjb25zdCBpZFN0eWxlVGFnID0gXCIjaWQtc3R5bGUtdGFnLWN1c3RvbS1zY3JvbGwtb3ZlcmxheVwiXG4gICAgY29uc3Qgc3R5bGVFbEN1c3RvbVNjcm9sbE92ZXJsYXkgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZChpZFN0eWxlVGFnKTtcblxuICAgIGlmICghc3R5bGVFbEN1c3RvbVNjcm9sbE92ZXJsYXkpIHtcbiAgICAgIGNvbnN0IHN0eWxlRWwgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdzdHlsZScpO1xuICAgICAgc3R5bGVFbC5zZXRBdHRyaWJ1dGUoJ2lkJywgaWRTdHlsZVRhZyk7XG4gICAgICBzdHlsZUVsLmlubmVySFRNTCA9IHRoaXMuc3R5bGVzKCk7XG4gICAgICBkb2N1bWVudC5oZWFkLmFwcGVuZChzdHlsZUVsKTtcbiAgICB9XG5cbiAgICBjb25zdCBzdHlsZXNQcm9wZXJ0eSA9IHtcbiAgICAgIFwiYm94LXNpemluZ1wiOiBcImJvcmRlci1ib3hcIixcbiAgICAgIFwic2Nyb2xsYmFyLXdpZHRoXCI6IFwibm9uZVwiLFxuICAgICAgXCJzY3JvbGxiYXItY29sb3JcIjogXCJ0cmFuc3BhcmVudCB0cmFuc3BhcmVudFwiLFxuICAgICAgXCJvdmVyZmxvd1wiOiBcImhpZGRlblwiLFxuICAgICAgXCJvdmVyZmxvdy14XCI6IGAke3RoaXMub3B0aW9ucygpPy5zY3JvbGxYIHx8ICdzY3JvbGwnfWAsXG4gICAgICBcIm92ZXJmbG93LXlcIjogYCR7dGhpcy5vcHRpb25zKCk/LnNjcm9sbFkgfHwgJ3Njcm9sbCd9YFxuICAgIH0gYXMgYW55O1xuXG4gICAgT2JqZWN0LmtleXMoc3R5bGVzUHJvcGVydHkpLmZvckVhY2goa2V5ID0+IHtcbiAgICAgIHRoaXMucmVuZGVyMi5zZXRTdHlsZSh0aGlzLkVsZW1lbnQsIGtleSwgc3R5bGVzUHJvcGVydHlba2V5XSwgMSk7XG4gICAgfSk7XG5cbiAgICB0cmFja0VsLmNsYXNzTGlzdC5hZGQoYHNjcm9sbGJhci10cmFjay0ke3Njcm9sbERpcmVjdGlvbn1gKTtcbiAgICB0cmFja0VsLnN0eWxlLmhlaWdodCA9IGAke3RoaXMuc2Nyb2xsYmFyV2lkdGh9cHhgO1xuXG4gICAgdGh1bWJFbC5jbGFzc0xpc3QuYWRkKGBzY3JvbGxiYXItdGh1bWItJHtzY3JvbGxEaXJlY3Rpb259YCk7XG4gICAgdGh1bWJFbC5zdHlsZS5iYWNrZ3JvdW5kQ29sb3IgPSB0aGlzLnNjcm9sbGJhckNvbG9yO1xuICAgIHRyYWNrRWwuYXBwZW5kQ2hpbGQodGh1bWJFbCk7XG4gICAgdGhpcy5FbGVtZW50LmFwcGVuZENoaWxkKHRyYWNrRWwpO1xuICAgIGlmICghdGhpcy5kaXZDb250YWluZXIuc3R5bGUucG9zaXRpb24pIHtcbiAgICAgIHRoaXMuRWxlbWVudC5wYXJlbnRFbGVtZW50Lmluc2VydEJlZm9yZSh0aGlzLmRpdkNvbnRhaW5lciwgdGhpcy5FbGVtZW50KTtcbiAgICAgIHRoaXMuZGl2Q29udGFpbmVyLnN0eWxlLnBvc2l0aW9uID0gJ3JlbGF0aXZlJztcbiAgICB9XG4gICAgdGhpcy5kaXZDb250YWluZXIuYXBwZW5kKHRoaXMuRWxlbWVudCk7XG4gICAgdGhpcy51cGRhdGVTY3JvbGxiYXJTaXplKHNjcm9sbERpcmVjdGlvbik7XG4gIH1cblxuICBwcml2YXRlIGJpbmRFdmVudHNTY3JvbGxCYXIoc2Nyb2xsRGlyZWN0aW9uOiBUWVBFX1NDUk9MTF9ESVJFQ1RJT04sIHRyYWNrRWw6IEhUTUxFbGVtZW50KSB7XG4gICAgbGV0IHNjcm9sbExlZnQgPSB0aGlzLkVsZW1lbnQuc2Nyb2xsTGVmdDtcbiAgICBsZXQgc2Nyb2xsVG9wID0gdGhpcy5FbGVtZW50LnNjcm9sbFRvcDtcbiAgICBjb25zdCBzdWJzOiBTdWJzY3JpcHRpb24gPSBmcm9tRXZlbnQ8RXZlbnQ+KHRoaXMuRWxlbWVudCwgJ3Njcm9sbCcpLnBpcGUodGFwKChldmVudCkgPT4ge1xuICAgICAgY29uc3QgdGFyZ2V0ID0gdGhpcy5FbGVtZW50O1xuXG4gICAgICBpZiAoc2Nyb2xsRGlyZWN0aW9uID09PSAnWCcpIHtcbiAgICAgICAgaWYgKHRhcmdldC5zY3JvbGxMZWZ0ICYmICh0YXJnZXQuc2Nyb2xsTGVmdCArIHRhcmdldC5vZmZzZXRXaWR0aCA+PSB0YXJnZXQuc2Nyb2xsV2lkdGgpKSB7XG4gICAgICAgICAgdGFyZ2V0LnNjcm9sbExlZnQgPSB0YXJnZXQuc2Nyb2xsV2lkdGggLSB0YXJnZXQub2Zmc2V0V2lkdGggLSAodGFyZ2V0Lm9mZnNldFdpZHRoIC0gdGFyZ2V0LmNsaWVudFdpZHRoKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmICh0YXJnZXQuc2Nyb2xsTGVmdCAhPT0gc2Nyb2xsTGVmdCkge1xuICAgICAgICAgIHRoaXMub3V0U2Nyb2xsWC5lbWl0KGV2ZW50KTtcblxuICAgICAgICB9XG4gICAgICAgIHNjcm9sbExlZnQgPSB0YXJnZXQuc2Nyb2xsTGVmdDtcbiAgICAgICAgdGhpcy51cGRhdGVTY3JvbGxiYXJQb3NpdGlvbihzY3JvbGxEaXJlY3Rpb24pO1xuXG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cblxuICAgICAgaWYgKHRhcmdldC5zY3JvbGxUb3AgPT09IHNjcm9sbFRvcCkge1xuICAgICAgICByZXR1cm5cbiAgICAgIH1cbiAgICAgIHRoaXMudXBkYXRlU2Nyb2xsYmFyUG9zaXRpb24oc2Nyb2xsRGlyZWN0aW9uKTtcbiAgICAgIHNjcm9sbFRvcCA9IHRhcmdldC5zY3JvbGxUb3A7XG4gICAgICB0aGlzLm91dFNjcm9sbFkuZW1pdChldmVudCk7XG5cbiAgICAgIGlmICh0YXJnZXQuc2Nyb2xsVG9wID09PSAwKSB7XG4gICAgICAgIHJldHVybiB0aGlzLm91dFNjcm9sbFRvcC5lbWl0KGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKHRhcmdldC5zY3JvbGxIZWlnaHQgPD0gdGFyZ2V0LnNjcm9sbFRvcCArIHRhcmdldC5vZmZzZXRIZWlnaHQgKyAzKSB7XG4gICAgICAgIHJldHVybiB0aGlzLm91dFNjcm9sbEJvdHRvbS5lbWl0KGV2ZW50KTtcbiAgICAgIH1cbiAgICB9KSwgdGFrZVVudGlsKHRoaXMub25EZXN0cm95KSkuc3Vic2NyaWJlKCk7XG5cbiAgICBzdWJzLmFkZChmcm9tRXZlbnQodGhpcy5FbGVtZW50LCAncmVzaXplJykucGlwZSh0YXAodGhpcy51cGRhdGVTY3JvbGxiYXJTaXplLmJpbmQodGhpcywgc2Nyb2xsRGlyZWN0aW9uKSksIHRha2VVbnRpbCh0aGlzLm9uRGVzdHJveSkpLnN1YnNjcmliZSgpKTtcblxuICAgIHN1YnMuYWRkKGZyb21FdmVudCh0aGlzLkVsZW1lbnQsICdtb3VzZWVudGVyJykucGlwZSh0YXAoKCkgPT4ge1xuICAgICAgdHJhY2tFbC5zdHlsZS52aXNpYmlsaXR5ID0gJ3Zpc2libGUnO1xuICAgICAgdHJhY2tFbC5zdHlsZS5vcGFjaXR5ID0gJzEnO1xuICAgICAgdGhpcy51cGRhdGVTY3JvbGxiYXJTaXplKHNjcm9sbERpcmVjdGlvbik7XG4gICAgfSksIHRha2VVbnRpbCh0aGlzLm9uRGVzdHJveSkpLnN1YnNjcmliZSgpKTtcblxuICAgIHN1YnMuYWRkKGZyb21FdmVudCh0aGlzLkVsZW1lbnQsICdtb3VzZWxlYXZlJykucGlwZSh0YXAoKCkgPT4ge1xuICAgICAgdHJhY2tFbC5zdHlsZS52aXNpYmlsaXR5ID0gJ2hpZGRlbic7XG4gICAgICB0cmFja0VsLnN0eWxlLm9wYWNpdHkgPSAnMCc7XG4gICAgfSksIHRha2VVbnRpbCh0aGlzLm9uRGVzdHJveSkpLnN1YnNjcmliZSgpKTtcblxuICAgIGlmIChzY3JvbGxEaXJlY3Rpb24gPT09ICdYJykge1xuICAgICAgdGhpcy5zdWJzWCA9IHN1YnM7XG5cbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBpZiAoc2Nyb2xsRGlyZWN0aW9uID09PSAnWScpIHtcbiAgICAgIHRoaXMuc3Vic1kgPSBzdWJzO1xuXG4gICAgICByZXR1cm47XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVTY3JvbGxiYXJTaXplKHNjcm9sbERpcmVjdGlvbjogVFlQRV9TQ1JPTExfRElSRUNUSU9OKSB7XG4gICAgaWYgKHNjcm9sbERpcmVjdGlvbiA9PT0gJ1gnKSB7XG4gICAgICBjb25zdCBjb250YWluZXJXaWR0aCA9IHRoaXMuRWxlbWVudC5vZmZzZXRXaWR0aDtcbiAgICAgIGNvbnN0IGNvbnRlbnRXaWR0aCA9IHRoaXMuRWxlbWVudC5zY3JvbGxXaWR0aDtcbiAgICAgIGNvbnN0IHRodW1iV2lkdGggPSAoY29udGFpbmVyV2lkdGggLyBjb250ZW50V2lkdGgpICogKGNvbnRhaW5lcldpZHRoIC0gdGhpcy50aHVtYlgub2Zmc2V0V2lkdGgpO1xuXG4gICAgICB0aGlzLnRodW1iWC5zdHlsZS53aWR0aCA9IGAke3RodW1iV2lkdGh9cHhgO1xuICAgICAgdGhpcy50cmFja1guc3R5bGUuZGlzcGxheSA9ICdub25lJztcbiAgICAgIGlmIChjb250YWluZXJXaWR0aCA+IHRodW1iV2lkdGgpIHtcbiAgICAgICAgdGhpcy50cmFja1guc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XG4gICAgICB9XG4gICAgICB0aGlzLnVwZGF0ZVNjcm9sbGJhclBvc2l0aW9uKHNjcm9sbERpcmVjdGlvbik7XG5cbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBjb25zdCBjb250YWluZXJIZWlnaHQgPSB0aGlzLkVsZW1lbnQub2Zmc2V0SGVpZ2h0O1xuICAgIGNvbnN0IGNvbnRlbnRIZWlnaHQgPSB0aGlzLkVsZW1lbnQuc2Nyb2xsSGVpZ2h0O1xuICAgIGNvbnN0IHRodW1iSGVpZ2h0ID0gKGNvbnRhaW5lckhlaWdodCAvIGNvbnRlbnRIZWlnaHQpICogKGNvbnRhaW5lckhlaWdodCAtIHRoaXMudGh1bWJZLm9mZnNldEhlaWdodCk7XG5cbiAgICB0aGlzLnRodW1iWS5zdHlsZS5oZWlnaHQgPSBgJHt0aHVtYkhlaWdodH1weGA7XG4gICAgdGhpcy50cmFja1kuc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XG4gICAgaWYgKHRodW1iSGVpZ2h0ID49IGNvbnRhaW5lckhlaWdodCkge1xuICAgICAgdGhpcy50cmFja1kuc3R5bGUuZGlzcGxheSA9ICdub25lJztcbiAgICB9XG5cbiAgICB0aGlzLnVwZGF0ZVNjcm9sbGJhclBvc2l0aW9uKCdZJyk7XG4gIH1cblxuICBwcml2YXRlIHVwZGF0ZVNjcm9sbGJhclBvc2l0aW9uKHNjcm9sbERpcmVjdGlvbjogVFlQRV9TQ1JPTExfRElSRUNUSU9OKSB7XG4gICAgaWYgKHNjcm9sbERpcmVjdGlvbiA9PT0gJ1gnKSB7XG4gICAgICBjb25zdCBjb250YWluZXJXaWR0aCA9IHRoaXMuRWxlbWVudC5vZmZzZXRXaWR0aDtcbiAgICAgIGNvbnN0IGNvbnRlbnRXaWR0aCA9IHRoaXMuRWxlbWVudC5zY3JvbGxXaWR0aDtcbiAgICAgIGNvbnN0IHNjcm9sbExlZnQgPSB0aGlzLkVsZW1lbnQuc2Nyb2xsTGVmdDtcbiAgICAgIGNvbnN0IHRodW1iUG9zaXRpb24gPSAoc2Nyb2xsTGVmdCAvIChjb250ZW50V2lkdGggLSBjb250YWluZXJXaWR0aCkpICogKGNvbnRhaW5lcldpZHRoIC0gdGhpcy50aHVtYlgub2Zmc2V0V2lkdGgpO1xuXG4gICAgICB0aGlzLnRodW1iWC5zdHlsZS5sZWZ0ID0gYCR7dGh1bWJQb3NpdGlvbn1weGA7XG5cbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgY29uc3QgY29udGFpbmVySGVpZ2h0ID0gdGhpcy5FbGVtZW50Lm9mZnNldEhlaWdodDtcbiAgICBjb25zdCBjb250ZW50SGVpZ2h0ID0gdGhpcy5FbGVtZW50LnNjcm9sbEhlaWdodDtcbiAgICBjb25zdCBzY3JvbGxUb3AgPSB0aGlzLkVsZW1lbnQuc2Nyb2xsVG9wO1xuICAgIGNvbnN0IHRodW1iUG9zaXRpb24gPSAoc2Nyb2xsVG9wIC8gKGNvbnRlbnRIZWlnaHQgLSBjb250YWluZXJIZWlnaHQpKSAqIChjb250YWluZXJIZWlnaHQgLSB0aGlzLnRodW1iWS5vZmZzZXRIZWlnaHQpO1xuXG4gICAgdGhpcy50aHVtYlkuc3R5bGUudG9wID0gYCR7dGh1bWJQb3NpdGlvbn1weGA7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLm9uRGVzdHJveS5uZXh0KCk7XG4gICAgdGhpcy5vbkRlc3Ryb3kuY29tcGxldGUoKTtcbiAgfVxuXG59Il19

package/esm2022/scroll.interface.mjs

@@ -0,0 +1,3 @@
+;
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Nyb2xsLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9zY3JvbGwtb3ZlcmxheS9zcmMvc2Nyb2xsLmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHR5cGUgVFlQRV9TQ1JPTExfRElSRUNUSU9OID0gJ1gnIHwgJ1knO1xuZXhwb3J0IHR5cGUgVFlQRV9TQ1JPTExfT1ZFUkZMT1cgPSAnaGlkZGVuJyB8ICdzY3JvbGwnO1xuZXhwb3J0IGludGVyZmFjZSBJU2Nyb2xsT3ZlcmxheU9wdGlvbnMge1xuICBzY3JvbGxiYXJXaWR0aD86IG51bWJlcjtcbiAgc2Nyb2xsYmFyQ29sb3I/OiBzdHJpbmc7XG4gIHNjcm9sbFg/OiBUWVBFX1NDUk9MTF9PVkVSRkxPVyxcbiAgc2Nyb2xsWT86IFRZUEVfU0NST0xMX09WRVJGTE9XXG59OyJdfQ==

package/fesm2022/libs-ui-components-scroll-overlay.mjs

@@ -0,0 +1,237 @@
+import * as i0 from '@angular/core';
+import { input, output, inject, ElementRef, Renderer2, effect, Directive } from '@angular/core';
+import { Subject, fromEvent, tap, takeUntil } from 'rxjs';
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+class LibsUIComponentsScrollOverlayDirective {
+    /* PROPERTY */
+    styles = () => `
+      .scrollbar-track-X {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        height: 8px;
+        pointer-events: none;
+        visibility: hidden;
+        opacity: 0;
+        transition: opacity 0.3s ease, visibility 0.3s ease;
+      }
+
+      .scrollbar-thumb-X {
+        height: 100%;
+        background-color: #CDD0D6;
+        border-radius: 4px;
+        cursor: pointer;
+        transition: background-color 0.3s;
+        pointer-events: auto;
+        position: absolute;
+      }
+      
+      .scrollbar-track-Y {
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 8px;
+        pointer-events: none;
+        visibility: hidden;
+        opacity: 0;
+        transition: opacity 0.3s ease, visibility 0.3s ease;
+      }
+
+      .scrollbar-thumb-Y {
+        width: 100%;
+        background-color: #CDD0D6;
+        border-radius: 4px;
+        cursor: pointer;
+        transition: background-color 0.3s;
+        pointer-events: auto;
+        position: absolute;
+      }
+
+      .scrollbar-thumb:hover {
+        background-color: #9CA2AD;
+      }
+  `;
+    subsX;
+    subsY;
+    scrollbarWidth;
+    scrollbarColor;
+    onDestroy = new Subject();
+    trackX = document.createElement('div');
+    thumbX = document.createElement('div');
+    trackY = document.createElement('div');
+    thumbY = document.createElement('div');
+    divContainer = document.createElement('div');
+    /* INPUT */
+    options = input(Object.assign({}));
+    /* OUTPUT */
+    outScrollX = output();
+    outScrollY = output();
+    outScrollTop = output();
+    outScrollBottom = output();
+    /* INJECT */
+    element = inject(ElementRef);
+    render2 = inject(Renderer2);
+    constructor() {
+        effect(() => {
+            this.scrollbarWidth = this.options()?.scrollbarWidth || 8; // Chiều rộng thanh cuộn
+            this.scrollbarColor = this.options()?.scrollbarColor || '#CDD0D6'; // Màu sắc thanh cuộn
+            if (this.options()?.scrollX !== 'hidden') {
+                this.subsX?.unsubscribe();
+                this.createScrollbar('X', this.trackX, this.thumbX);
+                this.bindEventsScrollBar('X', this.trackX);
+            }
+            if (this.options()?.scrollY !== 'hidden') {
+                this.subsY?.unsubscribe();
+                this.createScrollbar('Y', this.trackY, this.thumbY);
+                this.bindEventsScrollBar('Y', this.trackY);
+            }
+        });
+    }
+    /* FUNCTIONS*/
+    get Element() {
+        return this.element.nativeElement;
+    }
+    createScrollbar(scrollDirection, trackEl, thumbEl) {
+        const idStyleTag = "#id-style-tag-custom-scroll-overlay";
+        const styleElCustomScrollOverlay = document.getElementById(idStyleTag);
+        if (!styleElCustomScrollOverlay) {
+            const styleEl = document.createElement('style');
+            styleEl.setAttribute('id', idStyleTag);
+            styleEl.innerHTML = this.styles();
+            document.head.append(styleEl);
+        }
+        const stylesProperty = {
+            "box-sizing": "border-box",
+            "scrollbar-width": "none",
+            "scrollbar-color": "transparent transparent",
+            "overflow": "hidden",
+            "overflow-x": `${this.options()?.scrollX || 'scroll'}`,
+            "overflow-y": `${this.options()?.scrollY || 'scroll'}`
+        };
+        Object.keys(stylesProperty).forEach(key => {
+            this.render2.setStyle(this.Element, key, stylesProperty[key], 1);
+        });
+        trackEl.classList.add(`scrollbar-track-${scrollDirection}`);
+        trackEl.style.height = `${this.scrollbarWidth}px`;
+        thumbEl.classList.add(`scrollbar-thumb-${scrollDirection}`);
+        thumbEl.style.backgroundColor = this.scrollbarColor;
+        trackEl.appendChild(thumbEl);
+        this.Element.appendChild(trackEl);
+        if (!this.divContainer.style.position) {
+            this.Element.parentElement.insertBefore(this.divContainer, this.Element);
+            this.divContainer.style.position = 'relative';
+        }
+        this.divContainer.append(this.Element);
+        this.updateScrollbarSize(scrollDirection);
+    }
+    bindEventsScrollBar(scrollDirection, trackEl) {
+        let scrollLeft = this.Element.scrollLeft;
+        let scrollTop = this.Element.scrollTop;
+        const subs = fromEvent(this.Element, 'scroll').pipe(tap((event) => {
+            const target = this.Element;
+            if (scrollDirection === 'X') {
+                if (target.scrollLeft && (target.scrollLeft + target.offsetWidth >= target.scrollWidth)) {
+                    target.scrollLeft = target.scrollWidth - target.offsetWidth - (target.offsetWidth - target.clientWidth);
+                }
+                if (target.scrollLeft !== scrollLeft) {
+                    this.outScrollX.emit(event);
+                }
+                scrollLeft = target.scrollLeft;
+                this.updateScrollbarPosition(scrollDirection);
+                return;
+            }
+            if (target.scrollTop === scrollTop) {
+                return;
+            }
+            this.updateScrollbarPosition(scrollDirection);
+            scrollTop = target.scrollTop;
+            this.outScrollY.emit(event);
+            if (target.scrollTop === 0) {
+                return this.outScrollTop.emit(event);
+            }
+            if (target.scrollHeight <= target.scrollTop + target.offsetHeight + 3) {
+                return this.outScrollBottom.emit(event);
+            }
+        }), takeUntil(this.onDestroy)).subscribe();
+        subs.add(fromEvent(this.Element, 'resize').pipe(tap(this.updateScrollbarSize.bind(this, scrollDirection)), takeUntil(this.onDestroy)).subscribe());
+        subs.add(fromEvent(this.Element, 'mouseenter').pipe(tap(() => {
+            trackEl.style.visibility = 'visible';
+            trackEl.style.opacity = '1';
+            this.updateScrollbarSize(scrollDirection);
+        }), takeUntil(this.onDestroy)).subscribe());
+        subs.add(fromEvent(this.Element, 'mouseleave').pipe(tap(() => {
+            trackEl.style.visibility = 'hidden';
+            trackEl.style.opacity = '0';
+        }), takeUntil(this.onDestroy)).subscribe());
+        if (scrollDirection === 'X') {
+            this.subsX = subs;
+            return;
+        }
+        if (scrollDirection === 'Y') {
+            this.subsY = subs;
+            return;
+        }
+    }
+    updateScrollbarSize(scrollDirection) {
+        if (scrollDirection === 'X') {
+            const containerWidth = this.Element.offsetWidth;
+            const contentWidth = this.Element.scrollWidth;
+            const thumbWidth = (containerWidth / contentWidth) * (containerWidth - this.thumbX.offsetWidth);
+            this.thumbX.style.width = `${thumbWidth}px`;
+            this.trackX.style.display = 'none';
+            if (containerWidth > thumbWidth) {
+                this.trackX.style.display = 'block';
+            }
+            this.updateScrollbarPosition(scrollDirection);
+            return;
+        }
+        const containerHeight = this.Element.offsetHeight;
+        const contentHeight = this.Element.scrollHeight;
+        const thumbHeight = (containerHeight / contentHeight) * (containerHeight - this.thumbY.offsetHeight);
+        this.thumbY.style.height = `${thumbHeight}px`;
+        this.trackY.style.display = 'block';
+        if (thumbHeight >= containerHeight) {
+            this.trackY.style.display = 'none';
+        }
+        this.updateScrollbarPosition('Y');
+    }
+    updateScrollbarPosition(scrollDirection) {
+        if (scrollDirection === 'X') {
+            const containerWidth = this.Element.offsetWidth;
+            const contentWidth = this.Element.scrollWidth;
+            const scrollLeft = this.Element.scrollLeft;
+            const thumbPosition = (scrollLeft / (contentWidth - containerWidth)) * (containerWidth - this.thumbX.offsetWidth);
+            this.thumbX.style.left = `${thumbPosition}px`;
+            return;
+        }
+        const containerHeight = this.Element.offsetHeight;
+        const contentHeight = this.Element.scrollHeight;
+        const scrollTop = this.Element.scrollTop;
+        const thumbPosition = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - this.thumbY.offsetHeight);
+        this.thumbY.style.top = `${thumbPosition}px`;
+    }
+    ngOnDestroy() {
+        this.onDestroy.next();
+        this.onDestroy.complete();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUIComponentsScrollOverlayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: LibsUIComponentsScrollOverlayDirective, isStandalone: true, selector: "[LibsUIComponentsScrollOverlayDirective]", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outScrollX: "outScrollX", outScrollY: "outScrollY", outScrollTop: "outScrollTop", outScrollBottom: "outScrollBottom" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUIComponentsScrollOverlayDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[LibsUIComponentsScrollOverlayDirective]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+;
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LibsUIComponentsScrollOverlayDirective };
+//# sourceMappingURL=libs-ui-components-scroll-overlay.mjs.map

package/fesm2022/libs-ui-components-scroll-overlay.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"libs-ui-components-scroll-overlay.mjs","sources":["../../../../../libs-ui/components/scroll-overlay/src/scroll-overlay.directive.ts","../../../../../libs-ui/components/scroll-overlay/src/scroll.interface.ts","../../../../../libs-ui/components/scroll-overlay/src/libs-ui-components-scroll-overlay.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Directive, ElementRef, OnDestroy, Renderer2, effect, inject, input, output } from \"@angular/core\";\nimport { Subject, Subscription, fromEvent, takeUntil, tap } from \"rxjs\";\nimport { IScrollOverlayOptions, TYPE_SCROLL_DIRECTION } from \"./scroll.interface\";\n@Directive({\n  // eslint-disable-next-line @angular-eslint/directive-selector\n  selector: '[LibsUIComponentsScrollOverlayDirective]',\n  standalone: true\n})\nexport class LibsUIComponentsScrollOverlayDirective implements OnDestroy {\n  /* PROPERTY */\n  private readonly styles = () => `\n      .scrollbar-track-X {\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        height: 8px;\n        pointer-events: none;\n        visibility: hidden;\n        opacity: 0;\n        transition: opacity 0.3s ease, visibility 0.3s ease;\n      }\n\n      .scrollbar-thumb-X {\n        height: 100%;\n        background-color: #CDD0D6;\n        border-radius: 4px;\n        cursor: pointer;\n        transition: background-color 0.3s;\n        pointer-events: auto;\n        position: absolute;\n      }\n      \n      .scrollbar-track-Y {\n        position: absolute;\n        top: 0;\n        right: 0;\n        width: 8px;\n        pointer-events: none;\n        visibility: hidden;\n        opacity: 0;\n        transition: opacity 0.3s ease, visibility 0.3s ease;\n      }\n\n      .scrollbar-thumb-Y {\n        width: 100%;\n        background-color: #CDD0D6;\n        border-radius: 4px;\n        cursor: pointer;\n        transition: background-color 0.3s;\n        pointer-events: auto;\n        position: absolute;\n      }\n\n      .scrollbar-thumb:hover {\n        background-color: #9CA2AD;\n      }\n  `;\n  private subsX?: Subscription;\n  private subsY?: Subscription;\n  private scrollbarWidth!: number;\n  private scrollbarColor!: string;\n  private readonly onDestroy = new Subject<void>();\n  private readonly trackX: HTMLElement = document.createElement('div');\n  private readonly thumbX: HTMLElement = document.createElement('div');\n  private readonly trackY: HTMLElement = document.createElement('div');\n  private readonly thumbY: HTMLElement = document.createElement('div');\n  private readonly divContainer = document.createElement('div');\n\n  /* INPUT */\n  options = input<IScrollOverlayOptions | undefined>(Object.assign({}));\n\n  /* OUTPUT */\n  readonly outScrollX = output<Event>();\n  readonly outScrollY = output<Event>();\n  readonly outScrollTop = output<Event>();\n  readonly outScrollBottom = output<Event>();\n\n  /* INJECT */\n  private element = inject(ElementRef);\n  private render2 = inject(Renderer2);\n\n  constructor() {\n    effect(() => {\n      this.scrollbarWidth = this.options()?.scrollbarWidth || 8; // Chiều rộng thanh cuộn\n      this.scrollbarColor = this.options()?.scrollbarColor || '#CDD0D6'; // Màu sắc thanh cuộn\n\n      if (this.options()?.scrollX !== 'hidden') {\n        this.subsX?.unsubscribe();\n        this.createScrollbar('X', this.trackX, this.thumbX);\n        this.bindEventsScrollBar('X', this.trackX);\n      }\n      if (this.options()?.scrollY !== 'hidden') {\n        this.subsY?.unsubscribe();\n        this.createScrollbar('Y', this.trackY, this.thumbY);\n        this.bindEventsScrollBar('Y', this.trackY);\n      }\n    });\n  }\n\n  /* FUNCTIONS*/\n  private get Element() {\n    return this.element.nativeElement;\n  }\n\n  private createScrollbar(scrollDirection: TYPE_SCROLL_DIRECTION, trackEl: HTMLElement, thumbEl: HTMLElement) {\n    const idStyleTag = \"#id-style-tag-custom-scroll-overlay\"\n    const styleElCustomScrollOverlay = document.getElementById(idStyleTag);\n\n    if (!styleElCustomScrollOverlay) {\n      const styleEl = document.createElement('style');\n      styleEl.setAttribute('id', idStyleTag);\n      styleEl.innerHTML = this.styles();\n      document.head.append(styleEl);\n    }\n\n    const stylesProperty = {\n      \"box-sizing\": \"border-box\",\n      \"scrollbar-width\": \"none\",\n      \"scrollbar-color\": \"transparent transparent\",\n      \"overflow\": \"hidden\",\n      \"overflow-x\": `${this.options()?.scrollX || 'scroll'}`,\n      \"overflow-y\": `${this.options()?.scrollY || 'scroll'}`\n    } as any;\n\n    Object.keys(stylesProperty).forEach(key => {\n      this.render2.setStyle(this.Element, key, stylesProperty[key], 1);\n    });\n\n    trackEl.classList.add(`scrollbar-track-${scrollDirection}`);\n    trackEl.style.height = `${this.scrollbarWidth}px`;\n\n    thumbEl.classList.add(`scrollbar-thumb-${scrollDirection}`);\n    thumbEl.style.backgroundColor = this.scrollbarColor;\n    trackEl.appendChild(thumbEl);\n    this.Element.appendChild(trackEl);\n    if (!this.divContainer.style.position) {\n      this.Element.parentElement.insertBefore(this.divContainer, this.Element);\n      this.divContainer.style.position = 'relative';\n    }\n    this.divContainer.append(this.Element);\n    this.updateScrollbarSize(scrollDirection);\n  }\n\n  private bindEventsScrollBar(scrollDirection: TYPE_SCROLL_DIRECTION, trackEl: HTMLElement) {\n    let scrollLeft = this.Element.scrollLeft;\n    let scrollTop = this.Element.scrollTop;\n    const subs: Subscription = fromEvent<Event>(this.Element, 'scroll').pipe(tap((event) => {\n      const target = this.Element;\n\n      if (scrollDirection === 'X') {\n        if (target.scrollLeft && (target.scrollLeft + target.offsetWidth >= target.scrollWidth)) {\n          target.scrollLeft = target.scrollWidth - target.offsetWidth - (target.offsetWidth - target.clientWidth);\n        }\n\n        if (target.scrollLeft !== scrollLeft) {\n          this.outScrollX.emit(event);\n\n        }\n        scrollLeft = target.scrollLeft;\n        this.updateScrollbarPosition(scrollDirection);\n\n        return;\n      }\n\n      if (target.scrollTop === scrollTop) {\n        return\n      }\n      this.updateScrollbarPosition(scrollDirection);\n      scrollTop = target.scrollTop;\n      this.outScrollY.emit(event);\n\n      if (target.scrollTop === 0) {\n        return this.outScrollTop.emit(event);\n      }\n\n      if (target.scrollHeight <= target.scrollTop + target.offsetHeight + 3) {\n        return this.outScrollBottom.emit(event);\n      }\n    }), takeUntil(this.onDestroy)).subscribe();\n\n    subs.add(fromEvent(this.Element, 'resize').pipe(tap(this.updateScrollbarSize.bind(this, scrollDirection)), takeUntil(this.onDestroy)).subscribe());\n\n    subs.add(fromEvent(this.Element, 'mouseenter').pipe(tap(() => {\n      trackEl.style.visibility = 'visible';\n      trackEl.style.opacity = '1';\n      this.updateScrollbarSize(scrollDirection);\n    }), takeUntil(this.onDestroy)).subscribe());\n\n    subs.add(fromEvent(this.Element, 'mouseleave').pipe(tap(() => {\n      trackEl.style.visibility = 'hidden';\n      trackEl.style.opacity = '0';\n    }), takeUntil(this.onDestroy)).subscribe());\n\n    if (scrollDirection === 'X') {\n      this.subsX = subs;\n\n      return;\n    }\n\n    if (scrollDirection === 'Y') {\n      this.subsY = subs;\n\n      return;\n    }\n  }\n\n  private updateScrollbarSize(scrollDirection: TYPE_SCROLL_DIRECTION) {\n    if (scrollDirection === 'X') {\n      const containerWidth = this.Element.offsetWidth;\n      const contentWidth = this.Element.scrollWidth;\n      const thumbWidth = (containerWidth / contentWidth) * (containerWidth - this.thumbX.offsetWidth);\n\n      this.thumbX.style.width = `${thumbWidth}px`;\n      this.trackX.style.display = 'none';\n      if (containerWidth > thumbWidth) {\n        this.trackX.style.display = 'block';\n      }\n      this.updateScrollbarPosition(scrollDirection);\n\n      return;\n    }\n\n    const containerHeight = this.Element.offsetHeight;\n    const contentHeight = this.Element.scrollHeight;\n    const thumbHeight = (containerHeight / contentHeight) * (containerHeight - this.thumbY.offsetHeight);\n\n    this.thumbY.style.height = `${thumbHeight}px`;\n    this.trackY.style.display = 'block';\n    if (thumbHeight >= containerHeight) {\n      this.trackY.style.display = 'none';\n    }\n\n    this.updateScrollbarPosition('Y');\n  }\n\n  private updateScrollbarPosition(scrollDirection: TYPE_SCROLL_DIRECTION) {\n    if (scrollDirection === 'X') {\n      const containerWidth = this.Element.offsetWidth;\n      const contentWidth = this.Element.scrollWidth;\n      const scrollLeft = this.Element.scrollLeft;\n      const thumbPosition = (scrollLeft / (contentWidth - containerWidth)) * (containerWidth - this.thumbX.offsetWidth);\n\n      this.thumbX.style.left = `${thumbPosition}px`;\n\n      return;\n    }\n    const containerHeight = this.Element.offsetHeight;\n    const contentHeight = this.Element.scrollHeight;\n    const scrollTop = this.Element.scrollTop;\n    const thumbPosition = (scrollTop / (contentHeight - containerHeight)) * (containerHeight - this.thumbY.offsetHeight);\n\n    this.thumbY.style.top = `${thumbPosition}px`;\n  }\n\n  ngOnDestroy(): void {\n    this.onDestroy.next();\n    this.onDestroy.complete();\n  }\n\n}","export type TYPE_SCROLL_DIRECTION = 'X' | 'Y';\nexport type TYPE_SCROLL_OVERFLOW = 'hidden' | 'scroll';\nexport interface IScrollOverlayOptions {\n  scrollbarWidth?: number;\n  scrollbarColor?: string;\n  scrollX?: TYPE_SCROLL_OVERFLOW,\n  scrollY?: TYPE_SCROLL_OVERFLOW\n};","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -0,0 +1,2 @@
+export * from './scroll-overlay.directive';
+export * from './scroll.interface';

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@libs-ui/components-scroll-overlay",
+  "version": "0.2.5",
+  "peerDependencies": {
+    "@angular/common": "^18.2.0",
+    "@angular/core": "^18.2.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/libs-ui-components-scroll-overlay.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/libs-ui-components-scroll-overlay.mjs",
+      "esm": "./esm2022/libs-ui-components-scroll-overlay.mjs",
+      "default": "./fesm2022/libs-ui-components-scroll-overlay.mjs"
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/scroll-overlay.directive.d.ts

@@ -0,0 +1,32 @@
+import { OnDestroy } from "@angular/core";
+import { IScrollOverlayOptions } from "./scroll.interface";
+import * as i0 from "@angular/core";
+export declare class LibsUIComponentsScrollOverlayDirective implements OnDestroy {
+    private readonly styles;
+    private subsX?;
+    private subsY?;
+    private scrollbarWidth;
+    private scrollbarColor;
+    private readonly onDestroy;
+    private readonly trackX;
+    private readonly thumbX;
+    private readonly trackY;
+    private readonly thumbY;
+    private readonly divContainer;
+    options: import("@angular/core").InputSignal<IScrollOverlayOptions | undefined>;
+    readonly outScrollX: import("@angular/core").OutputEmitterRef<Event>;
+    readonly outScrollY: import("@angular/core").OutputEmitterRef<Event>;
+    readonly outScrollTop: import("@angular/core").OutputEmitterRef<Event>;
+    readonly outScrollBottom: import("@angular/core").OutputEmitterRef<Event>;
+    private element;
+    private render2;
+    constructor();
+    private get Element();
+    private createScrollbar;
+    private bindEventsScrollBar;
+    private updateScrollbarSize;
+    private updateScrollbarPosition;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUIComponentsScrollOverlayDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LibsUIComponentsScrollOverlayDirective, "[LibsUIComponentsScrollOverlayDirective]", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; }, { "outScrollX": "outScrollX"; "outScrollY": "outScrollY"; "outScrollTop": "outScrollTop"; "outScrollBottom": "outScrollBottom"; }, never, never, true, never>;
+}

package/scroll.interface.d.ts

@@ -0,0 +1,8 @@
+export type TYPE_SCROLL_DIRECTION = 'X' | 'Y';
+export type TYPE_SCROLL_OVERFLOW = 'hidden' | 'scroll';
+export interface IScrollOverlayOptions {
+    scrollbarWidth?: number;
+    scrollbarColor?: string;
+    scrollX?: TYPE_SCROLL_OVERFLOW;
+    scrollY?: TYPE_SCROLL_OVERFLOW;
+}