@eui/ecl 22.0.0-alpha.1 → 22.0.0-alpha.11

package/docs/llms.txt

@@ -1,6 +1,6 @@
 # eui documentation
 
-> Generated by compodoc 2.0.0 at 2026-08-24T10:49:12.243Z, llm-md export.
+> Generated by compodoc 2.0.0 at 2026-09-22T13:57:20.035Z, llm-md export.
 
 ## Modules
 
@@ -376,10 +376,8 @@ Inputs:
 - `tabindex: number`
 
 Properties:
-- `className: unknown = true` — Static class applied to the host element for styling. Always returns true to include the ecl-category-filter class.
-- `eclCategoryFilterItemsAll: QueryList<EclCategoryFilterItemComponent>`
+- `eclCategoryFilterItemsAll: unknown = contentChildren<EclCategoryFilterItemComponent>( forwardRef(() => EclCategoryFilterItemComponent), { descendants: true } )` — Signal-based query for all descendant category filter items.
 - `eclCategoryList: unknown = contentChild(forwardRef(() => EclCategoryFilterListComponent))`
-- `role: string = 'navigation'` — Defines the ARIA role for the host element. Always set to "navigation".
 
 Methods:
 - `getCssClasses(rootClass: string): string`
@@ -400,11 +398,7 @@ Outputs:
 - `itemSelect: EventEmitter = new EventEmitter<EclCategoryFilterItemSelectEvent>()` — Emits when the item is selected by the user (clicked).
 
 Properties:
-- `className: unknown = true` — Static class binding for base list item styling.
 - `eclCategoryList: unknown = contentChild(forwardRef(() => EclCategoryFilterListComponent))` — Child list component if the item has nested children.
-- `isCurrent: unknown = false` — Indicates whether the item is currently selected.
-- `isExpanded: unknown = false` — Indicates whether the item is currently expanded (open).
-- `role: string = 'listitem'` — Defines the ARIA role for the list item. Always set to "listitem".
 
 Methods:
 - `onItemClick(evt: MouseEvent): void` — Handles user click interaction, updates state and emits selection event. Prevents navigation if no href is defined.
@@ -421,10 +415,8 @@ Inputs:
 - `tabindex: number`
 
 Properties:
-- `className: unknown = true` — Adds the base class for the category filter list component.
-- `controls: string` — ARIA attribute that points to the element controlled by this list (if applicable).
 - `eclCategoryFilterItems: unknown = contentChildren<EclCategoryFilterItemComponent>(forwardRef(() => EclCategoryFilterItemComponent))` — List of all category filter items projected inside this list.
-- `role: string = 'list'` — Sets ARIA role to "list" for accessibility purposes.
+- `id: string` — ID of this list element, referenced by the parent item's aria-controls.
 
 Methods:
 - `updateChildrenItemsLevel(value: number): void` — Propagates the current level to all direct children items.
@@ -534,7 +526,6 @@ Methods:
 
 File: `packages/ecl/components/ecl-list/ecl-description-list-definition/ecl-description-list-definition.component.ts`
 Selector: `[eclDescriptionListDefinition]`
-Standalone: yes
 
 Description: Component for a definition item within an ECL description list. Supports variants (link, inline, taxonomy, tag) and collapsible functionality with maxVisibleItems control.
 
@@ -545,7 +536,7 @@ Inputs:
 - `tabindex: number`
 
 Properties:
-- `domReady: unknown = signal(false)` — Signal indicating whether the DOM is ready for manipulation. Set to true after first render to ensure projected content exists.
+- `domReady: unknown = signal(false)` — Signal indicating whether the DOM is ready for manipulation. Set to true after first render to ensure the projected exists before the see-more link is inserted into it. Defers DOM writes in the effect.
 - `hasSeeAll: unknown = computed(() => { const max = this.maxVisibleItems(); const total = this.currentItemsNumber(); return !!max && total > 0 && max < total; })` — Computed signal that determines if "See all" link should be shown. Returns true when maxVisibleItems is set and less than total items.
 - `maxVisibleItems: unknown = signal<number | null>(null)` — Maximum number of items to display before showing "See all" link. Controlled by parent EclDescriptionListDirective.
 
