@fundamental-styles/mcp 0.41.7-rc.8 → 0.41.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.
Files changed (215) hide show
  1. package/data/AI_USAGE.md +425 -0
  2. package/data/CHANGELOG.md +53 -3
  3. package/data/component-catalog.json +62 -209
  4. package/data/components/README.md +281 -0
  5. package/data/components/action-bar.md +443 -0
  6. package/data/components/ai-busy-indicator.md +79 -0
  7. package/data/components/ai-loading-bar.md +66 -0
  8. package/data/components/avatar-btp.md +198 -0
  9. package/data/components/avatar-group.md +2660 -0
  10. package/data/components/avatar-product-switch.md +476 -0
  11. package/data/components/avatar.md +993 -0
  12. package/data/components/bar.md +574 -0
  13. package/data/components/border-radius.md +148 -0
  14. package/data/components/border.md +412 -0
  15. package/data/components/breadcrumb.md +546 -0
  16. package/data/components/button-2.md +440 -0
  17. package/data/components/button-action-sheet.md +292 -0
  18. package/data/components/button-ai.md +730 -0
  19. package/data/components/button-btp.md +223 -0
  20. package/data/components/button-button.md +233 -0
  21. package/data/components/button-counter.md +176 -0
  22. package/data/components/button-patterns.md +731 -0
  23. package/data/components/button-split.md +459 -0
  24. package/data/components/button.md +469 -0
  25. package/data/components/calendar.md +5784 -0
  26. package/data/components/card-card-media.md +707 -0
  27. package/data/components/card-card.md +2426 -0
  28. package/data/components/card-layouts.md +1201 -0
  29. package/data/components/card.md +2404 -0
  30. package/data/components/carousel.md +1506 -0
  31. package/data/components/code.md +139 -0
  32. package/data/components/component-reset.md +272 -0
  33. package/data/components/components-icons-businesssuiteinappsymbol-icons.md +85 -0
  34. package/data/components/components-icons-sap-icons.md +147 -0
  35. package/data/components/components-icons-tnt-icons.md +85 -0
  36. package/data/components/container-queries.md +221 -0
  37. package/data/components/container.md +227 -0
  38. package/data/components/dialog-docs-static-busy-indicator.md +165 -0
  39. package/data/components/dialog-docs-static-dialog.md +949 -0
  40. package/data/components/dialog-docs-static-patterns.md +147 -0
  41. package/data/components/dialog-docs-static-settings.md +528 -0
  42. package/data/components/dialog-docs-static.md +982 -0
  43. package/data/components/dialog.md +606 -0
  44. package/data/components/dynamic-page-dynamic-page.md +1914 -0
  45. package/data/components/dynamic-page.md +973 -0
  46. package/data/components/dynamic-side.md +197 -0
  47. package/data/components/elevation.md +110 -0
  48. package/data/components/feed-input.md +346 -0
  49. package/data/components/feed-list.md +580 -0
  50. package/data/components/fieldset-2.md +292 -0
  51. package/data/components/fieldset-forms.md +169 -0
  52. package/data/components/fieldset.md +381 -0
  53. package/data/components/flexible-column-layout.md +205 -0
  54. package/data/components/form-group.md +287 -0
  55. package/data/components/form-header.md +71 -0
  56. package/data/components/form-item-2.md +98 -0
  57. package/data/components/form-item-3.md +134 -0
  58. package/data/components/form-item-4.md +556 -0
  59. package/data/components/form-item-5.md +182 -0
  60. package/data/components/form-item-6.md +539 -0
  61. package/data/components/form-item-7.md +239 -0
  62. package/data/components/form-item-ai.md +158 -0
  63. package/data/components/form-item-file-uploader.md +445 -0
  64. package/data/components/form-item-forms.md +234 -0
  65. package/data/components/form-item-patterns.md +426 -0
  66. package/data/components/form-item.md +464 -0
  67. package/data/components/form-label-ai.md +126 -0
  68. package/data/components/form-label-layouts.md +306 -0
  69. package/data/components/form-label-patterns.md +1175 -0
  70. package/data/components/form-label-status-indicator.md +1083 -0
  71. package/data/components/form-label-step-input.md +620 -0
  72. package/data/components/form-label.md +2876 -0
  73. package/data/components/generic-tag.md +747 -0
  74. package/data/components/grid-list-grid-list.md +1185 -0
  75. package/data/components/grid-list.md +1449 -0
  76. package/data/components/heading.md +66 -0
  77. package/data/components/horizontal-navigation.md +568 -0
  78. package/data/components/icon-tab-bar-dev.md +190 -0
  79. package/data/components/icon-tab-bar.md +2620 -0
  80. package/data/components/icon.md +171 -0
  81. package/data/components/iconBusinessSuite.md +92 -0
  82. package/data/components/iconTnt.md +92 -0
  83. package/data/components/illustrated-message.md +439 -0
  84. package/data/components/info-label.md +348 -0
  85. package/data/components/input-group.md +2068 -0
  86. package/data/components/label.md +66 -0
  87. package/data/components/layout-grid.md +447 -0
  88. package/data/components/layout-panel.md +261 -0
  89. package/data/components/layouts-layout-grid.md +608 -0
  90. package/data/components/layouts-paddings.md +133 -0
  91. package/data/components/layouts-section.md +287 -0
  92. package/data/components/list-2.md +148 -0
  93. package/data/components/list-3.md +735 -0
  94. package/data/components/list-list.md +790 -0
  95. package/data/components/list-object-list.md +1225 -0
  96. package/data/components/list.md +1286 -0
  97. package/data/components/media-queries.md +168 -0
  98. package/data/components/menu.md +946 -0
  99. package/data/components/message-box-docs-static-ai.md +149 -0
  100. package/data/components/message-box-docs-static.md +527 -0
  101. package/data/components/message-page-upload-collection.md +678 -0
  102. package/data/components/message-page.md +256 -0
  103. package/data/components/message-strip.md +977 -0
  104. package/data/components/message-toast.md +119 -0
  105. package/data/components/micro-process-flow.md +991 -0
  106. package/data/components/navigation-menu.md +366 -0
  107. package/data/components/navigation-navigation.md +1245 -0
  108. package/data/components/navigation.md +2604 -0
  109. package/data/components/numeric-content.md +317 -0
  110. package/data/components/object-attribute.md +96 -0
  111. package/data/components/object-identifier.md +227 -0
  112. package/data/components/object-marker.md +202 -0
  113. package/data/components/object-number.md +327 -0
  114. package/data/components/object-status.md +1538 -0
  115. package/data/components/off-screen.md +87 -0
  116. package/data/components/overflow.md +97 -0
  117. package/data/components/padding.md +122 -0
  118. package/data/components/paddings.md +130 -0
  119. package/data/components/page.md +300 -0
  120. package/data/components/pagination.md +672 -0
  121. package/data/components/panel-layouts.md +345 -0
  122. package/data/components/panel.md +514 -0
  123. package/data/components/patterns-label.md +74 -0
  124. package/data/components/popover-2.md +906 -0
  125. package/data/components/popover-ai.md +466 -0
  126. package/data/components/popover-btp.md +886 -0
  127. package/data/components/popover-deprecated.md +308 -0
  128. package/data/components/popover-message-popover.md +683 -0
  129. package/data/components/popover-notification.md +1511 -0
  130. package/data/components/popover-patterns.md +1100 -0
  131. package/data/components/popover-popover.md +1862 -0
  132. package/data/components/popover-quick-view.md +385 -0
  133. package/data/components/popover-timepicker.md +1836 -0
  134. package/data/components/popover-user-menu.md +1303 -0
  135. package/data/components/popover.md +1938 -0
  136. package/data/components/progress-indicator.md +351 -0
  137. package/data/components/prompt-input-ai.md +226 -0
  138. package/data/components/prompt-input.md +226 -0
  139. package/data/components/rating-indicator.md +1469 -0
  140. package/data/components/resizable-card-layout.md +951 -0
  141. package/data/components/scrollbar.md +86 -0
  142. package/data/components/search-field.md +287 -0
  143. package/data/components/section.md +250 -0
  144. package/data/components/segmented-button.md +324 -0
  145. package/data/components/shellbar.md +2183 -0
  146. package/data/components/side-nav.md +1562 -0
  147. package/data/components/skeleton.md +243 -0
  148. package/data/components/slider.md +395 -0
  149. package/data/components/splitter.md +353 -0
  150. package/data/components/table.md +2749 -0
  151. package/data/components/tabs.md +658 -0
  152. package/data/components/text-text.md +380 -0
  153. package/data/components/text.md +253 -0
  154. package/data/components/tile.md +1132 -0
  155. package/data/components/time.md +818 -0
  156. package/data/components/title.md +153 -0
  157. package/data/components/titles.md +83 -0
  158. package/data/components/token.md +311 -0
  159. package/data/components/tokenizer.md +398 -0
  160. package/data/components/tool-header.md +1352 -0
  161. package/data/components/tool-layout.md +199 -0
  162. package/data/components/toolbar-ai.md +174 -0
  163. package/data/components/toolbar-btp.md +526 -0
  164. package/data/components/toolbar-title-bar.md +473 -0
  165. package/data/components/toolbar.md +432 -0
  166. package/data/components/tree.md +1031 -0
  167. package/data/components/typography.md +435 -0
  168. package/data/components/variant-management.md +360 -0
  169. package/data/components/vertical-nav.md +589 -0
  170. package/data/components/wizard.md +1429 -0
  171. package/data/examples/Components/dialog/device-specifications.example.html +39 -30
  172. package/data/examples/Components/shellbar/optional-items.example.html +210 -157
  173. package/data/examples/Components/shellbar/overflow-toolbar.example.html +202 -177
  174. package/data/examples/Components/shellbar/responsive-paddings.example.html +217 -146
  175. package/data/examples/Components/shellbar/responsiveness.example.html +825 -613
  176. package/data/examples/Components/user-menu/default.example.html +241 -83
  177. package/data/schemas/badge.schema.json +1 -1
  178. package/data/schemas/button-split.schema.json +1 -1
  179. package/data/schemas/component-frontmatter.schema.json +123 -0
  180. package/data/schemas/component-markdown.schema.json +81 -0
  181. package/data/schemas/counter.schema.json +1 -1
  182. package/data/schemas/dynamic-page.schema.json +1 -1
  183. package/data/schemas/dynamic-side-content.schema.json +1 -1
  184. package/data/schemas/facet.schema.json +1 -1
  185. package/data/schemas/fieldset.schema.json +1 -1
  186. package/data/schemas/flexible-column-layout.schema.json +1 -1
  187. package/data/schemas/form-group.schema.json +3 -2
  188. package/data/schemas/form-header.schema.json +1 -1
  189. package/data/schemas/form-label.schema.json +1 -0
  190. package/data/schemas/form-message.schema.json +1 -1
  191. package/data/schemas/grid-list.schema.json +1 -1
  192. package/data/schemas/input-group.schema.json +1 -1
  193. package/data/schemas/layout-panel.schema.json +1 -1
  194. package/data/schemas/page.schema.json +1 -1
  195. package/data/schemas/quick-view.schema.json +2 -1
  196. package/data/schemas/section.schema.json +1 -1
  197. package/data/schemas/side-nav.schema.json +1 -1
  198. package/data/schemas/splitter.schema.json +1 -1
  199. package/data/schemas/tabs.schema.json +1 -1
  200. package/data/schemas/tile.schema.json +1 -1
  201. package/data/schemas/tool-layout.schema.json +1 -1
  202. package/data/schemas/user-menu.schema.json +10 -0
  203. package/data/schemas/wizard.schema.json +1 -1
  204. package/package.json +1 -1
  205. package/src/data/load-catalog.d.ts +2 -0
  206. package/src/data/load-catalog.js +5 -1
  207. package/src/data/load-catalog.js.map +1 -1
  208. package/src/data/load-markdown-docs.d.ts +44 -0
  209. package/src/data/load-markdown-docs.js +179 -0
  210. package/src/data/load-markdown-docs.js.map +1 -0
  211. package/src/data/markdown-cache.d.ts +60 -0
  212. package/src/data/markdown-cache.js +218 -0
  213. package/src/data/markdown-cache.js.map +1 -0
  214. package/src/server.js +72 -1
  215. package/src/server.js.map +1 -1
