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

/**
 * @description
 * The eui-content-card component projects the content for eui-card.
 */
class EuiBannerCtaComponent {
    constructor() {
        /**
         * Binds the class to the component.
         *
         * @default 'eui-banner-cta'
         */
        this.string = 'eui-banner-cta';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerCtaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiBannerCtaComponent, isStandalone: true, selector: "eui-banner-cta", host: { properties: { "class": "this.string" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 .eui-banner :host{margin-top:var(--eui-s-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerCtaComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-banner-cta', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eui-19 .eui-banner :host{margin-top:var(--eui-s-s)}\n"] }]
        }], propDecorators: { string: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @description
 * The eui-content-card component projects the content for eui-card.
 */
class EuiBannerDescriptionComponent {
    constructor() {
        /**
         * Binds the class to the component.
         *
         * @default 'eui-banner-description'
         */
        this.string = 'eui-banner-description';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiBannerDescriptionComponent, isStandalone: true, selector: "eui-banner-description", host: { properties: { "class": "this.string" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 .eui-banner :host{font:var(--_description-font)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerDescriptionComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-banner-description', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eui-19 .eui-banner :host{font:var(--_description-font)}\n"] }]
        }], propDecorators: { string: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @description
 * The eui-content-card component projects the content for eui-card.
 */
class EuiBannerTitleComponent {
    constructor() {
        /**
         * Binds the class to the component.
         *
         * @default 'eui-banner-title'
         */
        this.string = 'eui-banner-title';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiBannerTitleComponent, isStandalone: true, selector: "eui-banner-title", host: { properties: { "class": "this.string" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 .eui-banner :host{font:var(--_title-font)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerTitleComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-banner-title', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eui-19 .eui-banner :host{font:var(--_title-font)}\n"] }]
        }], propDecorators: { string: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @description
 * The eui-content-card component projects the content for eui-card.
 */
class EuiBannerVideoComponent {
    constructor() {
        /**
         * Binds the class to the component.
         *
         * @default 'eui-banner-video'
         */
        this.string = 'eui-banner-video';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiBannerVideoComponent, isStandalone: true, selector: "eui-banner-video", host: { properties: { "class": "this.string" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 .eui-banner :host{height:100%;position:static;width:100%;margin:0}.eui-19 .eui-banner :host ::ng-deep video{aspect-ratio:4/1;display:block;height:100%;object-fit:cover;position:relative;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerVideoComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-banner-video', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eui-19 .eui-banner :host{height:100%;position:static;width:100%;margin:0}.eui-19 .eui-banner :host ::ng-deep video{aspect-ratio:4/1;display:block;height:100%;object-fit:cover;position:relative;width:100%}\n"] }]
        }], propDecorators: { string: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @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.
 *
 */
class EuiBannerComponent {
    constructor() {
        /** @description ARIA role for accessibility */
        this.role = 'section';
        /** @description Data attribute for e2e testing */
        this.e2eAttr = 'eui-banner';
        /**
         * @description Whether as position top
         * @default false
         */
        this.euiPositionTop = false;
        /**
         * @description Whether as position center
         * @default false
         */
        this.euiPositionCenter = false;
        /**
         * @description Whether as position bottom
         * @default false
         */
        this.euiInverse = false;
        /**
         * @description Whether as position bottom
         * @default false
         */
        this.isVideoBanner = 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-banner'),
            this.euiPositionTop ? 'eui-banner--top' : '',
            this.euiPositionCenter ? 'eui-banner--center' : '',
            this.euiInverse ? 'eui-banner--inverse' : '',
        ].join(' ').trim();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: EuiBannerComponent, isStandalone: true, selector: "eui-banner", inputs: { e2eAttr: "e2eAttr", euiPositionTop: ["euiPositionTop", "euiPositionTop", booleanAttribute], euiPositionCenter: ["euiPositionCenter", "euiPositionCenter", booleanAttribute], euiInverse: ["euiInverse", "euiInverse", booleanAttribute], isVideoBanner: ["isVideoBanner", "isVideoBanner", booleanAttribute], imageUrl: "imageUrl" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.data-e2e": "this.e2eAttr" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeL", "euiSizeL", "euiSizeVariant", "euiSizeVariant", "euiOutline", "euiOutline"] }], ngImport: i0, template: "@if (imageUrl) {\n    <figure class=\"eui-banner__picture-container\">\n        <picture class=\"eui-banner__picture\">\n            <img class=\"eui-banner__image\" src=\"{{imageUrl}}\" alt=\"alternative text\">\n        </picture>\n    </figure>\n} @else {\n    <ng-content select=\"eui-banner-video\"/>\n}\n\n<div class=\"eui-banner__info\">\n    <div class=\"eui-banner__container\">\n        <ng-content select=\"eui-banner-title\"/>\n        <ng-content select=\"eui-banner-description\"/>\n        <ng-content select=\"eui-banner-cta\"/>\n    </div>\n</div>", styles: [".eui-19.eui-t-ds2025 :host.eui-banner{--_title-font: var(--eui-f-title-xl-medium);--_description-font: var(--eui-f-body-xl-regular)}.eui-19 :host.eui-banner{--_title-font: var(--eui-f-2xl-bold);--_description-font: var(--eui-f-xl)}.eui-19 :host.eui-banner{display:flex;flex-direction:column;position:relative;width:100%;align-items:center}.eui-19 :host.eui-banner .eui-banner__picture-container{height:100%;position:static;width:100%;margin:0}.eui-19 :host.eui-banner .eui-banner__picture{display:block;height:100%;position:relative;margin:0}.eui-19 :host.eui-banner .eui-banner__image{aspect-ratio:4/1;background-size:100%;background-repeat:no-repeat;object-position:top;display:block;height:100%;object-fit:cover;position:relative;width:100%}.eui-19 :host.eui-banner .eui-banner__info{position:absolute;display:flex;align-items:end;bottom:var(--eui-s-xl);flex-grow:1;width:100%;height:100%;padding:var(--eui-s-3xl) var(--eui-s-2xl)}.eui-19 :host.eui-banner .eui-banner__container{border-radius:var(--eui-br-m);min-width:50%;background-color:var(--eui-c-surface-container);display:flex;flex-direction:column;padding:var(--eui-s-xl) var(--eui-s-l)}.eui-19 :host.eui-banner--top .eui-banner__info{align-items:start;top:var(--eui-s-xl)}.eui-19 :host.eui-banner--center .eui-banner__info{align-items:center;bottom:0}.eui-19 :host.eui-banner--inverse .eui-banner__container{background-color:#000c;color:#fff}.eui-19 :host.eui-banner--size-s .eui-banner__image{aspect-ratio:5/1}.eui-19 :host.eui-banner--size-l .eui-banner__image{aspect-ratio:3/1}@media screen and (max-width: 995px){.eui-19 :host.eui-banner .eui-banner__info{position:relative;padding:var(--eui-s-m) 0 0 0;align-items:start}.eui-19 :host.eui-banner .eui-banner__container{background-color:transparent;padding:var(--eui-s-m) 0 0 0}.eui-19 :host.eui-banner--inverse .eui-banner__container{background-color:transparent;color:var(--eui-c-text)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBannerComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-banner', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                        {
                            directive: BaseStatesDirective,
                            inputs: [
                                'euiSizeS',
                                'euiSizeM',
                                'euiSizeL',
                                'euiSizeVariant',
                                'euiOutline',
                            ],
                        },
                    ], template: "@if (imageUrl) {\n    <figure class=\"eui-banner__picture-container\">\n        <picture class=\"eui-banner__picture\">\n            <img class=\"eui-banner__image\" src=\"{{imageUrl}}\" alt=\"alternative text\">\n        </picture>\n    </figure>\n} @else {\n    <ng-content select=\"eui-banner-video\"/>\n}\n\n<div class=\"eui-banner__info\">\n    <div class=\"eui-banner__container\">\n        <ng-content select=\"eui-banner-title\"/>\n        <ng-content select=\"eui-banner-description\"/>\n        <ng-content select=\"eui-banner-cta\"/>\n    </div>\n</div>", styles: [".eui-19.eui-t-ds2025 :host.eui-banner{--_title-font: var(--eui-f-title-xl-medium);--_description-font: var(--eui-f-body-xl-regular)}.eui-19 :host.eui-banner{--_title-font: var(--eui-f-2xl-bold);--_description-font: var(--eui-f-xl)}.eui-19 :host.eui-banner{display:flex;flex-direction:column;position:relative;width:100%;align-items:center}.eui-19 :host.eui-banner .eui-banner__picture-container{height:100%;position:static;width:100%;margin:0}.eui-19 :host.eui-banner .eui-banner__picture{display:block;height:100%;position:relative;margin:0}.eui-19 :host.eui-banner .eui-banner__image{aspect-ratio:4/1;background-size:100%;background-repeat:no-repeat;object-position:top;display:block;height:100%;object-fit:cover;position:relative;width:100%}.eui-19 :host.eui-banner .eui-banner__info{position:absolute;display:flex;align-items:end;bottom:var(--eui-s-xl);flex-grow:1;width:100%;height:100%;padding:var(--eui-s-3xl) var(--eui-s-2xl)}.eui-19 :host.eui-banner .eui-banner__container{border-radius:var(--eui-br-m);min-width:50%;background-color:var(--eui-c-surface-container);display:flex;flex-direction:column;padding:var(--eui-s-xl) var(--eui-s-l)}.eui-19 :host.eui-banner--top .eui-banner__info{align-items:start;top:var(--eui-s-xl)}.eui-19 :host.eui-banner--center .eui-banner__info{align-items:center;bottom:0}.eui-19 :host.eui-banner--inverse .eui-banner__container{background-color:#000c;color:#fff}.eui-19 :host.eui-banner--size-s .eui-banner__image{aspect-ratio:5/1}.eui-19 :host.eui-banner--size-l .eui-banner__image{aspect-ratio:3/1}@media screen and (max-width: 995px){.eui-19 :host.eui-banner .eui-banner__info{position:relative;padding:var(--eui-s-m) 0 0 0;align-items:start}.eui-19 :host.eui-banner .eui-banner__container{background-color:transparent;padding:var(--eui-s-m) 0 0 0}.eui-19 :host.eui-banner--inverse .eui-banner__container{background-color:transparent;color:var(--eui-c-text)}}\n"] }]
        }], propDecorators: { cssClasses: [{
                type: HostBinding,
                args: ['class']
            }], role: [{
                type: HostBinding,
                args: ['attr.role']
            }], e2eAttr: [{
                type: HostBinding,
                args: ['attr.data-e2e']
            }, {
                type: Input
            }], euiPositionTop: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], euiPositionCenter: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], euiInverse: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isVideoBanner: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], imageUrl: [{
                type: Input
            }] } });

const EUI_BANNER = [
    EuiBannerComponent,
    EuiBannerTitleComponent,
    EuiBannerDescriptionComponent,
    EuiBannerCtaComponent,
    EuiBannerVideoComponent,
];

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

export { EUI_BANNER, EuiBannerComponent, EuiBannerCtaComponent, EuiBannerDescriptionComponent, EuiBannerTitleComponent, EuiBannerVideoComponent };
//# sourceMappingURL=eui-components-eui-banner.mjs.map