@@ -1001,7 +992,7 @@ Inputs:
 - `color: 'inverted' | 'primary' | null = null` — Applies color styling to the icon. Use 'inverted' for icons on dark backgrounds, or 'primary' for emphasis.
 - `focusable: boolean = false` — Controls whether the icon is focusable via keyboard. Defaults to false .
 - `icon: string` — Name of the icon to render from the selected set.
-- `iconSet: 'default' | 'social' | 'social-media' | 'social-media-color' | 'flag' | 'flag-non-members' | 'phosphor' | string = 'default'` — Defines the icon set to use. Available sets: default , social , social-media , flag , or a custom URL prefix. Defaults to 'default' .
+- `iconSet: 'default' | 'social' | 'social-media' | 'social-media-color' | 'flag' | 'flag-non-members' | 'phosphor' | 'phosphor-fill' | string = 'default'` — Defines the icon set to use. Available sets: default , social , social-media , flag , or a custom URL prefix. Defaults to 'default' .
 - `isFlipHorizontal: boolean = false` — Flips the icon horizontally if set to true .
 - `role: string = undefined` — ARIA role of the icon. If a title is provided and no role is defined, defaults to 'img' .
 - `size: '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | 'fluid' | string = 'xs'` — Size of the icon. Supported values: '2xs' , 'xs' , 's' , 'm' , 'l' , 'xl' , '2xl' , 'fluid' . Defaults to 'xs' .
@@ -1187,6 +1178,8 @@ Properties:
 - `eclIllustrationPicture: unknown = contentChild(forwardRef(() => EclListIllustrationPictureDirective))`
 - `hasDivider: unknown = signal(false)` — A special class needs to be added, if an icon list has dividers between items.
 - `hasPicture: Signal<boolean> = computed(() => this.eclIllustrationPicture() !== undefined)`
+- `hasTitle: unknown = computed(() => Boolean(this.eclTitle()) || this.eclIllustrationIcon() !== undefined)` — Returns true if the item has a title or any projected icons.
+- `hasValue: unknown = computed(() => Boolean(this.eclValue()))` — Returns true if the item has a value.
 - `isVerticalPicture: unknown = signal(false)` — A special class needs to be added, for vertical lists with picture.
 - `role: string = 'listitem'` — Applies ARIA role for list items.
 
@@ -1276,7 +1269,6 @@ Properties:
 - `isTwoPanels: unknown = false` — If a menu item is expanded and has two panels/levels displayed.
 - `menuItems: unknown = contentChildren(forwardRef(() => EclMegaMenuItemComponent), { descendants: true })`
 - `overlayStyleTop: number` — Used to position the overlay, when a menu item is expanded.
-- `role: string = 'navigation'` — The 'role' attribute of the component is set to 'navigation'. should not be changed.
 
 Methods:
 - `onClickOutsideMegaMenu(): void` — When clicking outside the menu - close any expanded item.
@@ -1294,14 +1286,13 @@ Selector: `div[eclMegaMenuFeatured]`
 Description: This component represents the featured items panel.
 
 Inputs:
-- `title: string`
+- `title: string = undefined`
 - `titleId: string = undefined`
 - `class: string`
 - `e2eAttr: any`
 - `tabindex: number`
 
 Properties:
-- `cmpClass: unknown = true`
 - `eclMegaMenuFeaturedStyleHeight: number | null = null`
 - `featuredItems: unknown = contentChildren(forwardRef(() => EclMegaMenuFeaturedListItemDirective), { descendants: true })`
 - `links: unknown = contentChildren(forwardRef(() => EclLinkDirective), { descendants: true })`
