@patternfly/patternfly 6.5.0-prerelease.54 → 6.5.0-prerelease.55

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 (84) hide show
  1. package/assets/images/compass--hero-bg.png +0 -0
  2. package/assets/images/compass--wallpaper-dark.jpg +0 -0
  3. package/assets/images/compass--wallpaper-light.jpg +0 -0
  4. package/assets/images/glass-brand-dark.jpg +0 -0
  5. package/assets/images/glass-brand-dark.png +0 -0
  6. package/assets/images/glass-brand-light.jpg +0 -0
  7. package/assets/images/glass-brand-light.png +0 -0
  8. package/base/patternfly-variables.css +4238 -784
  9. package/base/patternfly-variables.scss +23 -21
  10. package/base/tokens/tokens-dark.scss +17 -17
  11. package/base/tokens/tokens-default.scss +18 -16
  12. package/base/tokens/tokens-glass-dark.scss +21 -4
  13. package/base/tokens/tokens-glass.scss +17 -4
  14. package/base/tokens/tokens-local.scss +4 -3
  15. package/base/tokens/tokens-palette.scss +1 -1
  16. package/base/tokens/tokens-redhat-dark.scss +432 -2
  17. package/base/tokens/tokens-redhat-glass-dark.scss +432 -4
  18. package/base/tokens/tokens-redhat-glass.scss +748 -4
  19. package/base/tokens/tokens-redhat-highcontrast-dark.scss +400 -3
  20. package/base/tokens/tokens-redhat-highcontrast.scss +635 -3
  21. package/base/tokens/tokens-redhat.scss +786 -2
  22. package/components/Accordion/accordion.css +10 -0
  23. package/components/Accordion/accordion.scss +11 -0
  24. package/components/Button/button.css +0 -14
  25. package/components/Button/button.scss +1 -16
  26. package/components/Card/card.css +13 -0
  27. package/components/Card/card.scss +20 -0
  28. package/components/Compass/compass.css +6 -6
  29. package/components/Compass/compass.scss +6 -6
  30. package/components/DataList/data-list.css +1 -1
  31. package/components/DataList/data-list.scss +1 -0
  32. package/components/Drawer/drawer.css +11 -6
  33. package/components/Drawer/drawer.scss +24 -11
  34. package/components/Login/login.css +7 -3
  35. package/components/Login/login.scss +7 -3
  36. package/components/Masthead/masthead.css +11 -3
  37. package/components/Masthead/masthead.scss +14 -4
  38. package/components/MenuToggle/menu-toggle.scss +1 -1
  39. package/components/Nav/nav.scss +1 -1
  40. package/components/Page/page.css +115 -8
  41. package/components/Page/page.scss +123 -11
  42. package/components/Panel/panel.css +14 -0
  43. package/components/Panel/panel.scss +18 -0
  44. package/components/Table/table-grid.css +4 -4
  45. package/components/Table/table-grid.scss +4 -4
  46. package/components/Table/table.css +12 -7
  47. package/components/Table/table.scss +13 -9
  48. package/components/_index.css +204 -52
  49. package/docs/components/Accordion/examples/Accordion.md +1 -0
  50. package/docs/components/Card/examples/Card.md +1 -0
  51. package/docs/components/DragDrop/examples/DragDrop.css +1 -1
  52. package/docs/components/Page/examples/Page.md +47 -37
  53. package/docs/components/Panel/examples/Panel.md +12 -0
  54. package/docs/demos/AboutModal/examples/AboutModal.md +40 -38
  55. package/docs/demos/Alert/examples/Alert.md +120 -114
  56. package/docs/demos/BackToTop/examples/BackToTop.md +40 -38
  57. package/docs/demos/Banner/examples/Banner.md +80 -76
  58. package/docs/demos/CardView/examples/CardView.md +297 -271
  59. package/docs/demos/Compass/examples/Compass.md +1409 -2732
  60. package/docs/demos/Dashboard/examples/Dashboard.md +40 -38
  61. package/docs/demos/DataList/examples/DataList.md +160 -152
  62. package/docs/demos/DescriptionList/examples/DescriptionList.md +120 -114
  63. package/docs/demos/Drawer/examples/Drawer.md +200 -190
  64. package/docs/demos/JumpLinks/examples/JumpLinks.md +240 -228
  65. package/docs/demos/Masthead/examples/Masthead.md +320 -304
  66. package/docs/demos/Modal/examples/Modal.md +240 -228
  67. package/docs/demos/Nav/examples/Nav.md +2302 -600
  68. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +180 -170
  69. package/docs/demos/Page/examples/Page.md +606 -568
  70. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +280 -266
  71. package/docs/demos/Skeleton/examples/Skeleton.md +40 -38
  72. package/docs/demos/Table/examples/Table.md +640 -604
  73. package/docs/demos/Tabs/examples/Tabs.md +240 -228
  74. package/docs/demos/Toolbar/examples/Toolbar.md +80 -76
  75. package/docs/demos/Wizard/examples/Wizard.md +360 -342
  76. package/package.json +1 -1
  77. package/patternfly-base-no-globals.css +4238 -784
  78. package/patternfly-base.css +4238 -784
  79. package/patternfly-no-globals.css +4356 -733
  80. package/patternfly.css +4356 -733
  81. package/patternfly.min.css +1 -1
  82. package/patternfly.min.css.map +1 -1
  83. package/patternfly.scss +27 -0
  84. package/sass-utilities/scss-variables.scss +1 -1
