@eui/eds 23.0.0-alpha.6 → 23.0.0-alpha.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/changelog.html +41 -0
- package/docs/classes/EdsChipModel.html +6 -6
- package/docs/classes/{EuiChipTooltip.html → EdsChipTooltip.html} +2 -2
- package/docs/components/EdsAlert.html +27 -226
- package/docs/components/EdsAlertTitle.html +2 -2
- package/docs/components/EdsAvatar.html +35 -108
- package/docs/components/EdsAvatarBadge.html +2 -2
- package/docs/components/EdsAvatarContent.html +2 -2
- package/docs/components/EdsAvatarContentLabel.html +2 -2
- package/docs/components/EdsAvatarContentSublabel.html +2 -2
- package/docs/components/EdsAvatarIcon.html +2 -2
- package/docs/components/EdsAvatarImage.html +2 -2
- package/docs/components/EdsAvatarList.html +2 -2
- package/docs/components/EdsAvatarText.html +2 -2
- package/docs/components/EdsBadge.html +41 -175
- package/docs/components/EdsButton.html +123 -123
- package/docs/components/EdsChip.html +135 -254
- package/docs/components/EdsIcon.html +93 -145
- package/docs/components/EdsIconButton.html +72 -86
- package/docs/components/EdsIconImage.html +5 -5
- package/docs/components/EdsIconState.html +47 -61
- package/docs/components/EdsLanguageSelector.html +870 -0
- package/docs/components/EdsMenu.html +631 -0
- package/docs/components/EdsMenuItemComponent.html +728 -0
- package/docs/components/EdsOverlay.html +804 -0
- package/docs/components/EdsOverlayContent.html +315 -0
- package/docs/components/EdsOverlayFooter.html +315 -0
- package/docs/components/EdsOverlayHeader.html +458 -0
- package/docs/components/EdsOverlayHeaderActionItems.html +315 -0
- package/docs/components/EdsOverlayHeaderLabel.html +315 -0
- package/docs/components/EdsOverlayHeaderSublabel.html +315 -0
- package/docs/components/EdsPage.html +315 -0
- package/docs/components/EdsPageContent.html +319 -0
- package/docs/components/EdsPageFooter.html +387 -0
- package/docs/components/EdsPageHeader.html +673 -0
- package/docs/components/EdsPageHeaderActionItems.html +315 -0
- package/docs/components/EdsPageHeaderBody.html +315 -0
- package/docs/components/EdsPageHeaderLabel.html +315 -0
- package/docs/components/EdsPageHeaderSublabel.html +315 -0
- package/docs/components/EdsShell.html +1078 -0
- package/docs/components/EdsShellContent.html +315 -0
- package/docs/components/EdsShellFooter.html +383 -0
- package/docs/components/EdsShellHeader.html +383 -0
- package/docs/components/EdsShellHeaderApp.html +443 -0
- package/docs/components/EdsShellHeaderEnd.html +311 -0
- package/docs/components/EdsShellHeaderEnvironment.html +315 -0
- package/docs/components/EdsShellHeaderLogo.html +561 -0
- package/docs/components/EdsShellHeaderStart.html +311 -0
- package/docs/components/EdsShellMenuToggle.html +458 -0
- package/docs/components/EdsShellSidebar.html +413 -0
- package/docs/components/EdsShellSidebarBottomNav.html +624 -0
- package/docs/components/EdsShellSidebarFooter.html +315 -0
- package/docs/components/EdsShellSidebarHeader.html +508 -0
- package/docs/components/EdsShellSidebarNav.html +624 -0
- package/docs/components/EdsShellToolbar.html +315 -0
- package/docs/components/EdsShellToolbarApp.html +443 -0
- package/docs/components/EdsShellToolbarEnd.html +315 -0
- package/docs/components/EdsShellToolbarEnvironment.html +315 -0
- package/docs/components/EdsShellToolbarLogo.html +315 -0
- package/docs/components/EdsShellToolbarStart.html +315 -0
- package/docs/components/EdsShellTopMessage.html +574 -0
- package/docs/components/EdsTab.html +6 -10
- package/docs/components/EdsTabBody.html +6 -10
- package/docs/components/EdsTabHeader.html +6 -10
- package/docs/components/EdsTabHeaderLabel.html +2 -2
- package/docs/components/EdsTabHeaderLeftContent.html +2 -2
- package/docs/components/EdsTabHeaderRightContent.html +2 -2
- package/docs/components/EdsTabHeaderSublabel.html +2 -2
- package/docs/components/EdsTabs.html +61 -126
- package/docs/components/EdsTabsRightContent.html +2 -2
- package/docs/components/EdsTag.html +82 -182
- package/docs/components/EdsTooltipContainer.html +2 -2
- package/docs/components/EdsUserProfile.html +1336 -0
- package/docs/components/EdsUserProfileMenu.html +315 -0
- package/docs/components/EdsUserProfileMenuItem.html +511 -0
- package/docs/directives/{EuiBaseColorVariantsDirective.html → EdsBaseColorVariantsDirective.html} +174 -91
- package/docs/directives/{EuiBaseSizeVariantsDirective.html → EdsBaseSizeVariantsDirective.html} +107 -107
- package/docs/directives/EdsResizable.html +586 -0
- package/docs/directives/EdsTooltip.html +21 -21
- package/docs/interfaces/EdsLanguage.html +368 -0
- package/docs/interfaces/EdsMenuItem.html +731 -0
- package/docs/js/menu-wc.js +146 -5
- package/docs/js/search/search_index.js +2 -2
- package/docs/json/EdsAlert.md +7 -7
- package/docs/json/EdsAvatar.md +8 -7
- package/docs/json/EdsBadge.md +14 -14
- package/docs/json/EdsBaseColorVariantsDirective.md +22 -0
- package/docs/json/EdsBaseSizeVariantsDirective.md +23 -0
- package/docs/json/EdsButton.md +21 -21
- package/docs/json/EdsChip.md +15 -14
- package/docs/json/EdsIcon.md +23 -23
- package/docs/json/EdsIconButton.md +18 -17
- package/docs/json/EdsIconImage.md +10 -10
- package/docs/json/EdsIconState.md +12 -12
- package/docs/json/EdsLanguageSelector.md +16 -0
- package/docs/json/EdsMenu.md +17 -0
- package/docs/json/EdsMenuItemComponent.md +18 -0
- package/docs/json/EdsOverlay.md +19 -0
- package/docs/json/EdsOverlayContent.md +8 -0
- package/docs/json/EdsOverlayFooter.md +8 -0
- package/docs/json/EdsOverlayHeader.md +11 -0
- package/docs/json/EdsOverlayHeaderActionItems.md +8 -0
- package/docs/json/EdsOverlayHeaderLabel.md +8 -0
- package/docs/json/EdsOverlayHeaderSublabel.md +8 -0
- package/docs/json/EdsPage.md +8 -0
- package/docs/json/EdsPageContent.md +8 -0
- package/docs/json/EdsPageFooter.md +11 -0
- package/docs/json/EdsPageHeader.md +18 -0
- package/docs/json/EdsPageHeaderActionItems.md +8 -0
- package/docs/json/EdsPageHeaderBody.md +8 -0
- package/docs/json/EdsPageHeaderLabel.md +8 -0
- package/docs/json/EdsPageHeaderSublabel.md +8 -0
- package/docs/json/EdsResizable.md +24 -0
- package/docs/json/EdsShell.md +14 -0
- package/docs/json/EdsShellContent.md +8 -0
- package/docs/json/EdsShellFooter.md +11 -0
- package/docs/json/EdsShellHeader.md +11 -0
- package/docs/json/EdsShellHeaderApp.md +13 -0
- package/docs/json/EdsShellHeaderEnd.md +8 -0
- package/docs/json/EdsShellHeaderEnvironment.md +8 -0
- package/docs/json/EdsShellHeaderLogo.md +15 -0
- package/docs/json/EdsShellHeaderStart.md +8 -0
- package/docs/json/EdsShellMenuToggle.md +11 -0
- package/docs/json/EdsShellSidebar.md +12 -0
- package/docs/json/EdsShellSidebarBottomNav.md +17 -0
- package/docs/json/EdsShellSidebarFooter.md +8 -0
- package/docs/json/EdsShellSidebarHeader.md +15 -0
- package/docs/json/EdsShellSidebarNav.md +17 -0
- package/docs/json/EdsShellToolbar.md +8 -0
- package/docs/json/EdsShellToolbarApp.md +13 -0
- package/docs/json/EdsShellToolbarEnd.md +8 -0
- package/docs/json/EdsShellToolbarEnvironment.md +8 -0
- package/docs/json/EdsShellToolbarLogo.md +8 -0
- package/docs/json/EdsShellToolbarStart.md +8 -0
- package/docs/json/EdsShellTopMessage.md +19 -0
- package/docs/json/EdsTabs.md +4 -4
- package/docs/json/EdsTag.md +14 -13
- package/docs/json/EdsTooltip.md +7 -7
- package/docs/json/EdsUserProfile.md +21 -0
- package/docs/json/EdsUserProfileMenu.md +8 -0
- package/docs/json/EdsUserProfileMenuItem.md +8 -0
- package/docs/json/documentation.json +9649 -5338
- package/docs/llms.txt +641 -123
- package/docs/miscellaneous/typealiases.html +309 -0
- package/docs/miscellaneous/variables.html +342 -0
- package/docs/overview.html +3 -3
- package/docs/properties.html +1 -1
- package/eds-language-selector/package.json +4 -0
- package/eds-menu/package.json +4 -0
- package/eds-overlay/package.json +4 -0
- package/eds-page/package.json +4 -0
- package/eds-resizable/package.json +4 -0
- package/eds-shell/package.json +4 -0
- package/eds-user-profile/package.json +4 -0
- package/fesm2022/eui-eds-eds-alert.mjs +33 -61
- package/fesm2022/eui-eds-eds-alert.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-avatar.mjs +29 -43
- package/fesm2022/eui-eds-eds-avatar.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-badge.mjs +65 -89
- package/fesm2022/eui-eds-eds-badge.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-button.mjs +70 -99
- package/fesm2022/eui-eds-eds-button.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-chip.mjs +118 -111
- package/fesm2022/eui-eds-eds-chip.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-icon-button.mjs +49 -55
- package/fesm2022/eui-eds-eds-icon-button.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-icon-state.mjs +38 -34
- package/fesm2022/eui-eds-eds-icon-state.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-icon.mjs +92 -107
- package/fesm2022/eui-eds-eds-icon.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-language-selector.mjs +67 -0
- package/fesm2022/eui-eds-eds-language-selector.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-menu.mjs +90 -0
- package/fesm2022/eui-eds-eds-menu.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-overlay.mjs +141 -0
- package/fesm2022/eui-eds-eds-overlay.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-page.mjs +129 -0
- package/fesm2022/eui-eds-eds-page.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-resizable.mjs +193 -0
- package/fesm2022/eui-eds-eds-resizable.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-shell.mjs +481 -0
- package/fesm2022/eui-eds-eds-shell.mjs.map +1 -0
- package/fesm2022/eui-eds-eds-tabs.mjs +71 -101
- package/fesm2022/eui-eds-eds-tabs.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-tag.mjs +74 -77
- package/fesm2022/eui-eds-eds-tag.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-tooltip.mjs +23 -23
- package/fesm2022/eui-eds-eds-tooltip.mjs.map +1 -1
- package/fesm2022/eui-eds-eds-user-profile.mjs +231 -0
- package/fesm2022/eui-eds-eds-user-profile.mjs.map +1 -0
- package/fesm2022/eui-eds-shared.mjs +255 -243
- package/fesm2022/eui-eds-shared.mjs.map +1 -1
- package/package.json +29 -1
- package/types/eui-eds-eds-alert.d.ts +7 -29
- package/types/eui-eds-eds-alert.d.ts.map +1 -1
- package/types/eui-eds-eds-avatar.d.ts +11 -12
- package/types/eui-eds-eds-avatar.d.ts.map +1 -1
- package/types/eui-eds-eds-badge.d.ts +15 -20
- package/types/eui-eds-eds-badge.d.ts.map +1 -1
- package/types/eui-eds-eds-button.d.ts +22 -30
- package/types/eui-eds-eds-button.d.ts.map +1 -1
- package/types/eui-eds-eds-chip.d.ts +36 -36
- package/types/eui-eds-eds-chip.d.ts.map +1 -1
- package/types/eui-eds-eds-icon-button.d.ts +13 -16
- package/types/eui-eds-eds-icon-button.d.ts.map +1 -1
- package/types/eui-eds-eds-icon-state.d.ts +8 -8
- package/types/eui-eds-eds-icon-state.d.ts.map +1 -1
- package/types/eui-eds-eds-icon.d.ts +22 -29
- package/types/eui-eds-eds-icon.d.ts.map +1 -1
- package/types/eui-eds-eds-language-selector.d.ts +34 -0
- package/types/eui-eds-eds-language-selector.d.ts.map +1 -0
- package/types/eui-eds-eds-menu.d.ts +65 -0
- package/types/eui-eds-eds-menu.d.ts.map +1 -0
- package/types/eui-eds-eds-overlay.d.ts +64 -0
- package/types/eui-eds-eds-overlay.d.ts.map +1 -0
- package/types/eui-eds-eds-page.d.ts +63 -0
- package/types/eui-eds-eds-page.d.ts.map +1 -0
- package/types/eui-eds-eds-resizable.d.ts +49 -0
- package/types/eui-eds-eds-resizable.d.ts.map +1 -0
- package/types/eui-eds-eds-shell.d.ts +229 -0
- package/types/eui-eds-eds-shell.d.ts.map +1 -0
- package/types/eui-eds-eds-tabs.d.ts +32 -30
- package/types/eui-eds-eds-tabs.d.ts.map +1 -1
- package/types/eui-eds-eds-tag.d.ts +22 -25
- package/types/eui-eds-eds-tag.d.ts.map +1 -1
- package/types/eui-eds-eds-tooltip.d.ts +16 -16
- package/types/eui-eds-eds-user-profile.d.ts +78 -0
- package/types/eui-eds-eds-user-profile.d.ts.map +1 -0
- package/types/eui-eds-shared.d.ts +82 -79
- package/types/eui-eds-shared.d.ts.map +1 -1
- package/docs/json/EuiBaseColorVariantsDirective.md +0 -21
- package/docs/json/EuiBaseSizeVariantsDirective.md +0 -23
package/docs/llms.txt
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# eui documentation
|
|
2
2
|
|
|
3
|
-
> Generated by compodoc 2.0.0 at 2026-
|
|
3
|
+
> Generated by compodoc 2.0.0 at 2026-08-03T15:06:50.240Z, llm-md export.
|
|
4
4
|
|
|
5
5
|
## Components
|
|
6
6
|
|
|
@@ -11,7 +11,7 @@ Selector: `div[edsAlert], eds-alert`
|
|
|
11
11
|
Change detection: `ChangeDetectionStrategy.OnPush`
|
|
12
12
|
|
|
13
13
|
Inputs:
|
|
14
|
-
- `e2eAttr: string = '
|
|
14
|
+
- `e2eAttr: string = 'eds-alert'` — Data attribute value for end-to-end testing identification. Applied as data-e2e attribute on the host element. 'eds-alert'
|
|
15
15
|
- `isCloseable: boolean = false` — Enables a close button allowing users to dismiss the alert. When true, displays a close icon button that hides the alert and emits closeAlert event. false
|
|
16
16
|
- `isVisible: boolean = true` — Controls the visibility state of the alert. Two-way bindable model that can be programmatically controlled or updated by user dismissal. true
|
|
17
17
|
|
|
@@ -20,7 +20,7 @@ Outputs:
|
|
|
20
20
|
- `isVisible: boolean = true` — Controls the visibility state of the alert. Two-way bindable model that can be programmatically controlled or updated by user dismissal. true
|
|
21
21
|
|
|
22
22
|
Properties:
|
|
23
|
-
- `
|
|
23
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-alert', this.colorVariantsBase.getCssClasses('eds-alert'), !this.isVisible() ? 'eds-alert--hidden' : '', ] .join(' ') .trim(); })` — Computed host CSS classes based on current state.
|
|
24
24
|
|
|
25
25
|
Methods:
|
|
26
26
|
- `onCloseClick(): void` — Hide the alert and emits the closeAlert event when the close button is clicked.
|
|
@@ -39,11 +39,11 @@ Change detection: `ChangeDetectionStrategy.OnPush`
|
|
|
39
39
|
|
|
40
40
|
Inputs:
|
|
41
41
|
- `aria-label: string | null = 'avatar'` — ARIA label for accessibility 'avatar'
|
|
42
|
+
- `colorPalette: string = ''` — Extra color palette to be used on the status-badge.
|
|
42
43
|
- `e2eAttr: string = 'eds-avatar'` — Data attribute for E2E testing 'eds-avatar'
|
|
43
44
|
|
|
44
45
|
Properties:
|
|
45
|
-
- `avatarImage:
|
|
46
|
-
- `role: string = 'status'` — ARIA role for accessibility 'status'
|
|
46
|
+
- `avatarImage: unknown = contentChild.required(forwardRef(() => EdsAvatarImage))`
|
|
47
47
|
|
|
48
48
|
Methods:
|
|
49
49
|
- `cssClasses(): string` — Gets the CSS classes to be applied to the host element. Combines base classes with modifier classes.
|
|
@@ -127,14 +127,14 @@ Inputs:
|
|
|
127
127
|
- `aria-label: string | null = 'badge'` — ARIA label for accessibility
|
|
128
128
|
- `charReplacement: string = ''` — String to display when content is truncated due to maxCharCount. '99+'
|
|
129
129
|
- `e2eAttr: string = 'eds-badge'` — Data attribute for e2e testing
|
|
130
|
-
- `
|
|
131
|
-
- `
|
|
132
|
-
- `
|
|
130
|
+
- `edsBadgeIcon: boolean = false` — Whether the badge contains only an icon (displays as a small dot indicator). When true, no text content is shown, creating a minimal status indicator. false
|
|
131
|
+
- `edsDottedBadge: boolean = false` — Whether to display the badge with dotted styling variant. Applies alternative visual treatment to the badge. false
|
|
132
|
+
- `edsOutline: boolean = false`
|
|
133
133
|
- `maxCharCount: number = 0` — Maximum number of characters to display before truncating. When content exceeds this limit, it will be replaced with charReplacement value. Useful for displaying large numbers in a compact format (e.g., "99+" for values over 99).
|
|
134
134
|
|
|
135
135
|
Properties:
|
|
136
|
-
- `content: ElementRef`
|
|
137
|
-
- `
|
|
136
|
+
- `content: unknown = viewChild.required<ElementRef>('contentRef')`
|
|
137
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-badge', this.sizeVariantsBase.getCssClasses('eds-badge'), this.colorVariantsBase.getCssClasses('eds-badge'), this.isEmpty() || th…` — Computes and returns the CSS classes for the badge based on its current state
|
|
138
138
|
|
|
139
139
|
Methods:
|
|
140
140
|
- `onContentChanged(): void` — Handles content changes and triggers content checking
|
|
@@ -146,18 +146,21 @@ Selector: `button[edsButton]`
|
|
|
146
146
|
Change detection: `ChangeDetectionStrategy.OnPush`
|
|
147
147
|
|
|
148
148
|
Inputs:
|
|
149
|
-
- `
|
|
150
|
-
- `
|
|
151
|
-
- `
|
|
152
|
-
- `
|
|
153
|
-
- `
|
|
154
|
-
- `
|
|
155
|
-
- `
|
|
156
|
-
- `
|
|
157
|
-
- `
|
|
158
|
-
- `
|
|
159
|
-
- `
|
|
160
|
-
- `id: string` — ID attribute for the button element
|
|
149
|
+
- `edsDisabled: boolean` — Controls the disabled state of the button When true, adds the disabled attribute and prevents interaction
|
|
150
|
+
- `e2eAttr: string = 'eds-button'` — Data attribute for e2e testing eds-button
|
|
151
|
+
- `edsAvatarButton: boolean = false` — When true, style the button when used in avatar trigger (for dropdown trigger f.e. see actionable avatar) false
|
|
152
|
+
- `edsBlockButton: boolean = false` — When true, makes the button full-width false
|
|
153
|
+
- `edsButtonPrimary: boolean = true`
|
|
154
|
+
- `edsButtonRounded: boolean = false`
|
|
155
|
+
- `edsButtonSecondary: boolean = false`
|
|
156
|
+
- `edsButtonTertiary: boolean = false`
|
|
157
|
+
- `edsIconButton: boolean = false` — When true, styles the button for icon-only content false
|
|
158
|
+
- `edsLineWrap: boolean = false` — When true, allows text content to wrap false
|
|
159
|
+
- `edsTypeVariant: "primary" | "secondary" | "tertiary" = 'primary'`
|
|
160
|
+
- `id: string | undefined = undefined` — ID attribute for the button element
|
|
161
|
+
|
|
162
|
+
Properties:
|
|
163
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-button', this.sizeVariantsBase.getCssClasses('eds-button'), this.colorVariantsBase.getCssClasses('eds-button'), (this.edsButtonPr…` — Computes and returns the CSS classes for the button based on its current state
|
|
161
164
|
|
|
162
165
|
### EdsChip
|
|
163
166
|
|
|
@@ -166,25 +169,27 @@ Selector: `eds-chip, span[edsChip], li[edsChip]`
|
|
|
166
169
|
Change detection: `ChangeDetectionStrategy.OnPush`
|
|
167
170
|
|
|
168
171
|
Inputs:
|
|
172
|
+
- `edsDisabled: boolean` — Controls the disabled state of the button When true, adds the disabled attribute and prevents interaction
|
|
169
173
|
- `ariaLabel: string = 'Chip content'` — Sets the aria-label attribute for the host element. 'Chip content'
|
|
170
|
-
- `data: any
|
|
171
|
-
- `e2eAttr: string = '
|
|
172
|
-
- `
|
|
173
|
-
- `
|
|
174
|
-
- `id: string | number` — Sets the id of the chip.
|
|
174
|
+
- `data: any` — Sets the data of the chip like tooltip configuration.
|
|
175
|
+
- `e2eAttr: string = 'eds-chip'` — Sets the data-e2e attribute for the host element. 'eds-chip'
|
|
176
|
+
- `edsInternalId: string = ''` — Sets the edsInternalId of the chip. null
|
|
177
|
+
- `id: string | number = ''` — Sets the id of the chip.
|
|
175
178
|
- `isActive: boolean = false`
|
|
176
|
-
- `
|
|
177
|
-
- `tooltipMessage: string` — Sets the label of the tooltip to diaply on hover.
|
|
179
|
+
- `isRemovable: boolean = false` — Wether the chip can be removed. false
|
|
180
|
+
- `tooltipMessage: string = ''` — Sets the label of the tooltip to diaply on hover.
|
|
178
181
|
|
|
179
182
|
Outputs:
|
|
180
|
-
- `
|
|
183
|
+
- `chipClick: any`
|
|
184
|
+
- `chipRemove: any` — Event emitted when the chip is removed.
|
|
181
185
|
|
|
182
186
|
Properties:
|
|
183
|
-
- `chipLabel: ElementRef<HTMLInputElement
|
|
187
|
+
- `chipLabel: unknown = viewChild.required<ElementRef<HTMLInputElement>>('chipLabel')` — Icon declares by user in the chip
|
|
188
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-chip', this.sizeVariantsBase.getCssClasses('eds-chip'), this.colorVariantsBase.getCssClasses('eds-chip'), this.isRemovable() ? 'e…` — Computes and returns the CSS classes for the component based on its current state.
|
|
184
189
|
- `role: string = 'status'` — Sets the role attribute for the host element. 'status'
|
|
185
190
|
|
|
186
191
|
Methods:
|
|
187
|
-
- `
|
|
192
|
+
- `onHostClick(event?: Event): void`
|
|
188
193
|
|
|
189
194
|
### EdsIcon
|
|
190
195
|
|
|
@@ -193,15 +198,16 @@ Selector: `eds-icon, span[edsIcon]`
|
|
|
193
198
|
Change detection: `ChangeDetectionStrategy.OnPush`
|
|
194
199
|
|
|
195
200
|
Inputs:
|
|
196
|
-
- `ariaHidden: boolean = true` — Hides the icon from assistive technologies when purely decorative.
|
|
197
|
-
- `ariaLabel: string` — Accessible label for screen readers describing the icon's purpose.
|
|
198
|
-
- `icon: string` — Name of the icon to display, optionally including the icon set using 'iconName:setName' format. When format includes colon separator, automatically splits into icon and set properties.
|
|
199
|
-
- `set: string = 'regular'` — Icon set library to load the icon from.
|
|
201
|
+
- `ariaHidden: boolean = true` — Hides the icon from assistive technologies when purely decorative. true
|
|
202
|
+
- `ariaLabel: string = ''` — Accessible label for screen readers describing the icon's purpose.
|
|
203
|
+
- `icon: string = ''` — Name of the icon to display, optionally including the icon set using 'iconName:setName' format. When format includes colon separator, automatically splits into icon and set properties.
|
|
204
|
+
- `set: string = 'regular'` — Icon set library to load the icon from. 'regular'
|
|
200
205
|
|
|
201
206
|
Properties:
|
|
202
|
-
- `ariaRole: string = 'img'`
|
|
203
207
|
- `assetsBaseUrl: string = 'assets'`
|
|
204
|
-
- `
|
|
208
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-icon', this.sizeVariantsBase.getCssClasses('eds-icon'), this.colorVariantsBase.getCssClasses('eds-icon'), ] .join(' ') .trim(); }…`
|
|
209
|
+
- `iconName: unknown = computed(() => { const raw = this.icon(); if (raw && raw.indexOf(':') > -1) { return raw.split(':')[0]; } return raw; })` — Resolved icon name (parsed from 'icon:set' format).
|
|
210
|
+
- `resolvedSet: unknown = computed(() => { const raw = this.icon(); if (raw && raw.indexOf(':') > -1) { return raw.split(':')[1] || 'regular'; } return this.set() || 'regular'; })` — Resolved icon set (parsed from 'icon:set' format or defaults to set input).
|
|
205
211
|
|
|
206
212
|
### EdsIconButton
|
|
207
213
|
|
|
@@ -209,13 +215,16 @@ File: `packages/eds/eds-icon-button/eds-icon-button.ts`
|
|
|
209
215
|
Selector: `button[edsIconButton]`
|
|
210
216
|
|
|
211
217
|
Inputs:
|
|
212
|
-
- `ariaLabel: string = '
|
|
213
|
-
- `
|
|
214
|
-
- `
|
|
215
|
-
- `icon: string` — The name of the icon to display from the eUI icon library.
|
|
218
|
+
- `ariaLabel: string = 'EDS Icon button'` — Accessible label for screen readers describing the button's purpose. 'EDS Icon button'
|
|
219
|
+
- `edsDisabled: boolean = false`
|
|
220
|
+
- `edsRounded: boolean = false` — Applies rounded corners to the button shape instead of default square corners. Default: false
|
|
221
|
+
- `icon: string = ''` — The name of the icon to display from the eUI icon library.
|
|
216
222
|
|
|
217
223
|
Outputs:
|
|
218
|
-
- `buttonClick:
|
|
224
|
+
- `buttonClick: Event` — Emitted when the button is clicked. Payload contains the native click Event object.
|
|
225
|
+
|
|
226
|
+
Properties:
|
|
227
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-icon-button', this.sizeVariantsBase.getCssClasses('eds-icon-button'), this.colorVariantsBase.getCssClasses('eds-icon-button'), th…`
|
|
219
228
|
|
|
220
229
|
Methods:
|
|
221
230
|
- `onClick(event: Event): void`
|
|
@@ -241,7 +250,403 @@ File: `packages/eds/eds-icon-state/eds-icon-state.ts`
|
|
|
241
250
|
Selector: `eds-icon-state`
|
|
242
251
|
|
|
243
252
|
Inputs:
|
|
244
|
-
- `ariaLabel: string` — Accessible label for screen readers describing the icon's purpose or meaning. Required for accessibility when the icon conveys semantic information.
|
|
253
|
+
- `ariaLabel: string = ''` — Accessible label for screen readers describing the icon's purpose or meaning. Required for accessibility when the icon conveys semantic information.
|
|
254
|
+
|
|
255
|
+
Properties:
|
|
256
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-icon-state', this.sizeVariantsBase.getCssClasses('eds-icon-state'), this.colorVariantsBase.getCssClasses('eds-icon-state'), ].joi…`
|
|
257
|
+
|
|
258
|
+
### EdsLanguageSelector
|
|
259
|
+
|
|
260
|
+
File: `packages/eds/eds-language-selector/eds-language-selector.ts`
|
|
261
|
+
Selector: `eds-language-selector`
|
|
262
|
+
|
|
263
|
+
Inputs:
|
|
264
|
+
- `ariaLabel: string = ''` — Aria label for accessibility.
|
|
265
|
+
- `languages: EdsLanguage[] = []` — Available languages.
|
|
266
|
+
- `selectedLanguage: string = 'en'` — Currently selected language code.
|
|
267
|
+
|
|
268
|
+
Outputs:
|
|
269
|
+
- `languageChange: string` — Emits the selected language code when user picks a language.
|
|
270
|
+
|
|
271
|
+
Properties:
|
|
272
|
+
- ``computedAriaLabel: unknown = computed(() => { if (this.ariaLabel()) return this.ariaLabel(); return `Change Language - Current: ${this.currentLanguage().label}`; })``
|
|
273
|
+
- `currentLanguage: unknown = computed(() => { const langs = this.languages(); const selected = this.selectedLanguage(); return langs.find(l => l.code === selected) ?? langs[0] ?? { code: 'e…`
|
|
274
|
+
- `isOpen: unknown = signal(false)`
|
|
275
|
+
|
|
276
|
+
Methods:
|
|
277
|
+
- `onDocumentClick(event: MouseEvent): void`
|
|
278
|
+
- `selectLanguage(lang: EdsLanguage): void`
|
|
279
|
+
- `toggle(): void`
|
|
280
|
+
|
|
281
|
+
### EdsMenu
|
|
282
|
+
|
|
283
|
+
File: `packages/eds/eds-menu/eds-menu.ts`
|
|
284
|
+
Selector: `eds-menu`
|
|
285
|
+
|
|
286
|
+
Inputs:
|
|
287
|
+
- `hasCollapsedLabels: boolean = false` — Whether to show labels underneath icons in collapsed mode.
|
|
288
|
+
- `hasIcons: boolean = false` — Whether to show icons alongside labels.
|
|
289
|
+
- `isCollapsed: boolean = false` — Whether the menu is in collapsed/icon-only mode.
|
|
290
|
+
- `items: EdsMenuItem[] = []` — Array of menu items to render.
|
|
291
|
+
|
|
292
|
+
Outputs:
|
|
293
|
+
- `itemClick: EdsMenuItem` — Emits when a menu item is clicked.
|
|
294
|
+
|
|
295
|
+
Methods:
|
|
296
|
+
- `onItemClick(item: EdsMenuItem): void`
|
|
297
|
+
|
|
298
|
+
### EdsMenuItemComponent
|
|
299
|
+
|
|
300
|
+
File: `packages/eds/eds-menu/eds-menu-item.ts`
|
|
301
|
+
Selector: `eds-menu-item`
|
|
302
|
+
|
|
303
|
+
Inputs:
|
|
304
|
+
- `hasCollapsedLabel: boolean = false` — Whether to show label under icon in collapsed mode.
|
|
305
|
+
- `hasIcon: boolean = false` — Whether to show icon.
|
|
306
|
+
- `isCollapsed: boolean = false` — Whether the menu is in collapsed/icon-only mode.
|
|
307
|
+
- `item: EdsMenuItem` — The menu item data.
|
|
308
|
+
|
|
309
|
+
Outputs:
|
|
310
|
+
- `childClick: EdsMenuItem` — Emits when a child item is clicked.
|
|
311
|
+
- `itemClick: EdsMenuItem` — Emits when this item is clicked.
|
|
312
|
+
|
|
313
|
+
Methods:
|
|
314
|
+
- `onChildClick(child: EdsMenuItem): void`
|
|
315
|
+
- `onClick(): void`
|
|
316
|
+
- `toggleExpand(): void`
|
|
317
|
+
|
|
318
|
+
### EdsOverlay
|
|
319
|
+
|
|
320
|
+
File: `packages/eds/eds-overlay/eds-overlay.ts`
|
|
321
|
+
Selector: `eds-overlay`
|
|
322
|
+
Change detection: `ChangeDetectionStrategy.OnPush`
|
|
323
|
+
|
|
324
|
+
Inputs:
|
|
325
|
+
- `fixedWidth: string = ''` — Fixed width value (overrides responsive width).
|
|
326
|
+
- `hasClosedOnClickOutside: boolean = false` — Enables automatic closing when clicking outside the overlay.
|
|
327
|
+
- `isActive: boolean = false` — Controls the visibility and active state of the overlay.
|
|
328
|
+
- `isHighlighted: boolean = false` — Applies highlighted visual styling.
|
|
329
|
+
- `position: EdsOverlayPosition = 'right'` — Screen position where the overlay appears ('right', 'left', 'top', 'bottom').
|
|
330
|
+
- `width: string = ''` — Responsive width variant for the overlay panel (e.g. 'small', 'medium', 'large').
|
|
331
|
+
|
|
332
|
+
Outputs:
|
|
333
|
+
- `activeState: boolean` — Emitted when the overlay's active state changes (typically false for close requests).
|
|
334
|
+
|
|
335
|
+
Properties:
|
|
336
|
+
- ``hostClasses: unknown = computed(() => { return [ 'eds-overlay', `eds-overlay--${this.position()}`, this.isActive() ? 'eds-overlay--active' : '', this.width() ? `eds-overlay--width-${t…``
|
|
337
|
+
|
|
338
|
+
Methods:
|
|
339
|
+
- `onBackdropClick(): void`
|
|
340
|
+
- `onEscape(): void`
|
|
341
|
+
|
|
342
|
+
### EdsOverlayContent
|
|
343
|
+
|
|
344
|
+
File: `packages/eds/eds-overlay/eds-overlay-content.ts`
|
|
345
|
+
Selector: `eds-overlay-content`
|
|
346
|
+
|
|
347
|
+
### EdsOverlayFooter
|
|
348
|
+
|
|
349
|
+
File: `packages/eds/eds-overlay/eds-overlay-footer.ts`
|
|
350
|
+
Selector: `eds-overlay-footer`
|
|
351
|
+
|
|
352
|
+
### EdsOverlayHeader
|
|
353
|
+
|
|
354
|
+
File: `packages/eds/eds-overlay/eds-overlay-header.ts`
|
|
355
|
+
Selector: `eds-overlay-header`
|
|
356
|
+
|
|
357
|
+
Outputs:
|
|
358
|
+
- `closeClick: void` — Emitted when the built-in close button is clicked.
|
|
359
|
+
|
|
360
|
+
Methods:
|
|
361
|
+
- `onClose(): void`
|
|
362
|
+
|
|
363
|
+
### EdsOverlayHeaderActionItems
|
|
364
|
+
|
|
365
|
+
File: `packages/eds/eds-overlay/eds-overlay-header-action-items.ts`
|
|
366
|
+
Selector: `eds-overlay-header-action-items`
|
|
367
|
+
|
|
368
|
+
### EdsOverlayHeaderLabel
|
|
369
|
+
|
|
370
|
+
File: `packages/eds/eds-overlay/eds-overlay-header-label.ts`
|
|
371
|
+
Selector: `eds-overlay-header-label`
|
|
372
|
+
|
|
373
|
+
### EdsOverlayHeaderSublabel
|
|
374
|
+
|
|
375
|
+
File: `packages/eds/eds-overlay/eds-overlay-header-sublabel.ts`
|
|
376
|
+
Selector: `eds-overlay-header-sublabel`
|
|
377
|
+
|
|
378
|
+
### EdsPage
|
|
379
|
+
|
|
380
|
+
File: `packages/eds/eds-page/eds-page.ts`
|
|
381
|
+
Selector: `eds-page`
|
|
382
|
+
|
|
383
|
+
### EdsPageContent
|
|
384
|
+
|
|
385
|
+
File: `packages/eds/eds-page/eds-page-content.ts`
|
|
386
|
+
Selector: `eds-page-content`
|
|
387
|
+
|
|
388
|
+
### EdsPageFooter
|
|
389
|
+
|
|
390
|
+
File: `packages/eds/eds-page/eds-page-footer.ts`
|
|
391
|
+
Selector: `eds-page-footer`
|
|
392
|
+
|
|
393
|
+
Inputs:
|
|
394
|
+
- `highlighted: boolean = false` — Adds visual emphasis to the footer.
|
|
395
|
+
|
|
396
|
+
### EdsPageHeader
|
|
397
|
+
|
|
398
|
+
File: `packages/eds/eds-page/eds-page-header.ts`
|
|
399
|
+
Selector: `eds-page-header`
|
|
400
|
+
|
|
401
|
+
Inputs:
|
|
402
|
+
- `collapsedLabel: string = 'Expand'` — Accessible label for the toggle button when header is collapsed.
|
|
403
|
+
- `expandedLabel: string = 'Collapse'` — Accessible label for the toggle button when header is expanded.
|
|
404
|
+
- `isCollapsed: boolean = false` — Controls the collapsed state of the header.
|
|
405
|
+
- `isCollapsible: boolean = false` — Enables expand/collapse functionality for the page header.
|
|
406
|
+
- `isHeaderMultilines: boolean = false` — Enables multi-line layout mode for headers with extensive content.
|
|
407
|
+
|
|
408
|
+
Outputs:
|
|
409
|
+
- `collapse: boolean` — Emitted when the header's collapsed state changes.
|
|
410
|
+
|
|
411
|
+
Properties:
|
|
412
|
+
- `collapsed: unknown = signal(false)`
|
|
413
|
+
|
|
414
|
+
Methods:
|
|
415
|
+
- `toggleCollapse(): void`
|
|
416
|
+
|
|
417
|
+
### EdsPageHeaderActionItems
|
|
418
|
+
|
|
419
|
+
File: `packages/eds/eds-page/eds-page-header-action-items.ts`
|
|
420
|
+
Selector: `eds-page-header-action-items`
|
|
421
|
+
|
|
422
|
+
### EdsPageHeaderBody
|
|
423
|
+
|
|
424
|
+
File: `packages/eds/eds-page/eds-page-header-body.ts`
|
|
425
|
+
Selector: `eds-page-header-body`
|
|
426
|
+
|
|
427
|
+
### EdsPageHeaderLabel
|
|
428
|
+
|
|
429
|
+
File: `packages/eds/eds-page/eds-page-header-label.ts`
|
|
430
|
+
Selector: `eds-page-header-label`
|
|
431
|
+
|
|
432
|
+
### EdsPageHeaderSublabel
|
|
433
|
+
|
|
434
|
+
File: `packages/eds/eds-page/eds-page-header-sublabel.ts`
|
|
435
|
+
Selector: `eds-page-header-sublabel`
|
|
436
|
+
|
|
437
|
+
### EdsShell
|
|
438
|
+
|
|
439
|
+
File: `packages/eds/eds-shell/eds-shell.ts`
|
|
440
|
+
Selector: `eds-shell`
|
|
441
|
+
|
|
442
|
+
Inputs:
|
|
443
|
+
- `sidebarOpen: boolean = true` — Whether the sidebar starts open on desktop.
|
|
444
|
+
|
|
445
|
+
Outputs:
|
|
446
|
+
- `sidebarOpenChange: boolean` — Emits when sidebar open state changes.
|
|
447
|
+
|
|
448
|
+
Properties:
|
|
449
|
+
- `hasSidebar: unknown = computed(() => !!this.sidebarChild())` — Whether a sidebar is projected.
|
|
450
|
+
- `isHeaderHidden: unknown = signal(false)` — Whether the header is hidden due to scroll.
|
|
451
|
+
- `isOpen: unknown = signal(window.innerWidth > BREAKPOINT)` — Internal open state signal.
|
|
452
|
+
- `isOverlay: unknown = signal(window.innerWidth <= BREAKPOINT)` — Whether we're in overlay mode (tablet/mobile).
|
|
453
|
+
- `isSidebarCollapsed: unknown = computed(() => !this.isOpen() && !this.isOverlay())` — Whether the sidebar nav should render in collapsed/icon-only mode.
|
|
454
|
+
- `isSidebarCollapsedWithLabels: unknown = computed(() => !this.isOpen() && !this.isOverlay() && this.collapseMode() === 'icons-labels', )` — Whether collapsed mode should show labels under icons.
|
|
455
|
+
- `sidebarClasses: unknown = computed(() => { const overlay = this.isOverlay(); const open = this.isOpen(); const mode = this.collapseMode(); if (overlay) { return { open, collapsed: false,…`
|
|
456
|
+
|
|
457
|
+
Methods:
|
|
458
|
+
- `closeSidebar(): void`
|
|
459
|
+
- `onKeydown(event: KeyboardEvent): void`
|
|
460
|
+
- `onResize(): void`
|
|
461
|
+
- `onScroll(event: Event): void`
|
|
462
|
+
- `toggleSidebar(): void`
|
|
463
|
+
|
|
464
|
+
### EdsShellContent
|
|
465
|
+
|
|
466
|
+
File: `packages/eds/eds-shell/eds-shell-content.ts`
|
|
467
|
+
Selector: `eds-shell-content`
|
|
468
|
+
|
|
469
|
+
### EdsShellFooter
|
|
470
|
+
|
|
471
|
+
File: `packages/eds/eds-shell/eds-shell-footer.ts`
|
|
472
|
+
Selector: `eds-shell-footer`
|
|
473
|
+
|
|
474
|
+
Inputs:
|
|
475
|
+
- `copyright: string = ''` — Copyright text displayed on the left.
|
|
476
|
+
|
|
477
|
+
### EdsShellHeader
|
|
478
|
+
|
|
479
|
+
File: `packages/eds/eds-shell/eds-shell-header.ts`
|
|
480
|
+
Selector: `eds-shell-header`
|
|
481
|
+
|
|
482
|
+
Inputs:
|
|
483
|
+
- `isShrinkOnScroll: boolean = false` — Whether the header shrinks on scroll.
|
|
484
|
+
|
|
485
|
+
### EdsShellHeaderApp
|
|
486
|
+
|
|
487
|
+
File: `packages/eds/eds-shell/eds-shell-header-app.ts`
|
|
488
|
+
Selector: `eds-shell-header-app`
|
|
489
|
+
|
|
490
|
+
Inputs:
|
|
491
|
+
- `appName: string = ''` — Full application name.
|
|
492
|
+
- `appShortName: string = ''` — Short name for responsive/compact layouts.
|
|
493
|
+
- `appSubTitle: string = ''` — Subtitle/description below the app name.
|
|
494
|
+
|
|
495
|
+
### EdsShellHeaderEnd
|
|
496
|
+
|
|
497
|
+
File: `packages/eds/eds-shell/eds-shell-header-end.ts`
|
|
498
|
+
Selector: `eds-shell-header-end`
|
|
499
|
+
|
|
500
|
+
### EdsShellHeaderEnvironment
|
|
501
|
+
|
|
502
|
+
File: `packages/eds/eds-shell/eds-shell-header-environment.ts`
|
|
503
|
+
Selector: `eds-shell-header-environment`
|
|
504
|
+
|
|
505
|
+
### EdsShellHeaderLogo
|
|
506
|
+
|
|
507
|
+
File: `packages/eds/eds-shell/eds-shell-header-logo.ts`
|
|
508
|
+
Selector: `eds-shell-header-logo`
|
|
509
|
+
|
|
510
|
+
Inputs:
|
|
511
|
+
- `homeUrl: string = '/'` — Route to navigate on logo click.
|
|
512
|
+
- `language: string = 'en'` — Current language code (used to resolve the EC logo variant). Default: 'en'.
|
|
513
|
+
- `logoHeight: string = '56px'` — Logo height CSS value.
|
|
514
|
+
- `logoUrl: string = ''` — Custom logo URL. If not provided, uses the EC logo for the given language.
|
|
515
|
+
- `logoWidth: string = 'auto'` — Logo width CSS value.
|
|
516
|
+
|
|
517
|
+
Properties:
|
|
518
|
+
- ``resolvedLogoUrl: unknown = computed(() => { if (this.logoUrl()) return this.logoUrl(); return `assets/logos/ec/positive/logo-ec--${this.language()}.svg`; })`` — Resolved logo URL — custom or language-based EC logo.
|
|
519
|
+
|
|
520
|
+
### EdsShellHeaderStart
|
|
521
|
+
|
|
522
|
+
File: `packages/eds/eds-shell/eds-shell-header-start.ts`
|
|
523
|
+
Selector: `eds-shell-header-start`
|
|
524
|
+
|
|
525
|
+
### EdsShellMenuToggle
|
|
526
|
+
|
|
527
|
+
File: `packages/eds/eds-shell/eds-shell-menu-toggle.ts`
|
|
528
|
+
Selector: `eds-shell-menu-toggle`
|
|
529
|
+
|
|
530
|
+
Outputs:
|
|
531
|
+
- `menuToggle: void` — Emits when the toggle button is clicked.
|
|
532
|
+
|
|
533
|
+
Methods:
|
|
534
|
+
- `onClick(): void`
|
|
535
|
+
|
|
536
|
+
### EdsShellSidebar
|
|
537
|
+
|
|
538
|
+
File: `packages/eds/eds-shell/eds-shell-sidebar.ts`
|
|
539
|
+
Selector: `eds-shell-sidebar`
|
|
540
|
+
|
|
541
|
+
Inputs:
|
|
542
|
+
- `collapseMode: EdsSidebarCollapseMode = 'hidden'` — Collapse mode: 'hidden' fully hides, 'icons' shows icon rail, 'icons-labels' shows icons + labels.
|
|
543
|
+
- `width: string = '260px'` — Width of the sidebar (CSS value).
|
|
544
|
+
|
|
545
|
+
### EdsShellSidebarBottomNav
|
|
546
|
+
|
|
547
|
+
File: `packages/eds/eds-shell/eds-shell-sidebar-bottom-nav.ts`
|
|
548
|
+
Selector: `eds-shell-sidebar-bottom-nav`
|
|
549
|
+
|
|
550
|
+
Inputs:
|
|
551
|
+
- `hasCollapsedLabels: boolean = false` — Whether to show labels underneath icons in collapsed mode.
|
|
552
|
+
- `hasIcons: boolean = false` — Whether to show icons alongside labels.
|
|
553
|
+
- `isCollapsed: boolean = false` — Whether the menu is in collapsed/icon-only mode.
|
|
554
|
+
- `items: EdsMenuItem[] = []` — Array of menu items to render.
|
|
555
|
+
|
|
556
|
+
Outputs:
|
|
557
|
+
- `itemClick: EdsMenuItem` — Emits when a menu item is clicked.
|
|
558
|
+
|
|
559
|
+
Methods:
|
|
560
|
+
- `onItemClick(item: EdsMenuItem): void`
|
|
561
|
+
|
|
562
|
+
### EdsShellSidebarFooter
|
|
563
|
+
|
|
564
|
+
File: `packages/eds/eds-shell/eds-shell-sidebar-footer.ts`
|
|
565
|
+
Selector: `eds-shell-sidebar-footer`
|
|
566
|
+
|
|
567
|
+
### EdsShellSidebarHeader
|
|
568
|
+
|
|
569
|
+
File: `packages/eds/eds-shell/eds-shell-sidebar-header.ts`
|
|
570
|
+
Selector: `eds-shell-sidebar-header`
|
|
571
|
+
|
|
572
|
+
Inputs:
|
|
573
|
+
- `brand: string = ''` — Brand/title text displayed in the sidebar header.
|
|
574
|
+
- `showClose: boolean = false` — Whether to show the close button (shown on overlay mode).
|
|
575
|
+
|
|
576
|
+
Outputs:
|
|
577
|
+
- `closeClick: void` — Emits when the close button is clicked.
|
|
578
|
+
|
|
579
|
+
Methods:
|
|
580
|
+
- `onClose(): void`
|
|
581
|
+
|
|
582
|
+
### EdsShellSidebarNav
|
|
583
|
+
|
|
584
|
+
File: `packages/eds/eds-shell/eds-shell-sidebar-nav.ts`
|
|
585
|
+
Selector: `eds-shell-sidebar-nav`
|
|
586
|
+
|
|
587
|
+
Inputs:
|
|
588
|
+
- `hasCollapsedLabels: boolean = false` — Whether to show labels underneath icons in collapsed mode.
|
|
589
|
+
- `hasIcons: boolean = false` — Whether to show icons alongside labels.
|
|
590
|
+
- `isCollapsed: boolean = false` — Whether the menu is in collapsed/icon-only mode.
|
|
591
|
+
- `items: EdsMenuItem[] = []` — Array of menu items to render.
|
|
592
|
+
|
|
593
|
+
Outputs:
|
|
594
|
+
- `itemClick: EdsMenuItem` — Emits when a menu item is clicked.
|
|
595
|
+
|
|
596
|
+
Methods:
|
|
597
|
+
- `onItemClick(item: EdsMenuItem): void`
|
|
598
|
+
|
|
599
|
+
### EdsShellToolbar
|
|
600
|
+
|
|
601
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar.ts`
|
|
602
|
+
Selector: `eds-shell-toolbar`
|
|
603
|
+
|
|
604
|
+
### EdsShellToolbarApp
|
|
605
|
+
|
|
606
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar-app.ts`
|
|
607
|
+
Selector: `eds-shell-toolbar-app`
|
|
608
|
+
|
|
609
|
+
Inputs:
|
|
610
|
+
- `appName: string = ''` — Full application name.
|
|
611
|
+
- `appShortName: string = ''` — Short name for responsive/compact layouts.
|
|
612
|
+
- `appSubTitle: string = ''` — Subtitle/description below the app name.
|
|
613
|
+
|
|
614
|
+
### EdsShellToolbarEnd
|
|
615
|
+
|
|
616
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar-end.ts`
|
|
617
|
+
Selector: `eds-shell-toolbar-end`
|
|
618
|
+
|
|
619
|
+
### EdsShellToolbarEnvironment
|
|
620
|
+
|
|
621
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar-environment.ts`
|
|
622
|
+
Selector: `eds-shell-toolbar-environment`
|
|
623
|
+
|
|
624
|
+
### EdsShellToolbarLogo
|
|
625
|
+
|
|
626
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar-logo.ts`
|
|
627
|
+
Selector: `eds-shell-toolbar-logo`
|
|
628
|
+
|
|
629
|
+
### EdsShellToolbarStart
|
|
630
|
+
|
|
631
|
+
File: `packages/eds/eds-shell/eds-shell-toolbar-start.ts`
|
|
632
|
+
Selector: `eds-shell-toolbar-start`
|
|
633
|
+
|
|
634
|
+
### EdsShellTopMessage
|
|
635
|
+
|
|
636
|
+
File: `packages/eds/eds-shell/eds-shell-top-message.ts`
|
|
637
|
+
Selector: `eds-shell-top-message`
|
|
638
|
+
|
|
639
|
+
Inputs:
|
|
640
|
+
- `isDismissible: boolean = true` — Whether the close button is shown.
|
|
641
|
+
|
|
642
|
+
Outputs:
|
|
643
|
+
- `dismissed: void` — Emits when the message is dismissed.
|
|
644
|
+
|
|
645
|
+
Properties:
|
|
646
|
+
- `isVisible: unknown = signal(true)` — Internal visibility state.
|
|
647
|
+
|
|
648
|
+
Methods:
|
|
649
|
+
- `dismiss(): void`
|
|
245
650
|
|
|
246
651
|
### EdsTab
|
|
247
652
|
|
|
@@ -267,7 +672,7 @@ Properties:
|
|
|
267
672
|
- `isDisabled$: unknown = new BehaviorSubject(this.isDisabled)`
|
|
268
673
|
- `isVisible$: unknown = new BehaviorSubject(this.isVisible)`
|
|
269
674
|
- `templateBody: EdsTabBody`
|
|
270
|
-
- `templateHeader: EdsTabHeader`
|
|
675
|
+
- `templateHeader: unknown = contentChild.required(forwardRef(() => EdsTabHeader))`
|
|
271
676
|
|
|
272
677
|
Methods:
|
|
273
678
|
- `activateTab(): void`
|
|
@@ -284,7 +689,7 @@ Inputs:
|
|
|
284
689
|
Properties:
|
|
285
690
|
- `tabIndex$: unknown = new BehaviorSubject(0)`
|
|
286
691
|
- `templatePortal: TemplatePortal`
|
|
287
|
-
- `templateRef: TemplateRef<HTMLElement
|
|
692
|
+
- `templateRef: unknown = viewChild.required<TemplateRef<HTMLElement>>('templateRef')`
|
|
288
693
|
|
|
289
694
|
### EdsTabHeader
|
|
290
695
|
|
|
@@ -293,7 +698,7 @@ Selector: `eds-tab-header`
|
|
|
293
698
|
|
|
294
699
|
Properties:
|
|
295
700
|
- `templatePortal: TemplatePortal`
|
|
296
|
-
- `templateRef: TemplateRef<HTMLElement
|
|
701
|
+
- `templateRef: unknown = viewChild.required<TemplateRef<HTMLElement>>('templateRef')`
|
|
297
702
|
|
|
298
703
|
### EdsTabHeaderLabel
|
|
299
704
|
|
|
@@ -336,22 +741,22 @@ Change detection: `ChangeDetectionStrategy.OnPush`
|
|
|
336
741
|
Inputs:
|
|
337
742
|
- `activeTabIndex: number = 0` — Index of the active tab 0
|
|
338
743
|
- `ariaLabel: string = 'EDS Tabs'` — Sets the aria-label attribute for the host element. 'eUI Tabs'
|
|
339
|
-
- `e2eAttr: string = 'eds-tabs'`
|
|
744
|
+
- `e2eAttr: string = 'eds-tabs'` — Sets the data-e2e attribute for the host element. 'eds-tabs'
|
|
340
745
|
- `isFlat: boolean = false`
|
|
341
746
|
- `isMainNavigation: boolean = false`
|
|
342
747
|
|
|
343
748
|
Outputs:
|
|
344
|
-
- `tabActivate:
|
|
345
|
-
- `tabClick:
|
|
346
|
-
- `tabClose:
|
|
749
|
+
- `tabActivate: { tab: EdsTab; index: number; }` — Event emitted when a tab is activated
|
|
750
|
+
- `tabClick: { tab: EdsTab; index: number; }` — Event emitted when a tab is clicked
|
|
751
|
+
- `tabClose: { tab: EdsTab; index: number; }` — Event emitted when a tab is closed
|
|
347
752
|
|
|
348
753
|
Properties:
|
|
349
754
|
- `_tabs: QueryList<EdsTab>`
|
|
350
755
|
- `currentOffset: number = 0`
|
|
351
|
-
- `
|
|
352
|
-
- `
|
|
353
|
-
- `
|
|
354
|
-
- `
|
|
756
|
+
- `edsTabListItems: unknown = viewChildren<ElementRef>('euiTabListItems')`
|
|
757
|
+
- `edsTabsHeaders: unknown = viewChild.required<ElementRef>('euiTabsHeaders')`
|
|
758
|
+
- `edsTabsHeadersContainer: unknown = viewChild.required<ElementRef>('euiTabsHeadersContainer')`
|
|
759
|
+
- `edsTabsRightContent: unknown = viewChild.required<ElementRef>('euiTabsRightContent')`
|
|
355
760
|
- `navigationLeftButtonDisabled: unknown = true`
|
|
356
761
|
- `navigationRightButtonDisabled: unknown = false`
|
|
357
762
|
- `scrolling: unknown = false`
|
|
@@ -376,18 +781,19 @@ Change detection: `ChangeDetectionStrategy.OnPush`
|
|
|
376
781
|
|
|
377
782
|
Inputs:
|
|
378
783
|
- `ariaLabel: string = 'Tag content'` — Sets the aria-label attribute for the host element. 'Chip content'
|
|
379
|
-
- `
|
|
380
|
-
- `
|
|
381
|
-
- `
|
|
382
|
-
- `
|
|
383
|
-
- `
|
|
384
|
-
- `
|
|
784
|
+
- `colorPalette: string = ''` — Extra color palette to be used on the status-badge.
|
|
785
|
+
- `data: any` — Sets the data of the chip like tooltip configuration.
|
|
786
|
+
- `e2eAttr: string = 'eds-tag'` — Sets the data-e2e attribute for the host element. 'eds-tag'
|
|
787
|
+
- `edsInternalId: string = ''` — Sets the edsInternalId of the tag. null
|
|
788
|
+
- `edsOutline: boolean = false`
|
|
789
|
+
- `id: string | number = ''` — Sets the id of the tag.
|
|
790
|
+
- `tooltipMessage: string = ''` — Sets the label of the tooltip to diaply on hover.
|
|
385
791
|
|
|
386
792
|
Outputs:
|
|
387
|
-
- `remove:
|
|
793
|
+
- `remove: any` — Event emitted when the chip is removed.
|
|
388
794
|
|
|
389
795
|
Properties:
|
|
390
|
-
- `
|
|
796
|
+
- `hostClasses: unknown = computed(() => { return [ 'eds-tag', this.sizeVariantsBase.getCssClasses('eds-tag'), this.colorVariantsBase.getCssClasses('eds-tag'), this.edsOutline() ? 'eds-t…` — Computes and returns the CSS classes for the component based on its current state.
|
|
391
797
|
|
|
392
798
|
### EdsTooltipContainer
|
|
393
799
|
|
|
@@ -401,8 +807,119 @@ Inputs:
|
|
|
401
807
|
Properties:
|
|
402
808
|
- `e2e: string = 'eds-tooltip'` — Sets the data-e2e attribute for the host element. 'eds-tooltip'
|
|
403
809
|
|
|
810
|
+
### EdsUserProfile
|
|
811
|
+
|
|
812
|
+
File: `packages/eds/eds-user-profile/eds-user-profile.ts`
|
|
813
|
+
Selector: `eds-user-profile`
|
|
814
|
+
|
|
815
|
+
Inputs:
|
|
816
|
+
- `avatarUrl: string = ''` — URL of the avatar image.
|
|
817
|
+
- `firstName: string = ''` — First name.
|
|
818
|
+
- `fullName: string = ''` — Full name of the user.
|
|
819
|
+
- `hasWelcomeLabel: boolean = true` — Whether to show the welcome label.
|
|
820
|
+
- `isReverse: boolean = false` — Reverse the layout (name on left, avatar on right).
|
|
821
|
+
- `isShowAvatarInitials: boolean = true` — Whether to show initials in the avatar when no image.
|
|
822
|
+
- `isShowUserInfos: boolean = true` — Whether to show user name and info text.
|
|
823
|
+
- `lastName: string = ''` — Last name.
|
|
824
|
+
- `reverseNameOrder: boolean = false` — Whether to reverse name order (firstName first).
|
|
825
|
+
- `subInfos: string = ''` — Additional info displayed below the name (e.g. email, role).
|
|
826
|
+
- `welcomeLabel: string = 'Welcome'` — Welcome label displayed before the user name.
|
|
827
|
+
|
|
828
|
+
Properties:
|
|
829
|
+
- `alignLeft: unknown = signal(false)` — Whether the dropdown should align to the left edge instead of right.
|
|
830
|
+
- `displayName: unknown = computed(() => { if (this.fullName()) return this.fullName(); const first = this.firstName(); const last = this.lastName(); if (this.reverseNameOrder()) { retur…` — Computed display name.
|
|
831
|
+
- `effectiveReverse: unknown = computed(() => this.isReverse() || this.contextReverse())` — Effective reverse state: true if input or context forces it.
|
|
832
|
+
- `focusedIndex: unknown = signal(-1)` — Index of the currently focused menu item (-1 = none).
|
|
833
|
+
- `hasMenu: unknown = computed(() => !!this.menuChild())` — Whether the component has a dropdown menu.
|
|
834
|
+
- ``initials: unknown = computed(() => { const first = this.firstName(); const last = this.lastName(); if (first && last) { return `${first.charAt(0)}${last.charAt(0)}`.toUpperCase(); …`` — Computed initials from name.
|
|
835
|
+
- `isInToolbar: unknown = signal(false)` — Whether the avatar should use medium size (e.g. inside eds-shell-toolbar).
|
|
836
|
+
- `isMenuOpen: unknown = signal(false)` — Whether dropdown menu is open.
|
|
837
|
+
|
|
838
|
+
Methods:
|
|
839
|
+
- `closeMenu(): void`
|
|
840
|
+
- `onDocumentClick(event: MouseEvent): void`
|
|
841
|
+
- `onMenuKeydown(event: KeyboardEvent): void`
|
|
842
|
+
- `toggleMenu(): void`
|
|
843
|
+
|
|
844
|
+
### EdsUserProfileMenu
|
|
845
|
+
|
|
846
|
+
File: `packages/eds/eds-user-profile/eds-user-profile-menu.ts`
|
|
847
|
+
Selector: `eds-user-profile-menu`
|
|
848
|
+
|
|
849
|
+
### EdsUserProfileMenuItem
|
|
850
|
+
|
|
851
|
+
File: `packages/eds/eds-user-profile/eds-user-profile-menu-item.ts`
|
|
852
|
+
Selector: `eds-user-profile-menu-item`
|
|
853
|
+
|
|
854
|
+
Properties:
|
|
855
|
+
- `role: string = 'menuitem'`
|
|
856
|
+
- `tabindex: unknown = -1`
|
|
857
|
+
|
|
404
858
|
## Directives
|
|
405
859
|
|
|
860
|
+
### EdsBaseColorVariantsDirective
|
|
861
|
+
|
|
862
|
+
File: `packages/eds/shared/base-color-variants.directive.ts`
|
|
863
|
+
Selector: `[edsBaseColorVariants]`
|
|
864
|
+
|
|
865
|
+
Inputs:
|
|
866
|
+
- `edsBrand: boolean`
|
|
867
|
+
- `edsColorVariant: string`
|
|
868
|
+
- `edsCritical: boolean`
|
|
869
|
+
- `edsDisabled: boolean`
|
|
870
|
+
- `edsHighlight: boolean`
|
|
871
|
+
- `edsInfo: boolean`
|
|
872
|
+
- `edsNeutral: boolean`
|
|
873
|
+
- `edsNeutralSubtle: boolean`
|
|
874
|
+
- `edsNeutralSubtler: boolean`
|
|
875
|
+
- `edsPrimary: boolean`
|
|
876
|
+
- `edsSuccess: boolean`
|
|
877
|
+
- `edsWarning: boolean`
|
|
878
|
+
|
|
879
|
+
Methods:
|
|
880
|
+
- `getCssClasses(rootClass: string): string`
|
|
881
|
+
|
|
882
|
+
### EdsBaseSizeVariantsDirective
|
|
883
|
+
|
|
884
|
+
File: `packages/eds/shared/base-size-variants.directive.ts`
|
|
885
|
+
Selector: `[edsBaseSizeVariants]`
|
|
886
|
+
|
|
887
|
+
Inputs:
|
|
888
|
+
- `edsSize2XL: boolean`
|
|
889
|
+
- `edsSize2XS: boolean`
|
|
890
|
+
- `edsSize3XL: boolean`
|
|
891
|
+
- `edsSize4XL: boolean`
|
|
892
|
+
- `edsSize5XL: boolean`
|
|
893
|
+
- `edsSize6XL: boolean`
|
|
894
|
+
- `edsSizeAuto: boolean`
|
|
895
|
+
- `edsSizeL: boolean`
|
|
896
|
+
- `edsSizeM: boolean`
|
|
897
|
+
- `edsSizeS: boolean`
|
|
898
|
+
- `edsSizeVariant: string`
|
|
899
|
+
- `edsSizeXL: boolean`
|
|
900
|
+
- `edsSizeXS: boolean`
|
|
901
|
+
|
|
902
|
+
Methods:
|
|
903
|
+
- `getCssClasses(rootClass: string): string`
|
|
904
|
+
|
|
905
|
+
### EdsResizable
|
|
906
|
+
|
|
907
|
+
File: `packages/eds/eds-resizable/eds-resizable.directive.ts`
|
|
908
|
+
Selector: `[edsResizable]`
|
|
909
|
+
|
|
910
|
+
Description: Directive that enables interactive resizing of a host element by dragging a handle. Applies width constraints dynamically and supports left or right-side handle placement. Usage: \<div edsResizable \[edsResizableMinWidth\]="200" \[edsResizableMaxWidth\]="600"\>\</div\>
|
|
911
|
+
|
|
912
|
+
Inputs:
|
|
913
|
+
- `edsResizableAriaLabel: string = 'Press the left or right arrow key to resize the panel'` — Accessible label for the separator handle.
|
|
914
|
+
- `edsResizableDisabled: boolean = false` — Whether the resize handle is hidden/disabled.
|
|
915
|
+
- `edsResizableKeyStep: number = 10` — Step size in pixels for keyboard arrow key resizing.
|
|
916
|
+
- `edsResizableMaxWidth: number | undefined = undefined` — Maximum width in pixels.
|
|
917
|
+
- `edsResizableMinWidth: number = 0` — Minimum width in pixels.
|
|
918
|
+
- `edsResizablePosition: EdsResizablePosition = 'right'` — Handle placement side.
|
|
919
|
+
|
|
920
|
+
Outputs:
|
|
921
|
+
- `edsResizableWidthChange: number` — Emits the new width in pixels after a resize operation.
|
|
922
|
+
|
|
406
923
|
### EdsTooltip
|
|
407
924
|
|
|
408
925
|
File: `packages/eds/eds-tooltip/eds-tooltip.ts`
|
|
@@ -412,13 +929,13 @@ Inputs:
|
|
|
412
929
|
- `contentAlignment: "left" | "right" | "center" | "justify" = 'center'` — Sets the alignment of the content in the tooltip. 'center''
|
|
413
930
|
- `e2eAttr: string = 'eds-tooltip'` — Sets the data-e2e attribute for the host element. 'eds-tooltip'
|
|
414
931
|
- `edsTooltip: string` — Tooltip content.
|
|
415
|
-
- `
|
|
416
|
-
- `
|
|
417
|
-
- `
|
|
418
|
-
- `
|
|
419
|
-
- `
|
|
420
|
-
- `
|
|
421
|
-
- `
|
|
932
|
+
- `edsTooltipAccent: boolean = false` — Whether the tooltip has Accent state. false
|
|
933
|
+
- `edsTooltipDanger: boolean = false` — Whether the tooltip has a Danger state. false
|
|
934
|
+
- `edsTooltipInfo: boolean = false` — Whether the tooltip has Info state. false
|
|
935
|
+
- `edsTooltipPrimary: boolean = false` — Whether the tooltip has a Primary state. false
|
|
936
|
+
- `edsTooltipSecondary: boolean = false` — Whether the tooltip has a Secondary state. false
|
|
937
|
+
- `edsTooltipSuccess: boolean = false` — Whether the tooltip has a Success state. false
|
|
938
|
+
- `edsTooltipWarning: boolean = false` — Whether the tooltip has a Warning state. false
|
|
422
939
|
- `hideDelay: number = 0` — Sets the delay for the tooltip to be hidden 0
|
|
423
940
|
- `isDisabled: boolean = false` — Whether the tooltip is disabled. false (enable)
|
|
424
941
|
- `position: "left" | "right" | "above" | "below" | "before" | "after" | string = 'above'` — Sets the position of the tooltip relative to its trigger element. 'center''
|
|
@@ -430,50 +947,6 @@ Methods:
|
|
|
430
947
|
- `mouseEntering(event: MouseEvent): void`
|
|
431
948
|
- `show(origin: EventTarget = this.host.nativeElement): void` — Method that shows a tooltip.
|
|
432
949
|
|
|
433
|
-
### EuiBaseColorVariantsDirective
|
|
434
|
-
|
|
435
|
-
File: `packages/eds/shared/base-color-variants.directive.ts`
|
|
436
|
-
Selector: `[euiBaseColorVariants]`
|
|
437
|
-
|
|
438
|
-
Inputs:
|
|
439
|
-
- `euiColorVariant: string`
|
|
440
|
-
- `euiCritical: boolean`
|
|
441
|
-
- `euiDisabled: boolean`
|
|
442
|
-
- `euiHighlight: boolean`
|
|
443
|
-
- `euiInfo: boolean`
|
|
444
|
-
- `euiNeutral: boolean`
|
|
445
|
-
- `euiNeutralSubtle: boolean`
|
|
446
|
-
- `euiNeutralSubtler: boolean`
|
|
447
|
-
- `euiPrimary: boolean`
|
|
448
|
-
- `euiSuccess: boolean`
|
|
449
|
-
- `euiWarning: boolean`
|
|
450
|
-
|
|
451
|
-
Methods:
|
|
452
|
-
- `getCssClasses(rootClass: string): string`
|
|
453
|
-
|
|
454
|
-
### EuiBaseSizeVariantsDirective
|
|
455
|
-
|
|
456
|
-
File: `packages/eds/shared/base-size-variants.directive.ts`
|
|
457
|
-
Selector: `[euiBaseSizeVariants]`
|
|
458
|
-
|
|
459
|
-
Inputs:
|
|
460
|
-
- `euiSize2XL: boolean`
|
|
461
|
-
- `euiSize2XS: boolean`
|
|
462
|
-
- `euiSize3XL: boolean`
|
|
463
|
-
- `euiSize4XL: boolean`
|
|
464
|
-
- `euiSize5XL: boolean`
|
|
465
|
-
- `euiSize6XL: boolean`
|
|
466
|
-
- `euiSizeAuto: boolean`
|
|
467
|
-
- `euiSizeL: boolean`
|
|
468
|
-
- `euiSizeM: boolean`
|
|
469
|
-
- `euiSizeS: boolean`
|
|
470
|
-
- `euiSizeVariant: string`
|
|
471
|
-
- `euiSizeXL: boolean`
|
|
472
|
-
- `euiSizeXS: boolean`
|
|
473
|
-
|
|
474
|
-
Methods:
|
|
475
|
-
- `getCssClasses(rootClass: string): string`
|
|
476
|
-
|
|
477
950
|
## Classes
|
|
478
951
|
|
|
479
952
|
### EdsChipModel
|
|
@@ -481,7 +954,7 @@ Methods:
|
|
|
481
954
|
File: `packages/eds/eds-chip/models/eui-chip.model.ts`
|
|
482
955
|
|
|
483
956
|
Properties:
|
|
484
|
-
- `
|
|
957
|
+
- `edsInternalId: string`
|
|
485
958
|
- `iconClass?: string`
|
|
486
959
|
- `iconSvgName?: string`
|
|
487
960
|
- `id: string | number`
|
|
@@ -490,9 +963,19 @@ Properties:
|
|
|
490
963
|
- `isRemovable: unknown = false`
|
|
491
964
|
- `isRounded: unknown = false`
|
|
492
965
|
- `label: string`
|
|
493
|
-
- `tooltip:
|
|
966
|
+
- `tooltip: EdsChipTooltip = new EdsChipTooltip()`
|
|
494
967
|
- `variant: "primary" | "secondary" | "info" | "success" | "warning" | "danger" | "accent" = 'primary'`
|
|
495
968
|
|
|
969
|
+
### EdsChipTooltip
|
|
970
|
+
|
|
971
|
+
File: `packages/eds/eds-chip/models/eui-chip.model.ts`
|
|
972
|
+
|
|
973
|
+
Properties:
|
|
974
|
+
- `contentAlignment?: "center" | "left" | "right" | "justify" = 'center'`
|
|
975
|
+
- `delay?: number = 0`
|
|
976
|
+
- `position?: "above" | "below" | "left" | "right" | "before" | "after" = 'above'`
|
|
977
|
+
- `tooltipMessage: string`
|
|
978
|
+
|
|
496
979
|
### EdsTooltipConfig
|
|
497
980
|
|
|
498
981
|
File: `packages/eds/eds-tooltip/eds-tooltip.config.ts`
|
|
@@ -504,17 +987,30 @@ Properties:
|
|
|
504
987
|
- `position: "left" | "right" | "above" | "below" | "before" | "after" | string = 'above'`
|
|
505
988
|
- `tooltipContent: null = null`
|
|
506
989
|
|
|
507
|
-
|
|
990
|
+
## Interfaces
|
|
991
|
+
|
|
992
|
+
### EdsLanguage
|
|
508
993
|
|
|
509
|
-
File: `packages/eds/eds-
|
|
994
|
+
File: `packages/eds/eds-language-selector/eds-language-selector.ts`
|
|
510
995
|
|
|
511
996
|
Properties:
|
|
512
|
-
- `
|
|
513
|
-
- `
|
|
514
|
-
- `position?: "above" | "below" | "left" | "right" | "before" | "after" = 'above'`
|
|
515
|
-
- `tooltipMessage: string`
|
|
997
|
+
- `code: string` — Language code (e.g. 'en', 'fr', 'de').
|
|
998
|
+
- `label: string` — Display label (e.g. 'English', 'Français').
|
|
516
999
|
|
|
517
|
-
|
|
1000
|
+
### EdsMenuItem
|
|
1001
|
+
|
|
1002
|
+
File: `packages/eds/eds-menu/eds-menu-item.model.ts`
|
|
1003
|
+
|
|
1004
|
+
Properties:
|
|
1005
|
+
- `children?: EdsMenuItem[]` — Child menu items for hierarchical navigation.
|
|
1006
|
+
- `command?: function` — Callback executed on click instead of navigation.
|
|
1007
|
+
- `data?: unknown` — Custom data attached to the item.
|
|
1008
|
+
- `icon?: string` — Icon name (EDS icon identifier).
|
|
1009
|
+
- `isActive?: boolean` — Whether the item is currently active.
|
|
1010
|
+
- `isDisabled?: boolean` — Whether the item is disabled.
|
|
1011
|
+
- `isExpanded?: boolean` — Whether the item is expanded (for parent items).
|
|
1012
|
+
- `label: string` — Display label for the menu item.
|
|
1013
|
+
- `url?: string` — Route URL to navigate to.
|
|
518
1014
|
|
|
519
1015
|
### EdsTooltipInterface
|
|
520
1016
|
|
|
@@ -527,8 +1023,16 @@ Properties:
|
|
|
527
1023
|
- `position: "left" | "right" | "above" | "below" | "before" | "after" | string`
|
|
528
1024
|
- `tooltipContent: string | null`
|
|
529
1025
|
|
|
1026
|
+
## Public type aliases
|
|
1027
|
+
|
|
1028
|
+
- `type EdsOverlayPosition = "right" | "left" | "top" | "bottom"`
|
|
1029
|
+
- `type EdsResizablePosition = "left" | "right"` — Handle placement side.
|
|
1030
|
+
- `type EdsSidebarCollapseMode = "hidden" | "icons" | "icons-labels"`
|
|
1031
|
+
|
|
530
1032
|
## Public variables
|
|
531
1033
|
|
|
1034
|
+
- `BREAKPOINT: number = 1024`
|
|
1035
|
+
Defined in `packages/eds/eds-shell/eds-shell.ts`
|
|
532
1036
|
- `EDS_ALERT: unknown = [ EdsAlert, EdsAlertTitle, ] as const`
|
|
533
1037
|
Defined in `packages/eds/eds-alert/index.ts`
|
|
534
1038
|
- `EDS_AVATAR: unknown = [ EdsAvatar, EdsAvatarIcon, EdsAvatarText, EdsAvatarImage, EdsAvatarBadge, EdsAvatarList, EdsAvatarContent, EdsAvatarContentLabel, EdsAvatarContentSublabel, ] a…`
|
|
@@ -545,10 +1049,24 @@ Properties:
|
|
|
545
1049
|
Defined in `packages/eds/eds-icon-button/index.ts`
|
|
546
1050
|
- `EDS_ICON_STATE: unknown = [ EdsIconState, ] as const`
|
|
547
1051
|
Defined in `packages/eds/eds-icon-state/index.ts`
|
|
1052
|
+
- `EDS_LANGUAGE_SELECTOR: unknown = [EdsLanguageSelector] as const` — Convenience array for importing eds-language-selector.
|
|
1053
|
+
Defined in `packages/eds/eds-language-selector/index.ts`
|
|
1054
|
+
- `EDS_MENU: unknown = [EdsMenu, EdsMenuItemComponent] as const` — Convenience array for importing eds-menu components.
|
|
1055
|
+
Defined in `packages/eds/eds-menu/index.ts`
|
|
1056
|
+
- `EDS_OVERLAY: unknown = [ EdsOverlay, EdsOverlayHeader, EdsOverlayHeaderLabel, EdsOverlayHeaderSublabel, EdsOverlayHeaderActionItems, EdsOverlayContent, EdsOverlayFooter, ] as const` — Convenience array for importing all eds-overlay components.
|
|
1057
|
+
Defined in `packages/eds/eds-overlay/index.ts`
|
|
1058
|
+
- `EDS_PAGE: unknown = [ EdsPage, EdsPageHeader, EdsPageHeaderLabel, EdsPageHeaderSublabel, EdsPageHeaderActionItems, EdsPageHeaderBody, EdsPageContent, EdsPageFooter, ] as const` — Convenience array for importing all eds-page components.
|
|
1059
|
+
Defined in `packages/eds/eds-page/index.ts`
|
|
1060
|
+
- `EDS_SHELL: unknown = [ EdsShell, EdsShellHeader, EdsShellHeaderLogo, EdsShellHeaderEnvironment, EdsShellHeaderApp, EdsShellHeaderStart, EdsShellHeaderEnd, EdsShellToolbar, EdsShellT…` — Convenience array for importing all eds-shell components.
|
|
1061
|
+
Defined in `packages/eds/eds-shell/index.ts`
|
|
548
1062
|
- `EDS_TABS: unknown = [ EdsTabs, EdsTabsRightContent, EdsTabBody, EdsTabHeader, EdsTabHeaderLabel, EdsTabHeaderSublabel, EdsTabHeaderRightContent, EdsTabHeaderLeftContent, EdsTab, ] …`
|
|
549
1063
|
Defined in `packages/eds/eds-tabs/index.ts`
|
|
550
1064
|
- `EDS_TAG: unknown = [ EdsTag, ] as const`
|
|
551
1065
|
Defined in `packages/eds/eds-tag/index.ts`
|
|
1066
|
+
- `EDS_USER_PROFILE: unknown = [ EdsUserProfile, EdsUserProfileMenu, EdsUserProfileMenuItem, ] as const` — Convenience array for importing all eds-user-profile components.
|
|
1067
|
+
Defined in `packages/eds/eds-user-profile/index.ts`
|
|
1068
|
+
- `pixelTransform: unknown = (value: string | number): number => Math.max(0, numberAttribute(value, 0))` — Ensures value is a non-negative pixel number.
|
|
1069
|
+
Defined in `packages/eds/eds-resizable/eds-resizable.directive.ts`
|
|
552
1070
|
- `showHide: unknown = trigger('showHide', [ state('initial, void, hidden', style({ opacity: 0, transform: 'scale(0)' })), state('visible', style({ transform: 'scale(1)' })), transiti…` — Tooltip display animation.
|
|
553
1071
|
Defined in `packages/eds/eds-tooltip/eds-tooltip-animations.ts`
|
|
554
1072
|
- `testBed: unknown = getTestBed()`
|