import type { CSSResult, CSSResultArray, PropertyValues, TemplateResult } from "lit";
import { LitElement } from "lit";
import "../icon/Icon";
import type { BadgeType, IconVariant } from "./badge.types";
/**
 * The `md-notification-badge` component is a versatile UI element used to
 * display dot, icons, counters, success, warning and error type badge.
 *
 * Supported badge types:
 * - `dot`: Displays a dot notification badge with a blue color.
 * - `icon`: Displays a badge with a specified icon using the `icon-name` attribute.
 * - `counter`: Displays a badge with a counter value. If the counter exceeds the `max-counter`,
 * it shows `maxCounter+`. The maximum value of the counter is 999 and anything above that will be set to `999+`.
 * - `success`: Displays a success badge with a check circle icon and green color.
 * - `warning`: Displays a warning badge with a warning icon and yellow color.
 * - `error`: Displays a error badge with a error legacy icon and red color.
 *
 * For `icon`, `success`, `warning` and `error` types, the `md-notification-icon` component is used to render the icon.
 *
 * For the `counter` type, a div is used to render the counter value.
 *
 * @dependency md-icon
 *
 * @tagname md-notification-badge
 *
 */
export declare class NotificationBadge extends LitElement {
    static get styles(): CSSResult | CSSResultArray;
    /**
     * Type of the badge
     * Can be `dot` (notification) , `icon`, `counter`, `success`, `warning` or `error`.
     */
    type?: BadgeType;
    /**
     * Type of the variant can be `primary` or `secondary`.
     * It defines the background and foreground color of the icon.
     * @default primary
     */
    variant: IconVariant;
    /**
     * Counter is the number which can be provided in the badge.
     */
    counter?: number;
    /**
     * The maximum number can be set up to 999, anything above that will be rendered as _999+_.
     * The max counter can be `9`, `99` or `999`.
     * @default 99
     */
    maxCounter: number;
    /**
     * Overlay is to add a thin outline to the badge.
     * This will help distinguish between the badge and the button,
     * where the badge will be layered on top of a button.
     * @default false
     */
    overlay: boolean;
    /**
     * Name of the icon (= filename).
     *
     * If no `icon-name` is provided, no icon will be rendered.
     */
    iconName?: string;
    /**
     * Aria-label attribute to be set for accessibility
     * @default null
     */
    ariaLabel: string | null;
    /**
     * If `type` is set to `counter` and if `counter` is greater than `maxCounter`,
     * then it will return a string the maxCounter value as string.
     * Otherwise, it will return a string representation of `counter`.
     * If `counter` is not a number, it will return an empty string.
     * @param maxCounter - the maximum limit which can be displayed on the badge
     * @param counter - the number to be displayed on the badge
     * @returns the string representation of the counter
     */
    private getCounterText;
    /**
     * Method to generate the badge icon.
     * @param iconName - the name of the icon from the icon set
     * @param backgroundClassPostfix - postfix for the class to style the badge icon.
     * @returns the template result of the icon.
     */
    private getBadgeIcon;
    /**
     * Method to generate the badge dot template.
     * @returns the template result of the dot with md-notification-badge-dot class.
     */
    private getBadgeDot;
    /**
     * Method to generate the badge text and counter template.
     * @returns the template result of the text.
     */
    private getBadgeCounterText;
    /**
     * Method to set the role based on the aria-label provided.
     * If the aria-label is provided, the role of the element will be 'img'.
     * Otherwise, the role will be null.
     */
    private setRoleByAriaLabel;
    /**
     * Generates the badge content based on the badge type.
     * Utilizes various helper methods to create the appropriate badge template based on the
     * current badge type. Supports 'dot', 'icon', 'counter', 'success', 'warning', and 'error'
     * types, returning the corresponding template result for each type.
     * @returns the TemplateResult for the current badge type.
     */
    private getBadgeContentBasedOnType;
    update(changedProperties: PropertyValues): void;
    render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        "md-notification-badge": NotificationBadge;
    }
}