@@ -195,172 +195,174 @@ section: patterns
195
195
  </div>
196
196
  </header>
197
197
  <div class="pf-v6-c-page__sidebar">
198
- <div class="pf-v6-c-page__sidebar-body">
199
- <nav
200
- class="pf-v6-c-nav"
201
- id="card-view-basic-example-expandable-nav"
202
- aria-label="Global"
203
- >
204
- <ul class="pf-v6-c-nav__list" role="list">
205
- <li class="pf-v6-c-nav__item pf-m-expanded">
206
- <button
207
- class="pf-v6-c-nav__link"
208
- aria-expanded="true"
209
- id="card-view-basic-example-expandable-nav-link1"
210
- >
211
- <span class="pf-v6-c-nav__link-text">System panel</span>
212
- <span class="pf-v6-c-nav__toggle">
213
- <span class="pf-v6-c-nav__toggle-icon">
214
- <svg
215
- class="pf-v6-svg"
216
- viewBox="0 0 20 20"
217
- fill="currentColor"
218
- aria-hidden="true"
219
- role="img"
220
- width="1em"
221
- height="1em"
222
- >
223
- <path
224
- d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
225
- />
226
- </svg>
198
+ <div class="pf-v6-c-page__sidebar-main">
199
+ <div class="pf-v6-c-page__sidebar-body">
200
+ <nav
201
+ class="pf-v6-c-nav"
202
+ id="card-view-basic-example-expandable-nav"
203
+ aria-label="Global"
204
+ >
205
+ <ul class="pf-v6-c-nav__list" role="list">
206
+ <li class="pf-v6-c-nav__item pf-m-expanded">
207
+ <button
208
+ class="pf-v6-c-nav__link"
209
+ aria-expanded="true"
210
+ id="card-view-basic-example-expandable-nav-link1"
211
+ >
212
+ <span class="pf-v6-c-nav__link-text">System panel</span>
213
+ <span class="pf-v6-c-nav__toggle">
214
+ <span class="pf-v6-c-nav__toggle-icon">
215
+ <svg
216
+ class="pf-v6-svg"
217
+ viewBox="0 0 20 20"
218
+ fill="currentColor"
219
+ aria-hidden="true"
220
+ role="img"
221
+ width="1em"
222
+ height="1em"
223
+ >
224
+ <path
225
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
226
+ />
227
+ </svg>
228
+ </span>
227
229
  </span>
