shelving/ui/misc/Tag.d.ts

Toolkit for using data in JavaScript.

import type { ReactElement } from "react";
import { type ClickableProps } from "../form/Clickable.js";
import { type ColorVariants } from "../style/Color.js";
import { type StatusVariants } from "../style/Status.js";
/** Variants for tags — accepts both status and raw colour variants. */
export interface TagVariants extends StatusVariants, ColorVariants {
    /** Make the tag appear smaller. */
    small?: boolean | undefined;
}
export interface TagProps extends TagVariants, ClickableProps {
}
/**
 * Small inline label used to annotate other content.
 * - Delegates to `getClickable()` — renders as `<a>` when `href` is set, otherwise `<button>`.
 * - Accepts a status variant (`success`, `info`, `error`, etc.) _or_ a raw colour variant (`red`, `blue`, `purple`, etc.).
 *
 * @example <Tag success>Active</Tag>
 * @example <Tag purple href="/beta">Beta</Tag>
 */
export declare function Tag(props: TagProps): ReactElement;
export declare function getTagClass(variants: TagVariants): string;