import * as i0 from '@angular/core';
import { inject, booleanAttribute, Input, HostBinding, ChangeDetectionStrategy, Component } from '@angular/core';
import * as i1 from '@eui/components/shared';
import { BaseStatesDirective } from '@eui/components/shared';

/**
 * @description
 * A badge component that can display text, numbers, or icons with various states and styles.
 * Supports content truncation, empty states, and icon-only modes.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <!-- Status badge with semantic colors -->
 * <span euiStatusBadge euiSuccess>Active</span>
 * <span euiStatusBadge euiWarning>Pending</span>
 * <span euiStatusBadge euiDanger>Error</span>
 *
 * <!-- Dotted badge -->
 * <span euiStatusBadge euiInfo [euiDottedBadge]="true">New</span>
 *
 * <!-- Custom color palette -->
 * <span euiStatusBadge [colorPalette]="'custom-color'">Custom</span>
 * ```
 *
 * ### Accessibility
 * - Badge has role="status" for screen readers
 * - Provide meaningful aria-label describing the status
 * - Ensure sufficient color contrast for text visibility
 *
 * ### Notes
 * - Use semantic color variants (euiSuccess, euiWarning, euiDanger, euiInfo) for consistent meaning
 * - Size variants (euiSizeS, euiSizeM) control badge dimensions
 * - Dotted badge mode displays a small dot indicator instead of full badge
 */
