/**
 * Auto layout utility, allows us to layout things vertically or horizontally with
 * proper gaping.
 *
 * The caller must ensure that the passed `items` are properly sanitized!
 *
 * @param props Function properties.
 * @param props.items Array of sanitized items to layout.
 * @param props.gap Gap between items.
 * @param props.direction Direction to layout items.
 * @param props.sizes Array of sizes for each item.
 * @returns Array of items with proper layout.
 */
declare const flexLayout: ({ items, gap, direction, sizes, }: {
    items: Array<string>;
    gap: number;
    direction?: "column" | "row";
    sizes?: Array<number>;
}) => Array<string>;
/**
 * Creates a node to display the primary programming language of the repository/gist.
 *
 * @param langName Language name.
 * @param langColor Language color.
 * @returns Language display SVG object.
 */
declare const createLanguageNode: (langName: string, langColor: string) => string;
/**
 * Create a node to indicate progress in percentage along a horizontal line.
 *
 * @param params Object that contains the createProgressNode parameters.
 * @param params.x X-axis position.
 * @param params.y Y-axis position.
 * @param params.width Width of progress bar.
 * @param params.color Optional foreground color as an inline fill fallback.
 *   When omitted, the color must be set via a `.lang-progress` CSS rule.
 * @param params.progress Progress value.
 * @param params.delay Delay before animation starts.
 * @returns Progress node.
 */
declare const createProgressNode: ({ x, y, width, color, progress, delay, }: {
    x: number;
    y: number;
    width: number;
    color?: string;
    progress: number;
    delay: number;
}) => string;
/**
 * Renders multi-line text via a `foreignObject` so the browser performs
 * native, font-aware wrapping. Content overflowing `lineCount` lines is
 * clipped (with an ellipsis on the last visible line) by CSS line-clamp.
 *
 * @param props Function properties.
 * @param props.text Text to render (will be HTML-encoded).
 * @param props.x X position of the foreignObject.
 * @param props.y Y position of the foreignObject.
 * @param props.width Width of the wrap box.
 * @param props.height Height of the wrap box.
 * @param props.lineCount Maximum number of lines to display.
 * @param props.className CSS class applied to the inner element.
 * @param props.testId Optional test id for the inner element.
 * @returns foreignObject SVG node.
 */
declare const wrappedTextNode: ({ text, x, y, width, height, lineCount, className, testId, }: {
    text: string;
    x: number;
    y: number;
    width: number;
    height: number;
    lineCount: number;
    className: string;
    testId?: string;
}) => string;
/**
 * CSS rules used to render multi-line text inside a `foreignObject`. Apply this
 * to a CSS class (e.g. `.description`) shared with `wrappedTextNode` so the
 * browser handles wrapping and the line count is taken from the `--lines`
 * custom property set on the element.
 *
 * @param color Text color (CSS `color` property).
 * @returns CSS rules block (without the surrounding selector).
 */
declare const wrappedTextStyles: (color: string) => string;
/**
 * Creates an icon with label to display repository/gist stats like forks, stars, etc.
 *
 * The caller must ensure that the passed `icon` is properly sanitized!
 *
 * @param icon The sanitized icon to display.
 * @param label The label to display.
 * @param testid The testid to assign to the label.
 * @param iconSize The size of the icon.
 * @returns Icon with label SVG object.
 */
declare const iconWithLabel: (icon: string, label: number | string, testid: string, iconSize: number) => string;
/**
 * Create a labelled stat text item
 * (a label and its value, optionally with an icon and link).
 * Shared by the stats and repo cards.
 *
 * The caller must ensure that the passed `icon` and `link` are properly sanitized!
 *
 * @param params Object that contains the createTextNode parameters.
 * @param params.icon The sanitized icon to display.
 * @param params.label The label to display.
 * @param params.value The value to display.
 * @param params.id The id of the stat.
 * @param params.unitSymbol The unit symbol of the stat.
 * @param params.index The index of the stat.
 * @param params.showIcons Whether to show icons.
 * @param params.shiftValuePos Number of pixels the value has to be shifted to the right.
 * @param params.bold Whether to bold the label.
 * @param params.numberFormat The format of numbers on card.
 * @param params.numberPrecision The precision of numbers on card.
 * @param params.link Sanitized url to link to.
 * @param params.labelXOffset horizontal offset for label.
 * @returns The stats card text item SVG object.
 */
declare const createTextNode: ({ icon, label, value, id, unitSymbol, index, showIcons, shiftValuePos, bold, numberFormat, numberPrecision, link, labelXOffset, }: {
    icon: string;
    label: string;
    value: number | string;
    id: string;
    unitSymbol?: string | undefined;
    index: number;
    showIcons: boolean;
    shiftValuePos: number;
    bold: boolean;
    numberFormat: string;
    numberPrecision?: number | undefined;
    link?: string | undefined;
    labelXOffset?: number;
}) => string;
/**
 * Renders error message on the card.
 *
 * @param args Function arguments.
 * @param args.message Main error message.
 * @param args.secondaryMessage The secondary error message.
 * @param args.renderOptions Render options.
 * @param args.renderOptions.title_color Card title color.
 * @param args.renderOptions.text_color Card text color.
 * @param args.renderOptions.bg_color Card background color.
 * @param args.renderOptions.border_color Card border color.
 * @param args.renderOptions.theme Card theme.
 * @param args.renderOptions.show_repo_link Whether to show repo link or not.
 * @returns The SVG markup.
 */
declare const renderError: ({ message, secondaryMessage, renderOptions, }: {
    message: string;
    secondaryMessage?: string | undefined;
    renderOptions?: {
        title_color?: string | undefined;
        text_color?: string | undefined;
        bg_color?: string | undefined;
        border_color?: string | undefined;
        theme?: string | undefined;
        show_repo_link?: boolean | undefined;
    };
}) => string;
/**
 * Retrieve text length based on Segoe UI font.
 *
 * @see https://stackoverflow.com/a/48172630/10629172
 * @param str String to measure.
 * @param fontSize Font size.
 * @returns Text length.
 */
declare const measureText: (str: string, fontSize?: number) => number;
/**
 * Split text into the lines it would wrap to when laid out greedily at the
 * given font size inside a box of width `maxWidth`. Uses `measureText` so the
 * estimate reflects actual font metrics rather than a fixed character count.
 * The browser still does the real wrap inside the foreignObject; this is only
 * used to size the SVG.
 *
 * @param text Text to split.
 * @param fontSize Font size in px (matches `measureText`).
 * @param maxWidth Available wrap width in px.
 * @returns Estimated wrapped lines.
 */
declare const splitWrappedText: (text: string, fontSize: number, maxWidth: number) => Array<string>;
/**
 * Estimate how many lines a string will wrap to when laid out greedily at the
 * given font size inside a box of width `maxWidth`, capped at `maxLines`.
 *
 * @param text Text to estimate.
 * @param fontSize Font size in px (matches `measureText`).
 * @param maxWidth Available wrap width in px.
 * @param maxLines Cap on the returned line count.
 * @returns Estimated line count, at least 1, at most `maxLines`.
 */
declare const countWrappedLines: (text: string, fontSize: number, maxWidth: number, maxLines: number) => number;
export { renderError, createLanguageNode, createProgressNode, createTextNode, iconWithLabel, flexLayout, measureText, splitWrappedText, countWrappedLines, wrappedTextNode, wrappedTextStyles, };
//# sourceMappingURL=render.d.ts.map