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

/**
 * @description
 * A component that represents an individual item within an input group add-on.
 * Can be used either as an attribute selector on a div or as a custom element.
 */
class EuiInputGroupAddOnItemComponent {
    constructor() {
        /**
         * @description
         * Input property for setting the data-e2e attribute value.
         * Used for end-to-end testing purposes.
         *
         * @default 'eui-input-group-addon-item'
         */
        this.e2eAttr = 'eui-input-group-addon-item';
    }
    /**
     * @description
     * Getter that returns the CSS class for the component.
     * Bound to the host element's class attribute.
     *
     * @returns {string} The CSS class name
     */
    get cssClasses() {
        return 'eui-input-group-addon-item';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupAddOnItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiInputGroupAddOnItemComponent, isStandalone: true, selector: "div[euiInputGroupAddOnItem], eui-input-group-addon-item", inputs: { e2eAttr: "e2eAttr" }, host: { properties: { "attr.data-e2e": "this.e2eAttr", "class": "this.cssClasses" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 .eui-input-group :host.eui-input-group-addon-item{align-items:center;align-self:stretch;background-color:var(--eui-c-s-secondary-surface-light);border:var(--eui-bw-xs) solid var(--eui-c-s-secondary-border-light);border-radius:var(--eui-br-none);box-shadow:none;color:var(--eui-c-text);display:flex;flex-shrink:0;font:var(--eui-f-m-compact);height:auto;justify-content:center;min-height:var(--eui-s-3xl);min-width:var(--eui-s-3xl);padding:0 var(--eui-s-xs)}.eui-19 .eui-input-group--size-s :host.eui-input-group-addon-item{min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs))}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupAddOnItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 'div[euiInputGroupAddOnItem], eui-input-group-addon-item', template: '<ng-content/>', styles: [".eui-19 .eui-input-group :host.eui-input-group-addon-item{align-items:center;align-self:stretch;background-color:var(--eui-c-s-secondary-surface-light);border:var(--eui-bw-xs) solid var(--eui-c-s-secondary-border-light);border-radius:var(--eui-br-none);box-shadow:none;color:var(--eui-c-text);display:flex;flex-shrink:0;font:var(--eui-f-m-compact);height:auto;justify-content:center;min-height:var(--eui-s-3xl);min-width:var(--eui-s-3xl);padding:0 var(--eui-s-xs)}.eui-19 .eui-input-group--size-s :host.eui-input-group-addon-item{min-height:calc(var(--eui-s-2xl) + var(--eui-s-2xs))}\n"] }]
        }], propDecorators: { e2eAttr: [{
                type: HostBinding,
                args: ['attr.data-e2e']
            }, {
                type: Input
            }], cssClasses: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @description
 * A component that serves as a container for input group add-on items.
 * Can be used either as an attribute selector on a div or as a custom element.
 */
class EuiInputGroupAddOnComponent {
    constructor() {
        /**
         * @description
         * Input property for setting the data-e2e attribute value.
         * Used for end-to-end testing purposes.
         *
         * @default 'eui-input-group-addon'
         */
        this.e2eAttr = 'eui-input-group-addon'; /**
         * @description
         * Getter that returns the CSS class for the component.
         * Bound to the host element's class attribute.
         *
         * @returns {string} The CSS class name
         */
    }
    get cssClasses() {
        return 'eui-input-group-addon';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupAddOnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiInputGroupAddOnComponent, isStandalone: true, selector: "div[euiInputGroupAddOn], eui-input-group-addon", inputs: { e2eAttr: "e2eAttr" }, host: { properties: { "attr.data-e2e": "this.e2eAttr", "class": "this.cssClasses" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19 :host.eui-input-group-addon{align-items:stretch;display:flex;position:relative;width:100%}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child){border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:last-child){border-bottom-left-radius:var(--eui-br-m);border-top-left-radius:var(--eui-br-m);border-bottom-right-radius:var(--eui-br-none);border-top-right-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child){border-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-select{border-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:last-child:not(:first-child){border-radius:var(--eui-br-none) var(--eui-br-m) var(--eui-br-m) var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-button,.eui-19 :host.eui-input-group-addon ::ng-deep eui-dropdown{margin-left:-2px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-text+.eui-input-group-addon-item,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-number+.eui-input-group-addon-item{border-left-color:transparent}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-button,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-textarea{margin-left:-1px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-select{border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none);margin-left:-1px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-select{border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none);margin-left:-1px}.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-text,.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-select,.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-number{padding:calc(var(--eui-s-2xs) - 1px) calc(var(--eui-s-m) - 1px)}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupAddOnComponent, decorators: [{
            type: Component,
            args: [{ selector: 'div[euiInputGroupAddOn], eui-input-group-addon', template: '<ng-content/>', styles: [".eui-19 :host.eui-input-group-addon{align-items:stretch;display:flex;position:relative;width:100%}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child){border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:last-child){border-bottom-left-radius:var(--eui-br-m);border-top-left-radius:var(--eui-br-m);border-bottom-right-radius:var(--eui-br-none);border-top-right-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child){border-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep>:not(:first-child):not(:last-child)>.eui-select{border-radius:var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep>:last-child:not(:first-child){border-radius:var(--eui-br-none) var(--eui-br-m) var(--eui-br-m) var(--eui-br-none)}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-button,.eui-19 :host.eui-input-group-addon ::ng-deep eui-dropdown{margin-left:-2px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-text+.eui-input-group-addon-item,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-number+.eui-input-group-addon-item{border-left-color:transparent}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-button,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-textarea{margin-left:-1px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-select{border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none);margin-left:-1px}.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-autocomplete__wrapper .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-textarea__wrapper .eui-select,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-textarea,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-input-text,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-input-number,.eui-19 :host.eui-input-group-addon ::ng-deep .eui-input-group-addon-item+.eui-input-maxlength-wrapper .eui-select{border-bottom-left-radius:var(--eui-br-none);border-top-left-radius:var(--eui-br-none);margin-left:-1px}.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-text,.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-select,.eui-19 .eui-input-group--size-s :host.eui-input-group-addon ::ng-deep .eui-input-number{padding:calc(var(--eui-s-2xs) - 1px) calc(var(--eui-s-m) - 1px)}\n"] }]
        }], propDecorators: { e2eAttr: [{
                type: HostBinding,
                args: ['attr.data-e2e']
            }, {
                type: Input
            }], cssClasses: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * @description
 * A component that serves as the main container for input group elements.
 * Can only be used as an attribute selector on a div element.
 */
class EuiInputGroupComponent {
    constructor() {
        /**
         * @description
         * Input property for setting the data-e2e attribute value.
         * Used for end-to-end testing purposes.
         *
         * @default 'eui-input-group'
         */
        this.e2eAttr = 'eui-input-group';
        /**
         * @description
         * Protected property that defines the type of the input group.
         * Bound to the host element's type attribute.
         *
         * @protected
         * @default 'inputGroup'
         */
        this.type = 'inputGroup';
        this.baseStatesDirective = inject(BaseStatesDirective);
    }
    /**
     * @description
     * Getter that returns the CSS class for the component.
     * Bound to the host element's class attribute.
     *
     * @returns {string} The CSS class name
     */
    get cssClasses() {
        return [
            this.baseStatesDirective.getCssClasses('eui-input-group'),
        ].join(' ').trim();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: EuiInputGroupComponent, isStandalone: true, selector: "div[euiInputGroup]", inputs: { e2eAttr: "e2eAttr" }, host: { properties: { "attr.data-e2e": "this.e2eAttr", "class": "this.cssClasses", "attr.type": "this.type" } }, hostDirectives: [{ directive: i1.BaseStatesDirective, inputs: ["euiSizeS", "euiSizeS", "euiSizeVariant", "euiSizeVariant"] }], ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eui-19.eui-t-ds2025 :host.eui-input-group{--_label-font: var(--eui-f-label-m-semi-bold)}.eui-19 :host.eui-input-group{--_label-font: var(--eui-f-m-bold)}.eui-19 :host.eui-input-group{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-19 :host.eui-input-group ::ng-deep>.eui-label{align-items:center;display:inline-flex}.eui-19 :host.eui-input-group ::ng-deep>.eui-label:first-child{font:var(--_label-font);margin-bottom:var(--eui-s-2xs);min-height:var(--eui-s-l)}.eui-19 :host.eui-input-group.row{align-items:center;flex-direction:row}.eui-19 :host.eui-input-group.row ::ng-deep .eui-label{align-items:center;display:flex;justify-content:flex-end;margin-bottom:0!important;margin-top:0;padding-right:0;text-align:right;font:var(--eui-f-m);white-space:normal}.eui-19 :host.eui-input-group.row ::ng-deep .eui-label:first-child{font:var(--_label-font)}@media screen and (max-width: 767px){.eui-19 :host.eui-input-group.row{flex-direction:column}.eui-19 :host.eui-input-group.row ::ng-deep label,.eui-19 :host.eui-input-group.row ::ng-deep .eui-label{justify-content:flex-start;text-align:left}}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupComponent, decorators: [{
            type: Component,
            args: [{ selector: 'div[euiInputGroup]', template: '<ng-content/>', hostDirectives: [
                        {
                            directive: BaseStatesDirective,
                            inputs: [
                                'euiSizeS',
                                'euiSizeVariant',
                            ],
                        },
                    ], styles: [".eui-19.eui-t-ds2025 :host.eui-input-group{--_label-font: var(--eui-f-label-m-semi-bold)}.eui-19 :host.eui-input-group{--_label-font: var(--eui-f-m-bold)}.eui-19 :host.eui-input-group{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-19 :host.eui-input-group ::ng-deep>.eui-label{align-items:center;display:inline-flex}.eui-19 :host.eui-input-group ::ng-deep>.eui-label:first-child{font:var(--_label-font);margin-bottom:var(--eui-s-2xs);min-height:var(--eui-s-l)}.eui-19 :host.eui-input-group.row{align-items:center;flex-direction:row}.eui-19 :host.eui-input-group.row ::ng-deep .eui-label{align-items:center;display:flex;justify-content:flex-end;margin-bottom:0!important;margin-top:0;padding-right:0;text-align:right;font:var(--eui-f-m);white-space:normal}.eui-19 :host.eui-input-group.row ::ng-deep .eui-label:first-child{font:var(--_label-font)}@media screen and (max-width: 767px){.eui-19 :host.eui-input-group.row{flex-direction:column}.eui-19 :host.eui-input-group.row ::ng-deep label,.eui-19 :host.eui-input-group.row ::ng-deep .eui-label{justify-content:flex-start;text-align:left}}\n"] }]
        }], propDecorators: { e2eAttr: [{
                type: HostBinding,
                args: ['attr.data-e2e']
            }, {
                type: Input
            }], cssClasses: [{
                type: HostBinding,
                args: ['class']
            }], type: [{
                type: HostBinding,
                args: ['attr.type']
            }] } });

/**
 * @description
 * Angular module that provides input group components for the EUI framework.
 * Includes the main input group component and its add-on components.
 *
 * @deprecated Use {@link EUI_INPUT_GROUP} instead.
 */
class EuiInputGroupModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupModule, imports: [EuiInputGroupComponent,
            EuiInputGroupAddOnComponent,
            EuiInputGroupAddOnItemComponent], exports: [EuiInputGroupComponent,
            EuiInputGroupAddOnComponent,
            EuiInputGroupAddOnItemComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupModule }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EuiInputGroupModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        EuiInputGroupComponent,
                        EuiInputGroupAddOnComponent,
                        EuiInputGroupAddOnItemComponent,
                    ],
                    exports: [
                        EuiInputGroupComponent,
                        EuiInputGroupAddOnComponent,
                        EuiInputGroupAddOnItemComponent,
                    ],
                }]
        }] });

const EUI_INPUT_GROUP = [
    EuiInputGroupComponent,
    EuiInputGroupAddOnComponent,
    EuiInputGroupAddOnItemComponent,
];

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

export { EUI_INPUT_GROUP, EuiInputGroupAddOnComponent, EuiInputGroupAddOnItemComponent, EuiInputGroupComponent, EuiInputGroupModule };
//# sourceMappingURL=eui-components-eui-input-group.mjs.map
