import * as i0 from '@angular/core';
import * as i1 from '@eui/components/shared';
import { BaseStatesDirective } from '@eui/components/shared';

/**
 * Content projection component for displaying call-to-action elements within eui-banner.
 * Provides consistent styling and positioning for action buttons or links in banner contexts.
 * Must be used as a child of eui-banner component.
 * Typically contains buttons, links, or other interactive elements that prompt user action.
 *
 * @usageNotes
 * ```html
 * <eui-banner imageUrl="image.jpg">
 *   <eui-banner-title>Join Us</eui-banner-title>
 *   <eui-banner-description>Be part of something great</eui-banner-description>
 *   <eui-banner-cta>
 *     <button euiButton euiCTAButton>Get Started</button>
 *   </eui-banner-cta>
 * </eui-banner>
 * ```
 *
 * ### Accessibility
 * - CTA buttons should have descriptive, action-oriented labels
 * - Interactive elements are keyboard accessible
 * - Ensure sufficient contrast for buttons on banner backgrounds
 *
 * ### Notes
 * - Must be direct child of eui-banner component
 * - Typically placed after title and description
 * - Can contain buttons, links, or button groups
 * - Automatically positioned according to banner layout
 * - Works with euiInverse for proper button styling on dark backgrounds
 */
declare class EuiBannerCtaComponent {
    /**
     * Binds the class to the component.
     *
     * @default 'eui-banner-cta'
     */
    string: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiBannerCtaComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiBannerCtaComponent, "eui-banner-cta", never, {}, {}, never, ["*"], true, never>;
}

/**
 * Content projection component for displaying descriptive text within eui-banner.
 * Provides consistent typography and styling for banner description content.
 * Must be used as a child of eui-banner component.
 * Accepts text, paragraphs, or inline elements through content projection.
 *
 * @usageNotes
 * ```html
 * <eui-banner imageUrl="image.jpg">
 *   <eui-banner-title>Innovation Hub</eui-banner-title>
 *   <eui-banner-description>
 *     Explore cutting-edge solutions and collaborate with experts.
 *   </eui-banner-description>
 * </eui-banner>
 * ```
 *
 * ### Accessibility
 * - Description text is readable by screen readers after title
 * - Provides additional context about banner content
 * - Ensure sufficient contrast with background images
 *
 * ### Notes
 * - Must be direct child of eui-banner component
 * - Typically placed after eui-banner-title
 * - Styled as secondary/body text
 * - Automatically adapts to banner size variants
 * - Works with euiInverse for light text on dark backgrounds
 */
declare class EuiBannerDescriptionComponent {
    /**
     * Binds the class to the component.
     *
     * @default 'eui-banner-description'
     */
    string: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiBannerDescriptionComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiBannerDescriptionComponent, "eui-banner-description", never, {}, {}, never, ["*"], true, never>;
}

/**
 * Content projection component for displaying the title within eui-banner.
 * Provides consistent typography and styling for banner title text.
 * Must be used as a child of eui-banner component.
 * Accepts text or inline elements through content projection.
 *
 * @usageNotes
 * ```html
 * <eui-banner imageUrl="image.jpg">
 *   <eui-banner-title>Welcome to Our Platform</eui-banner-title>
 *   <eui-banner-description>Start your journey today</eui-banner-description>
 * </eui-banner>
 * ```
 *
 * ### Accessibility
 * - Title text is readable by screen readers in natural order
 * - Use concise, descriptive titles that convey banner purpose
 * - Ensure sufficient contrast with background when using images
 *
 * ### Notes
 * - Must be direct child of eui-banner component
 * - Styled as prominent heading text
 * - Automatically adapts to banner size variants
 * - Works with euiInverse for light text on dark backgrounds
 */