228
- </span>
229
- </button>
230
- <section
231
- class="pf-v6-c-nav__subnav"
232
- aria-labelledby="card-view-basic-example-expandable-nav-link1"
233
- >
234
- <ul class="pf-v6-c-nav__list" role="list">
235
- <li class="pf-v6-c-nav__item">
236
- <a href="#" class="pf-v6-c-nav__link">
237
- <span class="pf-v6-c-nav__link-text">Overview</span>
238
- </a>
239
- </li>
240
- <li class="pf-v6-c-nav__item">
241
- <a
242
- href="#"
243
- class="pf-v6-c-nav__link pf-m-current"
244
- aria-current="page"
245
- >
246
- <span class="pf-v6-c-nav__link-text">Resource usage</span>
247
- </a>
248
- </li>
249
- <li class="pf-v6-c-nav__item">
250
- <a href="#" class="pf-v6-c-nav__link">
251
- <span class="pf-v6-c-nav__link-text">Hypervisors</span>
252
- </a>
253
- </li>
254
- <li class="pf-v6-c-nav__item">
255
- <a href="#" class="pf-v6-c-nav__link">
256
- <span class="pf-v6-c-nav__link-text">Instances</span>
257
- </a>
258
- </li>
259
- <li class="pf-v6-c-nav__item">
260
- <a href="#" class="pf-v6-c-nav__link">
261
- <span class="pf-v6-c-nav__link-text">Volumes</span>
262
- </a>
263
- </li>
264
- <li class="pf-v6-c-nav__item">
265
- <a href="#" class="pf-v6-c-nav__link">
266
- <span class="pf-v6-c-nav__link-text">Networks</span>
267
- </a>
268
- </li>
269
- </ul>
270
- </section>
271
- </li>
272
- <li class="pf-v6-c-nav__item">
273
- <button
274
- class="pf-v6-c-nav__link"
275
- aria-expanded="false"
276
- id="card-view-basic-example-expandable-nav-link2"
277
- >
278
- <span class="pf-v6-c-nav__link-text">Policy</span>
279
- <span class="pf-v6-c-nav__toggle">
280
- <span class="pf-v6-c-nav__toggle-icon">
281
- <svg
282
- class="pf-v6-svg"
283
- viewBox="0 0 20 20"
284
- fill="currentColor"
285
- aria-hidden="true"
286
- role="img"
287
- width="1em"
288
- height="1em"
289
- >
290
- <path
291
- d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
292
- />
293
- </svg>
230
+ </button>
231
+ <section
232
+ class="pf-v6-c-nav__subnav"
233
+ aria-labelledby="card-view-basic-example-expandable-nav-link1"
234
+ >
235
+ <ul class="pf-v6-c-nav__list" role="list">
236
+ <li class="pf-v6-c-nav__item">
237
+ <a href="#" class="pf-v6-c-nav__link">
238
+ <span class="pf-v6-c-nav__link-text">Overview</span>
239
+ </a>
240
+ </li>
241
+ <li class="pf-v6-c-nav__item">
242
+ <a
243
+ href="#"
244
+ class="pf-v6-c-nav__link pf-m-current"
245
+ aria-current="page"
246
+ >
247
+ <span class="pf-v6-c-nav__link-text">Resource usage</span>
248
+ </a>
249
+ </li>
250
+ <li class="pf-v6-c-nav__item">
251
+ <a href="#" class="pf-v6-c-nav__link">
252
+ <span class="pf-v6-c-nav__link-text">Hypervisors</span>
253
+ </a>
254
+ </li>
255
+ <li class="pf-v6-c-nav__item">
256
+ <a href="#" class="pf-v6-c-nav__link">
257
+ <span class="pf-v6-c-nav__link-text">Instances</span>
258
+ </a>
259
+ </li>
260
+ <li class="pf-v6-c-nav__item">
261
+ <a href="#" class="pf-v6-c-nav__link">
262
+ <span class="pf-v6-c-nav__link-text">Volumes</span>
263
+ </a>
264
+ </li>
265
+ <li class="pf-v6-c-nav__item">
266
+ <a href="#" class="pf-v6-c-nav__link">
267
+ <span class="pf-v6-c-nav__link-text">Networks</span>
268
+ </a>
269
+ </li>
270
+ </ul>
271
+ </section>
272
+ </li>
273
+ <li class="pf-v6-c-nav__item">
274
+ <button
275
+ class="pf-v6-c-nav__link"
276
+ aria-expanded="false"
277
+ id="card-view-basic-example-expandable-nav-link2"
278
+ >
279
+ <span class="pf-v6-c-nav__link-text">Policy</span>
280
+ <span class="pf-v6-c-nav__toggle">
281
+ <span class="pf-v6-c-nav__toggle-icon">
282
+ <svg
283
+ class="pf-v6-svg"
284
+ viewBox="0 0 20 20"
285
+ fill="currentColor"
286
+ aria-hidden="true"
287
+ role="img"
288
+ width="1em"
289
+ height="1em"
290
+ >
291
+ <path
292
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
293
+ />
294
+ </svg>
295
+ </span>
294
296
  </span>
295
- </span>
296
- </button>
297
- <section
298
- class="pf-v6-c-nav__subnav"
299
- aria-labelledby="card-view-basic-example-expandable-nav-link2"
300
- hidden
301
- inert
302
- >
303
- <ul class="pf-v6-c-nav__list" role="list">
304
- <li class="pf-v6-c-nav__item">
305
- <a href="#" class="pf-v6-c-nav__link">
306
- <span class="pf-v6-c-nav__link-text">Subnav link 1</span>
307
- </a>
308
- </li>
309
- <li class="pf-v6-c-nav__item">
310
- <a href="#" class="pf-v6-c-nav__link">
311
- <span class="pf-v6-c-nav__link-text">Subnav link 2</span>
312
- </a>
313
- </li>
314
- </ul>
315
- </section>
316
- </li>
317
- <li class="pf-v6-c-nav__item">
318
- <button
319
- class="pf-v6-c-nav__link"
320
- aria-expanded="false"
321
- id="card-view-basic-example-expandable-nav-link3"
322
- >
323
- <span class="pf-v6-c-nav__link-text">Authentication</span>
324
- <span class="pf-v6-c-nav__toggle">
325
- <span class="pf-v6-c-nav__toggle-icon">
326
- <svg
327
- class="pf-v6-svg"
328
- viewBox="0 0 20 20"
329
- fill="currentColor"
330
- aria-hidden="true"
331
- role="img"
332
- width="1em"
333
- height="1em"
334
- >
335
- <path
336
- d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
337
- />
338
- </svg>
297
+ </button>
298
+ <section
299
+ class="pf-v6-c-nav__subnav"
300
+ aria-labelledby="card-view-basic-example-expandable-nav-link2"
301
+ hidden
302
+ inert
303
+ >
304
+ <ul class="pf-v6-c-nav__list" role="list">
305
+ <li class="pf-v6-c-nav__item">
306
+ <a href="#" class="pf-v6-c-nav__link">
307
+ <span class="pf-v6-c-nav__link-text">Subnav link 1</span>
308
+ </a>
309
+ </li>
310
+ <li class="pf-v6-c-nav__item">
311
+ <a href="#" class="pf-v6-c-nav__link">
312
+ <span class="pf-v6-c-nav__link-text">Subnav link 2</span>
313
+ </a>
314
+ </li>
315
+ </ul>
316
+ </section>
317
+ </li>
318
+ <li class="pf-v6-c-nav__item">
319
+ <button
320
+ class="pf-v6-c-nav__link"
321
+ aria-expanded="false"
322
+ id="card-view-basic-example-expandable-nav-link3"
323
+ >
324
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
325
+ <span class="pf-v6-c-nav__toggle">
326
+ <span class="pf-v6-c-nav__toggle-icon">
327
+ <svg
328
+ class="pf-v6-svg"
329
+ viewBox="0 0 20 20"
330
+ fill="currentColor"
331
+ aria-hidden="true"
332
+ role="img"
333
+ width="1em"
334
+ height="1em"
335
+ >
336
+ <path
337
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
338
+ />
339
+ </svg>
340
+ </span>
339
341
  </span>
