@eui/components 18.0.0-next.25 → 18.0.0-next.27

package/fesm2022/eui-components-eui-input-checkbox.mjs.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../eui-input-checkbox/eui-input-checkbox.component.ts", "../../eui-input-checkbox/eui-input-checkbox.module.ts"],
   "sourcesContent": ["import {\n    DoCheck,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    Optional,\n    Renderer2,\n    Self,\n    SimpleChanges,\n    OnInit,\n    HostListener,\n    ChangeDetectorRef,\n    Component,\n    ViewEncapsulation,\n    Injector,\n    ViewContainerRef,\n    Output,\n    EventEmitter,\n} from '@angular/core';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { InputDirective } from '@eui/components/shared';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\n\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'input[euiInputCheckBox]',\n    styleUrls: ['./styles/_index.scss'],\n    template: '',\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EuiInputCheckboxComponent extends InputDirective implements OnInit, DoCheck, OnChanges, ControlValueAccessor {\n    @HostBinding('class')\n    public get cssClasses(): string {\n        return [this.getCssClasses('eui-input-checkbox'), this._isInvalid ? 'eui-input-checkbox--invalid' : ''].join(' ').trim();\n    }\n    /** Event emitted when the checkbox `indeterminate` value changes. */\n    @Output() readonly indeterminateChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n    /**\n     * Whether the checkbox is indeterminate. This is also known as \"mixed\" mode and can be used to\n     * represent a checkbox with three states, e.g. a checkbox that represents a nested list of\n     * checkable items. Note that whenever checkbox is manually clicked, indeterminate is immediately\n     * set to false.\n     */\n    @Input()\n    get indeterminate(): boolean {\n        return this._indeterminate;\n    }\n    set indeterminate(value: BooleanInput) {\n        const changed = value != this._indeterminate;\n        this._indeterminate = coerceBooleanProperty(value);\n\n        if (changed) {\n            this.indeterminateChange.emit(this._indeterminate);\n        }\n\n        this._syncIndeterminate(this._checked ? false : this._indeterminate);\n    }\n\n    @Input()\n    public get isInvalid(): boolean {\n        return this._isInvalid || null;\n    }\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    public set isInvalid(state: any) {\n        this.setInvalid(state);\n    }\n\n    protected _isInvalid: boolean;\n\n    @Input() styleClass: string;\n    @HostBinding('attr.type') protected type = 'checkbox';\n\n    @HostBinding('attr.checked')\n    @Input()\n    public get checked(): boolean {\n        return this._checked;\n    }\n\n    public set checked(value: BooleanInput) {\n        this._checked = coerceBooleanProperty(value) ? true : undefined;\n    }\n\n    protected _checked: boolean;\n\n    @HostBinding('attr.id')\n    @Input()\n    public get id(): string {\n        return this._id;\n    }\n\n    public set id(value: string | null) {\n        this.setIdAttribute(value);\n    }\n\n    protected _id: string;\n    private _indeterminate = false;\n\n    constructor(\n        @Optional() @Self() protected ngControl: NgControl,\n        protected _elementRef: ElementRef<HTMLInputElement>,\n        protected _renderer: Renderer2,\n        private _cd: ChangeDetectorRef,\n        private viewContainerRef: ViewContainerRef,\n        injector: Injector,\n    ) {\n        super(_elementRef, _renderer, injector);\n\n        // if there's no id attribute set one\n        if (!this._id) {\n            this.setIdAttribute();\n        }\n\n        // register control valueAccessor\n        if (this.ngControl) {\n            this.ngControl.valueAccessor = this;\n        }\n    }\n\n    ngOnInit(): void {\n        super.ngOnInit();\n\n        // in case control value is null set the default one (isChecked) and sync Control State\n        if (this.ngControl?.control?.value === null) {\n            this.ngControl.control.setValue(this._checked, { emitModelToViewChange: false });\n            // changing Model Expression after view checked, so detect changes\n            // TODO: check why although it's checked .checked returns false\n            // this.ngControl.viewToModelUpdate(this._checked);\n            // this._cd.detectChanges();\n        }\n    }\n\n    ngDoCheck(): void {\n        if (this.ngControl) {\n            this._isInvalid = this.ngControl.invalid && this.ngControl.touched;\n        }\n    }\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['checked']) {\n            const currentValue = coerceBooleanProperty(changes['checked']?.currentValue);\n            if (currentValue !== this?.ngControl?.control?.value) {\n                this._checked = currentValue;\n                this._elementRef.nativeElement.checked = currentValue;\n            }\n        }\n\n        if (changes['readonly']) {\n            const readonly = coerceBooleanProperty(changes['readonly']?.currentValue);\n            if (readonly) {\n                this._renderer.setAttribute(this._elementRef.nativeElement, 'readonly', null);\n            } else {\n                this._renderer.removeAttribute(this._elementRef.nativeElement, 'readonly');\n            }\n        }\n    }\n\n    writeValue(obj: boolean): void {\n        this._checked = coerceBooleanProperty(obj) ? true : undefined;\n        this._elementRef.nativeElement.checked = this._checked ? true : undefined;\n    }\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    registerOnChange(fn: any): void {\n        this.onChange = fn;\n    }\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    registerOnTouched(fn: any): void {\n        this.onBlur = fn;\n    }\n\n    setDisabledState?(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n    }\n\n    @HostListener('change', ['$event.target.checked'])\n    protected onChanged(checked): void {\n        this.onChange(checked);\n    }\n\n    @HostListener('keydown.space', ['$event'])\n    protected onSpacePressed(event: KeyboardEvent): void {\n        if (this.readonly) {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    protected onChange = (_): void => {\n        /* Nothing to be Done so far */\n    };\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    protected onBlur = (_: any): void => {\n        /* Nothing to be Done so far */\n    };\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    protected setInvalid(state?: any): void {\n        // in case it's controlled by NgControl override\n        this._isInvalid = this.control ? this.control.invalid && this.control.touched : coerceBooleanProperty(state);\n    }\n\n    /**\n     * Sets the indeterminate state of the checkbox. This is also known as \"mixed\" mode and can be used to\n     * represent a checkbox with three states, e.g. a checkbox that represents a nested list of\n     * checkable items.\n     *\n     * @param value\n     * @private\n     */\n    private _syncIndeterminate(value: boolean): void {\n        if (this._elementRef) {\n            this._elementRef.nativeElement.indeterminate = value;\n        }\n    }\n}\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EuiInputCheckboxComponent } from './eui-input-checkbox.component';\n\n@NgModule({\n    imports: [CommonModule],\n    declarations: [EuiInputCheckboxComponent],\n    exports: [EuiInputCheckboxComponent],\n})\nexport class EuiInputCheckboxModule {}\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/fesm2022/eui-components-eui-input-radio.mjs

@@ -117,12 +117,12 @@ var EuiInputRadioComponent = class _EuiInputRadioComponent extends InputDirectiv
     this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: _EuiInputRadioComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EuiInputRadioComponent, selector: "input[euiInputRadio]", inputs: { isInvalid: "isInvalid", defaultChecked: ["checked", "defaultChecked"], value: "value" }, host: { listeners: { "change": "onCheckedChanged($event)", "keydown.space": "onSpacePressed($event)" }, properties: { "class": "this.class", "attr.type": "this.type", "attr.checked": "this.defaultChecked" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "", isInline: true, styles: ['.eui-input-radio:not(.cdk-visually-hidden){appearance:inherit;align-items:center;border-radius:50%;cursor:pointer;display:inline-flex;flex-shrink:0;height:1.25rem;justify-content:center;margin-right:var(--eui-base-spacing-s);position:relative;vertical-align:middle;transition:all .25s ease;width:1.25rem;accent-color:var(--eui-base-color-white);background:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-75)}.eui-input-radio:not(.cdk-visually-hidden)+label,.eui-input-radio:not(.cdk-visually-hidden)+.eui-label{display:inline-flex;cursor:pointer;margin-right:var(--eui-base-spacing-m);white-space:inherit}.eui-input-radio:not(.cdk-visually-hidden):checked{background:var(--eui-base-color-white)}.eui-input-radio:not(.cdk-visually-hidden):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]){background:var(--eui-base-color-grey-25);border:2px solid var(--eui-base-color-grey-75);opacity:.25;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly])+label{pointer-events:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]{display:none;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly] .eui-label{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+.eui-label{display:inline-flex;cursor:default;margin-bottom:0;pointer-events:none;position:initial}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger{border:2px solid var(--eui-base-color-danger-100)!important}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid:checked:before,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger:checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-danger-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden):focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden) [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}\n'], encapsulation: i0.ViewEncapsulation.None });
+    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EuiInputRadioComponent, selector: "input[euiInputRadio]", inputs: { isInvalid: "isInvalid", defaultChecked: ["checked", "defaultChecked"], value: "value" }, host: { listeners: { "change": "onCheckedChanged($event)", "keydown.space": "onSpacePressed($event)" }, properties: { "class": "this.class", "attr.type": "this.type", "attr.checked": "this.defaultChecked" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "", isInline: true, styles: ['.eui-input-radio:not(.cdk-visually-hidden){appearance:inherit;align-items:center;border-radius:50%;cursor:pointer;display:inline-flex;flex-shrink:0;height:var(--eui-base-spacing-xl);justify-content:center;margin-right:var(--eui-base-spacing-s);position:relative;vertical-align:middle;transition:all .25s ease;width:var(--eui-base-spacing-xl);accent-color:var(--eui-base-color-white);background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-75)}.eui-input-radio:not(.cdk-visually-hidden)+label,.eui-input-radio:not(.cdk-visually-hidden)+.eui-label{display:inline-flex;cursor:pointer;margin-right:var(--eui-base-spacing-m);white-space:inherit}.eui-input-radio:not(.cdk-visually-hidden):checked{background:var(--eui-base-color-white)}.eui-input-radio:not(.cdk-visually-hidden):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]){background:var(--eui-base-color-grey-25);border:1px solid var(--eui-base-color-grey-75);opacity:.25;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly])+label{pointer-events:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]{display:none;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly] .eui-label{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+.eui-label{display:inline-flex;cursor:default;margin-bottom:0;pointer-events:none;position:initial}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger{border:1px solid var(--eui-base-color-danger-100)!important}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid:checked:before,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger:checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-danger-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden):focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden) [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}\n'], encapsulation: i0.ViewEncapsulation.None });
   }
 };
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiInputRadioComponent, decorators: [{
   type: Component,
-  args: [{ selector: "input[euiInputRadio]", template: "", encapsulation: ViewEncapsulation.None, styles: ['.eui-input-radio:not(.cdk-visually-hidden){appearance:inherit;align-items:center;border-radius:50%;cursor:pointer;display:inline-flex;flex-shrink:0;height:1.25rem;justify-content:center;margin-right:var(--eui-base-spacing-s);position:relative;vertical-align:middle;transition:all .25s ease;width:1.25rem;accent-color:var(--eui-base-color-white);background:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-75)}.eui-input-radio:not(.cdk-visually-hidden)+label,.eui-input-radio:not(.cdk-visually-hidden)+.eui-label{display:inline-flex;cursor:pointer;margin-right:var(--eui-base-spacing-m);white-space:inherit}.eui-input-radio:not(.cdk-visually-hidden):checked{background:var(--eui-base-color-white)}.eui-input-radio:not(.cdk-visually-hidden):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]){background:var(--eui-base-color-grey-25);border:2px solid var(--eui-base-color-grey-75);opacity:.25;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly])+label{pointer-events:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]{display:none;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly] .eui-label{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+.eui-label{display:inline-flex;cursor:default;margin-bottom:0;pointer-events:none;position:initial}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger{border:2px solid var(--eui-base-color-danger-100)!important}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid:checked:before,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger:checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-danger-100);height:.75rem;width:.75rem}.eui-input-radio:not(.cdk-visually-hidden):focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden):focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden) [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}\n'] }]
+  args: [{ selector: "input[euiInputRadio]", template: "", encapsulation: ViewEncapsulation.None, styles: ['.eui-input-radio:not(.cdk-visually-hidden){appearance:inherit;align-items:center;border-radius:50%;cursor:pointer;display:inline-flex;flex-shrink:0;height:var(--eui-base-spacing-xl);justify-content:center;margin-right:var(--eui-base-spacing-s);position:relative;vertical-align:middle;transition:all .25s ease;width:var(--eui-base-spacing-xl);accent-color:var(--eui-base-color-white);background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-75)}.eui-input-radio:not(.cdk-visually-hidden)+label,.eui-input-radio:not(.cdk-visually-hidden)+.eui-label{display:inline-flex;cursor:pointer;margin-right:var(--eui-base-spacing-m);white-space:inherit}.eui-input-radio:not(.cdk-visually-hidden):checked{background:var(--eui-base-color-white)}.eui-input-radio:not(.cdk-visually-hidden):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]){background:var(--eui-base-color-grey-25);border:1px solid var(--eui-base-color-grey-75);opacity:.25;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly]):checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):disabled:not([readonly])+label{pointer-events:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]{display:none;pointer-events:none;-webkit-user-select:none;user-select:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly] .eui-label{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked{display:none}.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+label,.eui-input-radio:not(.cdk-visually-hidden)[readonly]:checked+.eui-label{display:inline-flex;cursor:default;margin-bottom:0;pointer-events:none;position:initial}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger{border:1px solid var(--eui-base-color-danger-100)!important}.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--invalid:checked:before,.eui-input-radio:not(.cdk-visually-hidden).eui-input-radio--danger:checked:before{height:1rem;width:1rem;content:"";-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:cover;mask-size:cover;-webkit-mask-image:var(--eui-internal-icon-ellipse-path);mask-image:var(--eui-internal-icon-ellipse-path);background-color:var(--eui-base-color-danger-100);height:var(--eui-base-spacing-l);width:var(--eui-base-spacing-l)}.eui-input-radio:not(.cdk-visually-hidden):focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden):focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-input-radio:not(.cdk-visually-hidden) [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}\n'] }]
 }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
   type: Optional
 }, {

package/fesm2022/eui-components-eui-input-radio.mjs.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../eui-input-radio/eui-input-radio.component.ts", "../../eui-input-radio/eui-input-radio.module.ts"],
   "sourcesContent": ["import {\n    DoCheck,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    Optional,\n    Renderer2,\n    Self,\n    SimpleChanges,\n    OnInit,\n    ChangeDetectorRef,\n    Component,\n    ViewEncapsulation,\n    HostListener,\n    Injector,\n    ViewContainerRef,\n} from '@angular/core';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { InputDirective } from '@eui/components/shared';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\nimport { ChangeEvent } from 'cleave.js/react/props';\n\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'input[euiInputRadio]',\n    styleUrls: ['./styles/_index.scss'],\n    template: '',\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EuiInputRadioComponent extends InputDirective implements OnInit, DoCheck, OnChanges, ControlValueAccessor {\n    @Input()\n    public get isInvalid(): boolean {\n        return this._isInvalid || null;\n    }\n    public set isInvalid(state: BooleanInput) {\n        this.setInvalid(state);\n    }\n    protected _isInvalid: boolean;\n\n    @HostBinding('class')\n    // TODO v18 - check why this is applied\n    // @Input()\n    // public set class(cssClass: string) {\n    //     super.styleClass = cssClass;\n    // }\n    public get class(): string {\n        return [super.getCssClasses('eui-input-radio'), this._isInvalid ? 'eui-input-radio--invalid' : ''].join(' ').trim();\n    }\n    @HostBinding('attr.type') protected type = 'radio';\n\n    @HostBinding('attr.checked')\n    @Input('checked')\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    public get defaultChecked(): any {\n        return this._defaultChecked ? '' : null;\n    }\n    public set defaultChecked(value: BooleanInput) {\n        this._defaultChecked = coerceBooleanProperty(value);\n    }\n    protected _defaultChecked: boolean;\n\n    public get selected(): boolean {\n        return this._elementRef?.nativeElement.checked;\n    }\n\n    @Input()\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    get value(): any {\n        return this._value;\n    }\n    set value(value) {\n        this._value = value;\n        if (typeof value === 'number' || typeof value === 'boolean' || !!value) {\n            this._elementRef.nativeElement.value = this._value;\n        }\n    }\n    private _value;\n\n    constructor(\n        @Optional() @Self() protected ngControl: NgControl,\n        private viewContainerRef: ViewContainerRef,\n        protected _elementRef: ElementRef<HTMLInputElement>,\n        protected _renderer: Renderer2,\n        private _cd: ChangeDetectorRef,\n        injector: Injector,\n    ) {\n        super(_elementRef, _renderer, injector);\n\n        // Firefox fix: set type to radio before first ngDoCheck runs\n        this._elementRef.nativeElement.type = 'radio';\n\n        // if there's no id attribute set one\n        if (!this._id) {\n            this.setIdAttribute();\n        }\n\n        // register control valueAccessor\n        if (this.ngControl) {\n            this.ngControl.valueAccessor = this;\n        }\n    }\n\n    ngOnInit(): void {\n        super.ngOnInit();\n\n        // in case control value is null set the default one (isChecked) and sync Control State\n        // if (this.ngControl?.control?.value === null) {\n        // this.ngControl.control.setValue('', { emitModelToViewChange: false });\n        // changing Model Expression after view checked, so detect changes\n        // TODO: check why although it's checked .checked returns false\n        // this.ngControl.viewToModelUpdate(this._checked);\n        // this._cd.detectChanges();\n        // }\n\n        if (this.ngControl) {\n            this.ngControl.statusChanges.subscribe((status) => {\n                this.isInvalid = status === 'INVALID';\n                this.euiDanger = this.isInvalid;\n            });\n        }\n    }\n\n    ngDoCheck(): void {\n        if (this.ngControl) {\n            this.isInvalid = this.ngControl.invalid && this.ngControl.touched;\n        }\n    }\n\n    ngOnChanges(changes: SimpleChanges): void {\n        // when readonly changes hide other radio (input+label)\n        if (changes['readonly']) {\n            const readonly = coerceBooleanProperty(changes['readonly']?.currentValue);\n            if (readonly) {\n                this._renderer.setAttribute(this._elementRef.nativeElement, 'readonly', null);\n            } else {\n                this._renderer.removeAttribute(this._elementRef.nativeElement, 'readonly');\n            }\n        }\n\n        if (changes['isInvalid']) {\n            if (changes['isInvalid'].currentValue) {\n                this._renderer.addClass(this._elementRef.nativeElement, 'eui-input-radio--invalid');\n            } else {\n                this._renderer.removeClass(this._elementRef.nativeElement, 'eui-input-radio--invalid');\n            }\n        }\n    }\n\n    writeValue(obj: string): void {\n        // set checked state based if radio value matches the control's one\n        this._elementRef.nativeElement.checked = this._value === obj;\n    }\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    registerOnChange(fn: any): void {\n        this.onChange = fn;\n    }\n\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    registerOnTouched(fn: any): void {\n        this.onTouched = fn;\n    }\n\n    setDisabledState?(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n    }\n\n    @HostListener('change', ['$event'])\n    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    protected onCheckedChanged(event: ChangeEvent<any>): void {\n        this._defaultChecked = event.target.checked;\n        this.onChange(event.target.value === 'on' ? null : event.target.value);\n    }\n\n    @HostListener('keydown.space', ['$event'])\n    protected onSpacePressed(event: KeyboardEvent): void {\n        if (this.readonly) {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    }\n\n    protected setInvalid(state): void {\n        // in case it's controlled by NgControl override\n        this._isInvalid = this.control ? this.control.invalid && this.control.touched : coerceBooleanProperty(state);\n\n        // set BaseDirective Attribute\n        super.euiDanger = this._isInvalid;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    protected onChange = (_): void => {\n        /* Nothing to be Done so far */\n    };\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    protected onTouched = (_): void => {\n        /* Nothing to be Done so far */\n    };\n}\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { EuiInputRadioComponent } from './eui-input-radio.component';\n\n@NgModule({\n    imports: [CommonModule],\n    declarations: [EuiInputRadioComponent],\n    exports: [EuiInputRadioComponent],\n})\nexport class EuiInputRadioModule {}\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/fesm2022/eui-components-eui-language-selector.mjs

@@ -0,0 +1,214 @@
+// modal-selector/modal-selector.component.mjs
+import { Component, ViewEncapsulation, ChangeDetectionStrategy, Inject } from "@angular/core";
+import { EuiEuLanguages } from "@eui/base";
+import { DIALOG_COMPONENT_CONFIG } from "@eui/components/eui-dialog";
+import * as i0 from "@angular/core";
+import * as i1 from "@eui/components/eui-dialog";
+import * as i2 from "@angular/common";
+import * as i3 from "@eui/components/eui-button";
+var EuiModalSelectorComponent = class _EuiModalSelectorComponent {
+  constructor(euiDialogService, config) {
+    this.euiDialogService = euiDialogService;
+    this.config = config;
+    this.languageRows = [];
+    this.additionaLanguageRows = [];
+  }
+  ngOnInit() {
+    this.languageRows = this.prepareLanguageRows(EuiEuLanguages.filterEULanguages(this.config.languages));
+    this.additionaLanguageRows = this.prepareLanguageRows(EuiEuLanguages.filterNonEULanguages(this.config.languages));
+  }
+  selectLanguage(languageCode) {
+    if (this.selectedLanguage?.code !== languageCode.code) {
+      for (const language of this.config.languages) {
+        if (language.code === languageCode.code) {
+          this.selectedLanguage = language;
+          break;
+        }
+      }
+    }
+    this.config.languageChanged(languageCode);
+    this.euiDialogService.closeDialog();
+  }
+  prepareLanguageRows(languages) {
+    const rows = [];
+    let row = [];
+    for (let i = 0; i < languages.length; i++) {
+      if (i % 4 === 0) {
+        if (row.length > 0) {
+          rows.push(row);
+          row = [];
+        }
+      }
+      row.push(languages[i]);
+    }
+    if (row.length > 0) {
+      rows.push(row);
+    }
+    return rows;
+  }
+  static {
+    this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: _EuiModalSelectorComponent, deps: [{ token: i1.EuiDialogService }, { token: DIALOG_COMPONENT_CONFIG }], target: i0.ɵɵFactoryTarget.Component });
+  }
+  static {
+    this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EuiModalSelectorComponent, selector: "eui-modal-selector", ngImport: i0, template: '<h4 *ngIf="additionaLanguageRows?.length > 0">EU official languages</h4>\n<div id="eu_languages" *ngFor="let row of languageRows" class="row">\n    <div *ngFor="let language of row" class="col-md-6 mb-2">\n        <button\n            type="button"\n            e2eAttr="eui-language-selector-item_{{ language.code }}"\n            euiButton\n            euiBlockButton\n            [euiSecondary]="language.code !== config.selectedLanguage.code"\n            [euiPrimary]="language.code === config.selectedLanguage.code"\n            (click)="selectLanguage(language)">\n            {{ language.label }} ({{ language.code }})\n        </button>\n    </div>\n</div>\n<ng-container *ngIf="additionaLanguageRows?.length > 0">\n    <br />\n    <h4>Non-EU Languages</h4>\n    <div id="extra_languages" *ngFor="let row of additionaLanguageRows" class="row">\n        <div *ngFor="let language of row" class="col-md-6 mb-2">\n            <button\n                type="button"\n                e2eAttr="eui-language-selector-item_{{ language.code }}"\n                euiButton\n                euiBlockButton\n                [euiSecondary]="language.code !== config.selectedLanguage.code"\n                [euiPrimary]="language.code === config.selectedLanguage.code"\n                (click)="selectLanguage(language)">\n                {{ language.label }} ({{ language.code }})\n            </button>\n        </div>\n    </div>\n</ng-container>\n', dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  }
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiModalSelectorComponent, decorators: [{
+  type: Component,
+  args: [{ selector: "eui-modal-selector", changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: '<h4 *ngIf="additionaLanguageRows?.length > 0">EU official languages</h4>\n<div id="eu_languages" *ngFor="let row of languageRows" class="row">\n    <div *ngFor="let language of row" class="col-md-6 mb-2">\n        <button\n            type="button"\n            e2eAttr="eui-language-selector-item_{{ language.code }}"\n            euiButton\n            euiBlockButton\n            [euiSecondary]="language.code !== config.selectedLanguage.code"\n            [euiPrimary]="language.code === config.selectedLanguage.code"\n            (click)="selectLanguage(language)">\n            {{ language.label }} ({{ language.code }})\n        </button>\n    </div>\n</div>\n<ng-container *ngIf="additionaLanguageRows?.length > 0">\n    <br />\n    <h4>Non-EU Languages</h4>\n    <div id="extra_languages" *ngFor="let row of additionaLanguageRows" class="row">\n        <div *ngFor="let language of row" class="col-md-6 mb-2">\n            <button\n                type="button"\n                e2eAttr="eui-language-selector-item_{{ language.code }}"\n                euiButton\n                euiBlockButton\n                [euiSecondary]="language.code !== config.selectedLanguage.code"\n                [euiPrimary]="language.code === config.selectedLanguage.code"\n                (click)="selectLanguage(language)">\n                {{ language.label }} ({{ language.code }})\n            </button>\n        </div>\n    </div>\n</ng-container>\n' }]
+}], ctorParameters: () => [{ type: i1.EuiDialogService }, { type: void 0, decorators: [{
+  type: Inject,
+  args: [DIALOG_COMPONENT_CONFIG]
+}] }] });
+
+// language-selector.component.mjs
+import { Component as Component2, ViewEncapsulation as ViewEncapsulation3, HostBinding, Input, Output, EventEmitter, booleanAttribute } from "@angular/core";
+import { distinctUntilKeyChanged, map, takeUntil } from "rxjs/operators";
+import { Subject } from "rxjs";
+import { BaseDirective } from "@eui/components/shared";
+import { EuiEuLanguages as EuiEuLanguages2 } from "@eui/base";
+import { EuiDialogConfig } from "@eui/components/eui-dialog";
+import * as i02 from "@angular/core";
+import * as i12 from "@eui/components/eui-dialog";
+import * as i22 from "@eui/core";
+import * as i32 from "@ngx-translate/core";
+import * as i4 from "@angular/common";
+import * as i5 from "@eui/components/eui-dropdown";
+import * as i6 from "@eui/components/eui-icon";
+var EuiLanguageSelectorComponent = class _EuiLanguageSelectorComponent extends BaseDirective {
+  get cssClasses() {
+    return [
+      super.getCssClasses("eui-language-selector"),
+      this.languages?.length <= 1 ? "eui-language-selector--empty" : "",
+      this.isToolbarSelector ? "eui-language-selector--toolbar-selector" : ""
+    ].join(" ").trim();
+  }
+  constructor(cd, euiDialogService, appShellService, translateService) {
+    super();
+    this.cd = cd;
+    this.euiDialogService = euiDialogService;
+    this.appShellService = appShellService;
+    this.translateService = translateService;
+    this.hasLanguageSelection = true;
+    this.isToolbarSelector = false;
+    this.languageSelectorClick = new EventEmitter();
+    this.destroy$ = new Subject();
+  }
+  /**
+   * returns true if there are at least one and max four languages.
+   */
+  get isShowDropDown() {
+    return this.languages?.length > 1 && this.languages?.length < 4;
+  }
+  /**
+   * returns true if there are at least five languages.
+   */
+  get isShowModal() {
+    return this.languages?.length >= 4;
+  }
+  ngOnInit() {
+    this.appShellService.state$.pipe(takeUntil(this.destroy$), distinctUntilKeyChanged("languages"), map((state) => state.languages)).subscribe((languages) => {
+      this.languages = languages ? EuiEuLanguages2.getOrderedLanguages(languages) : EuiEuLanguages2.getLanguages();
+      this.cd.detectChanges();
+    });
+    this.appShellService.state$.pipe(takeUntil(this.destroy$), distinctUntilKeyChanged("activeLanguage"), map((state) => state.activeLanguage)).subscribe((activeLanguage) => {
+      this.selectedLanguage = this.getLanguage(activeLanguage);
+      this.cd.detectChanges();
+    });
+  }
+  ngOnDestroy() {
+    this.destroy$.next(true);
+    this.destroy$.unsubscribe();
+  }
+  onLanguageChanged(language) {
+    this.appShellService.setState({
+      ...this.appShellService.state,
+      activeLanguage: language.code
+    });
+  }
+  /**
+   * Opens the modal that renders the UxLanguage array with modal actions bindings to this Component
+   */
+  open(titleLabel = this.translateService.instant("eui.languageSelector.modalTitle")) {
+    this.euiDialogService.openDialog(new EuiDialogConfig({
+      title: titleLabel,
+      hasFooter: false,
+      hasClosedOnClickOutside: true,
+      bodyComponent: {
+        component: EuiModalSelectorComponent,
+        config: {
+          languages: this.languages,
+          selectedLanguage: this.selectedLanguage,
+          languageChanged: (language) => this.onLanguageChanged(language)
+        }
+      }
+    }));
+  }
+  onClick() {
+    this.languageSelectorClick.emit();
+  }
+  /**
+   * returns the UxLanguage Object from a given language code
+   *
+   * @param languageCode two char language code
+   * @protected
+   */
+  getLanguage(languageCode) {
+    return this.languages.find((lang) => lang.code === languageCode);
+  }
+  static {
+    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i02, type: _EuiLanguageSelectorComponent, deps: [{ token: i02.ChangeDetectorRef }, { token: i12.EuiDialogService }, { token: i22.EuiAppShellService }, { token: i32.TranslateService }], target: i02.ɵɵFactoryTarget.Component });
+  }
+  static {
+    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EuiLanguageSelectorComponent, selector: "eui-language-selector", inputs: { hasLanguageSelection: ["hasLanguageSelection", "hasLanguageSelection", booleanAttribute], isToolbarSelector: ["isToolbarSelector", "isToolbarSelector", booleanAttribute] }, outputs: { languageSelectorClick: "languageSelectorClick" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i02, template: '<ng-container *ngIf="!hasLanguageSelection">\n    <button class="eui-language-selector-button" (click)="onClick()">\n        <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n        <span class="eui-language-selector-button__language-code">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n\n<ng-container *ngIf="isShowDropDown && hasLanguageSelection">\n    <eui-dropdown>\n        <button class="eui-language-selector-button">\n            <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n            <span class="eui-language-selector-button__language-code">\n                {{ (appShellService.state$ | async).activeLanguage }}\n            </span>\n        </button>\n        <eui-dropdown-content>\n            <div class="eui-language-selector-menu">\n                <div\n                    *ngFor="let language of languages"\n                    euiDropdownItem\n                    attr.data-e2e="eui-language-selector-item_{{ language.code }}"\n                    class="eui-language-selector-menu-language-item"\n                    (click)="onLanguageChanged(language)">\n                    {{ language.label }} ({{ language.code }})\n                </div>\n            </div>\n        </eui-dropdown-content>\n    </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf="isShowModal && hasLanguageSelection">\n    <button class="eui-language-selector-button" (click)="open()">\n        <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n        <span class="eui-language-selector-button__language-code">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n', styles: ['.eui-language-selector{align-items:center;cursor:pointer;display:inline-flex;position:relative;margin-left:var(--eui-base-spacing-m);margin-top:var(--eui-base-spacing-xs)}.eui-language-selector .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-language-selector-button{justify-content:center;position:relative;align-items:center;display:flex;width:100%;padding:0;border:none;background:transparent;cursor:pointer}.eui-language-selector-button:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button:focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button__language-code{align-items:center;bottom:50%;display:flex;color:var(--eui-base-color-white);position:absolute;text-transform:uppercase;top:35%;font:normal normal 400 .875rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-language-selector-menu-language-item{padding:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-10);text-align:center;cursor:pointer}.eui-language-selector-menu-language-item:hover{background:var(--eui-base-color-grey-5)}.mat-menu-panel{min-width:8rem!important}.niko-test{margin:0}.eui-language-selector--empty{display:none}.eui-language-selector--primary .eui-language-selector-button__language-code{color:var(--eui-base-color-white)}.eui-language-selector--toolbar-selector{margin-right:var(--eui-base-spacing-m);margin-left:0;margin-bottom:var(--eui-base-spacing-2xs)}.eui-language-selector--toolbar-selector .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-language-selector--toolbar-selector .eui-language-selector-button__language-code{color:var(--eui-base-color-black)}\n'], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.EuiDropdownComponent, selector: "eui-dropdown", inputs: ["e2eAttr", "tabIndex", "width", "position", "isBlock", "isDropDownRightAligned", "isClosedOnClickInside", "hasClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation", "isRightClickEnabled"] }, { kind: "component", type: i5.EuiDropdownItemComponent, selector: "eui-dropdown-item, [euiDropdownItem]", inputs: ["subDropdown", "isActive"] }, { kind: "directive", type: i5.EuiDropdownContentDirective, selector: "eui-dropdown-content" }, { kind: "component", type: i6.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], encapsulation: i02.ViewEncapsulation.None });
+  }
+};
+i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i02, type: EuiLanguageSelectorComponent, decorators: [{
+  type: Component2,
+  args: [{ selector: "eui-language-selector", encapsulation: ViewEncapsulation3.None, template: '<ng-container *ngIf="!hasLanguageSelection">\n    <button class="eui-language-selector-button" (click)="onClick()">\n        <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n        <span class="eui-language-selector-button__language-code">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n\n<ng-container *ngIf="isShowDropDown && hasLanguageSelection">\n    <eui-dropdown>\n        <button class="eui-language-selector-button">\n            <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n            <span class="eui-language-selector-button__language-code">\n                {{ (appShellService.state$ | async).activeLanguage }}\n            </span>\n        </button>\n        <eui-dropdown-content>\n            <div class="eui-language-selector-menu">\n                <div\n                    *ngFor="let language of languages"\n                    euiDropdownItem\n                    attr.data-e2e="eui-language-selector-item_{{ language.code }}"\n                    class="eui-language-selector-menu-language-item"\n                    (click)="onLanguageChanged(language)">\n                    {{ language.label }} ({{ language.code }})\n                </div>\n            </div>\n        </eui-dropdown-content>\n    </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf="isShowModal && hasLanguageSelection">\n    <button class="eui-language-selector-button" (click)="open()">\n        <eui-icon-svg icon="eui-ecl-language" size="l" fillColor="white"></eui-icon-svg>\n        <span class="eui-language-selector-button__language-code">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n', styles: ['.eui-language-selector{align-items:center;cursor:pointer;display:inline-flex;position:relative;margin-left:var(--eui-base-spacing-m);margin-top:var(--eui-base-spacing-xs)}.eui-language-selector .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-language-selector-button{justify-content:center;position:relative;align-items:center;display:flex;width:100%;padding:0;border:none;background:transparent;cursor:pointer}.eui-language-selector-button:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button:focus-visible:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button [tabindex="0"]:focus:not([readonly]){outline:2px solid var(--eui-ctx-color-focus-visible)!important;outline-offset:0!important;transition:none!important}.eui-language-selector-button__language-code{align-items:center;bottom:50%;display:flex;color:var(--eui-base-color-white);position:absolute;text-transform:uppercase;top:35%;font:normal normal 400 .875rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-language-selector-menu-language-item{padding:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-10);text-align:center;cursor:pointer}.eui-language-selector-menu-language-item:hover{background:var(--eui-base-color-grey-5)}.mat-menu-panel{min-width:8rem!important}.niko-test{margin:0}.eui-language-selector--empty{display:none}.eui-language-selector--primary .eui-language-selector-button__language-code{color:var(--eui-base-color-white)}.eui-language-selector--toolbar-selector{margin-right:var(--eui-base-spacing-m);margin-left:0;margin-bottom:var(--eui-base-spacing-2xs)}.eui-language-selector--toolbar-selector .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-language-selector--toolbar-selector .eui-language-selector-button__language-code{color:var(--eui-base-color-black)}\n'] }]
+}], ctorParameters: () => [{ type: i02.ChangeDetectorRef }, { type: i12.EuiDialogService }, { type: i22.EuiAppShellService }, { type: i32.TranslateService }], propDecorators: { cssClasses: [{
+  type: HostBinding,
+  args: ["class"]
+}], hasLanguageSelection: [{
+  type: Input,
+  args: [{ transform: booleanAttribute }]
+}], isToolbarSelector: [{
+  type: Input,
+  args: [{ transform: booleanAttribute }]
+}], languageSelectorClick: [{
+  type: Output
+}] } });
+
+// language-selector.module.mjs
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { EuiButtonModule } from "@eui/components/eui-button";
+import { EuiDropdownModule } from "@eui/components/eui-dropdown";
+import { EuiDialogModule } from "@eui/components/eui-dialog";
+import { EuiIconModule } from "@eui/components/eui-icon";
+import * as i03 from "@angular/core";
+var EuiLanguageSelectorModule = class _EuiLanguageSelectorModule {
+  static {
+    this.ɵfac = i03.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i03, type: _EuiLanguageSelectorModule, deps: [], target: i03.ɵɵFactoryTarget.NgModule });
+  }
+  static {
+    this.ɵmod = i03.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i03, type: _EuiLanguageSelectorModule, declarations: [EuiLanguageSelectorComponent, EuiModalSelectorComponent], imports: [CommonModule, EuiDropdownModule, EuiButtonModule, EuiDialogModule, EuiIconModule], exports: [EuiLanguageSelectorComponent] });
+  }
+  static {
+    this.ɵinj = i03.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i03, type: _EuiLanguageSelectorModule, imports: [CommonModule, EuiDropdownModule, EuiButtonModule, EuiDialogModule, EuiIconModule] });
+  }
+};
+i03.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i03, type: EuiLanguageSelectorModule, decorators: [{
+  type: NgModule,
+  args: [{
+    imports: [CommonModule, EuiDropdownModule, EuiButtonModule, EuiDialogModule, EuiIconModule],
+    exports: [EuiLanguageSelectorComponent],
+    declarations: [EuiLanguageSelectorComponent, EuiModalSelectorComponent]
+  }]
+}] });
+export {
+  EuiLanguageSelectorComponent,
+  EuiLanguageSelectorModule,
+  EuiModalSelectorComponent
+};
+//# sourceMappingURL=eui-components-eui-language-selector.mjs.map

