@patternfly/patternfly-doc-core 1.15.4 → 1.15.5

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 (312) hide show
  1. package/.astro/content-modules.mjs +124 -124
  2. package/README.mdx +1 -0
  3. package/cli/cli.ts +54 -35
  4. package/{src → dist}/apiIndex.json +94 -94
  5. package/dist/cli/cli.js +48 -30
  6. package/dist/docs/_worker.js/chunks/fetch_CoXtH9RF.mjs +12 -0
  7. package/dist/docs/_worker.js/chunks/getConfig_DO3RhTb7.mjs +18 -0
  8. package/dist/docs/_worker.js/index.js +11 -9
  9. package/dist/docs/_worker.js/manifest_DIDAejNV.mjs +100 -0
  10. package/dist/docs/_worker.js/pages/api/_version_/_section_/_page_.astro.mjs +18 -10
  11. package/dist/docs/_worker.js/pages/api/_version_/_section_.astro.mjs +17 -8
  12. package/dist/docs/_worker.js/pages/api/_version_.astro.mjs +15 -8
  13. package/dist/docs/_worker.js/pages/api/openapi.json.astro.mjs +14 -3
  14. package/dist/docs/_worker.js/pages/api/versions.astro.mjs +11 -4
  15. package/dist/docs/_worker.js/pages/apiindex.json.astro.mjs +1 -0
  16. package/dist/docs/_worker.js/pages/props.astro.mjs +1 -16
  17. package/dist/docs/apiIndex.json +561 -0
  18. package/dist/docs/components/about-modal/html/index.html +8 -8
  19. package/dist/docs/components/about-modal/html-demos/index.html +4 -4
  20. package/dist/docs/components/about-modal/index.html +5 -5
  21. package/dist/docs/components/accordion/html/index.html +22 -22
  22. package/dist/docs/components/accordion/index.html +7 -7
  23. package/dist/docs/components/action-list/html/index.html +11 -11
  24. package/dist/docs/components/action-list/index.html +9 -9
  25. package/dist/docs/components/alert/html/index.html +31 -31
  26. package/dist/docs/components/alert/html-demos/index.html +10 -10
  27. package/dist/docs/components/alert/index.html +83 -83
  28. package/dist/docs/components/alert/react/index.html +83 -83
  29. package/dist/docs/components/avatar/html/index.html +16 -16
  30. package/dist/docs/components/avatar/index.html +8 -8
  31. package/dist/docs/components/avatar/react/index.html +5 -5
  32. package/dist/docs/components/back-to-top/html/index.html +9 -9
  33. package/dist/docs/components/back-to-top/html-demos/index.html +4 -4
  34. package/dist/docs/components/back-to-top/index.html +8 -8
  35. package/dist/docs/components/back-to-top/react/index.html +8 -8
  36. package/dist/docs/components/backdrop/html/index.html +11 -11
  37. package/dist/docs/components/backdrop/index.html +6 -6
  38. package/dist/docs/components/backdrop/react/index.html +6 -6
  39. package/dist/docs/components/background-image/html/index.html +11 -11
  40. package/dist/docs/components/background-image/index.html +6 -6
  41. package/dist/docs/components/background-image/react/index.html +6 -6
  42. package/dist/docs/components/badge/html/index.html +12 -12
  43. package/dist/docs/components/badge/index.html +8 -8
  44. package/dist/docs/components/badge/react/index.html +8 -8
  45. package/dist/docs/components/banner/html/index.html +12 -12
  46. package/dist/docs/components/banner/html-demos/index.html +9 -9
  47. package/dist/docs/components/banner/index.html +11 -11
  48. package/dist/docs/components/banner/react/index.html +11 -11
  49. package/dist/docs/components/brand/html/index.html +10 -10
  50. package/dist/docs/components/brand/index.html +6 -6
  51. package/dist/docs/components/breadcrumb/html/index.html +15 -15
  52. package/dist/docs/components/breadcrumb/index.html +6 -6
  53. package/dist/docs/components/breadcrumb/react/index.html +9 -9
  54. package/dist/docs/components/button/html/index.html +26 -26
  55. package/dist/docs/components/button/html-demos/index.html +5 -5
  56. package/dist/docs/components/button/index.html +34 -34
  57. package/dist/docs/components/button/react/index.html +37 -37
  58. package/dist/docs/components/calendar-month/html/index.html +9 -9
  59. package/dist/docs/components/calendar-month/index.html +6 -6
  60. package/dist/docs/components/calendar-month/react/index.html +9 -9
  61. package/dist/docs/components/card/html/index.html +37 -37
  62. package/dist/docs/components/card/html-demos/index.html +25 -25
  63. package/dist/docs/components/card/index.html +52 -52
  64. package/dist/docs/components/card/react/index.html +55 -55
  65. package/dist/docs/components/checkbox/html/index.html +21 -21
  66. package/dist/docs/components/checkbox/index.html +16 -16
  67. package/dist/docs/components/checkbox/react/index.html +13 -13
  68. package/dist/docs/components/chip/index.html +11 -11
  69. package/dist/docs/components/chip/react-deprecated/index.html +11 -11
  70. package/dist/docs/components/clipboard-copy/html/index.html +12 -12
  71. package/dist/docs/components/clipboard-copy/index.html +15 -15
  72. package/dist/docs/components/clipboard-copy/react/index.html +15 -15
  73. package/dist/docs/components/code-block/html/index.html +10 -10
  74. package/dist/docs/components/code-block/index.html +9 -9
  75. package/dist/docs/components/code-block/react/index.html +6 -6
  76. package/dist/docs/components/code-editor/html/index.html +16 -16
  77. package/dist/docs/components/code-editor/index.html +16 -16
  78. package/dist/docs/components/content/html/index.html +21 -21
  79. package/dist/docs/components/content/index.html +19 -19
  80. package/dist/docs/components/data-list/html/index.html +38 -38
  81. package/dist/docs/components/data-list/html-demos/index.html +12 -12
  82. package/dist/docs/components/data-list/index.html +21 -21
  83. package/dist/docs/components/date-picker/html/index.html +11 -11
  84. package/dist/docs/components/date-picker/index.html +14 -14
  85. package/dist/docs/components/date-picker/react/index.html +17 -17
  86. package/dist/docs/components/description-list/html/index.html +41 -41
  87. package/dist/docs/components/description-list/html-demos/index.html +8 -8
  88. package/dist/docs/components/description-list/index.html +36 -36
  89. package/dist/docs/components/description-list/react/index.html +39 -39
  90. package/dist/docs/components/divider/html/index.html +18 -18
  91. package/dist/docs/components/divider/index.html +11 -11
  92. package/dist/docs/components/drag-and-drop/html/index.html +11 -11
  93. package/dist/docs/components/drag-and-drop/index.html +9 -9
  94. package/dist/docs/components/drag-and-drop/react-deprecated/index.html +9 -9
  95. package/dist/docs/components/drawer/html/index.html +27 -27
  96. package/dist/docs/components/drawer/html-demos/index.html +16 -16
  97. package/dist/docs/components/drawer/index.html +25 -25
  98. package/dist/docs/components/dual-list-selector/html/index.html +13 -13
  99. package/dist/docs/components/dual-list-selector/index.html +17 -17
  100. package/dist/docs/components/empty-state/html/index.html +14 -14
  101. package/dist/docs/components/empty-state/index.html +13 -13
  102. package/dist/docs/components/empty-state/react/index.html +13 -13
  103. package/dist/docs/components/expandable-section/html/index.html +17 -17
  104. package/dist/docs/components/expandable-section/index.html +18 -18
  105. package/dist/docs/components/expandable-section/react/index.html +15 -15
  106. package/dist/docs/components/form/html/index.html +19 -19
  107. package/dist/docs/components/form/html-demos/index.html +6 -6
  108. package/dist/docs/components/form/index.html +19 -19
  109. package/dist/docs/components/form/react/index.html +19 -19
  110. package/dist/docs/components/form-control/html/index.html +12 -12
  111. package/dist/docs/components/form-control/index.html +12 -12
  112. package/dist/docs/components/form-select/index.html +9 -9
  113. package/dist/docs/components/form-select/react/index.html +9 -9
  114. package/dist/docs/components/helper-text/html/index.html +11 -11
  115. package/dist/docs/components/helper-text/html-demos/index.html +7 -7
  116. package/dist/docs/components/helper-text/index.html +9 -9
  117. package/dist/docs/components/hint/html/index.html +7 -7
  118. package/dist/docs/components/hint/index.html +8 -8
  119. package/dist/docs/components/hint/react/index.html +11 -11
  120. package/dist/docs/components/icon/html/index.html +16 -16
  121. package/dist/docs/components/icon/index.html +17 -17
  122. package/dist/docs/components/icon/react/index.html +20 -20
  123. package/dist/docs/components/inline-edit/html/index.html +29 -29
  124. package/dist/docs/components/inline-edit/index.html +29 -29
  125. package/dist/docs/components/input-group/html/index.html +12 -12
  126. package/dist/docs/components/input-group/index.html +12 -12
  127. package/dist/docs/components/input-group/react/index.html +12 -12
  128. package/dist/docs/components/jump-links/html/index.html +17 -17
  129. package/dist/docs/components/jump-links/html-demos/index.html +13 -13
  130. package/dist/docs/components/jump-links/index.html +9 -9
  131. package/dist/docs/components/jump-links/react/index.html +12 -12
  132. package/dist/docs/components/label/html/index.html +44 -44
  133. package/dist/docs/components/label/index.html +28 -28
  134. package/dist/docs/components/list/html/index.html +13 -13
  135. package/dist/docs/components/list/index.html +9 -9
  136. package/dist/docs/components/login-page/html/index.html +17 -17
  137. package/dist/docs/components/login-page/index.html +13 -13
  138. package/dist/docs/components/masthead/html/index.html +13 -13
  139. package/dist/docs/components/masthead/html-demos/index.html +20 -20
  140. package/dist/docs/components/masthead/index.html +18 -18
  141. package/dist/docs/components/menu/html/index.html +46 -46
  142. package/dist/docs/components/menu/index.html +68 -68
  143. package/dist/docs/components/menu/react/index.html +68 -68
  144. package/dist/docs/components/menu-toggle/html/index.html +35 -35
  145. package/dist/docs/components/menu-toggle/index.html +66 -66
  146. package/dist/docs/components/menu-toggle/react/index.html +66 -66
  147. package/dist/docs/components/modal/html/index.html +45 -45
  148. package/dist/docs/components/modal/html-demos/index.html +16 -16
  149. package/dist/docs/components/modal/index.html +41 -41
  150. package/dist/docs/components/multiple-file-upload/html/index.html +11 -11
  151. package/dist/docs/components/multiple-file-upload/index.html +26 -26
  152. package/dist/docs/components/navigation/html/index.html +26 -26
  153. package/dist/docs/components/navigation/html-demos/index.html +16 -16
  154. package/dist/docs/components/navigation/index.html +18 -18
  155. package/dist/docs/components/navigation/react/index.html +21 -21
  156. package/dist/docs/components/notification-badge/index.html +16 -16
  157. package/dist/docs/components/notification-badge/react/index.html +16 -16
  158. package/dist/docs/components/notification-drawer/html/index.html +9 -9
  159. package/dist/docs/components/notification-drawer/html-demos/index.html +13 -13
  160. package/dist/docs/components/notification-drawer/index.html +8 -8
  161. package/dist/docs/components/notification-drawer/react/index.html +8 -8
  162. package/dist/docs/components/number-input/html/index.html +12 -12
  163. package/dist/docs/components/number-input/index.html +11 -11
  164. package/dist/docs/components/number-input/react/index.html +14 -14
  165. package/dist/docs/components/overflow-menu/html/index.html +18 -18
  166. package/dist/docs/components/overflow-menu/index.html +9 -9
  167. package/dist/docs/components/overflow-menu/react/index.html +12 -12
  168. package/dist/docs/components/page/html/index.html +18 -18
  169. package/dist/docs/components/page/html-demos/index.html +32 -32
  170. package/dist/docs/components/page/index.html +50 -50
  171. package/dist/docs/components/page/react/index.html +50 -50
  172. package/dist/docs/components/pagination/html/index.html +20 -20
  173. package/dist/docs/components/pagination/index.html +17 -17
  174. package/dist/docs/components/pagination/react/index.html +14 -14
  175. package/dist/docs/components/panel/html/index.html +14 -14
  176. package/dist/docs/components/panel/html-demos/index.html +5 -5
  177. package/dist/docs/components/panel/index.html +22 -22
  178. package/dist/docs/components/password-generator/html-demos/index.html +4 -4
  179. package/dist/docs/components/password-generator/index.html +4 -4
  180. package/dist/docs/components/password-strength/html-demos/index.html +7 -7
  181. package/dist/docs/components/password-strength/index.html +7 -7
  182. package/dist/docs/components/popover/html/index.html +44 -44
  183. package/dist/docs/components/popover/index.html +20 -20
  184. package/dist/docs/components/popover/react/index.html +23 -23
  185. package/dist/docs/components/progress/html/index.html +31 -31
  186. package/dist/docs/components/progress/index.html +23 -23
  187. package/dist/docs/components/progress/react/index.html +23 -23
  188. package/dist/docs/components/progress-stepper/html/index.html +27 -27
  189. package/dist/docs/components/progress-stepper/index.html +16 -16
  190. package/dist/docs/components/progress-stepper/react/index.html +16 -16
  191. package/dist/docs/components/radio/html/index.html +20 -20
  192. package/dist/docs/components/radio/index.html +15 -15
  193. package/dist/docs/components/radio/react/index.html +15 -15
  194. package/dist/docs/components/sidebar/html/index.html +21 -21
  195. package/dist/docs/components/sidebar/index.html +17 -17
  196. package/dist/docs/components/simple-file-upload/html/index.html +15 -15
  197. package/dist/docs/components/simple-file-upload/index.html +32 -32
  198. package/dist/docs/components/simple-file-upload/react/index.html +32 -32
  199. package/dist/docs/components/simple-list/html/index.html +11 -11
  200. package/dist/docs/components/simple-list/index.html +9 -9
  201. package/dist/docs/components/simple-list/react/index.html +6 -6
  202. package/dist/docs/components/skeleton/html/index.html +13 -13
  203. package/dist/docs/components/skeleton/html-demos/index.html +3 -3
  204. package/dist/docs/components/skeleton/index.html +10 -10
  205. package/dist/docs/components/skeleton/react/index.html +10 -10
  206. package/dist/docs/components/skip-to-content/html/index.html +13 -13
  207. package/dist/docs/components/skip-to-content/index.html +6 -6
  208. package/dist/docs/components/skip-to-content/react/index.html +6 -6
  209. package/dist/docs/components/slider/html/index.html +14 -14
  210. package/dist/docs/components/slider/index.html +22 -22
  211. package/dist/docs/components/slider/react/index.html +22 -22
  212. package/dist/docs/components/spinner/html/index.html +16 -16
  213. package/dist/docs/components/spinner/index.html +9 -9
  214. package/dist/docs/components/spinner/react/index.html +6 -6
  215. package/dist/docs/components/switch/html/index.html +17 -17
  216. package/dist/docs/components/switch/index.html +12 -12
  217. package/dist/docs/components/switch/react/index.html +12 -12
  218. package/dist/docs/components/table/html/index.html +129 -129
  219. package/dist/docs/components/table/html-demos/index.html +33 -33
  220. package/dist/docs/components/table/index.html +129 -129
  221. package/dist/docs/components/tabs/html/index.html +67 -67
  222. package/dist/docs/components/tabs/html-demos/index.html +13 -13
  223. package/dist/docs/components/tabs/index.html +77 -77
  224. package/dist/docs/components/tabs/react/index.html +77 -77
  225. package/dist/docs/components/text-input/index.html +13 -13
  226. package/dist/docs/components/text-input/react/index.html +13 -13
  227. package/dist/docs/components/text-input-group/html/index.html +27 -27
  228. package/dist/docs/components/text-input-group/index.html +16 -16
  229. package/dist/docs/components/tile/html-deprecated/index.html +11 -11
  230. package/dist/docs/components/tile/index.html +23 -23
  231. package/dist/docs/components/tile/react-deprecated/index.html +26 -26
  232. package/dist/docs/components/time-picker/index.html +13 -13
  233. package/dist/docs/components/time-picker/react/index.html +13 -13
  234. package/dist/docs/components/timestamp/html/index.html +8 -8
  235. package/dist/docs/components/timestamp/index.html +21 -21
  236. package/dist/docs/components/timestamp/react/index.html +21 -21
  237. package/dist/docs/components/title/html/index.html +10 -10
  238. package/dist/docs/components/title/index.html +4 -4
  239. package/dist/docs/components/toggle-group/html/index.html +9 -9
  240. package/dist/docs/components/toggle-group/index.html +18 -18
  241. package/dist/docs/components/toolbar/html/index.html +55 -55
  242. package/dist/docs/components/toolbar/html-demos/index.html +12 -12
  243. package/dist/docs/components/toolbar/index.html +42 -42
  244. package/dist/docs/components/tooltip/html/index.html +17 -17
  245. package/dist/docs/components/tooltip/index.html +12 -12
  246. package/dist/docs/components/tree-view/html/index.html +21 -21
  247. package/dist/docs/components/tree-view/index.html +23 -23
  248. package/dist/docs/components/truncate/html/index.html +13 -13
  249. package/dist/docs/components/truncate/index.html +13 -13
  250. package/dist/docs/components/wizard/html/index.html +29 -29
  251. package/dist/docs/components/wizard/html-demos/index.html +22 -22
  252. package/dist/docs/components/wizard/index.html +32 -32
  253. package/dist/docs/components/wizard/react-deprecated/index.html +22 -22
  254. package/dist/docs/layouts/bullseye/html/index.html +11 -11
  255. package/dist/docs/layouts/bullseye/index.html +11 -11
  256. package/dist/docs/layouts/flex/html/index.html +87 -87
  257. package/dist/docs/layouts/flex/index.html +87 -87
  258. package/dist/docs/layouts/gallery/html/index.html +17 -17
  259. package/dist/docs/layouts/gallery/index.html +17 -17
  260. package/dist/docs/layouts/grid/html/index.html +22 -22
  261. package/dist/docs/layouts/grid/index.html +22 -22
  262. package/dist/docs/layouts/level/html/index.html +10 -10
  263. package/dist/docs/layouts/level/index.html +10 -10
  264. package/dist/docs/layouts/split/html/index.html +13 -13
  265. package/dist/docs/layouts/split/index.html +13 -13
  266. package/dist/docs/layouts/stack/html/index.html +12 -12
  267. package/dist/docs/layouts/stack/index.html +12 -12
  268. package/dist/docs/patterns/card-view/html-demos/index.html +4 -4
  269. package/dist/docs/patterns/card-view/index.html +4 -4
  270. package/dist/docs/patterns/dashboard/html-demos/index.html +4 -4
  271. package/dist/docs/patterns/dashboard/index.html +4 -4
  272. package/dist/docs/patterns/primary-detail/html-demos/index.html +17 -17
  273. package/dist/docs/patterns/primary-detail/index.html +17 -17
  274. package/dist/docs/utility-classes/accessibility/html/index.html +11 -11
  275. package/dist/docs/utility-classes/accessibility/index.html +11 -11
  276. package/dist/docs/utility-classes/alignment/html/index.html +7 -7
  277. package/dist/docs/utility-classes/alignment/index.html +7 -7
  278. package/dist/docs/utility-classes/background-color/html/index.html +9 -9
  279. package/dist/docs/utility-classes/background-color/index.html +9 -9
  280. package/dist/docs/utility-classes/box-shadow/html/index.html +12 -12
  281. package/dist/docs/utility-classes/box-shadow/index.html +12 -12
  282. package/dist/docs/utility-classes/display/html/index.html +18 -18
  283. package/dist/docs/utility-classes/display/index.html +18 -18
  284. package/dist/docs/utility-classes/flex/html/index.html +17 -17
  285. package/dist/docs/utility-classes/flex/index.html +17 -17
  286. package/dist/docs/utility-classes/float/html/index.html +7 -7
  287. package/dist/docs/utility-classes/float/index.html +7 -7
  288. package/dist/docs/utility-classes/sizing/html/index.html +28 -28
  289. package/dist/docs/utility-classes/sizing/index.html +28 -28
  290. package/dist/docs/utility-classes/spacing/html/index.html +12 -12
  291. package/dist/docs/utility-classes/spacing/index.html +12 -12
  292. package/dist/docs/utility-classes/text/html/index.html +18 -18
  293. package/dist/docs/utility-classes/text/index.html +18 -18
  294. package/jest.config.ts +1 -1
  295. package/package.json +5 -4
  296. package/src/pages/api/[version]/[section]/[page]/[tab].ts +11 -3
  297. package/src/pages/api/[version]/[section]/[page].ts +19 -11
  298. package/src/pages/api/[version]/[section].ts +18 -9
  299. package/src/pages/api/[version].ts +16 -9
  300. package/src/pages/api/openapi.json.ts +14 -3
  301. package/src/pages/api/versions.ts +11 -5
  302. package/src/pages/apiIndex.json.ts +27 -0
  303. package/src/utils/apiIndex/fetch.ts +20 -0
  304. package/src/utils/apiIndex/generate.ts +9 -5
  305. package/src/utils/apiIndex/get.ts +3 -1
  306. package/src/utils/getOutputDir.ts +19 -0
  307. package/src/utils/packageUtils.ts +5 -3
  308. package/tsconfig.json +9 -4
  309. package/dist/docs/_worker.js/chunks/apiIndex_rjiPwa_V.mjs +0 -9
  310. package/dist/docs/_worker.js/manifest_BOIk4wkr.mjs +0 -100
  311. /package/dist/docs/_worker.js/chunks/{_astro_data-layer-content_BIIrAXF8.mjs → _astro_data-layer-content_DGZXfKa-.mjs} +0 -0
  312. /package/dist/docs/_worker.js/chunks/{content-modules_BnWiSXLh.mjs → content-modules_Db1avyLw.mjs} +0 -0