package/data/examples/Components/shellbar/overflow-toolbar.example.html CHANGED
@@ -1,204 +1,229 @@
1
- <div style="height:250px">
1
+ <div style="height: 250px">
2
2
  <div class="fd-shellbar fd-shellbar--side-nav" role="banner" aria-label="Shell Bar">
3
3
  <div class="fd-shellbar__group fd-shellbar__group--product">
4
- <button aria-label="Main Navigation" aria-expanded="false" class="fd-button fd-button--transparent fd-shellbar__button">
4
+ <button
5
+ aria-label="Main Navigation"
6
+ aria-expanded="false"
7
+ class="fd-button fd-button--transparent fd-shellbar__button"
8
+ >
5
9
  <i class="sap-icon--menu2"></i>
6
10
  </button>
7
- <div class="fd-shellbar__branding" role="link" tabindex="0" aria-label="SAP Corporate Portal Solution Name Home">
8
- <span class="fd-shellbar__logo"><img src="//unpkg.com/fundamental-styles/dist/images/sap-logo.png" srcset="//unpkg.com/fundamental-styles/dist/images/sap-logo@2x.png 1x, //unpkg.com/fundamental-styles/dist/images/sap-logo@3x.png 2x, //unpkg.com/fundamental-styles/dist/images/sap-logo@4x.png 3x" height="32" alt="SAP"></span>
11
+ <div
12
+ class="fd-shellbar__branding"
13
+ role="link"
14
+ tabindex="0"
15
+ aria-label="SAP Corporate Portal Solution Name Home"
16
+ >
17
+ <span class="fd-shellbar__logo"
18
+ ><img
19
+ src="//unpkg.com/fundamental-styles/dist/images/sap-logo.png"
20
+ srcset="
21
+ //unpkg.com/fundamental-styles/dist/images/sap-logo@2x.png 1x,
22
+ //unpkg.com/fundamental-styles/dist/images/sap-logo@3x.png 2x,
23
+ //unpkg.com/fundamental-styles/dist/images/sap-logo@4x.png 3x
24
+ "
25
+ height="32"
26
+ alt="SAP"
27
+ /></span>
9
28
 