340
- </span>
341
- </button>
342
- <section
343
- class="pf-v6-c-nav__subnav"
344
- aria-labelledby="card-view-basic-example-expandable-nav-link3"
345
- hidden
346
- inert
347
- >
348
- <ul class="pf-v6-c-nav__list" role="list">
349
- <li class="pf-v6-c-nav__item">
350
- <a href="#" class="pf-v6-c-nav__link">
351
- <span class="pf-v6-c-nav__link-text">Subnav link 1</span>
352
- </a>
353
- </li>
354
- <li class="pf-v6-c-nav__item">
355
- <a href="#" class="pf-v6-c-nav__link">
356
- <span class="pf-v6-c-nav__link-text">Subnav link 2</span>
357
- </a>
358
- </li>
359
- </ul>
360
- </section>
361
- </li>
362
- </ul>
363
- </nav>
342
+ </button>
343
+ <section
344
+ class="pf-v6-c-nav__subnav"
345
+ aria-labelledby="card-view-basic-example-expandable-nav-link3"
346
+ hidden
347
+ inert
348
+ >
349
+ <ul class="pf-v6-c-nav__list" role="list">
350
+ <li class="pf-v6-c-nav__item">
351
+ <a href="#" class="pf-v6-c-nav__link">
352
+ <span class="pf-v6-c-nav__link-text">Subnav link 1</span>
353
+ </a>
354
+ </li>
355
+ <li class="pf-v6-c-nav__item">
356
+ <a href="#" class="pf-v6-c-nav__link">
357
+ <span class="pf-v6-c-nav__link-text">Subnav link 2</span>
358
+ </a>
359
+ </li>
360
+ </ul>
361
+ </section>
362
+ </li>
363
+ </ul>
364
+ </nav>
365
+ </div>
364
366
  </div>
365
367
  </div>
366
368
  <div class="pf-v6-c-page__main-container" tabindex="-1">
@@ -680,7 +682,7 @@ section: patterns
680
682
  </div>
681
683
  </div>
682
684
  <div
683
- class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
685
+ class="pf-v6-c-card pf-m-selectable-raised pf-m-secondary pf-m-compact"
684
686
  id="card-view-basic-example-gallery-card-1"
685
687
  >
686
688
  <div class="pf-v6-c-card__header">
@@ -813,69 +815,59 @@ section: patterns
813
815
  class="pf-v6-c-card__body"
814
816
  >This documentation page covers the Apache Spark component for the Apache Camel.</div>
815
817
  </div>
818
+ </div>
819
+ </div>
820
+ </section>
821
+ <section class="pf-v6-c-page__main-section pf-m-secondary">
822
+ <div class="pf-v6-c-page__main-body">
823
+ <div class="pf-v6-l-gallery pf-m-gutter">
816
824
  <div
817
825
  class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
818
- id="card-view-basic-example-gallery-card-4"
826
+ id="card-view-basic-example-gallery-card-empty-state"
819
827
  >
