carriera-intern 1.1.93 → 1.1.94

package/fesm2022/carriera-intern.mjs

@@ -9942,11 +9942,11 @@ class StickyScrollbarComponent {
         this.updateScrollState(this.calculateScrollState());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StickyScrollbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: StickyScrollbarComponent, isStandalone: true, selector: "ca-sticky-scrollbar", inputs: { hideThumb: "hideThumb", hideTrack: "hideTrack", alwaysVisible: "alwaysVisible", stickyOffset: "stickyOffset" }, outputs: { scrollStateChange: "scrollStateChange" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true }, { propertyName: "scrollThumb", first: true, predicate: ["scrollThumb"], descendants: true }], ngImport: i0, template: "<div class=\"sticky-scrollbar-wrapper\">\n  <div\n    #scrollContainer\n    class=\"sticky-scrollbar-container\"\n    cdkScrollable\n    tabindex=\"-1\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (alwaysVisible && !isContainerInView()) {\n    <div class=\"sticky-scrollbar-placeholder\"></div>\n  }\n  <div\n    class=\"sticky-scrollbar-track\"\n    [class.hidden]=\"hideTrack\"\n    [class.always-visible]=\"alwaysVisible\"\n    [class.fixed-mode]=\"alwaysVisible && !isContainerInView()\"\n    [style.bottom.px]=\"stickyOffset\"\n  >\n    <div\n      #scrollThumb\n      class=\"sticky-scrollbar-thumb\"\n      [class.dragging]=\"isDragging\"\n      [class.hidden-thumb]=\"hideThumb\"\n      (mousedown)=\"onThumbMouseDown($event)\"\n      (mouseup)=\"onThumbMouseUp()\"\n    ></div>\n  </div>\n</div>\n", styles: [".sticky-scrollbar-wrapper{position:relative;height:100%;width:100%;display:flex;flex-direction:column;overscroll-behavior-x:none}.sticky-scrollbar-container{flex:1;width:fit-content;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:none;contain:layout style paint;-ms-overflow-style:none;scrollbar-width:none}.sticky-scrollbar-container::-webkit-scrollbar{display:none}.sticky-scrollbar-container:focus-visible{outline:none!important}.sticky-scrollbar-placeholder{height:14px;visibility:hidden;pointer-events:none}.sticky-scrollbar-track{position:sticky;bottom:0;width:100%;height:14px;display:flex;align-items:center;border-radius:2px;margin-top:0;margin-bottom:0;transition:opacity .1s ease-in-out;z-index:10}.sticky-scrollbar-track.hidden{display:none}.sticky-scrollbar-track.always-visible{z-index:1000}.sticky-scrollbar-track.always-visible.fixed-mode{margin:0}.sticky-scrollbar-track:hover .sticky-scrollbar-thumb{height:6px;background-color:#424242b2}.sticky-scrollbar-thumb{position:relative;height:2px;background-color:#aaa;border-radius:2px;transition:background-color .1s ease-in-out,opacity .1s ease-in-out,height .1s ease-in-out;min-width:30px;will-change:transform,width,opacity;transform:translateZ(0);opacity:1}@starting-style{.sticky-scrollbar-thumb{opacity:0}}.sticky-scrollbar-thumb.hidden-thumb{opacity:0}.sticky-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}.sticky-scrollbar-thumb:hover,.sticky-scrollbar-thumb.dragging{background-color:#424242b2;height:6px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: StickyScrollbarComponent, isStandalone: true, selector: "ca-sticky-scrollbar", inputs: { hideThumb: "hideThumb", hideTrack: "hideTrack", alwaysVisible: "alwaysVisible", stickyOffset: "stickyOffset" }, outputs: { scrollStateChange: "scrollStateChange" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true }, { propertyName: "scrollThumb", first: true, predicate: ["scrollThumb"], descendants: true }], ngImport: i0, template: "<div class=\"sticky-scrollbar-wrapper\">\n  <div\n    #scrollContainer\n    class=\"sticky-scrollbar-container\"\n    cdkScrollable\n    tabindex=\"-1\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (alwaysVisible && !isContainerInView()) {\n    <div class=\"sticky-scrollbar-placeholder\"></div>\n  }\n  <div\n    class=\"sticky-scrollbar-track\"\n    [class.hidden]=\"hideTrack\"\n    [class.always-visible]=\"alwaysVisible\"\n    [class.fixed-mode]=\"alwaysVisible && !isContainerInView()\"\n    [style.bottom.px]=\"stickyOffset\"\n  >\n    <div\n      #scrollThumb\n      class=\"sticky-scrollbar-thumb\"\n      [class.dragging]=\"isDragging\"\n      [class.hidden-thumb]=\"hideThumb\"\n      (mousedown)=\"onThumbMouseDown($event)\"\n      (mouseup)=\"onThumbMouseUp()\"\n    ></div>\n  </div>\n</div>\n", styles: [".sticky-scrollbar-wrapper{position:relative;height:100%;width:100%;display:flex;flex-direction:column;overscroll-behavior-x:none}.sticky-scrollbar-container{flex:1;width:fit-content;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:none;contain:layout style paint;-ms-overflow-style:none;scrollbar-width:none}.sticky-scrollbar-container::-webkit-scrollbar{display:none}.sticky-scrollbar-container:focus-visible{outline:none!important}.sticky-scrollbar-placeholder{height:14px;visibility:hidden;pointer-events:none}.sticky-scrollbar-track{position:sticky;bottom:0;width:100%;height:14px;display:flex;align-items:center;border-radius:2px;margin-top:0;margin-bottom:0;transition:opacity .1s ease-in-out;z-index:10}.sticky-scrollbar-track.hidden{display:none}.sticky-scrollbar-track.always-visible{z-index:1000}.sticky-scrollbar-track.always-visible.fixed-mode{margin:0}.sticky-scrollbar-track:hover .sticky-scrollbar-thumb{height:6px;background-color:#00000080}.sticky-scrollbar-thumb{position:relative;height:2px;background-color:#0003;border-radius:2px;transition:background-color .1s ease-in-out,opacity .1s ease-in-out,height .1s ease-in-out;min-width:30px;will-change:transform,width,opacity;transform:translateZ(0);opacity:1}@starting-style{.sticky-scrollbar-thumb{opacity:0}}.sticky-scrollbar-thumb.hidden-thumb{opacity:0}.sticky-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}.sticky-scrollbar-thumb:hover,.sticky-scrollbar-thumb.dragging{background-color:#00000080;height:6px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: StickyScrollbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ca-sticky-scrollbar', imports: [CommonModule, CdkScrollable], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sticky-scrollbar-wrapper\">\n  <div\n    #scrollContainer\n    class=\"sticky-scrollbar-container\"\n    cdkScrollable\n    tabindex=\"-1\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (alwaysVisible && !isContainerInView()) {\n    <div class=\"sticky-scrollbar-placeholder\"></div>\n  }\n  <div\n    class=\"sticky-scrollbar-track\"\n    [class.hidden]=\"hideTrack\"\n    [class.always-visible]=\"alwaysVisible\"\n    [class.fixed-mode]=\"alwaysVisible && !isContainerInView()\"\n    [style.bottom.px]=\"stickyOffset\"\n  >\n    <div\n      #scrollThumb\n      class=\"sticky-scrollbar-thumb\"\n      [class.dragging]=\"isDragging\"\n      [class.hidden-thumb]=\"hideThumb\"\n      (mousedown)=\"onThumbMouseDown($event)\"\n      (mouseup)=\"onThumbMouseUp()\"\n    ></div>\n  </div>\n</div>\n", styles: [".sticky-scrollbar-wrapper{position:relative;height:100%;width:100%;display:flex;flex-direction:column;overscroll-behavior-x:none}.sticky-scrollbar-container{flex:1;width:fit-content;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:none;contain:layout style paint;-ms-overflow-style:none;scrollbar-width:none}.sticky-scrollbar-container::-webkit-scrollbar{display:none}.sticky-scrollbar-container:focus-visible{outline:none!important}.sticky-scrollbar-placeholder{height:14px;visibility:hidden;pointer-events:none}.sticky-scrollbar-track{position:sticky;bottom:0;width:100%;height:14px;display:flex;align-items:center;border-radius:2px;margin-top:0;margin-bottom:0;transition:opacity .1s ease-in-out;z-index:10}.sticky-scrollbar-track.hidden{display:none}.sticky-scrollbar-track.always-visible{z-index:1000}.sticky-scrollbar-track.always-visible.fixed-mode{margin:0}.sticky-scrollbar-track:hover .sticky-scrollbar-thumb{height:6px;background-color:#424242b2}.sticky-scrollbar-thumb{position:relative;height:2px;background-color:#aaa;border-radius:2px;transition:background-color .1s ease-in-out,opacity .1s ease-in-out,height .1s ease-in-out;min-width:30px;will-change:transform,width,opacity;transform:translateZ(0);opacity:1}@starting-style{.sticky-scrollbar-thumb{opacity:0}}.sticky-scrollbar-thumb.hidden-thumb{opacity:0}.sticky-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}.sticky-scrollbar-thumb:hover,.sticky-scrollbar-thumb.dragging{background-color:#424242b2;height:6px}\n"] }]
