@navikt/ds-react/esm/tag/Tag.d.ts

React components from the Norwegian Labour and Welfare Administration.

import React, { HTMLAttributes } from "react";
import { AkselColor } from "../types/index.js";
type legacyVariants = "warning" | "warning-filled" | "warning-moderate" | "error" | "error-filled" | "error-moderate" | "info" | "info-filled" | "info-moderate" | "success" | "success-filled" | "success-moderate" | "neutral" | "neutral-filled" | "neutral-moderate" | "alt1" | "alt1-filled" | "alt1-moderate" | "alt2" | "alt2-filled" | "alt2-moderate" | "alt3" | "alt3-filled" | "alt3-moderate";
type HiddenVariant = legacyVariants & {
    __brand?: never;
};
export interface TagProps extends HTMLAttributes<HTMLSpanElement> {
    children: React.ReactNode;
    /**
     * Changes visual profile of tag
     * @default "outline"
     */
    variant?: "outline" | "moderate" | "strong" | HiddenVariant;
    /**
     * @default "medium"
     */
    size?: "medium" | "small" | "xsmall";
    /**
     * Tag Icon
     */
    icon?: React.ReactNode;
    /**
     * Tag color
     * @default "neutral"
     */
    "data-color"?: AkselColor;
}
/**
 * A component that displays a small label with a text and a background color.
 *
 * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/tag)
 * @see 🏷️ {@link TagProps}
 *
 * @example
 * ```jsx
 * <Tag variant="success">Success</Tag>
 * ```
 */
export declare const Tag: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>>;
export default Tag;