package/fesm2022/eui-components-eui-language-selector.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../eui-language-selector/modal-selector/modal-selector.component.ts", "../../eui-language-selector/modal-selector/modal-selector.component.html", "../../eui-language-selector/language-selector.component.ts", "../../eui-language-selector/language-selector.component.html", "../../eui-language-selector/language-selector.module.ts"],
+  "sourcesContent": ["import { Component, ViewEncapsulation, ChangeDetectionStrategy, OnInit, Inject } from '@angular/core';\nimport { EuiEuLanguages, EuiLanguage } from '@eui/base';\n\nimport { DIALOG_COMPONENT_CONFIG } from '@eui/components/eui-dialog';\nimport { EuiDialogService } from '@eui/components/eui-dialog';\n\n@Component({\n    selector: 'eui-modal-selector',\n    templateUrl: './modal-selector.component.html',\n    changeDetection: ChangeDetectionStrategy.Default,\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EuiModalSelectorComponent implements OnInit {\n    public languageRows: EuiLanguage[][] = [];\n    public additionaLanguageRows: EuiLanguage[][] = [];\n\n    private selectedLanguage: EuiLanguage;\n\n    constructor(\n        private euiDialogService: EuiDialogService,\n        @Inject(DIALOG_COMPONENT_CONFIG)\n        public config: {\n            languages: EuiLanguage[];\n            selectedLanguage: EuiLanguage;\n            languageChanged: (language: EuiLanguage) => void;\n        },\n    ) {}\n\n    ngOnInit(): void {\n        this.languageRows = this.prepareLanguageRows(EuiEuLanguages.filterEULanguages(this.config.languages));\n        this.additionaLanguageRows = this.prepareLanguageRows(EuiEuLanguages.filterNonEULanguages(this.config.languages));\n    }\n\n    selectLanguage(languageCode: EuiLanguage): void {\n        if (this.selectedLanguage?.code !== languageCode.code) {\n            for (const language of this.config.languages) {\n                if (language.code === languageCode.code) {\n                    this.selectedLanguage = language;\n                    break;\n                }\n            }\n        }\n\n        this.config.languageChanged(languageCode);\n        this.euiDialogService.closeDialog();\n    }\n\n    private prepareLanguageRows(languages: EuiLanguage[]): EuiLanguage[][] {\n        const rows: EuiLanguage[][] = [];\n        let row: EuiLanguage[] = [];\n\n        for (let i = 0; i < languages.length; i++) {\n            if (i % 4 === 0) {\n                if (row.length > 0) {\n                    rows.push(row);\n                    row = [];\n                }\n            }\n            row.push(languages[i]);\n        }\n\n        if (row.length > 0) {\n            rows.push(row);\n        }\n\n        return rows;\n    }\n}\n", "<h4 *ngIf=\"additionaLanguageRows?.length > 0\">EU official languages</h4>\n<div id=\"eu_languages\" *ngFor=\"let row of languageRows\" class=\"row\">\n    <div *ngFor=\"let language of row\" class=\"col-md-6 mb-2\">\n        <button\n            type=\"button\"\n            e2eAttr=\"eui-language-selector-item_{{ language.code }}\"\n            euiButton\n            euiBlockButton\n            [euiSecondary]=\"language.code !== config.selectedLanguage.code\"\n            [euiPrimary]=\"language.code === config.selectedLanguage.code\"\n            (click)=\"selectLanguage(language)\">\n            {{ language.label }} ({{ language.code }})\n        </button>\n    </div>\n</div>\n<ng-container *ngIf=\"additionaLanguageRows?.length > 0\">\n    <br />\n    <h4>Non-EU Languages</h4>\n    <div id=\"extra_languages\" *ngFor=\"let row of additionaLanguageRows\" class=\"row\">\n        <div *ngFor=\"let language of row\" class=\"col-md-6 mb-2\">\n            <button\n                type=\"button\"\n                e2eAttr=\"eui-language-selector-item_{{ language.code }}\"\n                euiButton\n                euiBlockButton\n                [euiSecondary]=\"language.code !== config.selectedLanguage.code\"\n                [euiPrimary]=\"language.code === config.selectedLanguage.code\"\n                (click)=\"selectLanguage(language)\">\n                {{ language.label }} ({{ language.code }})\n            </button>\n        </div>\n    </div>\n</ng-container>\n", "import {\n    Component,\n    ViewEncapsulation,\n    HostBinding,\n    OnDestroy,\n    OnInit,\n    ChangeDetectorRef,\n    Input,\n    Output,\n    EventEmitter,\n    booleanAttribute,\n} from '@angular/core';\nimport { distinctUntilKeyChanged, map, takeUntil } from 'rxjs/operators';\nimport { Subject } from 'rxjs';\nimport { TranslateService } from '@ngx-translate/core';\n\nimport { BaseDirective } from '@eui/components/shared';\nimport { EuiEuLanguages, EuiLanguage } from '@eui/base';\nimport { EuiAppShellService } from '@eui/core';\nimport { EuiDialogConfig, EuiDialogService } from '@eui/components/eui-dialog';\n\nimport { EuiModalSelectorComponent } from './modal-selector/modal-selector.component';\n\n@Component({\n    selector: 'eui-language-selector',\n    templateUrl: './language-selector.component.html',\n    styleUrls: ['./_styles/_index.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EuiLanguageSelectorComponent extends BaseDirective implements OnInit, OnDestroy {\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [\n            super.getCssClasses('eui-language-selector'),\n            this.languages?.length <= 1 ? 'eui-language-selector--empty' : '',\n            this.isToolbarSelector ? 'eui-language-selector--toolbar-selector' : '',\n        ].join(' ').trim();\n    }\n\n    languages: EuiLanguage[];\n    selectedLanguage: EuiLanguage;\n\n    @Input({ transform: booleanAttribute }) hasLanguageSelection = true;\n    @Input({ transform: booleanAttribute }) isToolbarSelector = false;\n\n    @Output() languageSelectorClick = new EventEmitter<null>();\n\n    private destroy$: Subject<boolean> = new Subject<boolean>();\n\n    constructor(\n        private cd: ChangeDetectorRef,\n        private euiDialogService: EuiDialogService,\n        public appShellService: EuiAppShellService,\n        private translateService: TranslateService,\n    ) {\n        super();\n    }\n\n    /**\n     * returns true if there are at least one and max four languages.\n     */\n    get isShowDropDown(): boolean {\n        return this.languages?.length > 1 && this.languages?.length < 4;\n    }\n\n    /**\n     * returns true if there are at least five languages.\n     */\n    get isShowModal(): boolean {\n        return this.languages?.length >= 4;\n    }\n\n    ngOnInit(): void {\n        // update languages array based on AppShell State 'language' changes\n        this.appShellService.state$\n            .pipe(\n                takeUntil(this.destroy$),\n                distinctUntilKeyChanged('languages'),\n                map((state) => state.languages),\n            )\n            .subscribe((languages) => {\n                this.languages = languages ? EuiEuLanguages.getOrderedLanguages(languages) : EuiEuLanguages.getLanguages();\n                this.cd.detectChanges();\n            });\n\n        // update activeLanguage array based on AppShell State 'language' changes\n        this.appShellService.state$\n            .pipe(\n                takeUntil(this.destroy$),\n                distinctUntilKeyChanged('activeLanguage'),\n                map((state) => state.activeLanguage),\n            )\n            .subscribe((activeLanguage) => {\n                this.selectedLanguage = this.getLanguage(activeLanguage);\n                this.cd.detectChanges();\n            });\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next(true);\n        this.destroy$.unsubscribe();\n    }\n\n    onLanguageChanged(language: EuiLanguage): void {\n        // Update the AppShellService state\n        this.appShellService.setState({\n            ...this.appShellService.state,\n            activeLanguage: language.code,\n        });\n    }\n\n    /**\n     * Opens the modal that renders the UxLanguage array with modal actions bindings to this Component\n     */\n    open(titleLabel: string = this.translateService.instant('eui.languageSelector.modalTitle')): void {\n        this.euiDialogService.openDialog(\n            new EuiDialogConfig({\n                title: titleLabel,\n                hasFooter: false,\n                hasClosedOnClickOutside: true,\n                bodyComponent: {\n                    component: EuiModalSelectorComponent,\n                    config: {\n                        languages: this.languages,\n                        selectedLanguage: this.selectedLanguage,\n                        languageChanged: (language: EuiLanguage) => this.onLanguageChanged(language),\n                    },\n                },\n            }),\n        );\n    }\n\n    onClick(): void {\n        this.languageSelectorClick.emit();\n    }\n\n    /**\n     * returns the UxLanguage Object from a given language code\n     *\n     * @param languageCode two char language code\n     * @protected\n     */\n    protected getLanguage(languageCode: string): EuiLanguage {\n        return this.languages.find((lang) => lang.code === languageCode);\n    }\n}\n", "<ng-container *ngIf=\"!hasLanguageSelection\">\n    <button class=\"eui-language-selector-button\" (click)=\"onClick()\">\n        <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n        <span class=\"eui-language-selector-button__language-code\">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n\n<ng-container *ngIf=\"isShowDropDown && hasLanguageSelection\">\n    <eui-dropdown>\n        <button class=\"eui-language-selector-button\">\n            <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n            <span class=\"eui-language-selector-button__language-code\">\n                {{ (appShellService.state$ | async).activeLanguage }}\n            </span>\n        </button>\n        <eui-dropdown-content>\n            <div class=\"eui-language-selector-menu\">\n                <div\n                    *ngFor=\"let language of languages\"\n                    euiDropdownItem\n                    attr.data-e2e=\"eui-language-selector-item_{{ language.code }}\"\n                    class=\"eui-language-selector-menu-language-item\"\n                    (click)=\"onLanguageChanged(language)\">\n                    {{ language.label }} ({{ language.code }})\n                </div>\n            </div>\n        </eui-dropdown-content>\n    </eui-dropdown>\n</ng-container>\n\n<ng-container *ngIf=\"isShowModal && hasLanguageSelection\">\n    <button class=\"eui-language-selector-button\" (click)=\"open()\">\n        <eui-icon-svg icon=\"eui-ecl-language\" size=\"l\" fillColor=\"white\"></eui-icon-svg>\n        <span class=\"eui-language-selector-button__language-code\">\n            {{ (appShellService.state$ | async).activeLanguage }}\n        </span>\n    </button>\n</ng-container>\n", "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiDropdownModule } from '@eui/components/eui-dropdown';\nimport { EuiDialogModule } from '@eui/components/eui-dialog';\nimport { EuiIconModule } from '@eui/components/eui-icon';\n\nimport { EuiLanguageSelectorComponent } from './language-selector.component';\nimport { EuiModalSelectorComponent } from './modal-selector/modal-selector.component';\n\n@NgModule({\n    imports: [CommonModule, EuiDropdownModule, EuiButtonModule, EuiDialogModule, EuiIconModule],\n    exports: [EuiLanguageSelectorComponent],\n    declarations: [EuiLanguageSelectorComponent, EuiModalSelectorComponent],\n})\nexport class EuiLanguageSelectorModule {}\n"],
+  "mappings": "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",
+  "names": ["Component", "ViewEncapsulation", "EuiEuLanguages", "i0"]
+}