+            args: [{ selector: 'ca-sticky-scrollbar', imports: [CommonModule, CdkScrollable], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sticky-scrollbar-wrapper\">\n  <div\n    #scrollContainer\n    class=\"sticky-scrollbar-container\"\n    cdkScrollable\n    tabindex=\"-1\"\n  >\n    <ng-content></ng-content>\n  </div>\n  @if (alwaysVisible && !isContainerInView()) {\n    <div class=\"sticky-scrollbar-placeholder\"></div>\n  }\n  <div\n    class=\"sticky-scrollbar-track\"\n    [class.hidden]=\"hideTrack\"\n    [class.always-visible]=\"alwaysVisible\"\n    [class.fixed-mode]=\"alwaysVisible && !isContainerInView()\"\n    [style.bottom.px]=\"stickyOffset\"\n  >\n    <div\n      #scrollThumb\n      class=\"sticky-scrollbar-thumb\"\n      [class.dragging]=\"isDragging\"\n      [class.hidden-thumb]=\"hideThumb\"\n      (mousedown)=\"onThumbMouseDown($event)\"\n      (mouseup)=\"onThumbMouseUp()\"\n    ></div>\n  </div>\n</div>\n", styles: [".sticky-scrollbar-wrapper{position:relative;height:100%;width:100%;display:flex;flex-direction:column;overscroll-behavior-x:none}.sticky-scrollbar-container{flex:1;width:fit-content;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:none;contain:layout style paint;-ms-overflow-style:none;scrollbar-width:none}.sticky-scrollbar-container::-webkit-scrollbar{display:none}.sticky-scrollbar-container:focus-visible{outline:none!important}.sticky-scrollbar-placeholder{height:14px;visibility:hidden;pointer-events:none}.sticky-scrollbar-track{position:sticky;bottom:0;width:100%;height:14px;display:flex;align-items:center;border-radius:2px;margin-top:0;margin-bottom:0;transition:opacity .1s ease-in-out;z-index:10}.sticky-scrollbar-track.hidden{display:none}.sticky-scrollbar-track.always-visible{z-index:1000}.sticky-scrollbar-track.always-visible.fixed-mode{margin:0}.sticky-scrollbar-track:hover .sticky-scrollbar-thumb{height:6px;background-color:#00000080}.sticky-scrollbar-thumb{position:relative;height:2px;background-color:#0003;border-radius:2px;transition:background-color .1s ease-in-out,opacity .1s ease-in-out,height .1s ease-in-out;min-width:30px;will-change:transform,width,opacity;transform:translateZ(0);opacity:1}@starting-style{.sticky-scrollbar-thumb{opacity:0}}.sticky-scrollbar-thumb.hidden-thumb{opacity:0}.sticky-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}.sticky-scrollbar-thumb:hover,.sticky-scrollbar-thumb.dragging{background-color:#00000080;height:6px}\n"] }]
         }], propDecorators: { scrollContainer: [{
                 type: ViewChild,
                 args: ['scrollContainer', { static: false }]
@@ -9965,6 +9965,229 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 type: Output
             }] } });
 