820
- <div class="pf-v6-c-card__header">
821
- <img
822
- src="/assets/images/camel-avro_200x150.png"
823
- width="60px"
824
- alt="Logo"
825
- />
826
- <div class="pf-v6-c-card__actions">
827
- <button
828
- class="pf-v6-c-menu-toggle pf-m-plain"
829
- type="button"
830
- aria-expanded="false"
831
- aria-label="Menu toggle"
832
- id="card-view-basic-example-gallery-card-4-toggle"
833
- >
834
- <span class="pf-v6-c-menu-toggle__icon">
835
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
836
- </span>
837
- </button>
838
- <div class="pf-v6-c-check pf-m-standalone">
839
- <input
840
- class="pf-v6-c-check__input"
841
- type="checkbox"
842
- id="card-view-basic-example-gallery-card-4-check"
843
- name="card-view-basic-example-gallery-card-4-check"
844
- aria-labelledby="card-view-basic-example-gallery-card-4-check-label"
845
- />
828
+ <div class="pf-v6-l-bullseye">
829
+ <div class="pf-v6-c-empty-state pf-m-xs">
830
+ <div class="pf-v6-c-empty-state__content">
831
+ <div class="pf-v6-c-empty-state__icon">
832
+ <svg
833
+ class="pf-v6-svg"
834
+ viewBox="0 0 32 32"
835
+ fill="currentColor"
836
+ aria-hidden="true"
837
+ role="img"
838
+ width="1em"
839
+ height="1em"
840
+ >
841
+ <path
842
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7 16.125h-5.875V23a1.125 1.125 0 0 1-2.25 0v-5.875H9a1.125 1.125 0 0 1 0-2.25h5.875V9a1.125 1.125 0 0 1 2.25 0v5.875H23a1.125 1.125 0 0 1 0 2.25Z"
843
+ />
844
+ </svg>
845
+ </div>
846
+ <div class="pf-v6-c-card__title">
847
+ <h2
848
+ class="pf-v6-c-card__title-text pf-m-md"
849
+ >Add a new card to your page</h2>
850
+ </div>
851
+ <button class="pf-v6-c-button pf-m-link" type="button">
852
+ <span class="pf-v6-c-button__text">Add card</span>
853
+ </button>
846
854
  </div>
847
855
  </div>
848
856
  </div>
849
- <div class="pf-v6-c-card__title">
850
- <h2
851
- class="pf-v6-c-card__title-text"
852
- id="card-view-basic-example-gallery-card-4-check-label"
853
- >Avro</h2>
854
- <div class="pf-v6-c-content">
855
- <small>Provided by Red Hat</small>
856
- </div>
857
- </div>
858
- <div
859
- class="pf-v6-c-card__body"
860
- >This component provides a dataformat for avro, which allows serialization and deserialization of messages using Apache Avro’s binary dataformat. Moreover, it provides support for Apache Avro’s rpc, by providing producers and consumers endpoint for using avro over netty or http.</div>
861
857
  </div>
862
858
  <div
863
- class="pf-v6-c-card pf-m-selectable-raised pf-m-selected-raised pf-m-compact"
864
- id="card-view-basic-example-gallery-card-5"
859
+ class="pf-v6-c-card pf-m-selectable-raised pf-m-secondary pf-m-compact"
860
+ id="card-view-basic-example-gallery-card-1"
865
861
  >
866
862
  <div class="pf-v6-c-card__header">
867
- <img
868
- src="/assets/images/FuseConnector_Icons_AzureServices.png"
869
- width="60px"
870
- alt="Logo"
871
- />
863
+ <img src="/assets/images/PF-IconLogo.svg" alt="PatternFly logo" />
872
864
  <div class="pf-v6-c-card__actions">
873
865
  <button
874
866
  class="pf-v6-c-menu-toggle pf-m-plain"
875
867
  type="button"
876
868
  aria-expanded="false"
877
869
  aria-label="Menu toggle"
878
- id="card-view-basic-example-gallery-card-5-toggle"
870
+ id="card-view-basic-example-gallery-card-1-toggle"
879
871
  >
880
872
  <span class="pf-v6-c-menu-toggle__icon">
881
873
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -885,9 +877,9 @@ section: patterns
885
877
  <input
886
878
  class="pf-v6-c-check__input"
887
879
  type="checkbox"
888
- id="card-view-basic-example-gallery-card-5-check"
889
- name="card-view-basic-example-gallery-card-5-check"
890
- aria-labelledby="card-view-basic-example-gallery-card-5-check-label"
880
+ id="card-view-basic-example-gallery-card-1-check"
881
+ name="card-view-basic-example-gallery-card-1-check"
882
+ aria-labelledby="card-view-basic-example-gallery-card-1-check-label"
891
883
  />
892
884
  </div>
893
885
  </div>
@@ -895,23 +887,23 @@ section: patterns
895
887
  <div class="pf-v6-c-card__title">
896
888
  <h2
897
889
  class="pf-v6-c-card__title-text"
898
- id="card-view-basic-example-gallery-card-5-check-label"
899
- >Azure Services</h2>
890
+ id="card-view-basic-example-gallery-card-1-check-label"
891
+ >Patternfly</h2>
900
892
  <div class="pf-v6-c-content">
901
893
  <small>Provided by Red Hat</small>
902
894
  </div>
903
895
  </div>
904
896
  <div
905
897
  class="pf-v6-c-card__body"
906
- >The Camel Components for Windows Azure Services provide connectivity to Azure services from Camel.</div>
898
+ >PatternFly is a community project that promotes design commonality and improves user experience.</div>
907
899
  </div>