class EuiStatusBadgeComponent {
    constructor() {
        /** @description Data attribute for e2e testing */
        this.e2eAttr = 'eui-status-badge';
        /** @description ARIA role for accessibility */
        this.role = 'status';
        /** @description ARIA label for accessibility */
        this.ariaLabel = 'status-badge';
        /**
         * @description Whether to display the badge as a dot
         * @default false
         */
        this.euiDottedBadge = false;
        /** @description Instance of BaseStatesDirective for managing component states */
        this.baseStatesDirective = inject(BaseStatesDirective);
    }
    /**
     * @description
     * Computes and returns the CSS classes for the badge based on its current state
     *
     * @returns {string} Space-separated string of CSS class names
     */
    get cssClasses() {
        return [
            this.baseStatesDirective.getCssClasses('eui-status-badge'),
            this.colorPalette ? `eui-status-badge--${this.colorPalette}` : '',
        ].join(' ').trim();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: EuiStatusBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.1", type: EuiStatusBadgeComponent, isStandalone: true, selector: "div[euiStatusBadge], span[euiStatusBadge], eui-status-badge", inputs: { e2eAttr: "e2eAttr", ariaLabel: ["aria-label", "ariaLabel"], euiDottedBadge: ["euiDottedBadge", "euiDottedBadge", booleanAttribute], colorPalette: "colorPalette" }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiPrimary", "euiPrimary", "euiSecondary", "euiSecondary", "euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant", "euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeVariant", "euiSizeVariant"] }], ngImport: i0, template: '<ng-content />', isInline: true, styles: [".eui-21 :host.eui-status-badge{--_padding: var(--eui-s-3xs) var(--eui-s-s);--_border-radius: var(--eui-br-s);--_content-font: var(--eui-f-s);--_border-width: var(--eui-bw-xs);--_bg-color: var(--eui-c-info-surface-medium);--_color-on-bg: var(--eui-c-info-on-surface-medium)}.eui-21 :host.eui-status-badge--primary{--_bg-color: var(--eui-c-primary-surface-medium);--_color-on-bg: var(--eui-c-primary-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--secondary{--_bg-color: var(--eui-c-secondary-surface-medium);--_color-on-bg: var(--eui-c-secondary-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--info{--_bg-color: var(--eui-c-info-surface-medium);--_color-on-bg: var(--eui-c-info-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--success{--_bg-color: var(--eui-c-success-surface-medium);--_color-on-bg: var(--eui-c-success-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--warning{--_bg-color: var(--eui-c-warning-surface-medium);--_color-on-bg: var(--eui-c-warning-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--danger{--_bg-color: var(--eui-c-danger-surface-medium);--_color-on-bg: var(--eui-c-danger-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--red{--_bg-color: #fca5a5;--_color-on-bg: #7f1d1d;--_border-color: transparent}.eui-21 :host.eui-status-badge--orange{--_bg-color: #fdba74;--_color-on-bg: #7c2d12;--_border-color: transparent}.eui-21 :host.eui-status-badge--amber{--_bg-color: #fcd34d;--_color-on-bg: #78350f;--_border-color: transparent}.eui-21 :host.eui-status-badge--yellow{--_bg-color: #fde047;--_color-on-bg: #713f12;--_border-color: transparent}.eui-21 :host.eui-status-badge--lime{--_bg-color: #bef264;--_color-on-bg: #365314;--_border-color: transparent}.eui-21 :host.eui-status-badge--green{--_bg-color: #86efac;--_color-on-bg: #14532d;--_border-color: transparent}.eui-21 :host.eui-status-badge--emerald{--_bg-color: #6ee7b7;--_color-on-bg: #064e3b;--_border-color: transparent}.eui-21 :host.eui-status-badge--teal{--_bg-color: #5eead4;--_color-on-bg: #134e4a;--_border-color: transparent}.eui-21 :host.eui-status-badge--cyan{--_bg-color: #67e8f9;--_color-on-bg: #164e63;--_border-color: transparent}.eui-21 :host.eui-status-badge--sky{--_bg-color: #7dd3fc;--_color-on-bg: #0c4a6e;--_border-color: transparent}.eui-21 :host.eui-status-badge--blue{--_bg-color: #93c5fd;--_color-on-bg: #1e3a8a;--_border-color: transparent}.eui-21 :host.eui-status-badge--indigo{--_bg-color: #a5b4fc;--_color-on-bg: #312e81;--_border-color: transparent}.eui-21 :host.eui-status-badge--violet{--_bg-color: #c4b5fd;--_color-on-bg: #4c1d95;--_border-color: transparent}.eui-21 :host.eui-status-badge--purple{--_bg-color: #d8b4fe;--_color-on-bg: #581c87;--_border-color: transparent}.eui-21 :host.eui-status-badge--fuchsia{--_bg-color: #f0abfc;--_color-on-bg: #701a75;--_border-color: transparent}.eui-21 :host.eui-status-badge--pink{--_bg-color: #f9a8d4;--_color-on-bg: #831843;--_border-color: transparent}.eui-21 :host.eui-status-badge--rose{--_bg-color: #fda4af;--_color-on-bg: #881337;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-navy{--_bg-color: #bfbfe0;--_color-on-bg: #00002e;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-electric{--_bg-color: #5bd3ef;--_color-on-bg: #014959;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-ocean{--_bg-color: #97e0d8;--_color-on-bg: #0e7065;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green{--_bg-color: #8fe5c4;--_color-on-bg: #03774a;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-dark{--_bg-color: #8cbaba;--_color-on-bg: #003d3d;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-orange{--_bg-color: #ffc998;--_color-on-bg: #6b3a0d;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-purple{--_bg-color: #ccb5ee;--_color-on-bg: #3c285b;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-lemon{--_bg-color: #e8f2b0;--_color-on-bg: #7a8830;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-pine{--_bg-color: #b6c6ca;--_color-on-bg: #082f3a;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-red-crayola{--_bg-color: #ec798d;--_color-on-bg: #5f1724;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-yellow-gold{--_bg-color: #ffe05e;--_color-on-bg: #735d00;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-orange-abricot{--_bg-color: #ffbe5c;--_color-on-bg: #7e3610;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-purple-violet{--_bg-color: #b1a1ff;--_color-on-bg: #3a306b;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-red-tomato{--_bg-color: #ff9a86;--_color-on-bg: #6b2c1f;--_border-color: transparent}.eui-21 :host.eui-status-badge--size-s{--_padding: var(--eui-s-4xs) var(--eui-s-xs)}.eui-21 :host.eui-status-badge--size-m{--_padding: var(--eui-s-3xs) var(--eui-s-xs)}.eui-21 :host.eui-status-badge{display:inline-flex;gap:var(--eui-s-xs);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_border-radius);background-color:var(--_bg-color);color:var(--_color-on-bg);padding:var(--_padding);font:var(--_content-font)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: EuiStatusBadgeComponent, decorators: [{
            type: Component,
            args: [{ selector: 'div[euiStatusBadge], span[euiStatusBadge], eui-status-badge', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                        {
                            directive: BaseStatesDirective,
                            inputs: [
                                'euiPrimary',
                                'euiSecondary',
                                'euiSuccess',
                                'euiInfo',
                                'euiWarning',
                                'euiDanger',
                                'euiVariant',
                                'euiSizeS',
                                'euiSizeM',
                                'euiSizeVariant',
                            ],
                        },
                    ], styles: [".eui-21 :host.eui-status-badge{--_padding: var(--eui-s-3xs) var(--eui-s-s);--_border-radius: var(--eui-br-s);--_content-font: var(--eui-f-s);--_border-width: var(--eui-bw-xs);--_bg-color: var(--eui-c-info-surface-medium);--_color-on-bg: var(--eui-c-info-on-surface-medium)}.eui-21 :host.eui-status-badge--primary{--_bg-color: var(--eui-c-primary-surface-medium);--_color-on-bg: var(--eui-c-primary-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--secondary{--_bg-color: var(--eui-c-secondary-surface-medium);--_color-on-bg: var(--eui-c-secondary-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--info{--_bg-color: var(--eui-c-info-surface-medium);--_color-on-bg: var(--eui-c-info-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--success{--_bg-color: var(--eui-c-success-surface-medium);--_color-on-bg: var(--eui-c-success-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--warning{--_bg-color: var(--eui-c-warning-surface-medium);--_color-on-bg: var(--eui-c-warning-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--danger{--_bg-color: var(--eui-c-danger-surface-medium);--_color-on-bg: var(--eui-c-danger-on-surface-medium);--_border-color: transparent}.eui-21 :host.eui-status-badge--red{--_bg-color: #fca5a5;--_color-on-bg: #7f1d1d;--_border-color: transparent}.eui-21 :host.eui-status-badge--orange{--_bg-color: #fdba74;--_color-on-bg: #7c2d12;--_border-color: transparent}.eui-21 :host.eui-status-badge--amber{--_bg-color: #fcd34d;--_color-on-bg: #78350f;--_border-color: transparent}.eui-21 :host.eui-status-badge--yellow{--_bg-color: #fde047;--_color-on-bg: #713f12;--_border-color: transparent}.eui-21 :host.eui-status-badge--lime{--_bg-color: #bef264;--_color-on-bg: #365314;--_border-color: transparent}.eui-21 :host.eui-status-badge--green{--_bg-color: #86efac;--_color-on-bg: #14532d;--_border-color: transparent}.eui-21 :host.eui-status-badge--emerald{--_bg-color: #6ee7b7;--_color-on-bg: #064e3b;--_border-color: transparent}.eui-21 :host.eui-status-badge--teal{--_bg-color: #5eead4;--_color-on-bg: #134e4a;--_border-color: transparent}.eui-21 :host.eui-status-badge--cyan{--_bg-color: #67e8f9;--_color-on-bg: #164e63;--_border-color: transparent}.eui-21 :host.eui-status-badge--sky{--_bg-color: #7dd3fc;--_color-on-bg: #0c4a6e;--_border-color: transparent}.eui-21 :host.eui-status-badge--blue{--_bg-color: #93c5fd;--_color-on-bg: #1e3a8a;--_border-color: transparent}.eui-21 :host.eui-status-badge--indigo{--_bg-color: #a5b4fc;--_color-on-bg: #312e81;--_border-color: transparent}.eui-21 :host.eui-status-badge--violet{--_bg-color: #c4b5fd;--_color-on-bg: #4c1d95;--_border-color: transparent}.eui-21 :host.eui-status-badge--purple{--_bg-color: #d8b4fe;--_color-on-bg: #581c87;--_border-color: transparent}.eui-21 :host.eui-status-badge--fuchsia{--_bg-color: #f0abfc;--_color-on-bg: #701a75;--_border-color: transparent}.eui-21 :host.eui-status-badge--pink{--_bg-color: #f9a8d4;--_color-on-bg: #831843;--_border-color: transparent}.eui-21 :host.eui-status-badge--rose{--_bg-color: #fda4af;--_color-on-bg: #881337;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-navy{--_bg-color: #bfbfe0;--_color-on-bg: #00002e;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-electric{--_bg-color: #5bd3ef;--_color-on-bg: #014959;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-blue-ocean{--_bg-color: #97e0d8;--_color-on-bg: #0e7065;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green{--_bg-color: #8fe5c4;--_color-on-bg: #03774a;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-dark{--_bg-color: #8cbaba;--_color-on-bg: #003d3d;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-orange{--_bg-color: #ffc998;--_color-on-bg: #6b3a0d;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-purple{--_bg-color: #ccb5ee;--_color-on-bg: #3c285b;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-lemon{--_bg-color: #e8f2b0;--_color-on-bg: #7a8830;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-green-pine{--_bg-color: #b6c6ca;--_color-on-bg: #082f3a;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-red-crayola{--_bg-color: #ec798d;--_color-on-bg: #5f1724;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-yellow-gold{--_bg-color: #ffe05e;--_color-on-bg: #735d00;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-orange-abricot{--_bg-color: #ffbe5c;--_color-on-bg: #7e3610;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-purple-violet{--_bg-color: #b1a1ff;--_color-on-bg: #3a306b;--_border-color: transparent}.eui-21 :host.eui-status-badge--ecl-red-tomato{--_bg-color: #ff9a86;--_color-on-bg: #6b2c1f;--_border-color: transparent}.eui-21 :host.eui-status-badge--size-s{--_padding: var(--eui-s-4xs) var(--eui-s-xs)}.eui-21 :host.eui-status-badge--size-m{--_padding: var(--eui-s-3xs) var(--eui-s-xs)}.eui-21 :host.eui-status-badge{display:inline-flex;gap:var(--eui-s-xs);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_border-radius);background-color:var(--_bg-color);color:var(--_color-on-bg);padding:var(--_padding);font:var(--_content-font)}\n"] }]
        }], propDecorators: { cssClasses: [{
                type: HostBinding,
                args: ['class']
            }], e2eAttr: [{
                type: HostBinding,
                args: ['attr.data-e2e']
            }, {
                type: Input
            }], role: [{
                type: HostBinding,
                args: ['attr.role']
            }], ariaLabel: [{
                type: HostBinding,
                args: ['attr.aria-label']
            }, {
                type: Input,
                args: ['aria-label']
            }], euiDottedBadge: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], colorPalette: [{
                type: Input
            }] } });

const EUI_STATUS_BADGE = [
    EuiStatusBadgeComponent,
];
// export { EuiStatusBadgeComponent as EuiStatusBadge } from './eui-status-badge.component';

/**
 * Generated bundle index. Do not edit.
 */

export { EUI_STATUS_BADGE, EuiStatusBadgeComponent };
//# sourceMappingURL=eui-components-eui-status-badge.mjs.map
