@eui/eds 23.0.0-alpha.6 → 23.0.0-alpha.8

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.
Files changed (232) hide show
  1. package/docs/changelog.html +86 -0
  2. package/docs/classes/EdsChipModel.html +6 -6
  3. package/docs/classes/{EuiChipTooltip.html → EdsChipTooltip.html} +2 -2
  4. package/docs/components/EdsAlert.html +27 -226
  5. package/docs/components/EdsAlertTitle.html +2 -2
  6. package/docs/components/EdsAvatar.html +35 -108
  7. package/docs/components/EdsAvatarBadge.html +2 -2
  8. package/docs/components/EdsAvatarContent.html +2 -2
  9. package/docs/components/EdsAvatarContentLabel.html +2 -2
  10. package/docs/components/EdsAvatarContentSublabel.html +2 -2
  11. package/docs/components/EdsAvatarIcon.html +2 -2
  12. package/docs/components/EdsAvatarImage.html +2 -2
  13. package/docs/components/EdsAvatarList.html +2 -2
  14. package/docs/components/EdsAvatarText.html +2 -2
  15. package/docs/components/EdsBadge.html +41 -175
  16. package/docs/components/EdsButton.html +123 -123
  17. package/docs/components/EdsChip.html +135 -254
  18. package/docs/components/EdsIcon.html +93 -145
  19. package/docs/components/EdsIconButton.html +72 -86
  20. package/docs/components/EdsIconImage.html +5 -5
  21. package/docs/components/EdsIconState.html +47 -61
  22. package/docs/components/EdsLanguageSelector.html +870 -0
  23. package/docs/components/EdsMenu.html +631 -0
  24. package/docs/components/EdsMenuItemComponent.html +728 -0
  25. package/docs/components/EdsOverlay.html +804 -0
  26. package/docs/components/EdsOverlayContent.html +315 -0
  27. package/docs/components/EdsOverlayFooter.html +315 -0
  28. package/docs/components/EdsOverlayHeader.html +458 -0
  29. package/docs/components/EdsOverlayHeaderActionItems.html +315 -0
  30. package/docs/components/EdsOverlayHeaderLabel.html +315 -0
  31. package/docs/components/EdsOverlayHeaderSublabel.html +315 -0
  32. package/docs/components/EdsPage.html +315 -0
  33. package/docs/components/EdsPageContent.html +319 -0
  34. package/docs/components/EdsPageFooter.html +387 -0
  35. package/docs/components/EdsPageHeader.html +673 -0
  36. package/docs/components/EdsPageHeaderActionItems.html +315 -0
  37. package/docs/components/EdsPageHeaderBody.html +315 -0
  38. package/docs/components/EdsPageHeaderLabel.html +315 -0
  39. package/docs/components/EdsPageHeaderSublabel.html +315 -0
  40. package/docs/components/EdsShell.html +1078 -0
  41. package/docs/components/EdsShellContent.html +315 -0
  42. package/docs/components/EdsShellFooter.html +383 -0
  43. package/docs/components/EdsShellHeader.html +383 -0
  44. package/docs/components/EdsShellHeaderApp.html +443 -0
  45. package/docs/components/EdsShellHeaderEnd.html +311 -0
  46. package/docs/components/EdsShellHeaderEnvironment.html +315 -0
  47. package/docs/components/EdsShellHeaderLogo.html +561 -0
  48. package/docs/components/EdsShellHeaderStart.html +311 -0
  49. package/docs/components/EdsShellMenuToggle.html +458 -0
  50. package/docs/components/EdsShellSidebar.html +413 -0
  51. package/docs/components/EdsShellSidebarBottomNav.html +624 -0
  52. package/docs/components/EdsShellSidebarFooter.html +315 -0
  53. package/docs/components/EdsShellSidebarHeader.html +508 -0
  54. package/docs/components/EdsShellSidebarNav.html +624 -0
  55. package/docs/components/EdsShellToolbar.html +315 -0
  56. package/docs/components/EdsShellToolbarApp.html +443 -0
  57. package/docs/components/EdsShellToolbarEnd.html +315 -0
  58. package/docs/components/EdsShellToolbarEnvironment.html +315 -0
  59. package/docs/components/EdsShellToolbarLogo.html +315 -0
  60. package/docs/components/EdsShellToolbarStart.html +315 -0
  61. package/docs/components/EdsShellTopMessage.html +574 -0
  62. package/docs/components/EdsTab.html +6 -10
  63. package/docs/components/EdsTabBody.html +6 -10
  64. package/docs/components/EdsTabHeader.html +6 -10
  65. package/docs/components/EdsTabHeaderLabel.html +2 -2
  66. package/docs/components/EdsTabHeaderLeftContent.html +2 -2
  67. package/docs/components/EdsTabHeaderRightContent.html +2 -2
  68. package/docs/components/EdsTabHeaderSublabel.html +2 -2
  69. package/docs/components/EdsTabs.html +61 -126
  70. package/docs/components/EdsTabsRightContent.html +2 -2
  71. package/docs/components/EdsTag.html +82 -182
  72. package/docs/components/EdsTooltipContainer.html +2 -2
  73. package/docs/components/EdsUserProfile.html +1336 -0
  74. package/docs/components/EdsUserProfileMenu.html +315 -0
  75. package/docs/components/EdsUserProfileMenuItem.html +511 -0
  76. package/docs/directives/{EuiBaseColorVariantsDirective.html → EdsBaseColorVariantsDirective.html} +174 -91
  77. package/docs/directives/{EuiBaseSizeVariantsDirective.html → EdsBaseSizeVariantsDirective.html} +107 -107
  78. package/docs/directives/EdsResizable.html +586 -0
  79. package/docs/directives/EdsTooltip.html +21 -21
  80. package/docs/interfaces/EdsLanguage.html +368 -0
  81. package/docs/interfaces/EdsMenuItem.html +731 -0
  82. package/docs/js/menu-wc.js +146 -5
  83. package/docs/js/search/search_index.js +2 -2
  84. package/docs/json/EdsAlert.md +7 -7
  85. package/docs/json/EdsAvatar.md +8 -7
  86. package/docs/json/EdsBadge.md +14 -14
  87. package/docs/json/EdsBaseColorVariantsDirective.md +22 -0
  88. package/docs/json/EdsBaseSizeVariantsDirective.md +23 -0
  89. package/docs/json/EdsButton.md +21 -21
  90. package/docs/json/EdsChip.md +15 -14
  91. package/docs/json/EdsIcon.md +23 -23
  92. package/docs/json/EdsIconButton.md +18 -17
  93. package/docs/json/EdsIconImage.md +10 -10
  94. package/docs/json/EdsIconState.md +12 -12
  95. package/docs/json/EdsLanguageSelector.md +16 -0
  96. package/docs/json/EdsMenu.md +17 -0
  97. package/docs/json/EdsMenuItemComponent.md +18 -0
  98. package/docs/json/EdsOverlay.md +19 -0
  99. package/docs/json/EdsOverlayContent.md +8 -0
  100. package/docs/json/EdsOverlayFooter.md +8 -0
  101. package/docs/json/EdsOverlayHeader.md +11 -0
  102. package/docs/json/EdsOverlayHeaderActionItems.md +8 -0
  103. package/docs/json/EdsOverlayHeaderLabel.md +8 -0
  104. package/docs/json/EdsOverlayHeaderSublabel.md +8 -0
  105. package/docs/json/EdsPage.md +8 -0
  106. package/docs/json/EdsPageContent.md +8 -0
  107. package/docs/json/EdsPageFooter.md +11 -0
  108. package/docs/json/EdsPageHeader.md +18 -0
  109. package/docs/json/EdsPageHeaderActionItems.md +8 -0
  110. package/docs/json/EdsPageHeaderBody.md +8 -0
  111. package/docs/json/EdsPageHeaderLabel.md +8 -0
  112. package/docs/json/EdsPageHeaderSublabel.md +8 -0
  113. package/docs/json/EdsResizable.md +24 -0
  114. package/docs/json/EdsShell.md +14 -0
  115. package/docs/json/EdsShellContent.md +8 -0
  116. package/docs/json/EdsShellFooter.md +11 -0
  117. package/docs/json/EdsShellHeader.md +11 -0
  118. package/docs/json/EdsShellHeaderApp.md +13 -0
  119. package/docs/json/EdsShellHeaderEnd.md +8 -0
  120. package/docs/json/EdsShellHeaderEnvironment.md +8 -0
  121. package/docs/json/EdsShellHeaderLogo.md +15 -0
  122. package/docs/json/EdsShellHeaderStart.md +8 -0
  123. package/docs/json/EdsShellMenuToggle.md +11 -0
  124. package/docs/json/EdsShellSidebar.md +12 -0
  125. package/docs/json/EdsShellSidebarBottomNav.md +17 -0
  126. package/docs/json/EdsShellSidebarFooter.md +8 -0
  127. package/docs/json/EdsShellSidebarHeader.md +15 -0
  128. package/docs/json/EdsShellSidebarNav.md +17 -0
  129. package/docs/json/EdsShellToolbar.md +8 -0
  130. package/docs/json/EdsShellToolbarApp.md +13 -0
  131. package/docs/json/EdsShellToolbarEnd.md +8 -0
  132. package/docs/json/EdsShellToolbarEnvironment.md +8 -0
  133. package/docs/json/EdsShellToolbarLogo.md +8 -0
  134. package/docs/json/EdsShellToolbarStart.md +8 -0
  135. package/docs/json/EdsShellTopMessage.md +19 -0
  136. package/docs/json/EdsTabs.md +4 -4
  137. package/docs/json/EdsTag.md +14 -13
  138. package/docs/json/EdsTooltip.md +7 -7
  139. package/docs/json/EdsUserProfile.md +21 -0
  140. package/docs/json/EdsUserProfileMenu.md +8 -0
  141. package/docs/json/EdsUserProfileMenuItem.md +8 -0
  142. package/docs/json/documentation.json +9649 -5338
  143. package/docs/llms.txt +641 -123
  144. package/docs/miscellaneous/typealiases.html +309 -0
  145. package/docs/miscellaneous/variables.html +342 -0
  146. package/docs/overview.html +3 -3
  147. package/docs/properties.html +1 -1
  148. package/eds-language-selector/package.json +4 -0
  149. package/eds-menu/package.json +4 -0
  150. package/eds-overlay/package.json +4 -0
  151. package/eds-page/package.json +4 -0
  152. package/eds-resizable/package.json +4 -0
  153. package/eds-shell/package.json +4 -0
  154. package/eds-user-profile/package.json +4 -0
  155. package/fesm2022/eui-eds-eds-alert.mjs +33 -61
  156. package/fesm2022/eui-eds-eds-alert.mjs.map +1 -1
  157. package/fesm2022/eui-eds-eds-avatar.mjs +29 -43
  158. package/fesm2022/eui-eds-eds-avatar.mjs.map +1 -1
  159. package/fesm2022/eui-eds-eds-badge.mjs +65 -89
  160. package/fesm2022/eui-eds-eds-badge.mjs.map +1 -1
  161. package/fesm2022/eui-eds-eds-button.mjs +70 -99
  162. package/fesm2022/eui-eds-eds-button.mjs.map +1 -1
  163. package/fesm2022/eui-eds-eds-chip.mjs +118 -111
  164. package/fesm2022/eui-eds-eds-chip.mjs.map +1 -1
  165. package/fesm2022/eui-eds-eds-icon-button.mjs +49 -55
  166. package/fesm2022/eui-eds-eds-icon-button.mjs.map +1 -1
  167. package/fesm2022/eui-eds-eds-icon-state.mjs +38 -34
  168. package/fesm2022/eui-eds-eds-icon-state.mjs.map +1 -1
  169. package/fesm2022/eui-eds-eds-icon.mjs +92 -107
  170. package/fesm2022/eui-eds-eds-icon.mjs.map +1 -1
  171. package/fesm2022/eui-eds-eds-language-selector.mjs +67 -0
  172. package/fesm2022/eui-eds-eds-language-selector.mjs.map +1 -0
  173. package/fesm2022/eui-eds-eds-menu.mjs +90 -0
  174. package/fesm2022/eui-eds-eds-menu.mjs.map +1 -0
  175. package/fesm2022/eui-eds-eds-overlay.mjs +141 -0
  176. package/fesm2022/eui-eds-eds-overlay.mjs.map +1 -0
  177. package/fesm2022/eui-eds-eds-page.mjs +129 -0
  178. package/fesm2022/eui-eds-eds-page.mjs.map +1 -0
  179. package/fesm2022/eui-eds-eds-resizable.mjs +193 -0
  180. package/fesm2022/eui-eds-eds-resizable.mjs.map +1 -0
  181. package/fesm2022/eui-eds-eds-shell.mjs +481 -0
  182. package/fesm2022/eui-eds-eds-shell.mjs.map +1 -0
  183. package/fesm2022/eui-eds-eds-tabs.mjs +71 -101
  184. package/fesm2022/eui-eds-eds-tabs.mjs.map +1 -1
  185. package/fesm2022/eui-eds-eds-tag.mjs +74 -77
  186. package/fesm2022/eui-eds-eds-tag.mjs.map +1 -1
  187. package/fesm2022/eui-eds-eds-tooltip.mjs +23 -23
  188. package/fesm2022/eui-eds-eds-tooltip.mjs.map +1 -1
  189. package/fesm2022/eui-eds-eds-user-profile.mjs +231 -0
  190. package/fesm2022/eui-eds-eds-user-profile.mjs.map +1 -0
  191. package/fesm2022/eui-eds-shared.mjs +255 -243
  192. package/fesm2022/eui-eds-shared.mjs.map +1 -1
  193. package/package.json +29 -1
  194. package/types/eui-eds-eds-alert.d.ts +7 -29
  195. package/types/eui-eds-eds-alert.d.ts.map +1 -1
  196. package/types/eui-eds-eds-avatar.d.ts +11 -12
  197. package/types/eui-eds-eds-avatar.d.ts.map +1 -1
  198. package/types/eui-eds-eds-badge.d.ts +15 -20
  199. package/types/eui-eds-eds-badge.d.ts.map +1 -1
  200. package/types/eui-eds-eds-button.d.ts +22 -30
  201. package/types/eui-eds-eds-button.d.ts.map +1 -1
  202. package/types/eui-eds-eds-chip.d.ts +36 -36
  203. package/types/eui-eds-eds-chip.d.ts.map +1 -1
  204. package/types/eui-eds-eds-icon-button.d.ts +13 -16
  205. package/types/eui-eds-eds-icon-button.d.ts.map +1 -1
  206. package/types/eui-eds-eds-icon-state.d.ts +8 -8
  207. package/types/eui-eds-eds-icon-state.d.ts.map +1 -1
  208. package/types/eui-eds-eds-icon.d.ts +22 -29
  209. package/types/eui-eds-eds-icon.d.ts.map +1 -1
  210. package/types/eui-eds-eds-language-selector.d.ts +34 -0
  211. package/types/eui-eds-eds-language-selector.d.ts.map +1 -0
  212. package/types/eui-eds-eds-menu.d.ts +65 -0
  213. package/types/eui-eds-eds-menu.d.ts.map +1 -0
  214. package/types/eui-eds-eds-overlay.d.ts +64 -0
  215. package/types/eui-eds-eds-overlay.d.ts.map +1 -0
  216. package/types/eui-eds-eds-page.d.ts +63 -0
  217. package/types/eui-eds-eds-page.d.ts.map +1 -0
  218. package/types/eui-eds-eds-resizable.d.ts +49 -0
  219. package/types/eui-eds-eds-resizable.d.ts.map +1 -0
  220. package/types/eui-eds-eds-shell.d.ts +229 -0
  221. package/types/eui-eds-eds-shell.d.ts.map +1 -0
  222. package/types/eui-eds-eds-tabs.d.ts +32 -30
  223. package/types/eui-eds-eds-tabs.d.ts.map +1 -1
  224. package/types/eui-eds-eds-tag.d.ts +22 -25
  225. package/types/eui-eds-eds-tag.d.ts.map +1 -1
  226. package/types/eui-eds-eds-tooltip.d.ts +16 -16
  227. package/types/eui-eds-eds-user-profile.d.ts +78 -0
  228. package/types/eui-eds-eds-user-profile.d.ts.map +1 -0
  229. package/types/eui-eds-shared.d.ts +82 -79
  230. package/types/eui-eds-shared.d.ts.map +1 -1
  231. package/docs/json/EuiBaseColorVariantsDirective.md +0 -21
  232. package/docs/json/EuiBaseSizeVariantsDirective.md +0 -23
