UNPKG

@taiga-ui/kit

Version:
90 lines 12.2 kB
import { __decorate, __param } from "tslib"; import { DOCUMENT } from '@angular/common'; import { Directive, ElementRef, Inject, Input, OnChanges, Renderer2 } from '@angular/core'; import { px, svgNodeFilter, tuiDefaultProp, TuiDestroyService, TuiResizeService, } from '@taiga-ui/cdk'; import { Observable } from 'rxjs'; // @dynamic let TuiHighlightDirective = class TuiHighlightDirective { constructor(documentRef, elementRef, renderer, resize$) { this.documentRef = documentRef; this.elementRef = elementRef; this.renderer = renderer; this.tuiHighlight = ''; this.highlight = this.setUpHighlight(); this.treeWalker = this.documentRef.createTreeWalker(this.elementRef.nativeElement, NodeFilter.SHOW_TEXT, svgNodeFilter, false); resize$.subscribe(() => { this.updateStyles(); }); } get match() { return this.indexOf(this.elementRef.nativeElement.textContent) !== -1; } ngOnChanges() { this.updateStyles(); } updateStyles() { this.highlight.style.display = 'none'; if (!this.match) { return; } this.treeWalker.currentNode = this.elementRef.nativeElement; do { const index = this.indexOf(this.treeWalker.currentNode.nodeValue); if (index === -1) { continue; } const range = this.documentRef.createRange(); range.setStart(this.treeWalker.currentNode, index); range.setEnd(this.treeWalker.currentNode, index + this.tuiHighlight.length); const hostRect = this.elementRef.nativeElement.getBoundingClientRect(); const { left, top, width, height } = range.getBoundingClientRect(); const { style } = this.highlight; style.left = px(left - hostRect.left); style.top = px(top - hostRect.top); style.width = px(width); style.height = px(height); style.display = 'block'; return; } while (this.treeWalker.nextNode()); } indexOf(source) { return !source || !this.tuiHighlight ? -1 : source.toLowerCase().indexOf(this.tuiHighlight.toLowerCase()); } setUpHighlight() { const highlight = this.renderer.createElement('div'); const { style } = highlight; style.background = 'var(--tui-selection)'; style.zIndex = '-1'; style.position = 'absolute'; this.renderer.appendChild(this.elementRef.nativeElement, highlight); return highlight; } }; TuiHighlightDirective.ctorParameters = () => [ { type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] }, { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] }, { type: Renderer2, decorators: [{ type: Inject, args: [Renderer2,] }] }, { type: Observable, decorators: [{ type: Inject, args: [TuiResizeService,] }] } ]; __decorate([ Input(), tuiDefaultProp() ], TuiHighlightDirective.prototype, "tuiHighlight", void 0); TuiHighlightDirective = __decorate([ Directive({ selector: '[tuiHighlight]', host: { '[style.position]': '"relative"', '[style.zIndex]': '0', }, providers: [TuiDestroyService, TuiResizeService], }), __param(0, Inject(DOCUMENT)), __param(1, Inject(ElementRef)), __param(2, Inject(Renderer2)), __param(3, Inject(TuiResizeService)) ], TuiHighlightDirective); export { TuiHighlightDirective }; //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGlnaGxpZ2h0LmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B0YWlnYS11aS9raXQvZGlyZWN0aXZlcy9oaWdobGlnaHQvIiwic291cmNlcyI6WyJoaWdobGlnaHQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUMsUUFBUSxFQUFDLE1BQU0saUJBQWlCLENBQUM7QUFDekMsT0FBTyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ3pGLE9BQU8sRUFDSCxFQUFFLEVBQ0YsYUFBYSxFQUNiLGNBQWMsRUFDZCxpQkFBaUIsRUFDakIsZ0JBQWdCLEdBQ25CLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSxNQUFNLENBQUM7QUFFaEMsV0FBVztBQVNYLElBQWEscUJBQXFCLEdBQWxDLE1BQWEscUJBQXFCO0lBYzlCLFlBQ3VDLFdBQXFCLEVBQ25CLFVBQW1DLEVBQ3BDLFFBQW1CLEVBQzdCLE9BQTRCO1FBSG5CLGdCQUFXLEdBQVgsV0FBVyxDQUFVO1FBQ25CLGVBQVUsR0FBVixVQUFVLENBQXlCO1FBQ3BDLGFBQVEsR0FBUixRQUFRLENBQVc7UUFkM0QsaUJBQVksR0FBRyxFQUFFLENBQUM7UUFFRCxjQUFTLEdBQWdCLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUUvQyxlQUFVLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxnQkFBZ0IsQ0FDM0QsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQzdCLFVBQVUsQ0FBQyxTQUFTLEVBQ3BCLGFBQWEsRUFDYixLQUFLLENBQ1IsQ0FBQztRQVFFLE9BQU8sQ0FBQyxTQUFTLENBQUMsR0FBRyxFQUFFO1lBQ25CLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztRQUN4QixDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFRCxJQUFJLEtBQUs7UUFDTCxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsV0FBVyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7SUFDMUUsQ0FBQztJQUVELFdBQVc7UUFDUCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDeEIsQ0FBQztJQUVPLFlBQVk7UUFDaEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsT0FBTyxHQUFHLE1BQU0sQ0FBQztRQUV0QyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNiLE9BQU87U0FDVjtRQUVELElBQUksQ0FBQyxVQUFVLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDO1FBRTVELEdBQUc7WUFDQyxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsV0FBVyxDQUFDLFNBQVMsQ0FBQyxDQUFDO1lBRWxFLElBQUksS0FBSyxLQUFLLENBQUMsQ0FBQyxFQUFFO2dCQUNkLFNBQVM7YUFDWjtZQUVELE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsV0FBVyxFQUFFLENBQUM7WUFFN0MsS0FBSyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLFdBQVcsRUFBRSxLQUFLLENBQUMsQ0FBQztZQUNuRCxLQUFLLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsV0FBVyxFQUFFLEtBQUssR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1lBRTVFLE1BQU0sUUFBUSxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLHFCQUFxQixFQUFFLENBQUM7WUFDdkUsTUFBTSxFQUFDLElBQUksRUFBRSxHQUFHLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBQyxHQUFHLEtBQUssQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO1lBQ2pFLE1BQU0sRUFBQyxLQUFLLEVBQUMsR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDO1lBRS9CLEtBQUssQ0FBQyxJQUFJLEdBQUcsRUFBRSxDQUFDLElBQUksR0FBRyxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDdEMsS0FBSyxDQUFDLEdBQUcsR0FBRyxFQUFFLENBQUMsR0FBRyxHQUFHLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUNuQyxLQUFLLENBQUMsS0FBSyxHQUFHLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN4QixLQUFLLENBQUMsTUFBTSxHQUFHLEVBQUUsQ0FBQyxNQUFNLENBQUMsQ0FBQztZQUMxQixLQUFLLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQztZQUV4QixPQUFPO1NBQ1YsUUFBUSxJQUFJLENBQUMsVUFBVSxDQUFDLFFBQVEsRUFBRSxFQUFFO0lBQ3pDLENBQUM7SUFFTyxPQUFPLENBQUMsTUFBcUI7UUFDakMsT0FBTyxDQUFDLE1BQU0sSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZO1lBQ2hDLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDSixDQUFDLENBQUMsTUFBTSxDQUFDLFdBQVcsRUFBRSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQUM7SUFDeEUsQ0FBQztJQUVPLGNBQWM7UUFDbEIsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDckQsTUFBTSxFQUFDLEtBQUssRUFBQyxHQUFHLFNBQVMsQ0FBQztRQUUxQixLQUFLLENBQUMsVUFBVSxHQUFHLHNCQUFzQixDQUFDO1FBQzFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLEtBQUssQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDO1FBQzVCLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBRXBFLE9BQU8sU0FBUyxDQUFDO0lBQ3JCLENBQUM7Q0FDSixDQUFBOztZQXRFdUQsUUFBUSx1QkFBdkQsTUFBTSxTQUFDLFFBQVE7WUFDaUMsVUFBVSx1QkFBMUQsTUFBTSxTQUFDLFVBQVU7WUFDNEIsU0FBUyx1QkFBdEQsTUFBTSxTQUFDLFNBQVM7WUFDa0IsVUFBVSx1QkFBNUMsTUFBTSxTQUFDLGdCQUFnQjs7QUFmNUI7SUFGQyxLQUFLLEVBQUU7SUFDUCxjQUFjLEVBQUU7MkRBQ0M7QUFIVCxxQkFBcUI7SUFSakMsU0FBUyxDQUFDO1FBQ1AsUUFBUSxFQUFFLGdCQUFnQjtRQUMxQixJQUFJLEVBQUU7WUFDRixrQkFBa0IsRUFBRSxZQUFZO1lBQ2hDLGdCQUFnQixFQUFFLEdBQUc7U0FDeEI7UUFDRCxTQUFTLEVBQUUsQ0FBQyxpQkFBaUIsRUFBRSxnQkFBZ0IsQ0FBQztLQUNuRCxDQUFDO0lBZ0JPLFdBQUEsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFBO0lBQ2hCLFdBQUEsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFBO0lBQ2xCLFdBQUEsTUFBTSxDQUFDLFNBQVMsQ0FBQyxDQUFBO0lBQ2pCLFdBQUEsTUFBTSxDQUFDLGdCQUFnQixDQUFDLENBQUE7R0FsQnBCLHFCQUFxQixDQXFGakM7U0FyRlkscUJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtET0NVTUVOVH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7RGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbmplY3QsIElucHV0LCBPbkNoYW5nZXMsIFJlbmRlcmVyMn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1xuICAgIHB4LFxuICAgIHN2Z05vZGVGaWx0ZXIsXG4gICAgdHVpRGVmYXVsdFByb3AsXG4gICAgVHVpRGVzdHJveVNlcnZpY2UsXG4gICAgVHVpUmVzaXplU2VydmljZSxcbn0gZnJvbSAnQHRhaWdhLXVpL2Nkayc7XG5pbXBvcnQge09ic2VydmFibGV9IGZyb20gJ3J4anMnO1xuXG4vLyBAZHluYW1pY1xuQERpcmVjdGl2ZSh7XG4gICAgc2VsZWN0b3I6ICdbdHVpSGlnaGxpZ2h0XScsXG4gICAgaG9zdDoge1xuICAgICAgICAnW3N0eWxlLnBvc2l0aW9uXSc6ICdcInJlbGF0aXZlXCInLFxuICAgICAgICAnW3N0eWxlLnpJbmRleF0nOiAnMCcsXG4gICAgfSxcbiAgICBwcm92aWRlcnM6IFtUdWlEZXN0cm95U2VydmljZSwgVHVpUmVzaXplU2VydmljZV0sXG59KVxuZXhwb3J0IGNsYXNzIFR1aUhpZ2hsaWdodERpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gICAgQElucHV0KClcbiAgICBAdHVpRGVmYXVsdFByb3AoKVxuICAgIHR1aUhpZ2hsaWdodCA9ICcnO1xuXG4gICAgcHJpdmF0ZSByZWFkb25seSBoaWdobGlnaHQ6IEhUTUxFbGVtZW50ID0gdGhpcy5zZXRVcEhpZ2hsaWdodCgpO1xuXG4gICAgcHJpdmF0ZSByZWFkb25seSB0cmVlV2Fsa2VyID0gdGhpcy5kb2N1bWVudFJlZi5jcmVhdGVUcmVlV2Fsa2VyKFxuICAgICAgICB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudCxcbiAgICAgICAgTm9kZUZpbHRlci5TSE9XX1RFWFQsXG4gICAgICAgIHN2Z05vZGVGaWx0ZXIsXG4gICAgICAgIGZhbHNlLFxuICAgICk7XG5cbiAgICBjb25zdHJ1Y3RvcihcbiAgICAgICAgQEluamVjdChET0NVTUVOVCkgcHJpdmF0ZSByZWFkb25seSBkb2N1bWVudFJlZjogRG9jdW1lbnQsXG4gICAgICAgIEBJbmplY3QoRWxlbWVudFJlZikgcHJpdmF0ZSByZWFkb25seSBlbGVtZW50UmVmOiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PixcbiAgICAgICAgQEluamVjdChSZW5kZXJlcjIpIHByaXZhdGUgcmVhZG9ubHkgcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICAgICAgQEluamVjdChUdWlSZXNpemVTZXJ2aWNlKSByZXNpemUkOiBPYnNlcnZhYmxlPHVua25vd24+LFxuICAgICkge1xuICAgICAgICByZXNpemUkLnN1YnNjcmliZSgoKSA9PiB7XG4gICAgICAgICAgICB0aGlzLnVwZGF0ZVN0eWxlcygpO1xuICAgICAgICB9KTtcbiAgICB9XG5cbiAgICBnZXQgbWF0Y2goKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiB0aGlzLmluZGV4T2YodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQudGV4dENvbnRlbnQpICE9PSAtMTtcbiAgICB9XG5cbiAgICBuZ09uQ2hhbmdlcygpIHtcbiAgICAgICAgdGhpcy51cGRhdGVTdHlsZXMoKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIHVwZGF0ZVN0eWxlcygpIHtcbiAgICAgICAgdGhpcy5oaWdobGlnaHQuc3R5bGUuZGlzcGxheSA9ICdub25lJztcblxuICAgICAgICBpZiAoIXRoaXMubWF0Y2gpIHtcbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfVxuXG4gICAgICAgIHRoaXMudHJlZVdhbGtlci5jdXJyZW50Tm9kZSA9IHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50O1xuXG4gICAgICAgIGRvIHtcbiAgICAgICAgICAgIGNvbnN0IGluZGV4ID0gdGhpcy5pbmRleE9mKHRoaXMudHJlZVdhbGtlci5jdXJyZW50Tm9kZS5ub2RlVmFsdWUpO1xuXG4gICAgICAgICAgICBpZiAoaW5kZXggPT09IC0xKSB7XG4gICAgICAgICAgICAgICAgY29udGludWU7XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIGNvbnN0IHJhbmdlID0gdGhpcy5kb2N1bWVudFJlZi5jcmVhdGVSYW5nZSgpO1xuXG4gICAgICAgICAgICByYW5nZS5zZXRTdGFydCh0aGlzLnRyZWVXYWxrZXIuY3VycmVudE5vZGUsIGluZGV4KTtcbiAgICAgICAgICAgIHJhbmdlLnNldEVuZCh0aGlzLnRyZWVXYWxrZXIuY3VycmVudE5vZGUsIGluZGV4ICsgdGhpcy50dWlIaWdobGlnaHQubGVuZ3RoKTtcblxuICAgICAgICAgICAgY29uc3QgaG9zdFJlY3QgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICAgICAgICAgIGNvbnN0IHtsZWZ0LCB0b3AsIHdpZHRoLCBoZWlnaHR9ID0gcmFuZ2UuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gICAgICAgICAgICBjb25zdCB7c3R5bGV9ID0gdGhpcy5oaWdobGlnaHQ7XG5cbiAgICAgICAgICAgIHN0eWxlLmxlZnQgPSBweChsZWZ0IC0gaG9zdFJlY3QubGVmdCk7XG4gICAgICAgICAgICBzdHlsZS50b3AgPSBweCh0b3AgLSBob3N0UmVjdC50b3ApO1xuICAgICAgICAgICAgc3R5bGUud2lkdGggPSBweCh3aWR0aCk7XG4gICAgICAgICAgICBzdHlsZS5oZWlnaHQgPSBweChoZWlnaHQpO1xuICAgICAgICAgICAgc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XG5cbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfSB3aGlsZSAodGhpcy50cmVlV2Fsa2VyLm5leHROb2RlKCkpO1xuICAgIH1cblxuICAgIHByaXZhdGUgaW5kZXhPZihzb3VyY2U6IHN0cmluZyB8IG51bGwpOiBudW1iZXIge1xuICAgICAgICByZXR1cm4gIXNvdXJjZSB8fCAhdGhpcy50dWlIaWdobGlnaHRcbiAgICAgICAgICAgID8gLTFcbiAgICAgICAgICAgIDogc291cmNlLnRvTG93ZXJDYXNlKCkuaW5kZXhPZih0aGlzLnR1aUhpZ2hsaWdodC50b0xvd2VyQ2FzZSgpKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIHNldFVwSGlnaGxpZ2h0KCk6IEhUTUxFbGVtZW50IHtcbiAgICAgICAgY29uc3QgaGlnaGxpZ2h0ID0gdGhpcy5yZW5kZXJlci5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgICAgICAgY29uc3Qge3N0eWxlfSA9IGhpZ2hsaWdodDtcblxuICAgICAgICBzdHlsZS5iYWNrZ3JvdW5kID0gJ3ZhcigtLXR1aS1zZWxlY3Rpb24pJztcbiAgICAgICAgc3R5bGUuekluZGV4ID0gJy0xJztcbiAgICAgICAgc3R5bGUucG9zaXRpb24gPSAnYWJzb2x1dGUnO1xuICAgICAgICB0aGlzLnJlbmRlcmVyLmFwcGVuZENoaWxkKHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCBoaWdobGlnaHQpO1xuXG4gICAgICAgIHJldHVybiBoaWdobGlnaHQ7XG4gICAgfVxufVxuIl19