908
900
  <div
909
- class="pf-v6-c-card pf-m-non-selectable-raised pf-m-compact"
910
- id="card-view-basic-example-gallery-card-6"
901
+ class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
902
+ id="card-view-basic-example-gallery-card-2"
911
903
  >
912
904
  <div class="pf-v6-c-card__header">
913
905
  <img
914
- src="/assets/images/camel-saxon_200x150.png"
906
+ src="/assets/images/activemq-core_200x150.png"
915
907
  width="60px"
916
908
  alt="Logo"
917
909
  />
@@ -921,7 +913,7 @@ section: patterns
921
913
  type="button"
922
914
  aria-expanded="false"
923
915
  aria-label="Menu toggle"
924
- id="card-view-basic-example-gallery-card-6-toggle"
916
+ id="card-view-basic-example-gallery-card-2-toggle"
925
917
  >
926
918
  <span class="pf-v6-c-menu-toggle__icon">
927
919
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -931,10 +923,9 @@ section: patterns
931
923
  <input
932
924
  class="pf-v6-c-check__input"
933
925
  type="checkbox"
934
- id="card-view-basic-example-gallery-card-6-check"
935
- name="card-view-basic-example-gallery-card-6-check"
936
- disabled
937
- aria-labelledby="card-view-basic-example-gallery-card-6-check-label"
926
+ id="card-view-basic-example-gallery-card-2-check"
927
+ name="card-view-basic-example-gallery-card-2-check"
928
+ aria-labelledby="card-view-basic-example-gallery-card-2-check-label"
938
929
  />
939
930
  </div>
940
931
  </div>
@@ -942,23 +933,23 @@ section: patterns
942
933
  <div class="pf-v6-c-card__title">
943
934
  <h2
944
935
  class="pf-v6-c-card__title-text"
945
- id="card-view-basic-example-gallery-card-6-check-label"
946
- >Crypto</h2>
936
+ id="card-view-basic-example-gallery-card-2-check-label"
937
+ >ActiveMq</h2>
947
938
  <div class="pf-v6-c-content">
948
939
  <small>Provided by Red Hat</small>
949
940
  </div>
950
941
  </div>
951
942
  <div
952
943
  class="pf-v6-c-card__body"
953
- >For providing flexible endpoints to sign and verify exchanges using the Signature Service of the Java Cryptographic Extension.</div>
944
+ >The ActiveMQ component allows messages to be sent to a JMS Queue or Topic; or messages to be consumed from a JMS Queue or Topic using Apache ActiveMQ.</div>
954
945
  </div>
955
946
  <div
956
947
  class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
957
- id="card-view-basic-example-gallery-card-7"
948
+ id="card-view-basic-example-gallery-card-3"
958
949
  >
959
950
  <div class="pf-v6-c-card__header">
960
951
  <img
961
- src="/assets/images/camel-dropbox_200x150.png"
952
+ src="/assets/images/camel-spark_200x150.png"
962
953
  width="60px"
963
954
  alt="Logo"
964
955
  />
@@ -968,7 +959,7 @@ section: patterns
968
959
  type="button"
969
960
  aria-expanded="false"
970
961
  aria-label="Menu toggle"
971
- id="card-view-basic-example-gallery-card-7-toggle"
962
+ id="card-view-basic-example-gallery-card-3-toggle"
972
963
  >
973
964
  <span class="pf-v6-c-menu-toggle__icon">
974
965
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -978,9 +969,9 @@ section: patterns
978
969
  <input
979
970
  class="pf-v6-c-check__input"
980
971
  type="checkbox"
981
- id="card-view-basic-example-gallery-card-7-check"
982
- name="card-view-basic-example-gallery-card-7-check"
983
- aria-labelledby="card-view-basic-example-gallery-card-7-check-label"
972
+ id="card-view-basic-example-gallery-card-3-check"
973
+ name="card-view-basic-example-gallery-card-3-check"
974
+ aria-labelledby="card-view-basic-example-gallery-card-3-check-label"
984
975
  />
985
976
  </div>
986
977
  </div>
@@ -988,33 +979,69 @@ section: patterns
988
979
  <div class="pf-v6-c-card__title">
989
980
  <h2
990
981
  class="pf-v6-c-card__title-text"
991
- id="card-view-basic-example-gallery-card-7-check-label"
992
- >DropBox</h2>
982
+ id="card-view-basic-example-gallery-card-3-check-label"
983
+ >Apache Spark</h2>
993
984
  <div class="pf-v6-c-content">
994
985
  <small>Provided by Red Hat</small>
995
986
  </div>
996
987
  </div>
997
988
  <div
998
989
  class="pf-v6-c-card__body"
999
- >The dropbox: component allows you to treat Dropbox remote folders as a producer or consumer of messages.</div>
990
+ >This documentation page covers the Apache Spark component for the Apache Camel.</div>
1000
991
  </div>
