import React from "react";
import { Theme } from "../../themes";
export type BadgeColor = "primary" | "secondaryDark" | "success" | "warning" | "danger" | "inverse";
export type BadgeType = "normal" | "pill" | "signal";
export type BadgeSize = "xs" | "small" | "medium";
export declare const BADGE_SIZE: {
    xs: {
        iconSize: number;
        height: string;
        pillHeight: string;
        gap: string;
        padding: (theme: Theme) => string;
        signalPaddingLeft: string;
        signalPaddingRight: string;
        dotSize: number;
        fontSize: string;
    };
    small: {
        iconSize: number;
        height: string;
        pillHeight: string;
        gap: string;
        padding: (theme: Theme) => string;
        signalPaddingLeft: string;
        signalPaddingRight: string;
        dotSize: number;
        fontSize: string;
    };
    medium: {
        iconSize: number;
        height: string;
        pillHeight: string;
        gap: string;
        padding: (theme: Theme) => string;
        signalPaddingLeft: string;
        signalPaddingRight: string;
        dotSize: number;
        fontSize: string;
    };
};
export declare const BACKGROUND_COLOR_MAP: {
    normal: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
    pill: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
    signal: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
};
export declare const TEXT_COLOR_MAP: {
    normal: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
    pill: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
    signal: {
        primary: (theme: Theme) => string;
        secondaryDark: (theme: Theme) => string;
        success: (theme: Theme) => string;
        warning: (theme: Theme) => string;
        danger: (theme: Theme) => string;
        inverse: (theme: Theme) => string;
    };
};
export declare const getBackgroundColor: (key: BadgeColor, theme: Theme, type: BadgeType) => string;
export declare const getTextColor: (key: BadgeColor, theme: Theme, type: BadgeType) => string;
/** Signal バッジの枠線（各色の palette.light） */
export declare const SIGNAL_BORDER_COLOR_MAP: Record<BadgeColor, (theme: Theme) => string>;
export declare const getSignalBorderColor: (key: BadgeColor, theme: Theme) => string;
/** Signal バッジの背景（各色の palette.ultraLight） */
export declare const SIGNAL_BACKGROUND_COLOR_MAP: Record<BadgeColor, (theme: Theme) => string>;
export declare const getSignalBackgroundColor: (key: BadgeColor, theme: Theme) => string;
export type BadgeProps = React.ComponentPropsWithoutRef<"a" | "span"> & {
    /**
     * バッジの色
     */
    color: BadgeColor;
    /**
     * バッジのタイプ
     * @default "normal"
     */
    type?: BadgeType;
    /**
     * フォントサイズ
     * @default "13px"
     */
    fontSize?: string;
    /**
     * フォントの太さ
     * @default "normal"
     */
    fontWeight?: string;
    /**
     * 使用するHTML要素
     * @default "span"
     */
    component?: "span" | "a";
    /**
     * バッジのサイズ
     * @default "medium"
     */
    size?: BadgeSize;
    /**
     * アイコン要素
     */
    icon?: React.ReactNode;
};