@@ -1369,7 +1360,6 @@ Properties:
 - `eclMegaMenuSublist: unknown = contentChild(forwardRef(() => EclMegaMenuSublistDirective))` — Element, that holds the sub items of the current menu items.
 - `eclMegaMenuSublists: unknown = contentChildren(forwardRef(() => EclMegaMenuSublistDirective), { descendants: true })`
 - `el: unknown = inject(ElementRef)`
-- `hasPopup: unknown = this.hasChildren ? true : null`
 - `isCurrent: unknown = false`
 - `isExpanded: unknown = false`
 - `isMobileBreakpoint: unknown = false`
@@ -2732,25 +2722,15 @@ Properties:
 - `isPushLeft: boolean` — This property is used for dropdown positioning on the screen.
 - `isPushRight: boolean` — This property is used for dropdown positioning on the screen.
 - `isStack: boolean` — This property is used for dropdown positioning on the screen.
-- `LANGUAGE_MAX_COLUMNS: number = 8`
 - `languageArrowPosition: string` — This property is used for dropdown positioning on the screen.
 - `languageCode: string = 'en'`
-- `languageLinkElement: unknown = viewChild('languageLink', { read: ElementRef })` — The link to open the popover dialog.
-- `languagePopover: unknown = viewChild(EclSiteHeaderLanguagePopoverComponent)` — The language popover, that shows all available languages (configured in the config file of the current site).
 - `leftPosition: number`
-- `MOBILE_BREAKPOINT: number = 768`
 - `nonEuColumnsCount: number = 1`
 - `nonEuLanguages: EuiLanguage[] = []` — Array of non-EU languages, that can be selected for the current site.
 - `rightPosition: number`
 
 Methods:
-- `getLanguageLabel(): string`
 - `hasLanguageCodes(): boolean`
-- `onClickOutside(): void` — Close the dropdown, when clicking outside of the component.
-- `onEscapeKeydownHandler(): void` — Close the dropdown, when pressing ESC key.
-- `onLanguageClick(evt: Event): void` — Toggle the language dropdown when clicking the link, showing the current language.
-- `onLanguageClosed(evt: EclSiteHeaderLanguageCloseEvent): void`
-- `onLanguageSelected(evt: EclSiteHeaderLanguageSelectedEvent): void`
 - `getCssClasses(rootClass: string): string`
 
 ### EclSiteHeaderLanguagePopoverComponent
@@ -2761,19 +2741,19 @@ Selector: `ecl-site-header-language-popover`
 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.
 
 Inputs:
-- `euLanguages: EuiLanguage[] = []`
-- `languageArrowPosition: string` — Property to position the arrow of the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
-- `languageCode: string` — Current language
-- `leftPosition: number` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
-- `nonEuLanguages: EuiLanguage[] = []`
-- `rightPosition: number` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `euColumnsCount: number = undefined` — Number of columns for eu languages. Calculated by the parent component 'ecl-site-header-language'.
+- `euLanguages: EuiLanguage[] = []`
 - `isFull: boolean = false` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `isHidden: boolean = false` — Property to show/hide the dialog.
 - `isPushLeft: boolean = false` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `isPushRight: boolean = false` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `isStack: boolean = false` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
+- `languageArrowPosition: string = undefined` — Property to position the arrow of the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
+- `languageCode: string = undefined` — Current language
+- `leftPosition: number = undefined` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `nonEuColumnsCount: number = undefined` — Number of columns for non-eu languages. Calculated by the parent component 'ecl-site-header-language'.
+- `nonEuLanguages: EuiLanguage[] = []`
+- `rightPosition: number = undefined` — Property to position the dialog correctly. Calculated by the parent component 'ecl-site-header-language'.
 - `class: string`
 - `e2eAttr: any`
 - `tabindex: number`
@@ -2784,10 +2764,8 @@ Outputs:
 
 Properties:
 - `el: unknown = inject(ElementRef)`
