import type { CategoricalIndex, IntentName } from "@charcuterie/tokens";
import type { ReactNode } from "react";
import type { BadgeSize } from "../controlStyles.ts";
import type { IntentAppearance } from "../intentStyles.ts";
/**
 * The visual half of a badge, shared by the two elements that wear
 * it.
 *
 * `Badge` is a `<span>` and `BadgeButton` is a `<button>`, and the
 * pill is supposed to be indistinguishable between them — so the
 * class list, the icon slot, the truncation and the
 * only-when-clipped `title` are computed **here**, once, exactly as
 * `Button` and `ButtonLink` both call `getControlClassName`. A
 * second copy of this arithmetic is how the two drift: the wrapping
 * pill's `rounded-2xl` and the label's `min-w-0` are each one line,
 * and each is load-bearing.
 */
export type BadgeShapeProps = {
    appearance?: Exclude<IntentAppearance, "ghost">;
    /**
     * A numbered, **non-semantic** colour: 1–10, no meaning attached.
     *
     * For a badge whose colour the user picked — a Docket label, a
     * project, a chart series — where `intent` would be a lie.
     * `getCategoricalIndex(key)` from `@charcuterie/tokens` is the
     * stable fallback for a row nobody has chosen a colour for yet.
     *
     * Mutually exclusive with `intent` **in the type**: a badge is one
     * colour, and passing both is a question with no answer rather
     * than a precedence rule to remember.
     */
    categorical?: CategoricalIndex;
    children: ReactNode;
    icon?: ReactNode;
    intent?: IntentName;
    /**
     * What happens when the label is wider than the space it is given.
     *
     *  - `truncate` — one line, capped at the container, ellipsis. The
     *    default, because a status pill that changes its row's height
     *    when a message gets longer breaks the table it sits in.
     *  - `wrap` — the pill grows taller and shows everything. For the
     *    kiosk and any touch context, where the hover readout that
     *    `truncate` relies on does not exist.
     */
    overflow?: "truncate" | "wrap";
    size?: BadgeSize;
};
export declare const useBadgeShape: ({ appearance, categorical, children, className, icon, intent, overflow, size, title, }: BadgeShapeProps & {
    className?: string;
    title?: string;
}) => {
    className: string;
    content: ReactNode;
    title?: string;
};
//# sourceMappingURL=useBadgeShape.d.ts.map