@one-grid-core/angular 0.1.0-beta.5

package/esm2022/lib/core/directives/one-cell-text-expand.directive.mjs

@@ -0,0 +1,82 @@
+import { Directive, HostListener } from '@angular/core';
+import * as i0 from "@angular/core";
+export class OneCellTextExpandDirective {
+    constructor(cell, renderer) {
+        this.cell = cell;
+        this.renderer = renderer;
+        this.overflowing = false;
+        this.lastText = null;
+    }
+    ngAfterViewInit() {
+        this.checkOverflow();
+        this.lastText = this.cell.nativeElement.textContent;
+    }
+    ngAfterViewChecked() {
+        const currentText = this.cell.nativeElement.textContent;
+        if (this.lastText !== currentText) {
+            this.lastText = currentText;
+            this.checkOverflow();
+            this.collapse();
+        }
+    }
+    ngOnDestroy() {
+        clearTimeout(this.timer);
+        this.collapse();
+    }
+    checkOverflow() {
+        const cell = this.cell.nativeElement;
+        this.overflowing = cell.scrollWidth > cell.clientWidth;
+    }
+    onResize() {
+        this.checkOverflow();
+    }
+    onMouseEnter() {
+        if (!this.overflowing)
+            return;
+        this.timer = setTimeout(() => this.expand(), 800);
+    }
+    onMouseLeave() {
+        clearTimeout(this.timer);
+        this.collapse();
+    }
+    expand() {
+        const cell = this.cell.nativeElement;
+        this.renderer.setStyle(cell, 'overflow', 'visible');
+        this.renderer.setStyle(cell, 'text-overflow', 'unset');
+        this.renderer.setStyle(cell, 'z-index', '1000');
+        this.renderer.setStyle(cell, 'background', 'var(--ins-card-bg)');
+        this.renderer.setStyle(cell, 'white-space', 'nowrap');
+        this.renderer.setStyle(cell, 'transition', 'width 0.3s ease');
+        this.renderer.setStyle(cell, 'padding', '4px 8px');
+        this.renderer.setStyle(cell, 'border-radius', '4px');
+    }
+    collapse() {
+        const cell = this.cell.nativeElement;
+        this.renderer.setStyle(cell, 'white-space', 'nowrap');
+        this.renderer.setStyle(cell, 'overflow', 'hidden');
+        this.renderer.setStyle(cell, 'text-overflow', 'ellipsis');
+        this.renderer.removeStyle(cell, 'z-index');
+        this.renderer.removeStyle(cell, 'background');
+        this.renderer.removeStyle(cell, 'padding');
+        this.renderer.removeStyle(cell, 'border-radius');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OneCellTextExpandDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: OneCellTextExpandDirective, selector: "[oneCellTextExpand]", host: { listeners: { "window:resize": "onResize()", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OneCellTextExpandDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: false,
+                    selector: '[oneCellTextExpand]'
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { onResize: [{
+                type: HostListener,
+                args: ['window:resize']
+            }], onMouseEnter: [{
+                type: HostListener,
+                args: ['mouseenter']
+            }], onMouseLeave: [{
+                type: HostListener,
+                args: ['mouseleave']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib25lLWNlbGwtdGV4dC1leHBhbmQuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvb25lLWdyaWQvc3JjL2xpYi9jb3JlL2RpcmVjdGl2ZXMvb25lLWNlbGwtdGV4dC1leHBhbmQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBbUMsU0FBUyxFQUFjLFlBQVksRUFBd0IsTUFBTSxlQUFlLENBQUM7O0FBTTNILE1BQU0sT0FBTywwQkFBMEI7SUFNckMsWUFBb0IsSUFBNkIsRUFBVSxRQUFtQjtRQUExRCxTQUFJLEdBQUosSUFBSSxDQUF5QjtRQUFVLGFBQVEsR0FBUixRQUFRLENBQVc7UUFKdEUsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFFcEIsYUFBUSxHQUFrQixJQUFJLENBQUM7SUFFMEMsQ0FBQztJQUVsRixlQUFlO1FBRWIsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1FBRXJCLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsV0FBVyxDQUFDO0lBQ3RELENBQUM7SUFFRCxrQkFBa0I7UUFFaEIsTUFBTSxXQUFXLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsV0FBVyxDQUFDO1FBRXhELElBQUksSUFBSSxDQUFDLFFBQVEsS0FBSyxXQUFXLEVBQUUsQ0FBQztZQUVsQyxJQUFJLENBQUMsUUFBUSxHQUFHLFdBQVcsQ0FBQztZQUU1QixJQUFJLENBQUMsYUFBYSxFQUFFLENBQUM7WUFFckIsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBQ2xCLENBQUM7SUFDSCxDQUFDO0lBRUQsV0FBVztRQUVULFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFekIsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDO0lBQ2xCLENBQUM7SUFFTyxhQUFhO1FBRW5CLE1BQU0sSUFBSSxH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c0NvbnRlbnQiOlsiaW1wb3J0IHsgQWZ0ZXJWaWV3Q2hlY2tlZCwgQWZ0ZXJWaWV3SW5pdCwgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBIb3N0TGlzdGVuZXIsIE9uRGVzdHJveSwgUmVuZGVyZXIyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzdGFuZGFsb25lOiBmYWxzZSxcbiAgc2VsZWN0b3I6ICdbb25lQ2VsbFRleHRFeHBhbmRdJ1xufSlcbmV4cG9ydCBjbGFzcyBPbmVDZWxsVGV4dEV4cGFuZERpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIEFmdGVyVmlld0NoZWNrZWQsIE9uRGVzdHJveSB7XG5cbiAgcHJpdmF0ZSBvdmVyZmxvd2luZyA9IGZhbHNlO1xuICBwcml2YXRlIHRpbWVyOiBhbnk7XG4gIHByaXZhdGUgbGFzdFRleHQ6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgY2VsbDogRWxlbWVudFJlZjxIVE1MRWxlbWVudD4sIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMikge31cblxuICBuZ0FmdGVyVmlld0luaXQoKSB7XG5cbiAgICB0aGlzLmNoZWNrT3ZlcmZsb3coKTtcblxuICAgIHRoaXMubGFzdFRleHQgPSB0aGlzLmNlbGwubmF0aXZlRWxlbWVudC50ZXh0Q29udGVudDtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3Q2hlY2tlZCgpIHtcblxuICAgIGNvbnN0IGN1cnJlbnRUZXh0ID0gdGhpcy5jZWxsLm5hdGl2ZUVsZW1lbnQudGV4dENvbnRlbnQ7XG5cbiAgICBpZiAodGhpcy5sYXN0VGV4dCAhPT0gY3VycmVudFRleHQpIHtcblxuICAgICAgdGhpcy5sYXN0VGV4dCA9IGN1cnJlbnRUZXh0O1xuXG4gICAgICB0aGlzLmNoZWNrT3ZlcmZsb3coKTtcblxuICAgICAgdGhpcy5jb2xsYXBzZSgpO1xuICAgIH1cbiAgfVxuXG4gIG5nT25EZXN0cm95KCkge1xuXG4gICAgY2xlYXJUaW1lb3V0KHRoaXMudGltZXIpO1xuXG4gICAgdGhpcy5jb2xsYXBzZSgpO1xuICB9XG5cbiAgcHJpdmF0ZSBjaGVja092ZXJmbG93KCkge1xuXG4gICAgY29uc3QgY2VsbCA9IHRoaXMuY2VsbC5uYXRpdmVFbGVtZW50O1xuXG4gICAgdGhpcy5vdmVyZmxvd2luZyA9IGNlbGwuc2Nyb2xsV2lkdGggPiBjZWxsLmNsaWVudFdpZHRoO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignd2luZG93OnJlc2l6ZScpXG4gIG9uUmVzaXplKCkge1xuXG4gICAgdGhpcy5jaGVja092ZXJmbG93KCk7XG4gIH1cblxuICBASG9zdExpc3RlbmVyKCdtb3VzZWVudGVyJylcbiAgb25Nb3VzZUVudGVyKCkge1xuXG4gICAgaWYgKCF0aGlzLm92ZXJmbG93aW5nKSByZXR1cm47XG5cbiAgICB0aGlzLnRpbWVyID0gc2V0VGltZW91dCgoKSA9PiB0aGlzLmV4cGFuZCgpLCA4MDApO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignbW91c2VsZWF2ZScpXG4gIG9uTW91c2VMZWF2ZSgpIHtcblxuICAgIGNsZWFyVGltZW91dCh0aGlzLnRpbWVyKTtcblxuICAgIHRoaXMuY29sbGFwc2UoKTtcbiAgfVxuXG4gIHByaXZhdGUgZXhwYW5kKCkge1xuXG4gICAgY29uc3QgY2VsbCA9IHRoaXMuY2VsbC5uYXRpdmVFbGVtZW50O1xuXG4gICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZShjZWxsLCAnb3ZlcmZsb3cnLCAndmlzaWJsZScpO1xuICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUoY2VsbCwgJ3RleHQtb3ZlcmZsb3cnLCAndW5zZXQnKTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKGNlbGwsICd6LWluZGV4JywgJzEwMDAnKTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKGNlbGwsICdiYWNrZ3JvdW5kJywgJ3ZhcigtLWlucy1jYXJkLWJnKScpO1xuICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUoY2VsbCwgJ3doaXRlLXNwYWNlJywgJ25vd3JhcCcpO1xuICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUoY2VsbCwgJ3RyYW5zaXRpb24nLCAnd2lkdGggMC4zcyBlYXNlJyk7XG4gICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZShjZWxsLCAncGFkZGluZycsICc0cHggOHB4Jyk7XG4gICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZShjZWxsLCAnYm9yZGVyLXJhZGl1cycsICc0cHgnKTtcbiAgfVxuXG4gIHByaXZhdGUgY29sbGFwc2UoKSB7XG5cbiAgICBjb25zdCBjZWxsID0gdGhpcy5jZWxsLm5hdGl2ZUVsZW1lbnQ7XG5cbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKGNlbGwsICd3aGl0ZS1zcGFjZScsICdub3dyYXAnKTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKGNlbGwsICdvdmVyZmxvdycsICdoaWRkZW4nKTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKGNlbGwsICd0ZXh0LW92ZXJmbG93JywgJ2VsbGlwc2lzJyk7XG4gICAgdGhpcy5yZW5kZXJlci5yZW1vdmVTdHlsZShjZWxsLCAnei1pbmRleCcpO1xuICAgIHRoaXMucmVuZGVyZXIucmVtb3ZlU3R5bGUoY2VsbCwgJ2JhY2tncm91bmQnKTtcbiAgICB0aGlzLnJlbmRlcmVyLnJlbW92ZVN0eWxlKGNlbGwsICdwYWRkaW5nJyk7XG4gICAgdGhpcy5yZW5kZXJlci5yZW1vdmVTdHlsZShjZWxsLCAnYm9yZGVyLXJhZGl1cycpO1xuICB9XG59XG4iXX0=