@primer/react-brand/lib/ComparisonTable/ComparisonTable.d.ts

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

import React, { PropsWithChildren } from 'react';
import type { BaseProps } from '../component-helpers';
/**
 * Design tokens
 */
import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes.css';
import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/comparison-table/comparison-table.css';
export type ComparisonTableProps<C extends React.ElementType> = BaseProps<C> & {
    as?: C;
    heading?: string;
    variant?: 'default' | 'minimal';
    featuredColumn?: number;
} & React.ComponentPropsWithoutRef<C>;
export declare const _ComparisonTable: React.ForwardRefExoticComponent<Omit<ComparisonTableProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLDivElement>>;
type RowProps = {
    header?: boolean;
};
export type CellProps = BaseProps<HTMLTableCellElement> & {
    as?: 'td' | 'th';
};
export type FootnoteProps = BaseProps<HTMLParagraphElement>;
/**
 * @description
 *  Comparison tables are used to aid decision-making by displaying a list of features and their associated qualities side-by-side.
 *  They are useful for comparing products, plans, or features in marketing pages.
 * @see https://primer.style/brand/components/ComparisonTable
 */
export declare const ComparisonTable: React.ForwardRefExoticComponent<Omit<ComparisonTableProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
    Row: ({ children, ...rest }: PropsWithChildren<RowProps>) => import("react/jsx-runtime").JSX.Element;
    Cell: ({ as, children, ...props }: PropsWithChildren<CellProps>) => import("react/jsx-runtime").JSX.Element;
    Footnote: ({ children, ...props }: PropsWithChildren<FootnoteProps>) => import("react/jsx-runtime").JSX.Element;
};
export {};