@@ -42,10 +42,10 @@
42
42
  animation-fill-mode: both;
43
43
  animation-name: astroFadeIn; }</style><style>[data-astro-transition-scope="astro-2e6ke2uy-4"] { view-transition-name: astro-2e6ke2uy-4; }@layer astro { ::view-transition-old(astro-2e6ke2uy-4) { animation: none; opacity: 0; mix-blend-mode: normal; }::view-transition-new(astro-2e6ke2uy-4) { animation: none; mix-blend-mode: normal; }::view-transition-group(astro-2e6ke2uy-4) { animation: none } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-2e6ke2uy-4"],
44
44
  [data-astro-transition-fallback="old"][data-astro-transition-scope="astro-2e6ke2uy-4"] { animation: none; mix-blend-mode: normal; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-2e6ke2uy-4"],
45
- [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-2e6ke2uy-4"] { animation: none; mix-blend-mode: normal; }</style></head> <body> <div class="pf-v6-c-page"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var l=(n,t)=>{let i=async()=>{await(await n())()},e=typeof t.value=="object"?t.value:void 0,s={timeout:e==null?void 0:e.timeout};"requestIdleCallback"in window?window.requestIdleCallback(i,s):setTimeout(i,s.timeout||200)};(self.Astro||(self.Astro={})).idle=l;window.dispatchEvent(new Event("astro:idle"));})();</script><script>(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>1/0*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><header class="pf-v6-c-masthead pf-m-display-inline-on-md"> <div class="pf-v6-c-masthead__main"> <span class="pf-v6-c-masthead__toggle"> <astro-island uid="ZBlIxr" prefix="r4" component-url="/_astro/PageToggle.Dnq2xvgl.js" component-export="PageToggle" renderer-url="/_astro/client.DN8ES6L5.js" props="{&quot;data-astro-transition-persist&quot;:[0,&quot;astro-u5p5alki-2&quot;]}" ssr client="idle" opts="{&quot;name&quot;:&quot;PageToggle&quot;,&quot;value&quot;:true}" data-astro-transition-persist="astro-u5p5alki-2" await-children><button id="nav-toggle" aria-expanded="true" aria-label="Global navigation" class="pf-v6-c-button pf-m-plain" type="button" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-328"><span class="pf-v6-c-button__text"><svg class="pf-v6-svg" viewBox="0 0 448 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg></span></button><!--astro:end--></astro-island> </span> <div class="pf-v6-c-masthead__brand"> <a class="pf-v6-c-masthead__logo" tabindex="0" href="/"> <img class="pf-v6-c-brand" style="--pf-v6-c-brand--Height:36px" src="/PF-HorizontalLogo-Color.svg" alt="PatternFly"/> </a> </div> </div> <div class="pf-v6-c-masthead__content"> <astro-island uid="ZeQlyX" prefix="r6" component-url="/_astro/Toolbar.BmprOKR8.js" component-export="Toolbar" renderer-url="/_astro/client.DN8ES6L5.js" props="{}" ssr client="idle" opts="{&quot;name&quot;:&quot;ReactToolbar&quot;,&quot;value&quot;:true}" await-children><div class="pf-v6-c-toolbar pf-m-static" id="toolbar" data-ouia-component-type="PF6/Toolbar" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Toolbar-110"><div class="pf-v6-c-toolbar__content"><div class="pf-v6-c-toolbar__content-section"><div class="pf-v6-c-toolbar__group pf-m-action-group-plain pf-m-align-end pf-m-gap-none pf-m-gap-md-on-md"><div class="pf-v6-c-toolbar__item"></div><div class="pf-v6-c-toolbar__item"><div class="pf-v6-c-input-group ws-global-search"><div class="pf-v6-c-input-group__item"><button aria-expanded="false" aria-label="Expandable search input toggle" class="pf-v6-c-button pf-m-plain" type="button" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-329"><span class="pf-v6-c-button__icon"><svg class="pf-v6-svg" viewBox="0 0 512 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"></path></svg></span></button></div></div></div><div class="pf-v6-c-toolbar__item"><a href="//github.com/patternfly" target="top" aria-label="PatternFly GitHub page" class="pf-v6-c-button pf-m-plain" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-330"><span class="pf-v6-c-button__text"><svg class="pf-v6-svg" viewBox="0 0 496 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></span></a></div><div class="pf-v6-c-toolbar__item"><button class="pf-v6-c-menu-toggle" type="button" aria-expanded="false" data-ouia-component-type="PF6/MenuToggle" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-MenuToggle-110"><span class="pf-v6-c-menu-toggle__text">Release 6.1.0</span><span class="pf-v6-c-menu-toggle__controls"><span class="pf-v6-c-menu-toggle__toggle-icon"><svg class="pf-v6-svg" viewBox="0 0 320 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"></path></svg></span></span></button></div></div></div></div><div class="pf-v6-c-toolbar__content pf-m-hidden" hidden=""><div class="pf-v6-c-toolbar__group"></div></div></div><!--astro:end--></astro-island> </div> </header> <script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();</script><astro-island uid="2tEdvJ" component-url="/_astro/Navigation.B03CQhTw.js" component-export="Navigation" renderer-url="/_astro/client.DN8ES6L5.js" props="{&quot;navData&quot;:[1,[[1,[[0,{&quot;id&quot;:[0,&quot;src/components/aboutmodal/examples/aboutmodal&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;About modal&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/accordion/examples/accordion&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Accordion&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/actionlist/examples/actionlist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Action list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/alert/examples/alert&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Alert&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/avatar/examples/avatar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Avatar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backtotop/examples/backtotop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Back to top&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backdrop/examples/backdrop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Backdrop&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backgroundimage/examples/backgroundimage&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Background image&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/badge/examples/badge&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Badge&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/banner/examples/banner&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Banner&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/brand/examples/brand&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Brand&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/breadcrumb/examples/breadcrumb&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Breadcrumb&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/button/examples/button&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Button&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/calendarmonth/examples/calendarmonth&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Calendar month&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/card/examples/card&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Card&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/checkbox/examples/checkbox&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Checkbox&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/chip/examples/chip&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Chip&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/clipboardcopy/examples/clipboardcopy&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Clipboard copy&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/codeblock/examples/codeblock&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Code block&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/codeeditor/examples/codeeditor&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Code editor&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/content/examples/content&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Content&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/datalist/examples/datalist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Data list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/datepicker/examples/datepicker&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Date picker&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/descriptionlist/examples/descriptionlist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Description list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/divider/examples/divider&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Divider&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/dragdrop/examples/dragdrop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Drag and drop&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/drawer/examples/drawer&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Drawer&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/dropdown/examples/dropdown&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dropdown&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/duallistselector/examples/duallistselector&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dual list selector&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/emptystate/examples/emptystate&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Empty state&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/expandablesection/examples/expandablesection&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Expandable section&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/form/examples/form&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/formcontrol/examples/formcontrol&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form control&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/formselect/examples/formselect&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form select&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/helpertext/examples/helpertext&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Helper text&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/hint/examples/hint&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Hint&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/icon/examples/icon&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Icon&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/inlineedit/examples/inlineedit&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Inline edit&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/inputgroup/examples/inputgroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Input group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/jumplinks/examples/jumplinks&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Jump links&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/label/examples/label&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Label&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/list/examples/list&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;List&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/loginpage/examples/loginpage&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Login page&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/masthead/examples/masthead&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Masthead&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/menu/examples/menu&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Menu&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/menutoggle/examples/menutoggle&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Menu toggle&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/modal/examples/modal&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Modal&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/multiplefileupload/examples/multiplefileupload&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Multiple file upload&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/nav/examples/nav&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Navigation&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/notificationbadge/examples/notificationbadge&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Notification badge&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/notificationdrawer/examples/notificationdrawer&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Notification drawer&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/numberinput/examples/numberinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Number input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/overflowmenu/examples/overflowmenu&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Overflow menu&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/page/examples/page&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Page&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/pagination/examples/pagination&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Pagination&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/panel/examples/panel&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Panel&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/passwordgenerator/examples/passwordgenerator&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Password generator&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/passwordstrength/examples/passwordstrength&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Password strength&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/popover/examples/popover&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Popover&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/progress/examples/progress&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Progress&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/progressstepper/examples/progressstepper&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Progress stepper&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/radio/examples/radio&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Radio&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/searchinput/examples/searchinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Search input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/select/examples/select&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Select&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/sidebar/examples/sidebar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Sidebar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/fileupload/examples/fileupload&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Simple file upload&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/simplelist/examples/simplelist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Simple list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/skeleton/examples/skeleton&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Skeleton&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/skiptocontent/examples/skiptocontent&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Skip to content&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/slider/examples/slider&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Slider&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/spinner/examples/spinner&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Spinner&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/switch/examples/switch&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Switch&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/table/examples/table&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Table&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/tabs/examples/tabs&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tabs&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textarea/examples/textarea&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text area&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textinput/examples/textinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textinputgroup/examples/textinputgroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text input group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/tile/examples/tile&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tile&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/timepicker/examples/timepicker&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Time picker&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/timestamp/examples/timestamp&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Timestamp&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/title/examples/title&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Title&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/togglegroup/examples/togglegroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Toggle group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/toolbar/examples/toolbar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Toolbar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/tooltip/examples/tooltip&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tooltip&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/treeview/examples/treeview&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tree view&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/truncate/examples/truncate&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Truncate&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/wizard/examples/wizard&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Wizard&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;dist/patternfly-docs/quick-starts/design-guidelines/design-guidelines&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Quick starts&quot;],&quot;section&quot;:[0,&quot;extensions&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/layouts/bullseye/examples/bullseye&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Bullseye&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/flex/examples/flex&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Flex&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/gallery/examples/gallery&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Gallery&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/grid/examples/grid&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Grid&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/level/examples/level&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Level&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/split/examples/split&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Split&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/stack/examples/stack&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Stack&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/demos/cardview/examples/cardview&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Card view&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/dashboard/examples/dashboard&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dashboard&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/primarydetail/examples/primarydetail&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Primary-detail&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/utilities/accessibility/examples/accessibility&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Accessibility&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/alignment/examples/alignment&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Alignment&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/backgroundcolor/examples/backgroundcolor&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Background color&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/boxshadow/examples/box-shadow&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Box shadow&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/display/examples/display&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Display&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/flex/examples/flex&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Flex&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/float/examples/float&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Float&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/sizing/examples/sizing&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Sizing&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/spacing/examples/spacing&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Spacing&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/text/examples/text&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}]]]]],&quot;data-astro-transition-scope&quot;:[0,&quot;astro-xikxfxwm-3&quot;]}" ssr client="only" opts="{&quot;name&quot;:&quot;ReactNav&quot;,&quot;value&quot;:&quot;react&quot;}" data-astro-transition-scope="astro-xikxfxwm-3"></astro-island> <div class="pf-v6-c-page__main-container"> <main class="pf-v6-c-page__main"> <section class="pf-v6-c-page__main-section"><div class="pf-v6-c-page__main-body"> <section id="ws-sticky-nav-tabs" class="pf-v6-c-page__main-tabs pf-m-sticky-top"><div class="pf-v6-c-page__main-body"> <div class="pf-v6-c-tabs pf-m-page-insets pf-m-no-border-bottom"> <ul class="pf-v6-c-tabs__list"> <li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/react"> React </a> </li><li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/html"> HTML </a> </li><li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/html-demos"> HTML demos </a> </li> </ul> </div> </div></section><section id="main-content" class="pf-v6-c-page__main-section pf-m-fill"><div class="pf-v6-c-page__main-body"> <p data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1920" data-pf-content="true" class="pf-v6-c-content--p">import ’./Page.css’</p>
46
- <h2 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1921" data-pf-content="true" class="pf-v6-c-content--h2">Demos</h2>
47
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1922" data-pf-content="true" class="pf-v6-c-content--h3">Basic</h3>
48
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1937" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-basic&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
45
+ [data-astro-transition-fallback="new"][data-astro-transition-scope="astro-2e6ke2uy-4"] { animation: none; mix-blend-mode: normal; }</style></head> <body> <div class="pf-v6-c-page"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var l=(n,t)=>{let i=async()=>{await(await n())()},e=typeof t.value=="object"?t.value:void 0,s={timeout:e==null?void 0:e.timeout};"requestIdleCallback"in window?window.requestIdleCallback(i,s):setTimeout(i,s.timeout||200)};(self.Astro||(self.Astro={})).idle=l;window.dispatchEvent(new Event("astro:idle"));})();</script><script>(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>1/0*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><header class="pf-v6-c-masthead pf-m-display-inline-on-md"> <div class="pf-v6-c-masthead__main"> <span class="pf-v6-c-masthead__toggle"> <astro-island uid="qYuJo" prefix="r4" component-url="/_astro/PageToggle.Dnq2xvgl.js" component-export="PageToggle" renderer-url="/_astro/client.DN8ES6L5.js" props="{&quot;data-astro-transition-persist&quot;:[0,&quot;astro-u5p5alki-2&quot;]}" ssr client="idle" opts="{&quot;name&quot;:&quot;PageToggle&quot;,&quot;value&quot;:true}" data-astro-transition-persist="astro-u5p5alki-2" await-children><button id="nav-toggle" aria-expanded="true" aria-label="Global navigation" class="pf-v6-c-button pf-m-plain" type="button" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-310"><span class="pf-v6-c-button__text"><svg class="pf-v6-svg" viewBox="0 0 448 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg></span></button><!--astro:end--></astro-island> </span> <div class="pf-v6-c-masthead__brand"> <a class="pf-v6-c-masthead__logo" tabindex="0" href="/"> <img class="pf-v6-c-brand" style="--pf-v6-c-brand--Height:36px" src="/PF-HorizontalLogo-Color.svg" alt="PatternFly"/> </a> </div> </div> <div class="pf-v6-c-masthead__content"> <astro-island uid="Z2oYIqj" prefix="r6" component-url="/_astro/Toolbar.BmprOKR8.js" component-export="Toolbar" renderer-url="/_astro/client.DN8ES6L5.js" props="{}" ssr client="idle" opts="{&quot;name&quot;:&quot;ReactToolbar&quot;,&quot;value&quot;:true}" await-children><div class="pf-v6-c-toolbar pf-m-static" id="toolbar" data-ouia-component-type="PF6/Toolbar" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Toolbar-104"><div class="pf-v6-c-toolbar__content"><div class="pf-v6-c-toolbar__content-section"><div class="pf-v6-c-toolbar__group pf-m-action-group-plain pf-m-align-end pf-m-gap-none pf-m-gap-md-on-md"><div class="pf-v6-c-toolbar__item"></div><div class="pf-v6-c-toolbar__item"><div class="pf-v6-c-input-group ws-global-search"><div class="pf-v6-c-input-group__item"><button aria-expanded="false" aria-label="Expandable search input toggle" class="pf-v6-c-button pf-m-plain" type="button" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-311"><span class="pf-v6-c-button__icon"><svg class="pf-v6-svg" viewBox="0 0 512 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"></path></svg></span></button></div></div></div><div class="pf-v6-c-toolbar__item"><a href="//github.com/patternfly" target="top" aria-label="PatternFly GitHub page" class="pf-v6-c-button pf-m-plain" data-ouia-component-type="PF6/Button" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Button-plain-312"><span class="pf-v6-c-button__text"><svg class="pf-v6-svg" viewBox="0 0 496 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></span></a></div><div class="pf-v6-c-toolbar__item"><button class="pf-v6-c-menu-toggle" type="button" aria-expanded="false" data-ouia-component-type="PF6/MenuToggle" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-MenuToggle-104"><span class="pf-v6-c-menu-toggle__text">Release 6.1.0</span><span class="pf-v6-c-menu-toggle__controls"><span class="pf-v6-c-menu-toggle__toggle-icon"><svg class="pf-v6-svg" viewBox="0 0 320 512" fill="currentColor" aria-hidden="true" role="img" width="1em" height="1em"><path d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"></path></svg></span></span></button></div></div></div></div><div class="pf-v6-c-toolbar__content pf-m-hidden" hidden=""><div class="pf-v6-c-toolbar__group"></div></div></div><!--astro:end--></astro-island> </div> </header> <script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();</script><astro-island uid="2tEdvJ" component-url="/_astro/Navigation.B03CQhTw.js" component-export="Navigation" renderer-url="/_astro/client.DN8ES6L5.js" props="{&quot;navData&quot;:[1,[[1,[[0,{&quot;id&quot;:[0,&quot;src/components/aboutmodal/examples/aboutmodal&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;About modal&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/accordion/examples/accordion&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Accordion&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/actionlist/examples/actionlist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Action list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/alert/examples/alert&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Alert&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/avatar/examples/avatar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Avatar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backtotop/examples/backtotop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Back to top&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backdrop/examples/backdrop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Backdrop&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/backgroundimage/examples/backgroundimage&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Background image&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/badge/examples/badge&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Badge&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/banner/examples/banner&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Banner&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/brand/examples/brand&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Brand&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/breadcrumb/examples/breadcrumb&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Breadcrumb&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/button/examples/button&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Button&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/calendarmonth/examples/calendarmonth&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Calendar month&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/card/examples/card&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Card&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/checkbox/examples/checkbox&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Checkbox&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/chip/examples/chip&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Chip&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/clipboardcopy/examples/clipboardcopy&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Clipboard copy&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/codeblock/examples/codeblock&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Code block&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/codeeditor/examples/codeeditor&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Code editor&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/content/examples/content&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Content&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/datalist/examples/datalist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Data list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/datepicker/examples/datepicker&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Date picker&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/descriptionlist/examples/descriptionlist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Description list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/divider/examples/divider&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Divider&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/dragdrop/examples/dragdrop&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Drag and drop&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/drawer/examples/drawer&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Drawer&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/dropdown/examples/dropdown&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dropdown&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/duallistselector/examples/duallistselector&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dual list selector&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/emptystate/examples/emptystate&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Empty state&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/expandablesection/examples/expandablesection&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Expandable section&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/form/examples/form&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/formcontrol/examples/formcontrol&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form control&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/formselect/examples/formselect&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Form select&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/helpertext/examples/helpertext&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Helper text&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/hint/examples/hint&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Hint&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/icon/examples/icon&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Icon&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/components/inlineedit/examples/inlineedit&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Inline edit&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/inputgroup/examples/inputgroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Input group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/jumplinks/examples/jumplinks&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Jump links&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/label/examples/label&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Label&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/list/examples/list&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;List&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/loginpage/examples/loginpage&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Login page&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/masthead/examples/masthead&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Masthead&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/menu/examples/menu&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Menu&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/menutoggle/examples/menutoggle&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Menu toggle&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/modal/examples/modal&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Modal&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/multiplefileupload/examples/multiplefileupload&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Multiple file upload&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/nav/examples/nav&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Navigation&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/notificationbadge/examples/notificationbadge&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Notification badge&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/notificationdrawer/examples/notificationdrawer&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Notification drawer&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/numberinput/examples/numberinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Number input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/overflowmenu/examples/overflowmenu&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Overflow menu&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/page/examples/page&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Page&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/pagination/examples/pagination&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Pagination&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/panel/examples/panel&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Panel&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/passwordgenerator/examples/passwordgenerator&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Password generator&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/passwordstrength/examples/passwordstrength&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Password strength&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/popover/examples/popover&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Popover&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/progress/examples/progress&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Progress&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/progressstepper/examples/progressstepper&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Progress stepper&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/radio/examples/radio&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Radio&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/searchinput/examples/searchinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Search input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/select/examples/select&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Select&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/sidebar/examples/sidebar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Sidebar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/fileupload/examples/fileupload&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Simple file upload&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/simplelist/examples/simplelist&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Simple list&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/skeleton/examples/skeleton&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Skeleton&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/skiptocontent/examples/skiptocontent&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Skip to content&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/slider/examples/slider&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Slider&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/spinner/examples/spinner&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Spinner&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/switch/examples/switch&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Switch&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/table/examples/table&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Table&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/tabs/examples/tabs&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tabs&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textarea/examples/textarea&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text area&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textinput/examples/textinput&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text input&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/textinputgroup/examples/textinputgroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text input group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/deprecated/components/tile/examples/tile&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tile&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/timepicker/examples/timepicker&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Time picker&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/timestamp/examples/timestamp&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Timestamp&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/title/examples/title&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Title&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/togglegroup/examples/togglegroup&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Toggle group&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/toolbar/examples/toolbar&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Toolbar&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/tooltip/examples/tooltip&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tooltip&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/treeview/examples/treeview&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Tree view&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/truncate/examples/truncate&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Truncate&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;src/components/wizard/examples/wizard&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Wizard&quot;],&quot;section&quot;:[0,&quot;components&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;dist/patternfly-docs/quick-starts/design-guidelines/design-guidelines&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Quick starts&quot;],&quot;section&quot;:[0,&quot;extensions&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/layouts/bullseye/examples/bullseye&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Bullseye&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/flex/examples/flex&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Flex&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/gallery/examples/gallery&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Gallery&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/grid/examples/grid&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Grid&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/level/examples/level&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Level&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/split/examples/split&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Split&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/layouts/stack/examples/stack&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Stack&quot;],&quot;section&quot;:[0,&quot;layouts&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/demos/cardview/examples/cardview&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Card view&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/dashboard/examples/dashboard&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Dashboard&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/demos/primarydetail/examples/primarydetail&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Primary-detail&quot;],&quot;section&quot;:[0,&quot;patterns&quot;],&quot;sortValue&quot;:[0]}]}]]],[1,[[0,{&quot;id&quot;:[0,&quot;docs/utilities/accessibility/examples/accessibility&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Accessibility&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/alignment/examples/alignment&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Alignment&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/backgroundcolor/examples/backgroundcolor&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Background color&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/boxshadow/examples/box-shadow&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Box shadow&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/display/examples/display&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Display&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/flex/examples/flex&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Flex&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/float/examples/float&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Float&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/sizing/examples/sizing&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Sizing&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/spacing/examples/spacing&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Spacing&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}],[0,{&quot;id&quot;:[0,&quot;docs/utilities/text/examples/text&quot;],&quot;data&quot;:[0,{&quot;id&quot;:[0,&quot;Text&quot;],&quot;section&quot;:[0,&quot;utility-classes&quot;],&quot;sortValue&quot;:[0]}]}]]]]],&quot;data-astro-transition-scope&quot;:[0,&quot;astro-xikxfxwm-3&quot;]}" ssr client="only" opts="{&quot;name&quot;:&quot;ReactNav&quot;,&quot;value&quot;:&quot;react&quot;}" data-astro-transition-scope="astro-xikxfxwm-3"></astro-island> <div class="pf-v6-c-page__main-container"> <main class="pf-v6-c-page__main"> <section class="pf-v6-c-page__main-section"><div class="pf-v6-c-page__main-body"> <section id="ws-sticky-nav-tabs" class="pf-v6-c-page__main-tabs pf-m-sticky-top"><div class="pf-v6-c-page__main-body"> <div class="pf-v6-c-tabs pf-m-page-insets pf-m-no-border-bottom"> <ul class="pf-v6-c-tabs__list"> <li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/react"> React </a> </li><li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/html"> HTML </a> </li><li class="pf-v6-c-tabs__item"> <a class="pf-v6-c-tabs__link" href="/components/page/html-demos"> HTML demos </a> </li> </ul> </div> </div></section><section id="main-content" class="pf-v6-c-page__main-section pf-m-fill"><div class="pf-v6-c-page__main-body"> <p data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1759" data-pf-content="true" class="pf-v6-c-content--p">import ’./Page.css’</p>
46
+ <h2 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1760" data-pf-content="true" class="pf-v6-c-content--h2">Demos</h2>
47
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1761" data-pf-content="true" class="pf-v6-c-content--h3">Basic</h3>
48
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1776" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-basic&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
49
49
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
50
50
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span><span style="color:#B392F0"> href</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;#main-content-page-demo-basic&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
51
51
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">span</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button__text&quot;</span><span style="color:#E1E4E8">&gt;Skip to content&lt;/</span><span style="color:#85E89D">span</span><span style="color:#E1E4E8">&gt;</span></span>
@@ -339,8 +339,8 @@
339
339
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
340
340
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
341
341
  <span class="line"></span></code></pre>
342
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1923" data-pf-content="true" class="pf-v6-c-content--h3">Multiple sidebar body elements</h3>
343
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1938" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;multiple-sidebar-body-elements-demo&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
342
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1762" data-pf-content="true" class="pf-v6-c-content--h3">Multiple sidebar body elements</h3>
343
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1777" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;multiple-sidebar-body-elements-demo&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
344
344
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
345
345
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
346
346
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -655,8 +655,8 @@
655
655
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
656
656
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
657
657
  <span class="line"></span></code></pre>
658
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1924" data-pf-content="true" class="pf-v6-c-content--h3">Sticky horizontal subnav</h3>
659
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1939" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-horizontal-subnav&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
658
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1763" data-pf-content="true" class="pf-v6-c-content--h3">Sticky horizontal subnav</h3>
659
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1778" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-horizontal-subnav&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
660
660
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
661
661
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
662
662
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -1103,8 +1103,8 @@
1103
1103
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1104
1104
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1105
1105
  <span class="line"></span></code></pre>
1106
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1925" data-pf-content="true" class="pf-v6-c-content--h3">Sticky breadcrumb</h3>
1107
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1940" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-breadcrumb&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1106
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1764" data-pf-content="true" class="pf-v6-c-content--h3">Sticky breadcrumb</h3>
1107
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1779" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-breadcrumb&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1108
1108
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1109
1109
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
1110
1110
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -1526,8 +1526,8 @@
1526
1526
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1527
1527
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1528
1528
  <span class="line"></span></code></pre>
1529
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1926" data-pf-content="true" class="pf-v6-c-content--h3">Sticky breadcrumb on medium</h3>
1530
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1941" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-breadcrumb&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1529
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1765" data-pf-content="true" class="pf-v6-c-content--h3">Sticky breadcrumb on medium</h3>
1530
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1780" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-breadcrumb&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1531
1531
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1532
1532
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
1533
1533
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -1949,8 +1949,8 @@
1949
1949
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1950
1950
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
1951
1951
  <span class="line"></span></code></pre>
1952
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1927" data-pf-content="true" class="pf-v6-c-content--h3">Sticky section group</h3>
1953
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1942" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-section-group&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1952
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1766" data-pf-content="true" class="pf-v6-c-content--h3">Sticky section group</h3>
1953
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1781" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-top-section-group&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1954
1954
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
1955
1955
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
1956
1956
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -2372,8 +2372,8 @@
2372
2372
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
2373
2373
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
2374
2374
  <span class="line"></span></code></pre>
2375
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1928" data-pf-content="true" class="pf-v6-c-content--h3">Sticky section bottom</h3>
2376
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1943" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-section-bottom&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2375
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1767" data-pf-content="true" class="pf-v6-c-content--h3">Sticky section bottom</h3>
2376
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1782" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sticky-section-bottom&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2377
2377
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2378
2378
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
2379
2379
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -2800,8 +2800,8 @@
2800
2800
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
2801
2801
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
2802
2802
  <span class="line"></span></code></pre>
2803
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1929" data-pf-content="true" class="pf-v6-c-content--h3">Overflow scroll</h3>
2804
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1944" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-overflow-scroll&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2803
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1768" data-pf-content="true" class="pf-v6-c-content--h3">Overflow scroll</h3>
2804
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1783" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-overflow-scroll&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2805
2805
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
2806
2806
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
2807
2807
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -3230,8 +3230,8 @@
3230
3230
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3231
3231
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3232
3232
  <span class="line"></span></code></pre>
3233
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1930" data-pf-content="true" class="pf-v6-c-content--h3">Centered section</h3>
3234
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1945" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-centered-section&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3233
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1769" data-pf-content="true" class="pf-v6-c-content--h3">Centered section</h3>
3234
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1784" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-centered-section&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3235
3235
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3236
3236
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
3237
3237
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -3518,8 +3518,8 @@
3518
3518
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3519
3519
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3520
3520
  <span class="line"></span></code></pre>
3521
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1931" data-pf-content="true" class="pf-v6-c-content--h3">Context selector in sidebar</h3>
3522
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1946" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-context-selector&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3521
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1770" data-pf-content="true" class="pf-v6-c-content--h3">Context selector in sidebar</h3>
3522
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1785" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-context-selector&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3523
3523
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3524
3524
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
3525
3525
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -3833,8 +3833,8 @@
3833
3833
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3834
3834
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
3835
3835
  <span class="line"></span></code></pre>
3836
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1932" data-pf-content="true" class="pf-v6-c-content--h3">Context selector expanded in sidebar</h3>
3837
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1947" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-context-selector-expanded&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3836
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1771" data-pf-content="true" class="pf-v6-c-content--h3">Context selector expanded in sidebar</h3>
3837
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1786" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-context-selector-expanded&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3838
3838
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
3839
3839
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
3840
3840
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -4184,8 +4184,8 @@
4184
4184
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4185
4185
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4186
4186
  <span class="line"></span></code></pre>
4187
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1933" data-pf-content="true" class="pf-v6-c-content--h3">Sidebar collapsed</h3>
4188
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1948" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sidebar-collapsed&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4187
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1772" data-pf-content="true" class="pf-v6-c-content--h3">Sidebar collapsed</h3>
4188
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1787" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sidebar-collapsed&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4189
4189
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4190
4190
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
4191
4191
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -4482,8 +4482,8 @@
4482
4482
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4483
4483
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4484
4484
  <span class="line"></span></code></pre>
4485
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1934" data-pf-content="true" class="pf-v6-c-content--h3">Sidebar expanded</h3>
4486
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1949" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sidebar-expanded&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4485
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1773" data-pf-content="true" class="pf-v6-c-content--h3">Sidebar expanded</h3>
4486
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1788" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-sidebar-expanded&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4487
4487
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4488
4488
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
4489
4489
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -4780,8 +4780,8 @@
4780
4780
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4781
4781
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
4782
4782
  <span class="line"></span></code></pre>
4783
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1935" data-pf-content="true" class="pf-v6-c-content--h3">No sidebar</h3>
4784
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1950" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page pf-m-no-sidebar&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-no-sidebar&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4783
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1774" data-pf-content="true" class="pf-v6-c-content--h3">No sidebar</h3>
4784
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1789" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page pf-m-no-sidebar&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-no-sidebar&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4785
4785
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-skip-to-content&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
4786
4786
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">a</span></span>
4787
4787
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-button pf-m-primary&quot;</span></span>
@@ -5037,8 +5037,8 @@
5037
5037
  <span class="line"><span style="color:#E1E4E8"> &lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
5038
5038
  <span class="line"><span style="color:#E1E4E8">&lt;/</span><span style="color:#85E89D">div</span><span style="color:#E1E4E8">&gt;</span></span>
5039
5039
  <span class="line"></span></code></pre>
5040
- <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1936" data-pf-content="true" class="pf-v6-c-content--h3">No sidebar or masthead</h3>
5041
- <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1951" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page pf-m-no-sidebar&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-no-sidebar-masthead&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
5040
+ <h3 data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1775" data-pf-content="true" class="pf-v6-c-content--h3">No sidebar or masthead</h3>
5041
+ <pre data-ouia-component-type="PF6/Content" data-ouia-safe="true" data-ouia-component-id="OUIA-Generated-Content-1790" data-pf-content="true" class="pf-v6-c-content--pre"><code><span class="line"><span style="color:#E1E4E8">&lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page pf-m-no-sidebar&quot;</span><span style="color:#B392F0"> id</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;page-demo-no-sidebar-masthead&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
5042
5042
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">div</span><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page__main-container&quot;</span><span style="color:#B392F0"> tabindex</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;-1&quot;</span><span style="color:#E1E4E8">&gt;</span></span>
5043
5043
  <span class="line"><span style="color:#E1E4E8"> &lt;</span><span style="color:#85E89D">main</span></span>
5044
5044
  <span class="line"><span style="color:#B392F0"> class</span><span style="color:#E1E4E8">=</span><span style="color:#9ECBFF">&quot;pf-v6-c-page__main&quot;</span></span>