package/docs/components/EdsUserProfile.html ADDED
@@ -0,0 +1,1336 @@
1
+ <!doctype html>
2
+ <html class="no-js" lang="">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta http-equiv="x-ua-compatible" content="ie=edge">
6
+ <title>eui documentation</title>
7
+ <meta name="description" content="">
8
+ <meta name="viewport" content="width=device-width, initial-scale=1">
9
+
10
+ <link rel="icon" type="image/x-icon" href="../images/favicon.ico">
11
+ <link rel="stylesheet" href="../styles/style.css">
12
+ <link rel="stylesheet" href="../styles/dark.css">
13
+ <link rel="stylesheet" href="../styles/material.css">
14
+ </head>
15
+ <body>
16
+ <script>
17
+ // Blocking script to avoid flickering dark mode
18
+ // Dark mode toggle button
19
+ var useDark = window.matchMedia('(prefers-color-scheme: dark)');
20
+ var darkModeState = useDark.matches;
21
+ var $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
22
+ var $darkModeToggles = document.querySelectorAll('.dark-mode-switch');
23
+ var darkModeStateLocal = localStorage.getItem('compodoc_darkmode-state');
24
+
25
+ function checkToggle(check) {
26
+ for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
27
+ $darkModeToggleSwitchers[i].checked = check;
28
+ }
29
+ }
30
+
31
+ function toggleDarkMode(state) {
32
+ if (window.localStorage) {
33
+ localStorage.setItem('compodoc_darkmode-state', state);
34
+ }
35
+
36
+ checkToggle(state);
37
+
38
+ const hasClass = document.body.classList.contains('dark');
39
+
40
+ if (state) {
41
+ for (var i = 0; i < $darkModeToggles.length; i++) {
42
+ $darkModeToggles[i].classList.add('dark');
43
+ }
44
+ if (!hasClass) {
45
+ document.body.classList.add('dark');
46
+ }
47
+ } else {
48
+ for (var i = 0; i < $darkModeToggles.length; i++) {
49
+ $darkModeToggles[i].classList.remove('dark');
50
+ }
51
+ if (hasClass) {
52
+ document.body.classList.remove('dark');
53
+ }
54
+ }
55
+ }
56
+
57
+ useDark.addEventListener('change', function (evt) {
58
+ toggleDarkMode(evt.matches);
59
+ });
60
+ if (darkModeStateLocal) {
61
+ darkModeState = darkModeStateLocal === 'true';
62
+ }
63
+ toggleDarkMode(darkModeState);
64
+ </script>
65
+ <script>
66
+ // --- Iframe navigation tracking for Template Playground ---
67
+ function sendCurrentUrlToParent() {
68
+ if (window.parent && window.parent !== window) {
69
+ window.parent.postMessage({
70
+ type: 'compodoc-iframe-navigate',
71
+ url: window.location.pathname + window.location.hash
72
+ }, '*');
73
+ }
74
+ }
75
+ window.addEventListener('hashchange', sendCurrentUrlToParent, false);
76
+ window.addEventListener('popstate', sendCurrentUrlToParent, false);
77
+ window.addEventListener('DOMContentLoaded', sendCurrentUrlToParent, false);
78
+ </script>
79
+
80
+ <div class="navbar navbar-default navbar-fixed-top d-md-none p-0">
81
+ <div class="d-flex">
82
+ <a href="../" class="navbar-brand">eui documentation</a>
83
+ <button type="button" class="btn btn-default btn-menu ion-ios-menu" id="btn-menu"></button>
84
+ </div>
85
+ </div>
86
+
87
+ <div class="xs-menu menu" id="mobile-menu">
88
+ <div id="book-search-input" role="search">
89
+ <input type="text" placeholder="Type to search">
90
+ <button type="button"
91
+ class="search-input-clear"
92
+ aria-label="Clear search"
93
+ data-search-input-clear>&times;</button>
94
+ </div>
95
+ <compodoc-menu></compodoc-menu>
96
+ </div>
97
+
98
+ <div class="container-fluid main">
99
+ <div class="row main">
100
+ <div class="d-none d-md-block menu">
101
+ <compodoc-menu mode="normal"></compodoc-menu>
102
+ </div>
103
+ <!-- START CONTENT -->
104
+ <div class="content component">
105
+ <div class="content-data">
106
+
107
+
108
+
109
+
110
+
111
+
112
+
113
+
114
+ <ol class="breadcrumb">
115
+ <li class="breadcrumb-item">Components</li>
116
+ <li class="breadcrumb-item"
117
+ >
118
+ EdsUserProfile</li>
119
+ </ol>
120
+
121
+ <div class="io-file io-file-path" data-compodoc="entity-file-path">
122
+ <span class="icon ion-ios-document" aria-hidden="true"></span>
123
+ <code>packages/eds/eds-user-profile/eds-user-profile.ts</code>
124
+ </div>
125
+
126
+ <ul class="nav nav-tabs" role="tablist">
127
+ <li class="nav-item">
128
+ <a href="#info" class="nav-link active"
129
+ role="tab" id="info-tab" data-bs-toggle="tab" data-link="info">Info</a>
130
+ </li>
131
+ <li class="nav-item">
132
+ <a href="#api" class="nav-link"
133
+ role="tab" id="api-tab" data-bs-toggle="tab" data-link="api">API</a>
134
+ </li>
135
+ </ul>
136
+
137
+ <div class="tab-content">
138
+ <div class="tab-pane fade active in" id="info">
139
+
140
+
141
+ <p class="comment">
142
+ <h3>Implements</h3>
143
+ </p>
144
+ <p class="comment">
145
+ <code><a href="https://angular.dev/api/core/OnInit" target="_blank" >OnInit</a></code>
146
+ <code><a href="https://angular.dev/api/core/AfterViewChecked" target="_blank" >AfterViewChecked</a></code>
147
+ </p>
148
+
149
+
150
+ <section data-compodoc="block-metadata">
151
+ <h3>Metadata</h3>
152
+ <table class="table table-sm table-hover metadata">
153
+ <tbody>
154
+
155
+
156
+
157
+
158
+
159
+
160
+
161
+
162
+
163
+
164
+
165
+
166
+ <tr>
167
+ <td class="col-md-3">selector</td>
168
+ <td class="col-md-9"><code>eds-user-profile</code></td>
169
+ </tr>
170
+
171
+
172
+ <tr>
173
+ <td class="col-md-3">imports</td>
174
+ <td class="col-md-9">
175
+ <div> <code><a href="../miscellaneous/variables.html#EDS_AVATAR" target="_self" >EDS_AVATAR</a></code>
176
+ </div>
177
+ <div> <code><a href="../miscellaneous/variables.html#EDS_ICON" target="_self" >EDS_ICON</a></code>
178
+ </div>
179
+ <div> <code>A11yModule</code>
180
+ </div>
181
+ </td>
182
+ </tr>
183
+
184
+ <tr>
185
+ <td class="col-md-3">styleUrls</td>
186
+ <td class="col-md-9"><code>./eds-user-profile.scss</code></td>
187
+ </tr>
188
+
189
+
190
+
191
+
192
+ <tr>
193
+ <td class="col-md-3">templateUrl</td>
194
+ <td class="col-md-9"><code>./eds-user-profile.html</code></td>
195
+ </tr>
196
+
197
+
198
+
199
+ <tr>
200
+ <td class="col-md-3">styleUrl</td>
201
+ <td class="col-md-9"><code>./eds-user-profile.scss</code></td>
202
+ </tr>
203
+
204
+
205
+
206
+
207
+
208
+ </tbody>
209
+ </table>
210
+ </section>
211
+
212
+ <section data-compodoc="block-relationships">
213
+ <h3>Relationships</h3>
214
+
215
+ <div class="row pt-3">
216
+ <div class="col-sm-6">
217
+ <h4>Used by</h4>
218
+ <p class="comment"><i>No results matching.</i></p>
219
+ </div>
220
+
221
+ <div class="col-sm-6">
222
+ <h4>Depends on</h4>
223
+ <ul class="list-unstyled relationships-list">
224
+ <li>
225
+ <code><a href="../miscellaneous/variables.html#EDS_AVATAR" target="_self" >EDS_AVATAR</a></code>
226
+ </li>
227
+ <li>
228
+ <code><a href="../miscellaneous/variables.html#EDS_ICON" target="_self" >EDS_ICON</a></code>
229
+ </li>
230
+ <li>
231
+ <code>A11yModule</code>
232
+ </li>
233
+ <li>
234
+ <code><a href="https://angular.dev/api/core/OnInit" target="_blank" >OnInit</a></code>
235
+ </li>
236
+ <li>
237
+ <code><a href="https://angular.dev/api/core/AfterViewChecked" target="_blank" >AfterViewChecked</a></code>
238
+ </li>
239
+ </ul>
240
+ </div>
241
+ </div>
242
+ </section>
243
+ </div>
244
+
245
+ <div class="tab-pane fade " id="api"> <section data-compodoc="block-index">
246
+ <h3 id="index">Index</h3>
247
+ <table class="table table-sm table-bordered index-table">
248
+ <tbody>
249
+ <tr>
250
+ <td class="col-md-3">
251
+ <h6><b>Properties</b></h6>
252
+ </td>
253
+ <td class="col-md-9">
254
+ <ul class="index-list">
255
+ <li>
256
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
257
+ <a href="#alignLeft" >alignLeft</a>
258
+ </li>
259
+ <li>
260
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
261
+ <a href="#displayName" >displayName</a>
262
+ </li>
263
+ <li>
264
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
265
+ <a href="#effectiveReverse" >effectiveReverse</a>
266
+ </li>
267
+ <li>
268
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
269
+ <a href="#focusedIndex" >focusedIndex</a>
270
+ </li>
271
+ <li>
272
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
273
+ <a href="#hasMenu" >hasMenu</a>
274
+ </li>
275
+ <li>
276
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
277
+ <a href="#initials" >initials</a>
278
+ </li>
279
+ <li>
280
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
281
+ <a href="#isInToolbar" >isInToolbar</a>
282
+ </li>
283
+ <li>
284
+ <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
285
+ <a href="#isMenuOpen" >isMenuOpen</a>
286
+ </li>
287
+ </ul>
288
+ </td>
289
+ </tr>
290
+ </tbody>
291
+ </table>
292
+
293
+ <table class="table table-sm table-bordered index-table">
294
+ <tbody>
295
+ <tr>
296
+ <td class="col-md-3">
297
+ <h6><b>Methods</b></h6>
298
+ </td>
299
+ <td class="col-md-9">
300
+ <ul class="index-list">
301
+ <li>
302
+ <span class="reference-badge reference-badge--method" aria-hidden="true">M</span>
303
+ <a href="#closeMenu" >closeMenu</a>
304
+ </li>
305
+ <li>
306
+ <span class="reference-badge reference-badge--method" aria-hidden="true">M</span>
307
+ <span class="modifier"></span>
308
+ <a href="#onDocumentClick" >onDocumentClick</a>
309
+ </li>
310
+ <li>
311
+ <span class="reference-badge reference-badge--method" aria-hidden="true">M</span>
312
+ <a href="#onMenuKeydown" >onMenuKeydown</a>
313
+ </li>
314
+ <li>
315
+ <span class="reference-badge reference-badge--method" aria-hidden="true">M</span>
316
+ <a href="#toggleMenu" >toggleMenu</a>
317
+ </li>
318
+ </ul>
319
+ </td>
320
+ </tr>
321
+ </tbody>
322
+ </table>
323
+
324
+ <table class="table table-sm table-bordered index-table">
325
+ <tbody>
326
+ <tr>
327
+ <td class="col-md-3">
328
+ <h6><b>Inputs</b></h6>
329
+ </td>
330
+ <td class="col-md-9">
331
+ <ul class="index-list">
332
+ <li>
333
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#avatarUrl" >avatarUrl</a>
334
+ </li>
335
+ <li>
336
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#firstName" >firstName</a>
337
+ </li>
338
+ <li>
339
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#fullName" >fullName</a>
340
+ </li>
341
+ <li>
342
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#hasWelcomeLabel" >hasWelcomeLabel</a>
343
+ </li>
344
+ <li>
345
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#isReverse" >isReverse</a>
346
+ </li>
347
+ <li>
348
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#isShowAvatarInitials" >isShowAvatarInitials</a>
349
+ </li>
350
+ <li>
351
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#isShowUserInfos" >isShowUserInfos</a>
352
+ </li>
353
+ <li>
354
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#lastName" >lastName</a>
355
+ </li>
356
+ <li>
357
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#reverseNameOrder" >reverseNameOrder</a>
358
+ </li>
359
+ <li>
360
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#subInfos" >subInfos</a>
361
+ </li>
362
+ <li>
363
+ <span class="reference-badge reference-badge--property" aria-hidden="true">I</span><a href="#welcomeLabel" >welcomeLabel</a>
364
+ </li>
365
+ </ul>
366
+ </td>
367
+ </tr>
368
+ </tbody>
369
+ </table>
370
+
371
+
372
+
373
+ <table class="table table-sm table-bordered index-table">
374
+ <tbody>
375
+ <tr>
376
+ <td class="col-md-3">
377
+ <h6><b>HostListeners</b></h6>
378
+ </td>
379
+ <td class="col-md-9">
380
+ <ul class="index-list">
381
+ <li>
382
+ <span class="reference-badge reference-badge--method" aria-hidden="true">HL</span><a href="#document:click" >document:click</a>
383
+ </li>
384
+ </ul>
385
+ </td>
386
+ </tr>
387
+ </tbody>
388
+ </table>
389
+
390
+ </section>
391
+
392
+
393
+ <section data-compodoc="block-inputs">
394
+ <h3 id="inputs">Inputs</h3>
395
+ <table class="table table-sm table-bordered">
396
+ <tbody>
397
+ <tr>
398
+ <td class="col-md-4">
399
+ <a name="avatarUrl"></a>
400
+ <b>avatarUrl</b>
401
+ </td>
402
+ </tr>
403
+ <tr>
404
+ <td class="col-md-4">
405
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
406
+
407
+ </td>
408
+ </tr>
409
+ <tr>
410
+ <td class="col-md-4">
411
+ <i>Default value : </i><code>&#x27;&#x27;</code>
412
+ </td>
413
+ </tr>
414
+ <tr>
415
+ <td class="col-md-4">
416
+ <div class="io-description"><p>URL of the avatar image.</p>
417
+ </div>
418
+ </td>
419
+ </tr>
420
+ </tbody>
421
+ </table>
422
+ <table class="table table-sm table-bordered">
423
+ <tbody>
424
+ <tr>
425
+ <td class="col-md-4">
426
+ <a name="firstName"></a>
427
+ <b>firstName</b>
428
+ </td>
429
+ </tr>
430
+ <tr>
431
+ <td class="col-md-4">
432
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
433
+
434
+ </td>
435
+ </tr>
436
+ <tr>
437
+ <td class="col-md-4">
438
+ <i>Default value : </i><code>&#x27;&#x27;</code>
439
+ </td>
440
+ </tr>
441
+ <tr>
442
+ <td class="col-md-4">
443
+ <div class="io-description"><p>First name.</p>
444
+ </div>
445
+ </td>
446
+ </tr>
447
+ </tbody>
448
+ </table>
449
+ <table class="table table-sm table-bordered">
450
+ <tbody>
451
+ <tr>
452
+ <td class="col-md-4">
453
+ <a name="fullName"></a>
454
+ <b>fullName</b>
455
+ </td>
456
+ </tr>
457
+ <tr>
458
+ <td class="col-md-4">
459
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
460
+
461
+ </td>
462
+ </tr>
463
+ <tr>
464
+ <td class="col-md-4">
465
+ <i>Default value : </i><code>&#x27;&#x27;</code>
466
+ </td>
467
+ </tr>
468
+ <tr>
469
+ <td class="col-md-4">
470
+ <div class="io-description"><p>Full name of the user.</p>
471
+ </div>
472
+ </td>
473
+ </tr>
474
+ </tbody>
475
+ </table>
476
+ <table class="table table-sm table-bordered">
477
+ <tbody>
478
+ <tr>
479
+ <td class="col-md-4">
480
+ <a name="hasWelcomeLabel"></a>
481
+ <b>hasWelcomeLabel</b>
482
+ </td>
483
+ </tr>
484
+ <tr>
485
+ <td class="col-md-4">
486
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
487
+
488
+ </td>
489
+ </tr>
490
+ <tr>
491
+ <td class="col-md-4">
492
+ <i>Default value : </i><code>true</code>
493
+ </td>
494
+ </tr>
495
+ <tr>
496
+ <td class="col-md-4">
497
+ <div class="io-description"><p>Whether to show the welcome label.</p>
498
+ </div>
499
+ </td>
500
+ </tr>
501
+ </tbody>
502
+ </table>
503
+ <table class="table table-sm table-bordered">
504
+ <tbody>
505
+ <tr>
506
+ <td class="col-md-4">
507
+ <a name="isReverse"></a>
508
+ <b>isReverse</b>
509
+ </td>
510
+ </tr>
511
+ <tr>
512
+ <td class="col-md-4">
513
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
514
+
515
+ </td>
516
+ </tr>
517
+ <tr>
518
+ <td class="col-md-4">
519
+ <i>Default value : </i><code>false</code>
520
+ </td>
521
+ </tr>
522
+ <tr>
523
+ <td class="col-md-4">
524
+ <div class="io-description"><p>Reverse the layout (name on left, avatar on right).</p>
525
+ </div>
526
+ </td>
527
+ </tr>
528
+ </tbody>
529
+ </table>
530
+ <table class="table table-sm table-bordered">
531
+ <tbody>
532
+ <tr>
533
+ <td class="col-md-4">
534
+ <a name="isShowAvatarInitials"></a>
535
+ <b>isShowAvatarInitials</b>
536
+ </td>
537
+ </tr>
538
+ <tr>
539
+ <td class="col-md-4">
540
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
541
+
542
+ </td>
543
+ </tr>
544
+ <tr>
545
+ <td class="col-md-4">
546
+ <i>Default value : </i><code>true</code>
547
+ </td>
548
+ </tr>
549
+ <tr>
550
+ <td class="col-md-4">
551
+ <div class="io-description"><p>Whether to show initials in the avatar when no image.</p>
552
+ </div>
553
+ </td>
554
+ </tr>
555
+ </tbody>
556
+ </table>
557
+ <table class="table table-sm table-bordered">
558
+ <tbody>
559
+ <tr>
560
+ <td class="col-md-4">
561
+ <a name="isShowUserInfos"></a>
562
+ <b>isShowUserInfos</b>
563
+ </td>
564
+ </tr>
565
+ <tr>
566
+ <td class="col-md-4">
567
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
568
+
569
+ </td>
570
+ </tr>
571
+ <tr>
572
+ <td class="col-md-4">
573
+ <i>Default value : </i><code>true</code>
574
+ </td>
575
+ </tr>
576
+ <tr>
577
+ <td class="col-md-4">
578
+ <div class="io-description"><p>Whether to show user name and info text.</p>
579
+ </div>
580
+ </td>
581
+ </tr>
582
+ </tbody>
583
+ </table>
584
+ <table class="table table-sm table-bordered">
585
+ <tbody>
586
+ <tr>
587
+ <td class="col-md-4">
588
+ <a name="lastName"></a>
589
+ <b>lastName</b>
590
+ </td>
591
+ </tr>
592
+ <tr>
593
+ <td class="col-md-4">
594
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
595
+
596
+ </td>
597
+ </tr>
598
+ <tr>
599
+ <td class="col-md-4">
600
+ <i>Default value : </i><code>&#x27;&#x27;</code>
601
+ </td>
602
+ </tr>
603
+ <tr>
604
+ <td class="col-md-4">
605
+ <div class="io-description"><p>Last name.</p>
606
+ </div>
607
+ </td>
608
+ </tr>
609
+ </tbody>
610
+ </table>
611
+ <table class="table table-sm table-bordered">
612
+ <tbody>
613
+ <tr>
614
+ <td class="col-md-4">
615
+ <a name="reverseNameOrder"></a>
616
+ <b>reverseNameOrder</b>
617
+ </td>
618
+ </tr>
619
+ <tr>
620
+ <td class="col-md-4">
621
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
622
+
623
+ </td>
624
+ </tr>
625
+ <tr>
626
+ <td class="col-md-4">
627
+ <i>Default value : </i><code>false</code>
628
+ </td>
629
+ </tr>
630
+ <tr>
631
+ <td class="col-md-4">
632
+ <div class="io-description"><p>Whether to reverse name order (firstName first).</p>
633
+ </div>
634
+ </td>
635
+ </tr>
636
+ </tbody>
637
+ </table>
638
+ <table class="table table-sm table-bordered">
639
+ <tbody>
640
+ <tr>
641
+ <td class="col-md-4">
642
+ <a name="subInfos"></a>
643
+ <b>subInfos</b>
644
+ </td>
645
+ </tr>
646
+ <tr>
647
+ <td class="col-md-4">
648
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
649
+
650
+ </td>
651
+ </tr>
652
+ <tr>
653
+ <td class="col-md-4">
654
+ <i>Default value : </i><code>&#x27;&#x27;</code>
655
+ </td>
656
+ </tr>
657
+ <tr>
658
+ <td class="col-md-4">
659
+ <div class="io-description"><p>Additional info displayed below the name (e.g. email, role).</p>
660
+ </div>
661
+ </td>
662
+ </tr>
663
+ </tbody>
664
+ </table>
665
+ <table class="table table-sm table-bordered">
666
+ <tbody>
667
+ <tr>
668
+ <td class="col-md-4">
669
+ <a name="welcomeLabel"></a>
670
+ <b>welcomeLabel</b>
671
+ </td>
672
+ </tr>
673
+ <tr>
674
+ <td class="col-md-4">
675
+ <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
676
+
677
+ </td>
678
+ </tr>
679
+ <tr>
680
+ <td class="col-md-4">
681
+ <i>Default value : </i><code>&#x27;Welcome&#x27;</code>
682
+ </td>
683
+ </tr>
684
+ <tr>
685
+ <td class="col-md-4">
686
+ <div class="io-description"><p>Welcome label displayed before the user name.</p>
687
+ </div>
688
+ </td>
689
+ </tr>
690
+ </tbody>
691
+ </table>
692
+ </section>
693
+
694
+
695
+
696
+ <section data-compodoc="block-methods">
697
+ <h3>HostListeners</h3> <table class="table table-sm table-bordered">
698
+ <tbody>
699
+ <tr>
700
+ <td class="col-md-4">
701
+ <a name="document:click"></a>
702
+ <span class="name">
703
+ <span ><b>document:click</b></span>
704
+ <a href="#document:click"><span class="icon ion-ios-link"></span></a>
705
+ </span>
706
+ </td>
707
+ </tr>
708
+ <tr>
709
+ <td class="col-md-4">
710
+ <i>Arguments : </i><code>'$event' </code>
711
+ </td>
712
+ </tr>
713
+ <tr>
714
+ <td class="col-md-4">
715
+ <code>document:click(event: MouseEvent)</code>
716
+ </td>
717
+ </tr>
718
+
719
+
720
+
721
+
722
+ </tbody>
723
+ </table>
724
+ </section>
725
+
726
+ <section data-compodoc="block-methods">
727
+
728
+ <h3 id="methods">
729
+ Methods
730
+ </h3>
731
+ <table class="table table-sm table-bordered">
732
+ <tbody>
733
+ <tr>
734
+ <td class="col-md-4">
735
+ <a name="closeMenu"></a>
736
+ <span class="name">
737
+ <span ><b>closeMenu</b></span>
738
+ <a href="#closeMenu"><span class="icon ion-ios-link"></span></a>
739
+ </span>
740
+ </td>
741
+ </tr>
742
+ <tr>
743
+ <td class="col-md-4">
744
+ <code>closeMenu()</code>
745
+ </td>
746
+ </tr>
747
+
748
+
749
+
750
+
751
+ <tr>
752
+ <td class="col-md-4">
753
+
754
+ <div class="io-description">
755
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
756
+
757
+ </div>
758
+ </td>
759
+ </tr>
760
+ </tbody>
761
+ </table>
762
+ <table class="table table-sm table-bordered">
763
+ <tbody>
764
+ <tr>
765
+ <td class="col-md-4">
766
+ <a name="onDocumentClick"></a>
767
+ <span class="name">
768
+ <span class="modifier"></span>
769
+ <span ><b>onDocumentClick</b></span>
770
+ <a href="#onDocumentClick"><span class="icon ion-ios-link"></span></a>
771
+ </span>
772
+ </td>
773
+ </tr>
774
+ <tr>
775
+ <td class="col-md-4">
776
+ <span class="modifier-icon icon ion-ios-reset"></span>
777
+ <code>onDocumentClick(event: MouseEvent)</code>
778
+ </td>
779
+ </tr>
780
+
781
+ <tr>
782
+ <td class="col-md-4">
783
+ <b>Decorators : </b>
784
+ <br />
785
+ <code>@HostListener(&#x27;document:click&#x27;, [&#x27;$event&#x27;])<br /></code>
786
+ </td>
787
+ </tr>
788
+
789
+
790
+
791
+ <tr>
792
+ <td class="col-md-4">
793
+
794
+ <div class="io-description">
795
+ <b>Parameters :</b>
796
+
797
+ <table class="params">
798
+ <thead>
799
+ <tr>
800
+ <td>Name</td>
801
+ <td>Type</td>
802
+ <td>Optional</td>
803
+ </tr>
804
+ </thead>
805
+ <tbody>
806
+ <tr>
807
+ <td>event</td>
808
+ <td>
809
+ <code>MouseEvent</code>
810
+ </td>
811
+
812
+ <td>
813
+ No
814
+ </td>
815
+
816
+
817
+ </tr>
818
+ </tbody>
819
+ </table>
820
+ </div>
821
+ <div class="io-description">
822
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
823
+
824
+ </div>
825
+ <div class="io-description">
826
+
827
+ </div>
828
+ </td>
829
+ </tr>
830
+ </tbody>
831
+ </table>
832
+ <table class="table table-sm table-bordered">
833
+ <tbody>
834
+ <tr>
835
+ <td class="col-md-4">
836
+ <a name="onMenuKeydown"></a>
837
+ <span class="name">
838
+ <span ><b>onMenuKeydown</b></span>
839
+ <a href="#onMenuKeydown"><span class="icon ion-ios-link"></span></a>
840
+ </span>
841
+ </td>
842
+ </tr>
843
+ <tr>
844
+ <td class="col-md-4">
845
+ <code>onMenuKeydown(event: KeyboardEvent)</code>
846
+ </td>
847
+ </tr>
848
+
849
+
850
+
851
+
852
+ <tr>
853
+ <td class="col-md-4">
854
+
855
+ <div class="io-description">
856
+ <b>Parameters :</b>
857
+
858
+ <table class="params">
859
+ <thead>
860
+ <tr>
861
+ <td>Name</td>
862
+ <td>Type</td>
863
+ <td>Optional</td>
864
+ </tr>
865
+ </thead>
866
+ <tbody>
867
+ <tr>
868
+ <td>event</td>
869
+ <td>
870
+ <code>KeyboardEvent</code>
871
+ </td>
872
+
873
+ <td>
874
+ No
875
+ </td>
876
+
877
+
878
+ </tr>
879
+ </tbody>
880
+ </table>
881
+ </div>
882
+ <div class="io-description">
883
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
884
+
885
+ </div>
886
+ <div class="io-description">
887
+
888
+ </div>
889
+ </td>
890
+ </tr>
891
+ </tbody>
892
+ </table>
893
+ <table class="table table-sm table-bordered">
894
+ <tbody>
895
+ <tr>
896
+ <td class="col-md-4">
897
+ <a name="toggleMenu"></a>
898
+ <span class="name">
899
+ <span ><b>toggleMenu</b></span>
900
+ <a href="#toggleMenu"><span class="icon ion-ios-link"></span></a>
901
+ </span>
902
+ </td>
903
+ </tr>
904
+ <tr>
905
+ <td class="col-md-4">
906
+ <code>toggleMenu()</code>
907
+ </td>
908
+ </tr>
909
+
910
+
911
+
912
+
913
+ <tr>
914
+ <td class="col-md-4">
915
+
916
+ <div class="io-description">
917
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
918
+
919
+ </div>
920
+ </td>
921
+ </tr>
922
+ </tbody>
923
+ </table>
924
+ </section>
925
+
926
+ <section data-compodoc="block-properties">
927
+
928
+ <h3 id="inputs">
929
+ Properties
930
+ </h3>
931
+ <table class="table table-sm table-bordered">
932
+ <tbody>
933
+ <tr>
934
+ <td class="col-md-4">
935
+ <a name="alignLeft"></a>
936
+ <span class="name">
937
+ <span ><b>alignLeft</b></span>
938
+ <a href="#alignLeft"><span class="icon ion-ios-link"></span></a>
939
+ </span>
940
+ </td>
941
+ </tr>
942
+ <tr>
943
+ <td class="col-md-4">
944
+ <i>Type : </i> <code>unknown</code>
945
+
946
+ </td>
947
+ </tr>
948
+ <tr>
949
+ <td class="col-md-4">
950
+ <i>Default value : </i><code>signal(false)</code>
951
+ </td>
952
+ </tr>
953
+
954
+ <tr>
955
+ <td class="col-md-4">
956
+ <div class="io-description"><p>Whether the dropdown should align to the left edge instead of right.</p>
957
+ </div>
958
+ </td>
959
+ </tr>
960
+
961
+ </tbody>
962
+ </table>
963
+ <table class="table table-sm table-bordered">
964
+ <tbody>
965
+ <tr>
966
+ <td class="col-md-4">
967
+ <a name="displayName"></a>
968
+ <span class="name">
969
+ <span ><b>displayName</b></span>
970
+ <a href="#displayName"><span class="icon ion-ios-link"></span></a>
971
+ </span>
972
+ </td>
973
+ </tr>
974
+ <tr>
975
+ <td class="col-md-4">
976
+ <i>Type : </i> <code>unknown</code>
977
+
978
+ </td>
979
+ </tr>
980
+ <tr>
981
+ <td class="col-md-4">
982
+ <i>Default value : </i><code>computed(() &#x3D;&gt; {
983
+ if (this.fullName()) return this.fullName();
984
+ const first &#x3D; this.firstName();
985
+ const last &#x3D; this.lastName();
986
+ if (this.reverseNameOrder()) {
987
+ return &#x60;${first} ${last}&#x60;.trim();
988
+ }
989
+ return &#x60;${last} ${first}&#x60;.trim();
990
+ })</code>
991
+ </td>
992
+ </tr>
993
+
994
+ <tr>
995
+ <td class="col-md-4">
996
+ <div class="io-description"><p>Computed display name.</p>
997
+ </div>
998
+ </td>
999
+ </tr>
1000
+
1001
+ </tbody>
1002
+ </table>
1003
+ <table class="table table-sm table-bordered">
1004
+ <tbody>
1005
+ <tr>
1006
+ <td class="col-md-4">
1007
+ <a name="effectiveReverse"></a>
1008
+ <span class="name">
1009
+ <span ><b>effectiveReverse</b></span>
1010
+ <a href="#effectiveReverse"><span class="icon ion-ios-link"></span></a>
1011
+ </span>
1012
+ </td>
1013
+ </tr>
1014
+ <tr>
1015
+ <td class="col-md-4">
1016
+ <i>Type : </i> <code>unknown</code>
1017
+
1018
+ </td>
1019
+ </tr>
1020
+ <tr>
1021
+ <td class="col-md-4">
1022
+ <i>Default value : </i><code>computed(() &#x3D;&gt; this.isReverse() || this.contextReverse())</code>
1023
+ </td>
1024
+ </tr>
1025
+
1026
+ <tr>
1027
+ <td class="col-md-4">
1028
+ <div class="io-description"><p>Effective reverse state: true if input or context forces it.</p>
1029
+ </div>
1030
+ </td>
1031
+ </tr>
1032
+
1033
+ </tbody>
1034
+ </table>
1035
+ <table class="table table-sm table-bordered">
1036
+ <tbody>
1037
+ <tr>
1038
+ <td class="col-md-4">
1039
+ <a name="focusedIndex"></a>
1040
+ <span class="name">
1041
+ <span ><b>focusedIndex</b></span>
1042
+ <a href="#focusedIndex"><span class="icon ion-ios-link"></span></a>
1043
+ </span>
1044
+ </td>
1045
+ </tr>
1046
+ <tr>
1047
+ <td class="col-md-4">
1048
+ <i>Type : </i> <code>unknown</code>
1049
+
1050
+ </td>
1051
+ </tr>
1052
+ <tr>
1053
+ <td class="col-md-4">
1054
+ <i>Default value : </i><code>signal(-1)</code>
1055
+ </td>
1056
+ </tr>
1057
+
1058
+ <tr>
1059
+ <td class="col-md-4">
1060
+ <div class="io-description"><p>Index of the currently focused menu item (-1 = none).</p>
1061
+ </div>
1062
+ </td>
1063
+ </tr>
1064
+
1065
+ </tbody>
1066
+ </table>
1067
+ <table class="table table-sm table-bordered">
1068
+ <tbody>
1069
+ <tr>
1070
+ <td class="col-md-4">
1071
+ <a name="hasMenu"></a>
1072
+ <span class="name">
1073
+ <span ><b>hasMenu</b></span>
1074
+ <a href="#hasMenu"><span class="icon ion-ios-link"></span></a>
1075
+ </span>
1076
+ </td>
1077
+ </tr>
1078
+ <tr>
1079
+ <td class="col-md-4">
1080
+ <i>Type : </i> <code>unknown</code>
1081
+
1082
+ </td>
1083
+ </tr>
1084
+ <tr>
1085
+ <td class="col-md-4">
1086
+ <i>Default value : </i><code>computed(() &#x3D;&gt; !!this.menuChild())</code>
1087
+ </td>
1088
+ </tr>
1089
+
1090
+ <tr>
1091
+ <td class="col-md-4">
1092
+ <div class="io-description"><p>Whether the component has a dropdown menu.</p>
1093
+ </div>
1094
+ </td>
1095
+ </tr>
1096
+
1097
+ </tbody>
1098
+ </table>
1099
+ <table class="table table-sm table-bordered">
1100
+ <tbody>
1101
+ <tr>
1102
+ <td class="col-md-4">
1103
+ <a name="initials"></a>
1104
+ <span class="name">
1105
+ <span ><b>initials</b></span>
1106
+ <a href="#initials"><span class="icon ion-ios-link"></span></a>
1107
+ </span>
1108
+ </td>
1109
+ </tr>
1110
+ <tr>
1111
+ <td class="col-md-4">
1112
+ <i>Type : </i> <code>unknown</code>
1113
+
1114
+ </td>
1115
+ </tr>
1116
+ <tr>
1117
+ <td class="col-md-4">
1118
+ <i>Default value : </i><code>computed(() &#x3D;&gt; {
1119
+ const first &#x3D; this.firstName();
1120
+ const last &#x3D; this.lastName();
1121
+ if (first &amp;&amp; last) {
1122
+ return &#x60;${first.charAt(0)}${last.charAt(0)}&#x60;.toUpperCase();
1123
+ }
1124
+ const full &#x3D; this.fullName();
1125
+ if (full) {
1126
+ const parts &#x3D; full.split(&#x27; &#x27;).filter(Boolean);
1127
+ if (parts.length &gt;&#x3D; 2) {
1128
+ return &#x60;${parts[0].charAt(0)}${parts[parts.length - 1].charAt(0)}&#x60;.toUpperCase();
1129
+ }
1130
+ return full.substring(0, 2).toUpperCase();
1131
+ }
1132
+ return &#x27;&#x27;;
1133
+ })</code>
1134
+ </td>
1135
+ </tr>
1136
+
1137
+ <tr>
1138
+ <td class="col-md-4">
1139
+ <div class="io-description"><p>Computed initials from name.</p>
1140
+ </div>
1141
+ </td>
1142
+ </tr>
1143
+
1144
+ </tbody>
1145
+ </table>
1146
+ <table class="table table-sm table-bordered">
1147
+ <tbody>
1148
+ <tr>
1149
+ <td class="col-md-4">
1150
+ <a name="isInToolbar"></a>
1151
+ <span class="name">
1152
+ <span ><b>isInToolbar</b></span>
1153
+ <a href="#isInToolbar"><span class="icon ion-ios-link"></span></a>
1154
+ </span>
1155
+ </td>
1156
+ </tr>
1157
+ <tr>
1158
+ <td class="col-md-4">
1159
+ <i>Type : </i> <code>unknown</code>
1160
+
1161
+ </td>
1162
+ </tr>
1163
+ <tr>
1164
+ <td class="col-md-4">
1165
+ <i>Default value : </i><code>signal(false)</code>
1166
+ </td>
1167
+ </tr>
1168
+
1169
+ <tr>
1170
+ <td class="col-md-4">
1171
+ <div class="io-description"><p>Whether the avatar should use medium size (e.g. inside eds-shell-toolbar).</p>
1172
+ </div>
1173
+ </td>
1174
+ </tr>
1175
+
1176
+ </tbody>
1177
+ </table>
1178
+ <table class="table table-sm table-bordered">
1179
+ <tbody>
1180
+ <tr>
1181
+ <td class="col-md-4">
1182
+ <a name="isMenuOpen"></a>
1183
+ <span class="name">
1184
+ <span ><b>isMenuOpen</b></span>
1185
+ <a href="#isMenuOpen"><span class="icon ion-ios-link"></span></a>
1186
+ </span>
1187
+ </td>
1188
+ </tr>
1189
+ <tr>
1190
+ <td class="col-md-4">
1191
+ <i>Type : </i> <code>unknown</code>
1192
+
1193
+ </td>
1194
+ </tr>
1195
+ <tr>
1196
+ <td class="col-md-4">
1197
+ <i>Default value : </i><code>signal(false)</code>
1198
+ </td>
1199
+ </tr>
1200
+
1201
+ <tr>
1202
+ <td class="col-md-4">
1203
+ <div class="io-description"><p>Whether dropdown menu is open.</p>
1204
+ </div>
1205
+ </td>
1206
+ </tr>
1207
+
1208
+ </tbody>
1209
+ </table>
1210
+ </section>
1211
+
1212
+ </div>
1213
+
1214
+
1215
+
1216
+
1217
+
1218
+
1219
+
1220
+ </div>
1221
+
1222
+ <script src="../js/libs/vis-network.min.js"></script>
1223
+ <script src="../js/libs/htmlparser.js"></script>
1224
+ <script src="../js/libs/deep-iterator.js"></script>
1225
+ <script>
1226
+ var COMPONENT_TEMPLATE = '<div><div class="user-profile" [class.reverse]="effectiveReverse()" [class.in-toolbar]="isInToolbar()" [class.has-menu]="hasMenu()" [attr.tabindex]="hasMenu() ? 0 : null" [attr.role]="hasMenu() ? \'button\' : null" (click)="hasMenu() && toggleMenu()" (keydown.enter)="hasMenu() && toggleMenu()" (keydown.space)="hasMenu() && toggleMenu(); $event.preventDefault()" (keydown.escape)="closeMenu()"> <!-- Avatar --> @if (isInToolbar()) { <eds-avatar edsSizeM> @if (avatarUrl()) { <eds-avatar-icon> <eds-avatar-image [imageUrl]="avatarUrl()" /> </eds-avatar-icon> } @else if (isShowAvatarInitials() && initials()) { <eds-avatar-icon> <eds-avatar-text>{{ initials() }}</eds-avatar-text> </eds-avatar-icon> } @else { <eds-avatar-icon> <eds-avatar-text>👤</eds-avatar-text> </eds-avatar-icon> } </eds-avatar> } @else { <eds-avatar edsSizeL> @if (avatarUrl()) { <eds-avatar-icon> <eds-avatar-image [imageUrl]="avatarUrl()" /> </eds-avatar-icon> } @else if (isShowAvatarInitials() && initials()) { <eds-avatar-icon> <eds-avatar-text>{{ initials() }}</eds-avatar-text> </eds-avatar-icon> } @else { <eds-avatar-icon> <eds-avatar-text>👤</eds-avatar-text> </eds-avatar-icon> } </eds-avatar> } <!-- User info --> @if (isShowUserInfos()) { <div class="user-info"> @if (hasWelcomeLabel() && welcomeLabel()) { <span class="welcome">{{ welcomeLabel() }}</span> } <span class="name">{{ displayName() }}</span> @if (subInfos()) { <span class="sub-info">{{ subInfos() }}</span> } </div> } <!-- Chevron indicator (only when menu is present) --> @if (hasMenu()) { <eds-icon class="chevron" [class.chevron-brand]="isInToolbar()" [icon]="isMenuOpen() ? \'caret-up\' : \'caret-down\'" edsSizeS /> }</div><!-- Dropdown menu (content projected) -->@if (isMenuOpen()) { <div class="profile-menu" [class.align-left]="alignLeft()" cdkTrapFocus [cdkTrapFocusAutoCapture]="true" role="menu" (keydown)="onMenuKeydown($event)"> <ng-content select="eds-user-profile-menu"></ng-content> </div>}</div>'
1227
+ var COMPONENTS = [{'name': 'EdsAlert', 'selector': 'div[edsAlert], eds-alert'},{'name': 'EdsAlertTitle', 'selector': 'eds-alert-title'},{'name': 'EdsAvatar', 'selector': 'div[edsAvatar], span[edsAvatar], eds-avatar'},{'name': 'EdsAvatarBadge', 'selector': 'eds-avatar-badge'},{'name': 'EdsAvatarContent', 'selector': 'eds-avatar-content'},{'name': 'EdsAvatarContentLabel', 'selector': 'eds-avatar-content-label'},{'name': 'EdsAvatarContentSublabel', 'selector': 'eds-avatar-content-sublabel'},{'name': 'EdsAvatarIcon', 'selector': 'eds-avatar-icon'},{'name': 'EdsAvatarImage', 'selector': 'eds-avatar-image'},{'name': 'EdsAvatarList', 'selector': 'eds-avatar-list'},{'name': 'EdsAvatarText', 'selector': 'eds-avatar-text'},{'name': 'EdsBadge', 'selector': 'div[edsBadge], span[edsBadge], eds-badge'},{'name': 'EdsButton', 'selector': 'button[edsButton]'},{'name': 'EdsChip', 'selector': 'eds-chip, span[edsChip], li[edsChip]'},{'name': 'EdsIcon', 'selector': 'eds-icon, span[edsIcon]'},{'name': 'EdsIconButton', 'selector': 'button[edsIconButton]'},{'name': 'EdsIconImage', 'selector': 'eds-icon-image, span[edsIconImage]'},{'name': 'EdsIconState', 'selector': 'eds-icon-state'},{'name': 'EdsLanguageSelector', 'selector': 'eds-language-selector'},{'name': 'EdsMenu', 'selector': 'eds-menu'},{'name': 'EdsMenuItemComponent', 'selector': 'eds-menu-item'},{'name': 'EdsOverlay', 'selector': 'eds-overlay'},{'name': 'EdsOverlayContent', 'selector': 'eds-overlay-content'},{'name': 'EdsOverlayFooter', 'selector': 'eds-overlay-footer'},{'name': 'EdsOverlayHeader', 'selector': 'eds-overlay-header'},{'name': 'EdsOverlayHeaderActionItems', 'selector': 'eds-overlay-header-action-items'},{'name': 'EdsOverlayHeaderLabel', 'selector': 'eds-overlay-header-label'},{'name': 'EdsOverlayHeaderSublabel', 'selector': 'eds-overlay-header-sublabel'},{'name': 'EdsPage', 'selector': 'eds-page'},{'name': 'EdsPageContent', 'selector': 'eds-page-content'},{'name': 'EdsPageFooter', 'selector': 'eds-page-footer'},{'name': 'EdsPageHeader', 'selector': 'eds-page-header'},{'name': 'EdsPageHeaderActionItems', 'selector': 'eds-page-header-action-items'},{'name': 'EdsPageHeaderBody', 'selector': 'eds-page-header-body'},{'name': 'EdsPageHeaderLabel', 'selector': 'eds-page-header-label'},{'name': 'EdsPageHeaderSublabel', 'selector': 'eds-page-header-sublabel'},{'name': 'EdsShell', 'selector': 'eds-shell'},{'name': 'EdsShellContent', 'selector': 'eds-shell-content'},{'name': 'EdsShellFooter', 'selector': 'eds-shell-footer'},{'name': 'EdsShellHeader', 'selector': 'eds-shell-header'},{'name': 'EdsShellHeaderApp', 'selector': 'eds-shell-header-app'},{'name': 'EdsShellHeaderEnd', 'selector': 'eds-shell-header-end'},{'name': 'EdsShellHeaderEnvironment', 'selector': 'eds-shell-header-environment'},{'name': 'EdsShellHeaderLogo', 'selector': 'eds-shell-header-logo'},{'name': 'EdsShellHeaderStart', 'selector': 'eds-shell-header-start'},{'name': 'EdsShellMenuToggle', 'selector': 'eds-shell-menu-toggle'},{'name': 'EdsShellSidebar', 'selector': 'eds-shell-sidebar'},{'name': 'EdsShellSidebarBottomNav', 'selector': 'eds-shell-sidebar-bottom-nav'},{'name': 'EdsShellSidebarFooter', 'selector': 'eds-shell-sidebar-footer'},{'name': 'EdsShellSidebarHeader', 'selector': 'eds-shell-sidebar-header'},{'name': 'EdsShellSidebarNav', 'selector': 'eds-shell-sidebar-nav'},{'name': 'EdsShellToolbar', 'selector': 'eds-shell-toolbar'},{'name': 'EdsShellToolbarApp', 'selector': 'eds-shell-toolbar-app'},{'name': 'EdsShellToolbarEnd', 'selector': 'eds-shell-toolbar-end'},{'name': 'EdsShellToolbarEnvironment', 'selector': 'eds-shell-toolbar-environment'},{'name': 'EdsShellToolbarLogo', 'selector': 'eds-shell-toolbar-logo'},{'name': 'EdsShellToolbarStart', 'selector': 'eds-shell-toolbar-start'},{'name': 'EdsShellTopMessage', 'selector': 'eds-shell-top-message'},{'name': 'EdsTab', 'selector': 'eds-tab'},{'name': 'EdsTabBody', 'selector': 'eds-tab-body'},{'name': 'EdsTabHeader', 'selector': 'eds-tab-header'},{'name': 'EdsTabHeaderLabel', 'selector': 'eds-tab-header-label'},{'name': 'EdsTabHeaderLeftContent', 'selector': 'eds-tab-header-left-content'},{'name': 'EdsTabHeaderRightContent', 'selector': 'eds-tab-header-right-content'},{'name': 'EdsTabHeaderSublabel', 'selector': 'eds-tab-header-sub-label'},{'name': 'EdsTabs', 'selector': 'eds-tabs'},{'name': 'EdsTabsRightContent', 'selector': 'eds-tabs-right-content'},{'name': 'EdsTag', 'selector': 'eds-tag, span[edsTag]'},{'name': 'EdsTooltipContainer', 'selector': 'eds-tooltip-container'},{'name': 'EdsUserProfile', 'selector': 'eds-user-profile'},{'name': 'EdsUserProfileMenu', 'selector': 'eds-user-profile-menu'},{'name': 'EdsUserProfileMenuItem', 'selector': 'eds-user-profile-menu-item'}];
1228
+ var DIRECTIVES = [{'name': 'EdsBaseColorVariantsDirective', 'selector': '[edsBaseColorVariants]'},{'name': 'EdsBaseSizeVariantsDirective', 'selector': '[edsBaseSizeVariants]'},{'name': 'EdsResizable', 'selector': '[edsResizable]'},{'name': 'EdsTooltip', 'selector': '[edsTooltip]'}];
1229
+ var ACTUAL_COMPONENT = {'name': 'EdsUserProfile'};
1230
+ </script>
1231
+ <script src="../js/tree.js"></script>
1232
+
1233
+
1234
+
1235
+
1236
+
1237
+
1238
+
1239
+
1240
+
1241
+
1242
+
1243
+
1244
+
1245
+
1246
+
1247
+
1248
+
1249
+ </div><div class="search-results">
1250
+ <div class="has-results">
1251
+ <h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
1252
+ <ul class="search-results-list"></ul>
1253
+ </div>
1254
+ <div class="no-results">
1255
+ <h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
1256
+ </div>
1257
+ </div>
1258
+ </div>
1259
+ <!-- END CONTENT -->
1260
+ </div>
1261
+ </div>
1262
+
1263
+ <label class="dark-mode-switch">
1264
+ <input type="checkbox">
1265
+ <span class="slider">
1266
+ <svg class="slider-icon" viewBox="0 0 24 24" fill="none" height="20" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="20" xmlns="http://www.w3.org/2000/svg">
1267
+ <path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"></path>
1268
+ </svg>
1269
+ </span>
1270
+ </label>
1271
+
1272
+ <script>
1273
+ var COMPODOC_CURRENT_PAGE_DEPTH = 1;
1274
+ var COMPODOC_CURRENT_PAGE_CONTEXT = 'component';
1275
+ var COMPODOC_CURRENT_PAGE_URL = 'EdsUserProfile.html';
1276
+ var MAX_SEARCH_RESULTS = 15;
1277
+ </script>
1278
+
1279
+ <script>
1280
+ $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
1281
+ var updateDarkModeSwitchOffset = function () {
1282
+ var content = document.querySelector('.content');
1283
+ var scrollbarWidth = 0;
1284
+
1285
+ if (content) {
1286
+ scrollbarWidth = Math.max(0, content.offsetWidth - content.clientWidth);
1287
+ }
1288
+
1289
+ document.documentElement.style.setProperty(
1290
+ '--content-scrollbar-width',
1291
+ scrollbarWidth + 'px'
1292
+ );
1293
+ };
1294
+
1295
+ updateDarkModeSwitchOffset();
1296
+ requestAnimationFrame(updateDarkModeSwitchOffset);
1297
+ window.addEventListener('resize', updateDarkModeSwitchOffset);
1298
+
1299
+ checkToggle(darkModeState);
1300
+ if ($darkModeToggleSwitchers.length > 0) {
1301
+ for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
1302
+ $darkModeToggleSwitchers[i].addEventListener('change', function (event) {
1303
+ darkModeState = !darkModeState;
1304
+ toggleDarkMode(darkModeState);
1305
+ });
1306
+ }
1307
+ }
1308
+ </script>
1309
+
1310
+ <script src="../js/libs/custom-elements.min.js"></script>
1311
+ <script src="../js/libs/lit-html.js"></script>
1312
+
1313
+ <script src="../js/menu-wc.js" defer></script>
1314
+
1315
+ <script src="../js/libs/bootstrap-native.js"></script>
1316
+
1317
+ <script src="../js/libs/es6-shim.min.js"></script>
1318
+ <script src="../js/libs/EventDispatcher.js"></script>
1319
+ <script src="../js/libs/promise.min.js"></script>
1320
+
1321
+ <script src="../js/compodoc.js"></script>
1322
+
1323
+ <script src="../js/tabs.js"></script>
1324
+ <script src="../js/menu.js"></script>
1325
+ <script src="../js/libs/clipboard.min.js"></script>
1326
+ <script src="../js/libs/prism.js"></script>
1327
+ <script src="../js/sourceCode.js"></script>
1328
+ <script src="../js/search/search.js"></script>
1329
+ <script src="../js/search/lunr.min.js"></script>
1330
+ <script src="../js/search/search-lunr.js"></script>
1331
+ <script src="../js/search/search_index.js"></script>
1332
+ <script src="../js/lazy-load-graphs.js"></script>
1333
+
1334
+
1335
+ </body>
1336
+ </html>