+class CaScrollableComponent {
+    scrollContainer;
+    horizontalTrack;
+    horizontalThumb;
+    verticalTrack;
+    verticalThumb;
+    isLight = false;
+    set hideHorizontalScrollbar(value) {
+        this._hideHorizontalScrollbar = value;
+        this.refreshScrollbars();
+    }
+    get hideHorizontalScrollbar() {
+        return this._hideHorizontalScrollbar;
+    }
+    set hideVerticalScrollbar(value) {
+        this._hideVerticalScrollbar = value;
+        this.refreshScrollbars();
+    }
+    get hideVerticalScrollbar() {
+        return this._hideVerticalScrollbar;
+    }
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    ngZone = inject(NgZone);
+    _hideHorizontalScrollbar = false;
+    _hideVerticalScrollbar = false;
+    isInitialized = false;
+    isDraggingHorizontal = false;
+    isDraggingVertical = false;
+    dragStartX = 0;
+    dragStartY = 0;
+    scrollStartLeft = 0;
+    scrollStartTop = 0;
+    removeMouseMoveListener;
+    removeMouseUpListener;
+    removeMouseLeaveListener;
+    removeScrollListener;
+    ngAfterViewInit() {
+        this.isInitialized = true;
+        this.updateScrollbars();
+        this.setupScrollListener();
+        this.setupResizeObserver();
+        this.setupGlobalMouseListeners();
+        this.destroyRef.onDestroy(() => {
+            this.removeMouseMoveListener?.();
+            this.removeMouseUpListener?.();
+            this.removeMouseLeaveListener?.();
+            this.removeScrollListener?.();
+        });
+    }
+    onHorizontalThumbMouseDown(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.isDraggingHorizontal = true;
+        this.renderer.addClass(this.horizontalThumb.nativeElement, 'dragging');
+        this.dragStartX = event.clientX;
+        this.scrollStartLeft = this.scrollContainer.nativeElement.scrollLeft;
+    }
+    onVerticalThumbMouseDown(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.isDraggingVertical = true;
+        this.renderer.addClass(this.verticalThumb.nativeElement, 'dragging');
+        this.dragStartY = event.clientY;
+        this.scrollStartTop = this.scrollContainer.nativeElement.scrollTop;
+    }
+    setupScrollListener() {
+        this.ngZone.runOutsideAngular(() => {
+            const container = this.scrollContainer.nativeElement;
+            const onScroll = () => this.handleContainerScroll();
+            container.addEventListener('scroll', onScroll, { passive: true });
+            this.removeScrollListener = () => container.removeEventListener('scroll', onScroll);
+        });
+    }
+    handleContainerScroll() {
+        if (!this.isDraggingHorizontal && !this.isDraggingVertical) {
+            this.updateScrollbars();
+        }
+    }
+    setupResizeObserver() {
+        this.ngZone.runOutsideAngular(() => {
+            const resizeObserver = new ResizeObserver(() => this.updateScrollbars());
+            const container = this.scrollContainer.nativeElement;
+            resizeObserver.observe(container);
+            if (container.firstElementChild) {
+                resizeObserver.observe(container.firstElementChild);
+            }
+            this.destroyRef.onDestroy(() => {
+                resizeObserver.disconnect();
+            });
+        });
+    }
+    setupGlobalMouseListeners() {
+        this.ngZone.runOutsideAngular(() => {
+            const onMouseMove = (event) => this.onThumbDrag(event);
+            const onMouseUp = () => this.onThumbMouseUp();
+            const onMouseLeave = () => this.onThumbMouseUp();
+            window.addEventListener('mousemove', onMouseMove, { passive: true });
+            window.addEventListener('mouseup', onMouseUp);
+            window.addEventListener('mouseleave', onMouseLeave);
+            this.removeMouseMoveListener = () => window.removeEventListener('mousemove', onMouseMove);
+            this.removeMouseUpListener = () => window.removeEventListener('mouseup', onMouseUp);
+            this.removeMouseLeaveListener = () => window.removeEventListener('mouseleave', onMouseLeave);
+        });
+    }
+    onThumbDrag(event) {
+        const container = this.scrollContainer.nativeElement;
+        if (this.isDraggingHorizontal) {
+            const deltaX = event.clientX - this.dragStartX;
+            const maxScrollX = Math.max(container.scrollWidth - container.clientWidth, 0);
+            const trackWidth = this.horizontalTrack.nativeElement.clientWidth;
+            const thumbWidth = this.horizontalThumb.nativeElement.offsetWidth;
+            const maxThumbTravelX = Math.max(trackWidth - thumbWidth, 1);
+            const scrollDeltaX = (deltaX / maxThumbTravelX) * maxScrollX;
+            container.scrollLeft = this.scrollStartLeft + scrollDeltaX;
+        }
+        if (this.isDraggingVertical) {
+            const deltaY = event.clientY - this.dragStartY;
+            const maxScrollY = Math.max(container.scrollHeight - container.clientHeight, 0);
+            const trackHeight = this.verticalTrack.nativeElement.clientHeight;
+            const thumbHeight = this.verticalThumb.nativeElement.offsetHeight;
+            const maxThumbTravelY = Math.max(trackHeight - thumbHeight, 1);
+            const scrollDeltaY = (deltaY / maxThumbTravelY) * maxScrollY;
+            container.scrollTop = this.scrollStartTop + scrollDeltaY;
+        }
+        this.updateScrollbars();
+    }
+    onThumbMouseUp() {
+        if (this.isDraggingHorizontal) {
+            this.renderer.removeClass(this.horizontalThumb.nativeElement, 'dragging');
+        }
+        if (this.isDraggingVertical) {
+            this.renderer.removeClass(this.verticalThumb.nativeElement, 'dragging');
+        }
+        this.isDraggingHorizontal = false;
+        this.isDraggingVertical = false;
+    }
+    updateScrollbars() {
+        const container = this.scrollContainer.nativeElement;
+        const horizontalTrack = this.horizontalTrack.nativeElement;
+        const verticalTrack = this.verticalTrack.nativeElement;
+        const horizontalThumb = this.horizontalThumb.nativeElement;
+        const verticalThumb = this.verticalThumb.nativeElement;
+        const containerWidth = container.clientWidth;
+        const containerHeight = container.clientHeight;
+        const contentWidth = container.scrollWidth;
+        const contentHeight = container.scrollHeight;
+        const maxScrollX = Math.max(contentWidth - containerWidth, 0);
+        const maxScrollY = Math.max(contentHeight - containerHeight, 0);
+        const horizontalTrackLength = horizontalTrack.clientWidth;
+        const verticalTrackLength = verticalTrack.clientHeight;
+        const hasHorizontalOverflow = maxScrollX > 0;
+        const hasVerticalOverflow = maxScrollY > 0;
+        const shouldShowHorizontal = hasHorizontalOverflow && !this.hideHorizontalScrollbar;
+        const shouldShowVertical = hasVerticalOverflow && !this.hideVerticalScrollbar;
+        this.renderer.setStyle(horizontalTrack, 'opacity', shouldShowHorizontal ? '1' : '0');
+        this.renderer.setStyle(horizontalTrack, 'pointer-events', shouldShowHorizontal ? 'auto' : 'none');
+        if (shouldShowHorizontal) {
+            this.renderer.removeClass(horizontalTrack, 'hidden');
+        }
+        else {
+            this.renderer.addClass(horizontalTrack, 'hidden');
+            this.renderer.removeClass(horizontalThumb, 'dragging');
+        }
+        this.renderer.setStyle(verticalTrack, 'opacity', shouldShowVertical ? '1' : '0');
+        this.renderer.setStyle(verticalTrack, 'pointer-events', shouldShowVertical ? 'auto' : 'none');
+        if (shouldShowVertical) {
+            this.renderer.removeClass(verticalTrack, 'hidden');
+        }
+        else {
+            this.renderer.addClass(verticalTrack, 'hidden');
+            this.renderer.removeClass(verticalThumb, 'dragging');
+        }
+        if (shouldShowHorizontal) {
+            const thumbWidth = Math.min(horizontalTrackLength, Math.max((containerWidth / contentWidth) * horizontalTrackLength, 24));
+            const maxThumbTravelX = Math.max(horizontalTrackLength - thumbWidth, 1);
+            const thumbPositionX = (container.scrollLeft / maxScrollX) * maxThumbTravelX;
+            this.renderer.setStyle(horizontalThumb, 'width', `${thumbWidth}px`);
+            this.renderer.setStyle(horizontalThumb, 'transform', `translateX(${thumbPositionX}px)`);
+        }
+        if (shouldShowVertical) {
+            const thumbHeight = Math.min(verticalTrackLength, Math.max((containerHeight / contentHeight) * verticalTrackLength, 24));
+            const maxThumbTravelY = Math.max(verticalTrackLength - thumbHeight, 1);
+            const thumbPositionY = (container.scrollTop / maxScrollY) * maxThumbTravelY;
+            this.renderer.setStyle(verticalThumb, 'height', `${thumbHeight}px`);
+            this.renderer.setStyle(verticalThumb, 'transform', `translateY(${thumbPositionY}px)`);
+        }
+    }
+    refreshScrollbars() {
+        if (!this.isInitialized) {
+            return;
+        }
+        this.updateScrollbars();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaScrollableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: CaScrollableComponent, isStandalone: true, selector: "ca-scrollable", inputs: { isLight: "isLight", hideHorizontalScrollbar: "hideHorizontalScrollbar", hideVerticalScrollbar: "hideVerticalScrollbar" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true }, { propertyName: "horizontalTrack", first: true, predicate: ["horizontalTrack"], descendants: true }, { propertyName: "horizontalThumb", first: true, predicate: ["horizontalThumb"], descendants: true }, { propertyName: "verticalTrack", first: true, predicate: ["verticalTrack"], descendants: true }, { propertyName: "verticalThumb", first: true, predicate: ["verticalThumb"], descendants: true }], ngImport: i0, template: "<div class=\"ca-scrollable-wrapper\" [class.light]=\"isLight\">\n  <div\n    #scrollContainer\n    class=\"ca-scrollable-container\"\n    tabindex=\"-1\"\n    cdkScrollable\n  >\n    <ng-content></ng-content>\n  </div>\n\n  <div #horizontalTrack class=\"ca-scrollbar-track horizontal\">\n    <div\n      #horizontalThumb\n      class=\"ca-scrollbar-thumb\"\n      (mousedown)=\"onHorizontalThumbMouseDown($event)\"\n    ></div>\n  </div>\n\n  <div #verticalTrack class=\"ca-scrollbar-track vertical\">\n    <div\n      #verticalThumb\n      class=\"ca-scrollbar-thumb\"\n      (mousedown)=\"onVerticalThumbMouseDown($event)\"\n    ></div>\n  </div>\n</div>\n", styles: [".ca-scrollable-wrapper{--ca-scrollbar-thumb-color: rgba(0, 0, 0, .2);--ca-scrollbar-thumb-hover-color: rgba(0, 0, 0, .5);--ca-scrollbar-thumb-dragging-color: rgba(0, 0, 0, .5);position:relative;width:100%;height:100%;overscroll-behavior:none}.ca-scrollable-wrapper.light{--ca-scrollbar-thumb-color: rgba(255, 255, 255, .4);--ca-scrollbar-thumb-hover-color: rgba(255, 255, 255, .5);--ca-scrollbar-thumb-dragging-color: rgba(255, 255, 255, .5)}.ca-scrollable-container{width:100%;height:100%;overflow:auto;overscroll-behavior:none;-ms-overflow-style:none;scrollbar-width:none}.ca-scrollable-container::-webkit-scrollbar{display:none}.ca-scrollable-container:focus-visible{outline:none!important}.ca-scrollbar-track{position:absolute;z-index:1;display:flex;box-sizing:border-box;opacity:0;pointer-events:none;transition:opacity .1s ease-in-out}.ca-scrollbar-track.hidden .ca-scrollbar-thumb:before{pointer-events:none}.ca-scrollbar-track.horizontal{left:4px;right:4px;bottom:12px;height:14px;align-items:center}.ca-scrollbar-track.horizontal .ca-scrollbar-thumb{width:100%;height:2px}.ca-scrollbar-track.horizontal:hover .ca-scrollbar-thumb,.ca-scrollbar-track.horizontal .ca-scrollbar-thumb.dragging{height:6px;background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-track.vertical{top:4px;right:0;bottom:4px;width:12px;justify-content:center}.ca-scrollbar-track.vertical .ca-scrollbar-thumb{width:2px;height:100%}.ca-scrollbar-track.vertical:hover .ca-scrollbar-thumb,.ca-scrollbar-track.vertical .ca-scrollbar-thumb.dragging{width:6px;background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-thumb{position:relative;background-color:var(--ca-scrollbar-thumb-color);border-radius:2px;transition:background-color .1s ease-in-out,height .1s ease-in-out,width .1s ease-in-out}.ca-scrollbar-thumb:hover{background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CaScrollableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ca-scrollable', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, CdkScrollable], template: "<div class=\"ca-scrollable-wrapper\" [class.light]=\"isLight\">\n  <div\n    #scrollContainer\n    class=\"ca-scrollable-container\"\n    tabindex=\"-1\"\n    cdkScrollable\n  >\n    <ng-content></ng-content>\n  </div>\n\n  <div #horizontalTrack class=\"ca-scrollbar-track horizontal\">\n    <div\n      #horizontalThumb\n      class=\"ca-scrollbar-thumb\"\n      (mousedown)=\"onHorizontalThumbMouseDown($event)\"\n    ></div>\n  </div>\n\n  <div #verticalTrack class=\"ca-scrollbar-track vertical\">\n    <div\n      #verticalThumb\n      class=\"ca-scrollbar-thumb\"\n      (mousedown)=\"onVerticalThumbMouseDown($event)\"\n    ></div>\n  </div>\n</div>\n", styles: [".ca-scrollable-wrapper{--ca-scrollbar-thumb-color: rgba(0, 0, 0, .2);--ca-scrollbar-thumb-hover-color: rgba(0, 0, 0, .5);--ca-scrollbar-thumb-dragging-color: rgba(0, 0, 0, .5);position:relative;width:100%;height:100%;overscroll-behavior:none}.ca-scrollable-wrapper.light{--ca-scrollbar-thumb-color: rgba(255, 255, 255, .4);--ca-scrollbar-thumb-hover-color: rgba(255, 255, 255, .5);--ca-scrollbar-thumb-dragging-color: rgba(255, 255, 255, .5)}.ca-scrollable-container{width:100%;height:100%;overflow:auto;overscroll-behavior:none;-ms-overflow-style:none;scrollbar-width:none}.ca-scrollable-container::-webkit-scrollbar{display:none}.ca-scrollable-container:focus-visible{outline:none!important}.ca-scrollbar-track{position:absolute;z-index:1;display:flex;box-sizing:border-box;opacity:0;pointer-events:none;transition:opacity .1s ease-in-out}.ca-scrollbar-track.hidden .ca-scrollbar-thumb:before{pointer-events:none}.ca-scrollbar-track.horizontal{left:4px;right:4px;bottom:12px;height:14px;align-items:center}.ca-scrollbar-track.horizontal .ca-scrollbar-thumb{width:100%;height:2px}.ca-scrollbar-track.horizontal:hover .ca-scrollbar-thumb,.ca-scrollbar-track.horizontal .ca-scrollbar-thumb.dragging{height:6px;background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-track.vertical{top:4px;right:0;bottom:4px;width:12px;justify-content:center}.ca-scrollbar-track.vertical .ca-scrollbar-thumb{width:2px;height:100%}.ca-scrollbar-track.vertical:hover .ca-scrollbar-thumb,.ca-scrollbar-track.vertical .ca-scrollbar-thumb.dragging{width:6px;background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-thumb{position:relative;background-color:var(--ca-scrollbar-thumb-color);border-radius:2px;transition:background-color .1s ease-in-out,height .1s ease-in-out,width .1s ease-in-out}.ca-scrollbar-thumb:hover{background-color:var(--ca-scrollbar-thumb-hover-color)}.ca-scrollbar-thumb:before{content:\"\";position:absolute;inset:-6px -4px;pointer-events:auto}\n"] }]
+        }], propDecorators: { scrollContainer: [{
+                type: ViewChild,
+                args: ['scrollContainer']
+            }], horizontalTrack: [{
+                type: ViewChild,
+                args: ['horizontalTrack']
+            }], horizontalThumb: [{
+                type: ViewChild,
+                args: ['horizontalThumb']
+            }], verticalTrack: [{
+                type: ViewChild,
+                args: ['verticalTrack']
+            }], verticalThumb: [{
+                type: ViewChild,
+                args: ['verticalThumb']
+            }], isLight: [{
+                type: Input
+            }], hideHorizontalScrollbar: [{
+                type: Input
+            }], hideVerticalScrollbar: [{
+                type: Input
+            }] } });
+
 class DispatchDropdownHelper {
     /**
      * Calculate the max height for grouped options dropdown menu
@@ -10981,5 +11204,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AvatarComponent, CaiInputDatetimePickerComponent, CopyComponent, CounterComponent, DispatchDropdownComponent, DispatchLocationComponent, DropZoneComponent, DropdownTypes, INPUT_CHARACTER_SETS, InputAddressComponent, InputComponent, IntervalDropdownComponent, ListContactDropdownComponent, PmComponent, RatingReviewComponent, ReviewModalComponent, SelectedBusinessFieldComponent, StickyScrollbarComponent, TabOptionDropdownComponent, TextAreaComponent, eScrollState, ignoreWhenAutofilled, sizes };
+export { AvatarComponent, CaScrollableComponent, CaiInputDatetimePickerComponent, CopyComponent, CounterComponent, DispatchDropdownComponent, DispatchLocationComponent, DropZoneComponent, DropdownTypes, INPUT_CHARACTER_SETS, InputAddressComponent, InputComponent, IntervalDropdownComponent, ListContactDropdownComponent, PmComponent, RatingReviewComponent, ReviewModalComponent, SelectedBusinessFieldComponent, StickyScrollbarComponent, TabOptionDropdownComponent, TextAreaComponent, eScrollState, ignoreWhenAutofilled, sizes };
 //# sourceMappingURL=carriera-intern.mjs.map