package/fesm2022/eui-components-eui-menu.mjs

@@ -223,7 +223,7 @@ var EuiMenuItemComponent = class _EuiMenuItemComponent {
     </span>
 
     <div class="eui-menu-item__link-right-content">
-        <eui-chip *ngIf="item.tagLabel" euiSizeXS euiOutline styleClass="eui-menu-item__link-tag-label eui-chip--{{ item.tagTypeClass }}" [ariaLabel]="item.tagLabel">
+        <eui-chip *ngIf="item.tagLabel" euiSizeXS euiOutline class="eui-menu-item__link-tag-label eui-chip--{{ item.tagTypeClass }}" [ariaLabel]="item.tagLabel">
             <span euiLabel class="eui-label">{{ item.tagLabel }}</span>
         </eui-chip>
 
@@ -413,7 +413,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3",
     </span>
 
     <div class="eui-menu-item__link-right-content">
-        <eui-chip *ngIf="item.tagLabel" euiSizeXS euiOutline styleClass="eui-menu-item__link-tag-label eui-chip--{{ item.tagTypeClass }}" [ariaLabel]="item.tagLabel">
+        <eui-chip *ngIf="item.tagLabel" euiSizeXS euiOutline class="eui-menu-item__link-tag-label eui-chip--{{ item.tagTypeClass }}" [ariaLabel]="item.tagLabel">
             <span euiLabel class="eui-label">{{ item.tagLabel }}</span>
         </eui-chip>