-- `labelledBy: string = 'ecl-site-header__language-title'`
 - `languageContent: unknown = viewChild<ElementRef>('languageContent')` — The div, that wraps all the languages.
 - `languageContentMaxHeight: number`
-- `role: string = 'dialog'` — The role of the dialog is 'dialog'. Should not be changed.
 
 Methods:
 - `onCloseClick(): void`
@@ -2813,17 +2791,9 @@ Outputs:
 - `login: EclSiteHeaderLoginEvent`
 
 Properties:
-- `class: string = 'ecl-site-header__login-container'`
-- `isLoginBoxActive: unknown = false` — If login popover is open (true) or closed (false).
-- `loginArrowPosition: string` — The position of the arrow of the popover.
-- `loginLinkElement: unknown = viewChild('loginLink', { read: ElementRef })`
-- `TABLET_BREAKPOINT: number = 996`
+- `isLoginBoxActive: unknown = false` — If login popover is open (true) or closed (false). Kept public because the parent ecl-site-header resets it directly when the search box opens.
 
 Methods:
-- `getLoginBoxCssClasses(): string`
-- `onClickOutsideMegaMenu(): void` — Close the login popover on click outside.
-- `onLoginBoxToggle(evt: MouseEvent): void`
-- `onLoginClick(evt: MouseEvent): void`
 - `getCssClasses(rootClass: string): string`
 
 ### EclSiteHeaderNotificationComponent
@@ -2863,17 +2833,9 @@ Outputs:
 - `searchEvent: EclSiteHeaderSearchEvent`
 
 Properties:
-- `class: string = 'ecl-site-header__search-container'`
-- `isSearchBoxActive: unknown = false`
-- `role: string = 'search'` — The default role of the component is 'search', should not be changed.
-- `searchArrowPosition: string` — The arrow position of the serahc dropdown, when in mobile mode.
-- `searchLinkElement: unknown = viewChild('searchLink', { read: ElementRef })` — The search link element from the view, i.e. the search button.
+- `isSearchBoxActive: unknown = false` — Whether the search dropdown is open. Kept public because the parent ecl-site-header resets it directly when the login box opens.
 
 Methods:
-- `getSearchBoxCssClasses(): string`
-- `onModelChange(newValue: string): void`
-- `onSearch(evt: EclSearchFormEvent): boolean`
-- `onSearchBoxToggle(evt: MouseEvent): void`
 - `registerOnChange(fn: any): void`
 - `registerOnTouched(fn: any): void`
 - `writeValue(value: any): void`
@@ -2904,6 +2866,7 @@ Selector: `ecl-social-media-follow`
 Inputs:
 - `description: string = undefined`
 - `horizontalAlignment: 'right' | 'left' | string = 'left'`
+- `isIconOnly: boolean = false`
 - `isVertical: boolean = false`
 - `class: string`
 - `e2eAttr: any`
@@ -2933,11 +2896,8 @@ Inputs:
 Outputs:
 - `itemClick: EclSocialMediaFollowItemClickEvent`
 
-Properties:
-- `role: string = 'listitem'`
-
 Methods:
-- `onItemClick(evt: unknown): void`
+- `onItemClick(evt: Event): void`
 - `getCssClasses(rootClass: string): string`
 
 ### EclSplashPageComponent
@@ -4183,8 +4143,8 @@ Inputs:
 - `tabindex: number`
 
 Properties:
-- `isHidden: unknown = false` — Internal state used to hide the item when exceeding the visible limit.
-- `isLastVisible: unknown = false` — Indicates whether this is the last item visible before the "see all" action is triggered.
+- `isHidden: unknown = signal(false)` — Internal state used to hide the item when exceeding the visible limit.
+- `isLastVisible: unknown = signal(false)` — Indicates whether this is the last item visible before the "see all" action is triggered.
 
 Methods:
 - `getCssClasses(rootClass: string): string`
