UNPKG

m-truncate

Version:

`mTruncate` is a **lightweight, flexible, and fully standalone Angular directive** that truncates text dynamically and optionally displays a **tooltip** with the full text. It supports **character-based**, **line-based**, and **width-based** truncation

62 lines (61 loc) 3.06 kB
import { ElementRef, AfterViewInit, Renderer2, SimpleChanges } from '@angular/core'; import { MTruncateService } from './m-truncate.service'; import * as i0 from "@angular/core"; export declare class MTruncateDirective implements AfterViewInit { private el; private renderer; private mTruncateService; /** Whether to show tooltip on truncated text hover */ showTooltip: boolean; /** Number of lines to truncate the text to */ truncateLines: number; /** Maximum width for truncation */ maxTruncateWidth: number; /** Maximum width for tooltip */ maxTooltipWidth: number; /** Background color of the tooltip */ bgColor: string; /** Text color of the tooltip */ color: string; /** Tooltip position (top, bottom, left, right) */ tooltipPosition: string; /** Text direction (LTR, RTL) */ tooltipDirection: string; /** Suffix to append when text is truncated */ truncateSuffix: string; /** ID for the tooltip element */ id: string; /** Maximum number of characters before truncation */ truncateChar: number; /** Whether to resize the truncated on resize */ resize: Boolean; /** to detect that the text when change */ textChange: string; element: HTMLElement; private fullText; private tooltip; private tooltipArrow; private destroy$; constructor(el: ElementRef, renderer: Renderer2, mTruncateService: MTruncateService); ngAfterViewInit(): void; ngOnChanges(changes: SimpleChanges): void; truncateMethod(): void; private truncateByChar; private applyTruncate; private applyRowsTruncate; getTooltipDirection(dir: string): void; onResize(): void; private createTooltip; private removeTooltip; private positionTooltip; arrowPositionDown(): void; arrowPositionUp(): void; arrowPositionRight(): void; arrowPositionLeft(): void; private addKeyframes; handleMouseOver(event: Event): void; handleMouseOut(event?: Event): void; ngOnDestroy(): void; static ɵfac: i0.ɵɵFactoryDeclaration<MTruncateDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<MTruncateDirective, "[mTruncate]", never, { "showTooltip": { "alias": "showTooltip"; "required": false; }; "truncateLines": { "alias": "truncateLines"; "required": false; }; "maxTruncateWidth": { "alias": "maxTruncateWidth"; "required": false; }; "maxTooltipWidth": { "alias": "maxTooltipWidth"; "required": false; }; "bgColor": { "alias": "bgColor"; "required": false; }; "color": { "alias": "color"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "tooltipDirection": { "alias": "tooltipDirection"; "required": false; }; "truncateSuffix": { "alias": "truncateSuffix"; "required": false; }; "id": { "alias": "id"; "required": false; }; "truncateChar": { "alias": "truncateChar"; "required": false; }; "resize": { "alias": "resize"; "required": false; }; "textChange": { "alias": "textChange"; "required": false; }; }, {}, never, never, true, never>; }