import React from 'react';
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
import type {
  IconName,
  SharedAccessibilityProps,
  SharedProps,
  TagColorScheme,
  TagEmphasis,
  TagIntent,
} from '@coinbase/cds-common/types';
import { type BoxDefaultElement, type BoxProps } from '../layout/Box';
export declare const tagStaticClassName = 'cds-tag';
export type TagBaseProps = SharedProps &
  SharedAccessibilityProps & {
    /** Children to render within the Tag. */
    children: React.ReactNode;
    /**
     * Specify the intent of the Tag
     * @default informational
     */
    intent?: TagIntent;
    /**
     * Specify the emphasis of the Tag.
     * @default 'low' when informational intent, 'high' when promotional intent
     */
    emphasis?: TagEmphasis;
    /**
     * Specify the colorScheme of the Tag
     * @default blue
     */
    colorScheme?: TagColorScheme;
    /** @danger Custom background color */
    background?: ThemeVars.SpectrumColor;
    /** @danger Custom text color */
    color?: ThemeVars.SpectrumColor;
    /** Setting a custom max width for this tag will enable text truncation */
    maxWidth?: BoxProps<BoxDefaultElement>['maxWidth'];
    /** Set the start node */
    start?: React.ReactNode;
    /** Icon to render at the start of the tag. */
    startIcon?: IconName;
    /** Whether the start icon is active */
    startIconActive?: boolean;
    /** Set the end node */
    end?: React.ReactNode;
    /** Icon to render at the end of the tag. */
    endIcon?: IconName;
    /** Whether the end icon is active */
    endIconActive?: boolean;
  };
export type TagProps = TagBaseProps &
  Omit<BoxProps<BoxDefaultElement>, 'color' | 'background' | 'children' | 'maxWidth'>;
export declare const Tag: React.MemoExoticComponent<
  React.ForwardRefExoticComponent<Omit<TagProps, 'ref'> & React.RefAttributes<HTMLDivElement>>
>;
//# sourceMappingURL=Tag.d.ts.map