@octopusdeploy/design-system-components/dist/src/components/Tag/TagBase.d.ts

The design systems component library.

import { type IconProps } from "@octopusdeploy/design-system-icons";
import type React from "react";
import { type AvatarProps } from "../Avatar/Avatar";
export interface TagBaseProps {
    /**
     * The text content to display in the tag.
     */
    label: string;
    /**
     * Optional icon or avatar to display before the label.
     * Can be either an Icon component, or an Avatar component for an entity.
     */
    prefix?: React.ReactElement<IconProps> | React.ReactElement<AvatarProps>;
    /**
     * Callback function invoked when the dismiss button is clicked.
     * When provided, a dismiss button (X) will be displayed on the tag.
     */
    onDismiss?: () => void;
    /**
     * Optional custom colour. This is a runtime value (e.g. a user-chosen category colour), not a
     * design token, so it is applied via the inline `style` prop. When set, it colours the border
     * and prefix icon, and the background uses the same colour at 10% opacity. When omitted the
     * tag falls back to its default token appearance.
     */
    color?: string;
}
/**
 * Presentational and behavioural core shared by `Tag` and `CategoryTag`: layout, overflow
 * tooltip, and the dismiss button. Colours are supplied by the consumer, letting `Tag` use the
 * default tokens and `CategoryTag` apply runtime colours.
 */
export declare function TagBase({ label, prefix, onDismiss, color }: TagBaseProps): import("react/jsx-runtime").JSX.Element;