992
+ </div>
993
+ </div>
994
+ </section>
995
+ <section class="pf-v6-c-page__main-section">
996
+ <div class="pf-v6-c-page__main-body">
997
+ <div class="pf-v6-l-gallery pf-m-gutter">
1001
998
  <div
1002
999
  class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
1003
- id="card-view-basic-example-gallery-card-8"
1000
+ id="card-view-basic-example-gallery-card-empty-state"
1001
+ >
1002
+ <div class="pf-v6-l-bullseye">
1003
+ <div class="pf-v6-c-empty-state pf-m-xs">
1004
+ <div class="pf-v6-c-empty-state__content">
1005
+ <div class="pf-v6-c-empty-state__icon">
1006
+ <svg
1007
+ class="pf-v6-svg"
1008
+ viewBox="0 0 32 32"
1009
+ fill="currentColor"
1010
+ aria-hidden="true"
1011
+ role="img"
1012
+ width="1em"
1013
+ height="1em"
1014
+ >
1015
+ <path
1016
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7 16.125h-5.875V23a1.125 1.125 0 0 1-2.25 0v-5.875H9a1.125 1.125 0 0 1 0-2.25h5.875V9a1.125 1.125 0 0 1 2.25 0v5.875H23a1.125 1.125 0 0 1 0 2.25Z"
1017
+ />
1018
+ </svg>
1019
+ </div>
1020
+ <div class="pf-v6-c-card__title">
1021
+ <h2
1022
+ class="pf-v6-c-card__title-text pf-m-md"
1023
+ >Add a new card to your page</h2>
1024
+ </div>
1025
+ <button class="pf-v6-c-button pf-m-link" type="button">
1026
+ <span class="pf-v6-c-button__text">Add card</span>
1027
+ </button>
1028
+ </div>
1029
+ </div>
1030
+ </div>
1031
+ </div>
1032
+ <div
1033
+ class="pf-v6-c-card pf-m-selectable-raised pf-m-secondary pf-m-compact"
1034
+ id="card-view-basic-example-gallery-card-1"
1004
1035
  >
1005
1036
  <div class="pf-v6-c-card__header">
1006
- <img
1007
- src="/assets/images/camel-infinispan_200x150.png"
1008
- width="60px"
1009
- alt="Logo"
1010
- />
1037
+ <img src="/assets/images/PF-IconLogo.svg" alt="PatternFly logo" />
1011
1038
  <div class="pf-v6-c-card__actions">
1012
1039
  <button
1013
1040
  class="pf-v6-c-menu-toggle pf-m-plain"
1014
1041
  type="button"
1015
1042
  aria-expanded="false"
1016
1043
  aria-label="Menu toggle"
1017
- id="card-view-basic-example-gallery-card-8-toggle"
1044
+ id="card-view-basic-example-gallery-card-1-toggle"
1018
1045
  >
1019
1046
  <span class="pf-v6-c-menu-toggle__icon">
1020
1047
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1024,9 +1051,9 @@ section: patterns
1024
1051
  <input
1025
1052
  class="pf-v6-c-check__input"
1026
1053
  type="checkbox"
1027
- id="card-view-basic-example-gallery-card-8-check"
1028
- name="card-view-basic-example-gallery-card-8-check"
1029
- aria-labelledby="card-view-basic-example-gallery-card-8-check-label"
1054
+ id="card-view-basic-example-gallery-card-1-check"
1055
+ name="card-view-basic-example-gallery-card-1-check"
1056
+ aria-labelledby="card-view-basic-example-gallery-card-1-check-label"
1030
1057
  />
1031
1058
  </div>
1032
1059
  </div>
@@ -1034,23 +1061,23 @@ section: patterns
1034
1061
  <div class="pf-v6-c-card__title">
1035
1062
  <h2
1036
1063
  class="pf-v6-c-card__title-text"
1037
- id="card-view-basic-example-gallery-card-8-check-label"
1038
- >JBoss Data Grid</h2>
1064
+ id="card-view-basic-example-gallery-card-1-check-label"
1065
+ >Patternfly</h2>
1039
1066
  <div class="pf-v6-c-content">
1040
1067
  <small>Provided by Red Hat</small>
1041
1068
  </div>
1042
1069
  </div>
1043
1070
  <div
1044
1071
  class="pf-v6-c-card__body"
1045
- >Read or write to a fully-supported distributed cache and data grid for faster integration services.</div>
1072
+ >PatternFly is a community project that promotes design commonality and improves user experience.</div>
1046
1073
  </div>
1047
1074
  <div
1048
1075
  class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
1049
- id="card-view-basic-example-gallery-card-9"
1076
+ id="card-view-basic-example-gallery-card-2"
1050
1077
  >
1051
1078
  <div class="pf-v6-c-card__header">
1052
1079
  <img
1053
- src="/assets/images/FuseConnector_Icons_REST.png"
1080
+ src="/assets/images/activemq-core_200x150.png"
1054
1081
  width="60px"
