import { CommonProps, Refable } from "@trackunit/react-components"; import { HTMLAttributes, ReactElement } from "react"; export interface LinkCellProps extends CommonProps, HTMLAttributes, Refable { /** * A id that can be used in tests to get the component */ "data-testid"?: string; /** * Custom classNames that will be merged with the default classNames. */ className?: string; /** * Type of link to render */ type: "LINK" | "PHONE" | "EMAIL"; /** * The link to render */ link: string; } /** * The `` component renders a clickable link in a table cell. * Supports URLs, phone numbers (tel:), and email addresses (mailto:). * Clicking the link opens it without triggering the table row click handler. * * ### When to use * - Display clickable URLs, emails, or phone numbers in table columns * - When users need to contact someone or visit an external link from table data * - For contact information columns (email, phone) * * ### When not to use * - For internal navigation - use `IdentityCell` with link prop instead * - For action buttons - use `ButtonCell` or `RowActions` instead * - For non-interactive text - use `TextCell` instead * * @example Basic usage with different link types * ```tsx * import { LinkCell } from "@trackunit/react-table-base-components"; * import { createColumnHelper } from "@tanstack/react-table"; * * const columnHelper = createColumnHelper(); * * const columns = [ * columnHelper.accessor("email", { * header: "Email", * cell: ({ getValue }) => ( * * ), * }), * columnHelper.accessor("phone", { * header: "Phone", * cell: ({ getValue }) => ( * * ), * }), * columnHelper.accessor("website", { * header: "Website", * cell: ({ getValue }) => ( * * ), * }), * ]; * ``` * @example Link type examples * ```tsx * import { LinkCell } from "@trackunit/react-table-base-components"; * * // Email - opens mail client * * * // Phone - opens phone dialer * * * // URL - opens in browser * * ``` * @param {LinkCellProps} props - The props for the LinkCell component * @returns {ReactElement} LinkCell component */ export declare const LinkCell: ({ link, type, className, ref, ...rest }: LinkCellProps) => ReactElement;