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

/**
 * @description
 * EuiBlockDocumentComponent creates a document overlay that can be toggled into
 * a blocked state. When blocked, a loading indicator is displayed.
 * Uses OnPush change detection strategy for better performance.
 *
 * @usageNotes
 * #### Typically placed at app root level
 * ```html
 * <eui-block-document [isBlocked]="isProcessing"></eui-block-document>
 * ```
 *
 * #### Trigger blocking from component
 * ```html
 * <button euiButton (click)="blockDocument()">Process Data</button>
 * ```
 *
 * ```ts
 * import { EuiAppShellService } from '@eui/core';
 *
 * private appShellService = inject(EuiAppShellService);
 * isProcessing = false;
 *
 * blockDocument(): void {
 *   this.appShellService.isBlockDocumentActive = true;
 *
 *   // Simulate async operation
 *   setTimeout(() => {
 *     this.appShellService.isBlockDocumentActive = false;
 *   }, 2000);
 * }
 * ```
 *
 * ### Accessibility
 * - Uses role="region" for semantic landmark identification
 * - aria-label provides context about the blocked state
 * - Loading indicator is announced to screen readers
 * - Prevents interaction with underlying content when blocked
 * - Focus is trapped within the overlay during blocked state
 *
 * ### Notes
 * - Typically controlled via EuiAppShellService.isBlockDocumentActive property
 * - Creates full-page overlay when isBlocked is true
 * - Displays loading spinner automatically during blocked state
 * - Should be placed at application root level for full document coverage
 * - Use for long-running operations that require blocking entire UI
 * - Different from eui-block-content which blocks specific sections
 * - Automatically handles z-index to appear above all content
 * - Consider user experience - use sparingly for truly blocking operations
 */
class EuiBlockDocumentComponent {
    constructor() {
        /**
         * Controls whether the document is in blocked state.
         * When true, displays the loading indicator.
         *
         * @default false
         */
        this.isBlocked = false;
        /**
         * ARIA role for the document component.
         *
         * @default 'region'
         */
        this.role = 'region';
        /**
         * ARIA label for the document component.
         *
         * @default 'eUI Block Document'
         */
        this.ariaLabel = 'eUI Block Document';
    }
    /**
     * Applies CSS classes to the host element.
     * Always includes 'eui-block-document' and conditionally adds
     * 'eui-block-document--blocked' when isBlocked is true.
     *
     * @returns String of space-separated CSS classes
     */
    get cssClasses() {
        return [
            'eui-block-document',
            this.isBlocked ? 'eui-block-document--blocked' : '',
        ].join(' ').trim();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: EuiBlockDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.1.0", type: EuiBlockDocumentComponent, isStandalone: true, selector: "eui-block-document", inputs: { isBlocked: ["isBlocked", "isBlocked", booleanAttribute], ariaLabel: "ariaLabel" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel" } }, ngImport: i0, template: "<div class=\"eui-block-document__loader\"></div>\n", styles: [".eui-21 :host.eui-block-document .eui-block-document__loader{display:none}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader{display:block;inset:0;margin:auto;overflow:show;position:fixed;z-index:var(--eui-zi-block-document)}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:before{background-color:#0000001a;content:\"\";display:block;height:100%;left:0;position:fixed;top:0;width:100%}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:not(:required){background-color:transparent;border:var(--eui-bw-none);color:transparent;font:0/0 a;text-shadow:none}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:not(:required):after{border-top:var(--eui-s-xs) solid currentcolor;border-right:var(--eui-s-xs) solid currentcolor;border-bottom-style:solid;border-left-style:solid;border-radius:var(--eui-br-max);border-bottom-width:var(--eui-s-xs);border-left-width:var(--eui-s-xs);border-bottom-color:#0003;border-left-color:#0003;color:var(--eui-c-primary-base);-webkit-animation:spin .65s linear infinite;animation:spin .65s linear infinite;display:block;left:50%;margin:-40px 0 0 -40px;top:50%;content:\"\";position:absolute;height:120px;width:120px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: EuiBlockDocumentComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-block-document', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"eui-block-document__loader\"></div>\n", styles: [".eui-21 :host.eui-block-document .eui-block-document__loader{display:none}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader{display:block;inset:0;margin:auto;overflow:show;position:fixed;z-index:var(--eui-zi-block-document)}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:before{background-color:#0000001a;content:\"\";display:block;height:100%;left:0;position:fixed;top:0;width:100%}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:not(:required){background-color:transparent;border:var(--eui-bw-none);color:transparent;font:0/0 a;text-shadow:none}.eui-21 :host.eui-block-document--blocked .eui-block-document__loader:not(:required):after{border-top:var(--eui-s-xs) solid currentcolor;border-right:var(--eui-s-xs) solid currentcolor;border-bottom-style:solid;border-left-style:solid;border-radius:var(--eui-br-max);border-bottom-width:var(--eui-s-xs);border-left-width:var(--eui-s-xs);border-bottom-color:#0003;border-left-color:#0003;color:var(--eui-c-primary-base);-webkit-animation:spin .65s linear infinite;animation:spin .65s linear infinite;display:block;left:50%;margin:-40px 0 0 -40px;top:50%;content:\"\";position:absolute;height:120px;width:120px}\n"] }]
        }], propDecorators: { cssClasses: [{
                type: HostBinding,
                args: ['class']
            }], isBlocked: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], role: [{
                type: HostBinding,
                args: ['attr.role']
            }], ariaLabel: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.aria-label']
            }] } });

const EUI_BLOCK_DOCUMENT = [
    EuiBlockDocumentComponent,
];
// export { EuiBlockDocumentComponent as EuiBlockDocument } from './eui-block-document.component';

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

export { EUI_BLOCK_DOCUMENT, EuiBlockDocumentComponent };
//# sourceMappingURL=eui-components-eui-block-document.mjs.map
