ng-fusion-ui/lib/table/pipes/highlight.d.ts

Angular data table library!

import { PipeTransform } from '@angular/core';
import * as i0 from "@angular/core";
/**
 * Highlights occurrences of a search term inside a string by wrapping matches
 * in a `<mark>` element.
 *
 * This pipe is primarily intended for use with table cells and search results.
 * It returns an HTML string and is typically used together with `[innerHTML]`.
 *
 * ## Parameters
 * - `value` – the text value to highlight
 * - `term` – the search term to highlight
 * - `active` (optional) – whether the match should be marked as the active match
 *
 * If `term` is empty or `value` is `null`/`undefined`, the original value is
 * returned as a string.
 *
 * Special characters in the search term are safely escaped.
 *
 * ## Usage
 * ```html
 * <span
 *   [innerHTML]="value | fuHighlight : searchTerm : isActive"
 * ></span>
 * ```
 *
 * ## Styling
 * The pipe adds the following CSS classes:
 * - `search-highlight` – applied to all matches
 * - `search-highlight active` – applied when `active` is `true`
 *
 * Example:
 * ```css
 * .search-highlight {
 *   background-color: var(--fu-search-highlight-bg);
 * }
 *
 * .search-highlight.active {
 *   background-color: var(--fu-search-highlight-active-bg);
 * }
 * ```
 *
 * ## Notes
 * - This pipe returns **HTML**, not plain text.
 * - Always bind using `[innerHTML]`.
 * - The pipe is stateless and does not manage search state internally.
 */
export declare class FuHighlightPipe implements PipeTransform {
    /**
     * Highlights occurrences of `term` in `value` by wrapping them in `<mark>`.
     *
     * @param value Text to transform
     * @param term Search term to highlight
     * @param active Whether the match is the active one
     * @returns HTML string with highlighted matches
     */
    transform(value: any, term: string, active?: boolean): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<FuHighlightPipe, never>;
    static ɵpipe: i0.ɵɵPipeDeclaration<FuHighlightPipe, "fuHighlight", true>;
}