import * as i0 from '@angular/core';
import { inject, ElementRef, Renderer2, booleanAttribute, Input, HostBinding, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';

/**
 * @description
 * Component that wraps content and manages focus state when content is blocked.
 * Provides accessibility attributes and handles focus restoration when blocking/unblocking.
 */
class EuiBlockContentComponent {
    constructor() {
        /**
         * ARIA role for the content wrapper
         * @default 'region'
         */
        this.role = 'region';
        /**
         * ARIA label for the content wrapper
         * @default 'block content wrapper'
         */
        this.ariaLabel = 'block content wrapper';
        /**
         * Whether the content is currently blocked
         * When true, focused elements within will be blurred and state saved
         * @default false
         */
        this.isBlocked = false;
        /** Stores the element focused before content was blocked */
        this.lastActiveElement = null;
        this.elRef = inject(ElementRef);
        this.renderer = inject(Renderer2);
    }
    /** CSS classes applied to the host element */
    get cssClasses() {
        return [
            'eui-block-content',
            this.isBlocked ? 'eui-block-content--blocked' : '',
        ].join(' ').trim();
    }
    /**
     * Handles changes to the blocked state.
     * Manages focus when content is blocked or unblocked.
     */
    ngOnChanges(changes) {
        if (changes['isBlocked']) {
            const activeElement = this.getActiveElement();
            const isBlocking = this.isAboutToBlock(changes['isBlocked']);
            if (isBlocking) {
                this.deactivateElement(activeElement);
            }
            else {
                this.reactivateElement(this.lastActiveElement);
            }
        }
    }
    /**
     * Removes focus from the currently focused element when blocking
     * Stores the element reference for later restoration
     *
     * @param activeElement - The currently focused element
     */
    deactivateElement(activeElement) {
        if (activeElement) {
            this.renderer.selectRootElement(activeElement, true).blur();
            this.lastActiveElement = activeElement;
        }
        else {
            this.lastActiveElement = null;
        }
    }
    /**
     * Restores focus to the previously focused element when unblocking
     *
     * @param element - The element that was previously focused
     */
    reactivateElement(element) {
        if (element) {
            this.renderer.selectRootElement(element, true).focus();
        }
    }
    /**
     * Determines if the content is transitioning to a blocked state
     *
     * @param change - Angular SimpleChange object
     * @returns true if the content is being blocked, false otherwise
     */
    isAboutToBlock(change) {
        return change?.currentValue && !change.previousValue;
    }
    /**
     * Finds the currently focused element within the block content
     *
     * @returns The currently focused HTMLElement or null if none found
     */
    getActiveElement() {
        return this.elRef.nativeElement.querySelector(':focus');
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.17", type: EuiBlockContentComponent, isStandalone: true, selector: "eui-block-content", inputs: { role: "role", ariaLabel: "ariaLabel", isBlocked: ["isBlocked", "isBlocked", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel" } }, usesOnChanges: true, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 :host.eui-block-content{display:block;position:relative}.eui-19 :host.eui-block-content--blocked{min-height:114px}.eui-19 :host.eui-block-content--blocked:before{border-top:var(--eui-s-2xs) solid currentcolor;border-right:var(--eui-s-2xs) solid currentcolor;border-bottom-style:solid;border-left-style:solid;border-radius:var(--eui-br-max);border-bottom-width:var(--eui-s-2xs);border-left-width:var(--eui-s-2xs);border-bottom-color:var(--eui-c-s-secondary-border-light);border-left-color:var(--eui-c-s-secondary-border-light);color:var(--eui-c-s-primary-base);-webkit-animation:spin .65s linear infinite;animation:spin .65s linear infinite;display:block;height:80px;left:50%;margin:-40px 0 0 -40px;top:50%;content:\"\";position:absolute;width:80px;z-index:var(--eui-zi-overlay)}.eui-19 :host.eui-block-content--blocked:after{background-color:#fff6;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-block-content', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eui-19 :host.eui-block-content{display:block;position:relative}.eui-19 :host.eui-block-content--blocked{min-height:114px}.eui-19 :host.eui-block-content--blocked:before{border-top:var(--eui-s-2xs) solid currentcolor;border-right:var(--eui-s-2xs) solid currentcolor;border-bottom-style:solid;border-left-style:solid;border-radius:var(--eui-br-max);border-bottom-width:var(--eui-s-2xs);border-left-width:var(--eui-s-2xs);border-bottom-color:var(--eui-c-s-secondary-border-light);border-left-color:var(--eui-c-s-secondary-border-light);color:var(--eui-c-s-primary-base);-webkit-animation:spin .65s linear infinite;animation:spin .65s linear infinite;display:block;height:80px;left:50%;margin:-40px 0 0 -40px;top:50%;content:\"\";position:absolute;width:80px;z-index:var(--eui-zi-overlay)}.eui-19 :host.eui-block-content--blocked:after{background-color:#fff6;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n"] }]
        }], propDecorators: { cssClasses: [{
                type: HostBinding,
                args: ['class']
            }], role: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.role']
            }], ariaLabel: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.aria-label']
            }], isBlocked: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }] } });

/**
 * @deprecated Import the standalone {@link EUI_BLOCK_CONTENT} instead.
 * This module is maintained for backward compatibility.
 */
class EuiBlockContentModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentModule, imports: [EuiBlockContentComponent], exports: [EuiBlockContentComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentModule }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiBlockContentModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [EuiBlockContentComponent],
                    exports: [EuiBlockContentComponent],
                }]
        }] });

const EUI_BLOCK_CONTENT = [
    EuiBlockContentComponent,
];
// export { EuiBlockContentComponent as EuiBlockContent } from './eui-block-content.component';

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

export { EUI_BLOCK_CONTENT, EuiBlockContentComponent, EuiBlockContentModule };
//# sourceMappingURL=eui-components-eui-block-content.mjs.map