10
29
  <span class="fd-shellbar__title">Corporate Portal</span>
11
30
  </div>
12
31
  </div>
13
32
  <div class="fd-shellbar__group fd-shellbar__group--context-area" role="group" aria-label="Additional info">
14
- <span class="fd-shellbar__separator"></span>
15
- <div class="fd-popover">
16
- <div class="fd-popover__control">
17
- <button
18
- class="fd-button fd-button--transparent fd-shellbar__button fd-shellbar__button--menu fd-button--menu"
19
- onclick="onPopoverClick('9GLB269412874');"
20
- aria-controls="9GLB269412874"
21
- aria-haspopup="true"
22
- aria-expanded="false"
23
- >
24
- <span class="fd-button__text">EMEA</span>
25
- <i class="sap-icon--slim-arrow-down"></i>
26
- </button>
27
- </div>
28
- <div
29
- class="fd-popover__body fd-popover__body--no-arrow"
30
- aria-hidden="true"
31
- id="9GLB269412874"
32
- >
33
- <nav class="fd-menu">
34
- <ul class="fd-menu__list fd-menu__list--no-shadow">
35
- <li class="fd-menu__item">
36
- <a role="button" class="fd-menu__link">
37
- <span class="fd-menu__title">Application A</span>
38
- </a>
39
- </li>
40
- <li class="fd-menu__item">
41
- <a role="button" class="fd-menu__link">
42
- <span class="fd-menu__title">Application B</span>
43
- </a>
44
- </li>
45
- <li class="fd-menu__item">
46
- <a role="button" class="fd-menu__link">
47
- <span class="fd-menu__title">Application C</span>
48
- </a>
49
- </li>
50
- <li class="fd-menu__item">
51
- <a role="button" class="fd-menu__link">
52
- <span class="fd-menu__title">Application D</span>
53
- </a>
54
- </li>
55
- </ul>
56
- </nav>
57
- </div>
58
- </div>
59
- </div>
60
- <div class="fd-shellbar__group fd-shellbar__group--actions">
61
- <div class="fd-toolbar fd-toolbar--clear fd-toolbar--transparent fd-shellbar__toolbar" role="toolbar" aria-label="Toolbar">
62
- <div id="YDGFD82347TED" class="fd-input-group fd-shellbar__search-field">
63
- <input
64
- aria-label="search-input"
65
- type="text"
66
- onfocus="addClass('YDGFD82347TED', 'is-focus')"
67
- onblur="removeClass('YDGFD82347TED', 'is-focus')"
68
- class="fd-input fd-input-group__input fd-shellbar__search-field-input"
69
- id="F4GcX348b1"
70
- placeholder="Search everything"
71
- />
72
- <div
73
- class="fd-input-group__addon fd-shellbar__search-field-addon fd-shellbar__search-cancel fd-input-group__addon--button"
74
- >
75
- <button
76
- aria-label="button-search"
77
- class="fd-shellbar__button fd-button fd-button--transparent"
78
- >
79
- <i class="sap-icon--decline"></i>
80
- </button>
81
- </div>
82
- <div
83
- class="fd-input-group__addon fd-shellbar__search-field-addon fd-shellbar__search-submit fd-input-group__addon--button"
84
- >
85
- <button
86
- aria-label="button-search"
87
- class="fd-shellbar__button fd-button fd-button--transparent"
88
- >
89
- <i class="sap-icon--search"></i>
90
- </button>
91
- </div>
92
- <div class="fd-shellbar__search-field-helper"></div>
93
- </div>
94
- <button
95
- class="fd-button fd-button--transparent fd-shellbar__button"
96
- aria-label="Joule Digital Assitant" aria-haspopup="dialog" aria-expanded="false" title="Joule Digital Assitant">
97
- <i class="sap-icon--da"></i>
98
- </button>
99
- <button
100
- class="fd-button fd-button--transparent fd-shellbar__button"
101
- aria-label="Notifications"
102
- title="Notifications"
103
- aria-haspopup="dialog" aria-expanded="false"
104
- >
105
- <i class="sap-icon--bell"></i>
106
- <span class="fd-button__badge">72</span>
107
- </button>
108
- <button
109
- class="fd-button fd-button--transparent fd-shellbar__button"
110
- aria-label="Feedback" aria-haspopup="dialog" aria-expanded="false" title="Feedback">
111
- <i class="sap-icon--feedback"></i>
112
- </button>
113
- <button
114
- class="fd-button fd-button--transparent fd-shellbar__button"
115
- aria-label="Help" aria-haspopup="dialog" aria-expanded="false" title="Help">
116
- <i class="sap-icon--sys-help"></i>
117
- </button>
118
- </div>
119
- <div class="fd-shellbar__action">
120
- <div class="fd-popover fd-popover--right">
33
+ <span class="fd-shellbar__separator"></span>
34
+ <div class="fd-popover">
121
35
  <div class="fd-popover__control">