@@ -4201,9 +4161,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true` — Applies the ECL list container class.
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -4257,9 +4214,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `hasClass: unknown = true` — Binds the ecl-separator CSS class to the host \<hr\> element.
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -4751,7 +4705,6 @@ Inputs:
 - `tabindex: number`
 
 Properties:
-- `cd: unknown = inject(ChangeDetectorRef)`
 - `eclIconComponents: unknown = contentChildren(forwardRef(() => EclIconComponent), { descendants: true })`
 - `el: unknown = inject(ElementRef)`
 - `renderer: unknown = inject(Renderer2)`
@@ -4902,7 +4855,6 @@ Selector: `iframe[eclMediaContainerIframe]`
 Description: Adds styling and attributes to the iframe element.
 
 Inputs:
-- `ratio: string`
 - `height = undefined`
 - `width = undefined`
 - `class: string`
@@ -4980,9 +4932,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `hasClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -4998,9 +4947,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -5016,9 +4962,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -5032,9 +4975,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -5052,9 +4992,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getEclMegaMenuFeaturedItemHeight(): number`
 - `getCssClasses(rootClass: string): string`
@@ -5086,9 +5023,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -5104,9 +5038,6 @@ Inputs:
 - `e2eAttr: any`
 - `tabindex: number`
 
-Properties:
-- `cmpClass: unknown = true`
-
 Methods:
 - `getCssClasses(rootClass: string): string`
 
@@ -5126,7 +5057,6 @@ Outputs:
 - `megaMenuSubItemClicked: EventEmitter = new EventEmitter()`
 
 Properties:
-- `cmpClass: unknown = true`
 - `el: unknown = inject(ElementRef)`
 - `isScrollable: unknown = false`
 - `spacer: unknown = contentChild(forwardRef(() => EclMegaMenuSpacerDirective))`
@@ -7635,6 +7565,12 @@ Properties:
 
 ## Public variables
 
+- `ARROW_SIZE: string = '0.5rem'` — Half the arrow's own width, matching ECL's arrowSize .
+  Defined in `packages/ecl/components/ecl-site-header/language/ecl-site-header-language.component.ts`
+- `ARROW_SIZE: string = '0.5rem'` — Half the arrow's own width, matching ECL's arrowSize .
+  Defined in `packages/ecl/components/ecl-site-header/login/ecl-site-header-login.component.ts`
+- `ARROW_SIZE: string = '0.5rem'` — Half the arrow's own width, matching ECL's arrowSize .
+  Defined in `packages/ecl/components/ecl-site-header/search/ecl-site-header-search.component.ts`
 - `AVAILABLE_NON_EU_LOGO_COUNTRY_CODES: string[] = ['ar', 'ca', 'is', 'jp', 'lb', 'no', 'ru', 'sw', 'tr', 'uk', 'zh'] as const`
   Defined in `packages/ecl/core/utils/constants/constants.ts`
 - `DEFAULT_LOGO_COUNTRY_CODE: string = 'en'`
@@ -7801,5 +7737,9 @@ Properties:
   Defined in `packages/ecl/components/ecl-search-form/ecl-search-form.component.ts`
 - `noop: unknown = (): void => { /** empty*/ }`
   Defined in `packages/ecl/components/ecl-site-header/search/ecl-site-header-search.component.ts`
+- `RESIZE_DEBOUNCE: number = 200` — Debounce for the resize recomputation, matching ECL's handleResize .
+  Defined in `packages/ecl/components/ecl-site-header/login/ecl-site-header-login.component.ts`
+- `RESIZE_DEBOUNCE: number = 200` — Debounce for the resize recomputation, matching ECL's handleResize .
+  Defined in `packages/ecl/components/ecl-site-header/search/ecl-site-header-search.component.ts`
 - `testBed: unknown = getTestBed()`
   Defined in `packages/ecl/test-setup.ts`