### File

`packages/ecl/components/ecl-site-header/language/ecl-site-header-language-popover.component.ts`

### Description

This component is a popover, that appears after the user clicks on language link. It contains all the available languages, configured for the current site. Adds styling and functionality for the dialog. Emits events when language is selected and when dialog is closed.

### Extends

`ECLBaseDirective`

### Implements

`OnDestroy`

### Metadata

selector | `ecl-site-header-language-popover`
imports | `TranslateModule` `EUI_ECL_BUTTON` `EUI_ECL_ICON` `EUI_ECL_LINK`
templateUrl | `./ecl-site-header-language-popover.component.html`

### Index

###### Properties
el labelledBy languageContent languageContentMaxHeight role
###### Methods
onCloseClick onLanguageClick setLanguageContentMaxHeight getCssClasses
###### Inputs
euColumnsCount euLanguages isFull isHidden isPushLeft isPushRight isStack languageArrowPosition languageCode leftPosition nonEuColumnsCount nonEuLanguages rightPosition class e2eAttr tabindex
###### Outputs
languageClosed languageSelected
###### HostBindings
attr.aria-labelledby attr.aria-modal attr.hidden attr.role class style.display
###### Accessors
display cssClasses isModal isDropdownHidden

### Constructor

`constructor()`

### Inputs

euColumnsCount
Type : `number`
Number of columns for eu languages. Calculated by the parent component 'ecl-site-header-language'.

euLanguages
Type : `Array<EuiLanguage>`
Default value : `[]`

isFull
Type : `boolean`
Default value : `false`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

isHidden
Type : `boolean`
Default value : `false`
Property to show/hide the dialog.

isPushLeft
Type : `boolean`
Default value : `false`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

isPushRight
Type : `boolean`
Default value : `false`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

isStack
Type : `boolean`
Default value : `false`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

languageArrowPosition
Type : `string`
Property to position the arrow of the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

languageCode
Type : `string`
Current language

leftPosition
Type : `number`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

nonEuColumnsCount
Type : `number`
Number of columns for non-eu languages. Calculated by the parent component 'ecl-site-header-language'.

nonEuLanguages
Type : `Array<EuiLanguage>`
Default value : `[]`

rightPosition
Type : `number`
Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.

class
Type : `string`

e2eAttr
Type : `any`

tabindex
Type : `number`

### Outputs

languageClosed
Type : `EventEmitter`

languageSelected
Type : `EventEmitter`

### HostBindings

attr.aria-labelledby
Type : `string`
Default value : `'ecl-site-header__language-title'`

attr.aria-modal
Type : `boolean | undefined`

attr.hidden
Type : `boolean | undefined`

attr.role
Type : `string`
Default value : `'dialog'`
The role of the dialog is 'dialog'. Should not be changed.

class
Type : `string`

style.display
Type : `string`

### Methods

onCloseClick
`onCloseClick()`
Returns : `void`

onLanguageClick
`onLanguageClick(language: EuiLanguage, evt: MouseEvent)`
Parameters :
Name | Type | Optional
language | `EuiLanguage` | No
evt | `MouseEvent` | No
Returns : `void`

setLanguageContentMaxHeight
`setLanguageContentMaxHeight()`
Set the max-height property of the component. It is calculated depending on the viewport. Returns : `void`

getCssClasses
`getCssClasses(rootClass: string)`
Parameters :
Name | Type | Optional
rootClass | `string` | No
Returns : `string`

### Properties

el
Type : `unknown`
Default value : `inject(ElementRef)`

labelledBy
Type : `string`
Default value : `'ecl-site-header__language-title'`
Decorators : `@HostBinding('attr.aria-labelledby')`

languageContent
Type : `ElementRef`
Decorators : `@ViewChild('languageContent')`
The div, that wraps all the languages.

languageContentMaxHeight
Type : `number`

role
Type : `string`
Default value : `'dialog'`
Decorators : `@HostBinding('attr.role')`
The role of the dialog is 'dialog'. Should not be changed.

### Accessors

display
get `display()`

cssClasses
get `cssClasses()`

isModal
get `isModal()`

isDropdownHidden
get `isDropdownHidden()`

# results matching ""

# No results matching ""