122
- <div class="fd-button fd-button--transparent fd-shellbar__button fd-user-menu__control"
123
- onclick="onPopoverClick('MKFAY276YRW')" aria-controls="MKFAY276YRW" aria-expanded="false"
124
- aria-haspopup="dialog" role="button" tabindex="0" aria-label="User Menu" title="User Menu">
125
- <span
126
- class="fd-avatar fd-avatar--xs fd-avatar--circle fd-avatar--thumbnail fd-shellbar__avatar--circle"
127
- style="background-image: url('assets/images/avatars/1.svg');"
128
- aria-label="William Wallingham">
129
- </span>
130
- </div>
36
+ <button
37
+ class="fd-button fd-button--transparent fd-shellbar__button fd-shellbar__button--menu fd-button--menu"
38
+ onclick="onPopoverClick('9GLB269412874')"
39
+ aria-controls="9GLB269412874"
40
+ aria-haspopup="true"
41
+ aria-expanded="false"
42
+ >
43
+ <span class="fd-button__text">EMEA</span>
44
+ <i class="sap-icon--slim-arrow-down"></i>
45
+ </button>
131
46
  </div>
132
- <div class="fd-popover__body fd-popover__body--no-arrow fd-popover__body--right" aria-hidden="true"
133
- id="MKFAY276YRW">
47
+ <div class="fd-popover__body fd-popover__body--no-arrow" aria-hidden="true" id="9GLB269412874">
134
48
  <nav class="fd-menu">