1055
1082
  alt="Logo"
1056
1083
  />
@@ -1060,7 +1087,7 @@ section: patterns
1060
1087
  type="button"
1061
1088
  aria-expanded="false"
1062
1089
  aria-label="Menu toggle"
1063
- id="card-view-basic-example-gallery-card-9-toggle"
1090
+ id="card-view-basic-example-gallery-card-2-toggle"
1064
1091
  >
1065
1092
  <span class="pf-v6-c-menu-toggle__icon">
1066
1093
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1070,9 +1097,9 @@ section: patterns
1070
1097
  <input
1071
1098
  class="pf-v6-c-check__input"
1072
1099
  type="checkbox"
1073
- id="card-view-basic-example-gallery-card-9-check"
1074
- name="card-view-basic-example-gallery-card-9-check"
1075
- aria-labelledby="card-view-basic-example-gallery-card-9-check-label"
1100
+ id="card-view-basic-example-gallery-card-2-check"
1101
+ name="card-view-basic-example-gallery-card-2-check"
1102
+ aria-labelledby="card-view-basic-example-gallery-card-2-check-label"
1076
1103
  />
1077
1104
  </div>
1078
1105
  </div>
@@ -1080,24 +1107,23 @@ section: patterns
1080
1107
  <div class="pf-v6-c-card__title">
1081
1108
  <h2
1082
1109
  class="pf-v6-c-card__title-text"
1083
- id="card-view-basic-example-gallery-card-9-check-label"
1084
- >Rest</h2>
1110
+ id="card-view-basic-example-gallery-card-2-check-label"
1111
+ >ActiveMq</h2>
1085
1112
  <div class="pf-v6-c-content">
1086
1113
  <small>Provided by Red Hat</small>
1087
1114
  </div>
1088
1115
  </div>
1089
- <div class="pf-v6-c-card__body">
1090
- The rest component allows to define REST endpoints (consumer) using the Rest DSL and plugin to other Camel components as the REST transport.
1091
- From Camel 2.18 onwards the rest component can also be used as a client (producer) to call REST services.
1092
- </div>
1116
+ <div
1117
+ class="pf-v6-c-card__body"
1118
+ >The ActiveMQ component allows messages to be sent to a JMS Queue or Topic; or messages to be consumed from a JMS Queue or Topic using Apache ActiveMQ.</div>
1093
1119
  </div>
1094
1120
  <div
1095
1121
  class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
1096
- id="card-view-basic-example-gallery-card-10"
1122
+ id="card-view-basic-example-gallery-card-3"
1097
1123
  >
1098
1124
  <div class="pf-v6-c-card__header">
1099
1125
  <img
1100
- src="/assets/images/camel-swagger-java_200x150.png"
1126
+ src="/assets/images/camel-spark_200x150.png"
1101
1127
  width="60px"
1102
1128
  alt="Logo"
1103
1129
  />
@@ -1107,7 +1133,7 @@ section: patterns
1107
1133
  type="button"
1108
1134
  aria-expanded="false"
1109
1135
  aria-label="Menu toggle"
1110
- id="card-view-basic-example-gallery-card-10-toggle"
1136
+ id="card-view-basic-example-gallery-card-3-toggle"
1111
1137
  >
1112
1138
  <span class="pf-v6-c-menu-toggle__icon">
1113
1139
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1117,9 +1143,9 @@ section: patterns
1117
1143
  <input
1118
1144
  class="pf-v6-c-check__input"
1119
1145
  type="checkbox"
1120
- id="card-view-basic-example-gallery-card-10-check"
1121
- name="card-view-basic-example-gallery-card-10-check"
1122
- aria-labelledby="card-view-basic-example-gallery-card-10-check-label"
1146
+ id="card-view-basic-example-gallery-card-3-check"
1147
+ name="card-view-basic-example-gallery-card-3-check"
1148
+ aria-labelledby="card-view-basic-example-gallery-card-3-check-label"
1123
1149
  />
1124
1150
  </div>
1125
1151
  </div>
@@ -1127,15 +1153,15 @@ section: patterns
1127
1153
  <div class="pf-v6-c-card__title">
1128
1154
  <h2
1129
1155
  class="pf-v6-c-card__title-text"
1130
- id="card-view-basic-example-gallery-card-10-check-label"
1131
- >SWAGGER</h2>
1156
+ id="card-view-basic-example-gallery-card-3-check-label"
1157
+ >Apache Spark</h2>
1132
1158
  <div class="pf-v6-c-content">
1133
1159
  <small>Provided by Red Hat</small>
1134
1160
  </div>
1135
1161
  </div>
1136
1162
  <div
1137
1163
  class="pf-v6-c-card__body"
1138
- >Expose REST services and their APIs using Swagger specification.</div>
1164
+ >This documentation page covers the Apache Spark component for the Apache Camel.</div>
1139
1165
  </div>
1140
1166
  </div>
1141
1167
  </div>