declare class EuiBannerTitleComponent {
    /**
     * Binds the class to the component.
     *
     * @default 'eui-banner-title'
     */
    string: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiBannerTitleComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiBannerTitleComponent, "eui-banner-title", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Content projection component for embedding video content within eui-banner.
 * Provides consistent styling and layout for video elements in banner contexts.
 * Must be used as a child of eui-banner component with isVideoBanner enabled.
 * Accepts any video-related content through content projection.
 *
 * @usageNotes
 * ```html
 * <eui-banner [isVideoBanner]="true" euiSizeL>
 *   <eui-banner-video>
 *     <video poster="thumbnail.jpg" autoplay loop muted>
 *       <source src="video.mp4" type="video/mp4">
 *     </video>
 *   </eui-banner-video>
 *   <eui-banner-title>Innovation in Action</eui-banner-title>
 *   <eui-banner-description>Watch our story unfold</eui-banner-description>
 * </eui-banner>
 * ```
 *
 * ### Accessibility
 * - Video should include captions for users with hearing impairments
 * - Provide poster image for video thumbnail
 * - Use muted attribute for autoplay videos to comply with accessibility guidelines
 * - Consider providing alternative text description of video content
 *
 * ### Notes
 * - Must be direct child of eui-banner component
 * - Parent banner should have isVideoBanner set to true
 * - Video element should include poster attribute for initial display
 * - Use autoplay, loop, and muted attributes for background videos
 * - Video is displayed as full-width background
 * - Content (title, description) overlays the video
 * - Consider video file size and format for performance
 */
declare class EuiBannerVideoComponent {
    /**
     * Binds the class to the component.
     *
     * @default 'eui-banner-video'
     */
    string: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiBannerVideoComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiBannerVideoComponent, "eui-banner-video", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Banner component for displaying prominent content sections with images or videos across the full width of a page.
 * Provides flexible positioning options (top, center, bottom) and supports inverse color schemes.
 * Can display static images or video backgrounds with content overlay.
 * Supports size variants (S, M, L) and outline styling through `BaseStatesDirective`.
 *
 * @usageNotes
 * #### Basic banner with image
 * ```html
 * <eui-banner imageUrl="https://example.com/image.jpg">
 *   <eui-banner-title>Welcome</eui-banner-title>
 *   <eui-banner-description>Discover our services</eui-banner-description>
 * </eui-banner>
 * ```
 *
 * #### Banner with CTA and positioning
 * ```html
 * <eui-banner imageUrl="image.jpg" [euiPositionCenter]="true" [euiInverse]="true">
 *   <eui-banner-title>Get Started</eui-banner-title>
 *   <eui-banner-description>Join us today</eui-banner-description>
 *   <eui-banner-cta>
 *     <button euiButton euiCTAButton>Sign Up</button>
 *   </eui-banner-cta>
 * </eui-banner>
 * ```
 *
 * #### Video banner
 * ```html
 * <eui-banner [isVideoBanner]="true" euiSizeL>
 *   <eui-banner-video>
 *     <video autoplay loop muted>
 *       <source src="video.mp4" type="video/mp4">
 *     </video>
 *   </eui-banner-video>
 *   <eui-banner-title>Innovation</eui-banner-title>
 * </eui-banner>
 * ```
 *
 * ### Accessibility
 * - No ARIA landmark role assigned; banner is a visual component
 * - Ensure banner images have meaningful content or are decorative
 * - Use euiInverse for better text contrast on dark images
 * - Video content should include captions when containing important information
 * - CTA buttons should have descriptive labels
 *
 * ### Notes
 * - Size variants: euiSizeS, euiSizeM (default), euiSizeL control banner height
 * - Position options: euiPositionTop, euiPositionCenter (default is bottom)
 * - euiInverse applies light text on dark background for better image contrast
 * - imageUrl displays static background image
 * - isVideoBanner enables video background mode, use with eui-banner-video
 * - euiOutline adds border outline styling
 * - Content is overlaid on background image/video
 * - Typically contains eui-banner-title, eui-banner-description, and optionally eui-banner-cta
 */
declare class EuiBannerComponent {
    get cssClasses(): string;
    /**
     * Data attribute value for end-to-end testing identification.
     * Applied as data-e2e attribute on the host element.
     * @default 'eui-banner'
     */
    e2eAttr: string;
    /**
     * Positions the banner content at the top of the banner area.
     * When true, aligns content to the top with appropriate spacing.
     * @default false
     */
    euiPositionTop: boolean;
    /**
     * Positions the banner content at the center of the banner area.
     * When true, vertically centers content within the banner.
     * @default false
     */
    euiPositionCenter: boolean;
    /**
     * Applies inverse color scheme to the banner.
     * When true, uses light text on dark background for better contrast with images.
     * @default false
     */
    euiInverse: boolean;
    /**
     * Enables video banner mode for displaying video backgrounds.
     * When true, configures banner to support video content instead of static images.
     * @default false
     */
    isVideoBanner: boolean;
    /**
     * URL path to the banner background image.
     * When provided, displays the image as the banner background.
     * Optional.
     */
    imageUrl: string;
    protected baseStatesDirective: BaseStatesDirective;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiBannerComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiBannerComponent, "eui-banner", never, { "e2eAttr": { "alias": "e2eAttr"; "required": false; }; "euiPositionTop": { "alias": "euiPositionTop"; "required": false; }; "euiPositionCenter": { "alias": "euiPositionCenter"; "required": false; }; "euiInverse": { "alias": "euiInverse"; "required": false; }; "isVideoBanner": { "alias": "isVideoBanner"; "required": false; }; "imageUrl": { "alias": "imageUrl"; "required": false; }; }, {}, never, ["eui-banner-video", "eui-banner-title", "eui-banner-description", "eui-banner-cta"], true, [{ directive: typeof i1.BaseStatesDirective; inputs: { "euiSizeS": "euiSizeS"; "euiSizeM": "euiSizeM"; "euiSizeL": "euiSizeL"; "euiSizeVariant": "euiSizeVariant"; "euiOutline": "euiOutline"; }; outputs: {}; }]>;
    static ngAcceptInputType_euiPositionTop: unknown;
    static ngAcceptInputType_euiPositionCenter: unknown;
    static ngAcceptInputType_euiInverse: unknown;
    static ngAcceptInputType_isVideoBanner: unknown;
}

declare const EUI_BANNER: readonly [typeof EuiBannerComponent, typeof EuiBannerTitleComponent, typeof EuiBannerDescriptionComponent, typeof EuiBannerCtaComponent, typeof EuiBannerVideoComponent];

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