135
49
  <ul class="fd-menu__list fd-menu__list--no-shadow">
136
50
  <li class="fd-menu__item">
137
51
  <a role="button" class="fd-menu__link">
138
- <span class="fd-menu__title">Settings</span>
52
+ <span class="fd-menu__title">Application A</span>
139
53
  </a>
140
54
  </li>
141
55
  <li class="fd-menu__item">
142
56
  <a role="button" class="fd-menu__link">
143
- <span class="fd-menu__title">Sign Out</span>
57
+ <span class="fd-menu__title">Application B</span>
58
+ </a>
59
+ </li>
60
+ <li class="fd-menu__item">
61
+ <a role="button" class="fd-menu__link">
62
+ <span class="fd-menu__title">Application C</span>
63
+ </a>
64
+ </li>
65
+ <li class="fd-menu__item">
66
+ <a role="button" class="fd-menu__link">
67
+ <span class="fd-menu__title">Application D</span>
144
68
  </a>
145
69
  </li>
146
70
  </ul>
147
71
  </nav>
148
72
  </div>
149
73
  </div>
150
- </div>
151
- <div class="fd-shellbar__action">
152
- <div class="fd-product-switch">
153
- <div class="fd-popover fd-popover--right">
154
- <button
155
- class="fd-button fd-button--transparent fd-shellbar__button fd-popover__control"
156
- aria-label="Product Switcher"
157
- title="Product Switcher"
158
- aria-controls="UYYAY276YRW"
159
- aria-expanded="false"
160
- aria-haspopup="dialog"
161
- onclick="onPopoverClick('UYYAY276YRW')">
162
- <i class="sap-icon--grid"></i>
163
- </button>
164
- <div class="fd-popover__body fd-popover__body--right" aria-hidden="true"
165
- id="UYYAY276YRW">
166
- <div class="fd-product-switch__body">
167
- <ul class="fd-product-switch__list">
168
- <li class="fd-product-switch__item">
169
- <div class="fd-product-switch__icon sap-icon--home"></div>
170
- <div class="fd-product-switch__text">
171
- <div class="fd-product-switch__title">Home</div>
172
- <div class="fd-product-switch__subtitle">Central Home</div>
173
- </div>
174
- </li>
175
- <li class="fd-product-switch__item selected">
176
- <div
177
- class="fd-product-switch__icon sap-icon--business-objects-experience"></div>
178
- <div class="fd-product-switch__text">
179
- <div class="fd-product-switch__title">Analytics Cloud</div>
180
- <div class="fd-product-switch__subtitle">Analytics Cloud</div>
181
- </div>
182
- </li>
183
- <li class="fd-product-switch__item">
184
- <div class="fd-product-switch__icon sap-icon--contacts"></div>
185
- <div class="fd-product-switch__text">
186
- <div class="fd-product-switch__title">Catalog</div>
187
- <div class="fd-product-switch__subtitle">Ariba</div>
188
- </div>
189
- </li>
190
- <li class="fd-product-switch__item">
191
- <div class="fd-product-switch__icon sap-icon--credit-card"></div>
192
- <div class="fd-product-switch__text">
193
- <div class="fd-product-switch__title">Guided Buying</div>
194
- </div>
195
- </li>
196
- </ul>
197
- </div>
198
- </div>
199
- </div>
200
- </div>
201
- </div>
74
+ </div>
75
+ <div class="fd-shellbar__group fd-shellbar__group--actions">
76
+ <div
77
+ class="fd-toolbar fd-toolbar--clear fd-toolbar--transparent fd-shellbar__toolbar"
78
+ role="toolbar"
79
+ aria-label="Toolbar"
80
+ >
81
+ <div id="YDGFD82347TED" class="fd-input-group fd-shellbar__search-field">
82
+ <input
83
+ aria-label="search-input"
84
+ type="text"
85
+ onfocus="addClass('YDGFD82347TED', 'is-focus')"
86
+ onblur="removeClass('YDGFD82347TED', 'is-focus')"
87
+ class="fd-input fd-input-group__input fd-shellbar__search-field-input"
88
+ id="F4GcX348b1"
89
+ placeholder="Search everything"
90
+ />
91
+ <div
92
+ class="fd-input-group__addon fd-shellbar__search-field-addon fd-shellbar__search-cancel fd-input-group__addon--button"
93
+ >
94
+ <button aria-label="button-search" class="fd-shellbar__button fd-button fd-button--transparent">
95
+ <i class="sap-icon--decline"></i>
96
+ </button>
97
+ </div>
98
+ <div
99
+ class="fd-input-group__addon fd-shellbar__search-field-addon fd-shellbar__search-submit fd-input-group__addon--button"
100
+ >
101
+ <button aria-label="button-search" class="fd-shellbar__button fd-button fd-button--transparent">
102
+ <i class="sap-icon--search"></i>
103
+ </button>
104
+ </div>
105
+ <div class="fd-shellbar__search-field-helper"></div>
106
+ </div>
107
+ <button
108
+ class="fd-button fd-button--transparent fd-shellbar__button"
109
+ aria-label="Joule Digital Assitant"
110
+ aria-haspopup="dialog"
111
+ aria-expanded="false"
112
+ title="Joule Digital Assitant"
113
+ >
114
+ <i class="sap-icon--da"></i>
115
+ </button>
116
+ <button
117
+ class="fd-button fd-button--transparent fd-shellbar__button"
118
+ aria-label="Notifications"
119
+ title="Notifications"
120
+ aria-haspopup="dialog"
121
+ aria-expanded="false"
122
+ >
123
+ <i class="sap-icon--bell"></i>
124
+ <span class="fd-button__badge">72</span>
125
+ </button>
126
+ </div>
127
+ <div class="fd-shellbar__action">
128
+ <div class="fd-popover fd-popover--right">
129
+ <div class="fd-popover__control">
130
+ <div
131
+ class="fd-button fd-button--transparent fd-shellbar__button fd-user-menu__control"
132
+ onclick="onPopoverClick('MKFAY276YRW')"
133
+ aria-controls="MKFAY276YRW"
134
+ aria-expanded="false"
135
+ aria-haspopup="dialog"
136
+ role="button"
137
+ tabindex="0"
138
+ aria-label="User Menu"
139
+ title="User Menu"
140
+ >
141
+ <span
142
+ class="fd-avatar fd-avatar--xs fd-avatar--circle fd-avatar--thumbnail fd-shellbar__avatar--circle"
143
+ style="background-image: url('assets/images/avatars/1.svg')"
144
+ aria-label="William Wallingham"
145
+ >
146
+ </span>
147
+ </div>
148
+ </div>
149
+ <div
150
+ class="fd-popover__body fd-popover__body--no-arrow fd-popover__body--right"
151
+ aria-hidden="true"
152
+ id="MKFAY276YRW"
153
+ >
154
+ <nav class="fd-menu">
155
+ <ul class="fd-menu__list fd-menu__list--no-shadow">
156
+ <li class="fd-menu__item">
157
+ <a role="button" class="fd-menu__link">
158
+ <span class="fd-menu__title">Settings</span>
159
+ </a>
160
+ </li>
161
+ <li class="fd-menu__item">
162
+ <a role="button" class="fd-menu__link">
163
+ <span class="fd-menu__title">Sign Out</span>
164
+ </a>
165
+ </li>
166
+ </ul>
167
+ </nav>
168
+ </div>
169
+ </div>
170
+ </div>
171
+ <div class="fd-shellbar__action">
172
+ <div class="fd-product-switch">
173
+ <div class="fd-popover fd-popover--right">
174
+ <button
175
+ class="fd-button fd-button--transparent fd-shellbar__button fd-popover__control"
176
+ aria-label="Product Switcher"
177
+ title="Product Switcher"
178
+ aria-controls="UYYAY276YRW"
179
+ aria-expanded="false"
180
+ aria-haspopup="dialog"
181
+ onclick="onPopoverClick('UYYAY276YRW')"
182
+ >
183
+ <i class="sap-icon--grid"></i>
184
+ </button>
185
+ <div
186
+ class="fd-popover__body fd-popover__body--no-arrow fd-popover__body--right"
187
+ aria-hidden="true"
188
+ id="UYYAY276YRW"
189
+ >
190
+ <div class="fd-product-switch__body">
191
+ <ul class="fd-product-switch__list">
192
+ <li class="fd-product-switch__item">
193
+ <div class="fd-product-switch__icon sap-icon--home"></div>
194
+ <div class="fd-product-switch__text">
195
+ <div class="fd-product-switch__title">Home</div>
196
+ <div class="fd-product-switch__subtitle">Central Home</div>
197
+ </div>
198
+ </li>
199
+ <li class="fd-product-switch__item selected">
200
+ <div
201
+ class="fd-product-switch__icon sap-icon--business-objects-experience"
202
+ ></div>
203
+ <div class="fd-product-switch__text">
204
+ <div class="fd-product-switch__title">Analytics Cloud</div>
205
+ <div class="fd-product-switch__subtitle">Analytics Cloud</div>
206
+ </div>
207
+ </li>
208
+ <li class="fd-product-switch__item">
209
+ <div class="fd-product-switch__icon sap-icon--contacts"></div>
210
+ <div class="fd-product-switch__text">
211
+ <div class="fd-product-switch__title">Catalog</div>
212
+ <div class="fd-product-switch__subtitle">Ariba</div>
213
+ </div>
214
+ </li>
215
+ <li class="fd-product-switch__item">
216
+ <div class="fd-product-switch__icon sap-icon--credit-card"></div>
217
+ <div class="fd-product-switch__text">
218
+ <div class="fd-product-switch__title">Guided Buying</div>
219
+ </div>
220
+ </li>
221
+ </ul>
222
+ </div>
223
+ </div>
224
+ </div>
225
+ </div>
226
+ </div>
202
227
  </div>
203
228
  </div>
204
- </div>
229
+ </div>