@patternfly/quickstarts 6.0.0-alpha.6 → 6.0.0-prerelease.2

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 (22) hide show
  1. package/dist/index.es.js +7 -10
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +7 -10
  4. package/dist/index.js.map +1 -1
  5. package/dist/patternfly-docs/quick-starts/design-guidelines/design-guidelines.md +122 -50
  6. package/dist/patternfly-global.css +1499 -5
  7. package/dist/patternfly-nested.css +622 -2413
  8. package/dist/quickstarts-full.es.js +371 -399
  9. package/dist/quickstarts-full.es.js.map +1 -1
  10. package/dist/quickstarts-standalone.css +5 -5
  11. package/dist/quickstarts-standalone.min.css +2 -6
  12. package/dist/quickstarts-vendor.css +44 -0
  13. package/dist/quickstarts.css +45 -1
  14. package/dist/quickstarts.min.css +1 -1
  15. package/package.json +11 -11
  16. package/src/catalog/QuickStartCatalog.tsx +1 -1
  17. package/src/catalog/QuickStartTile.tsx +3 -8
  18. package/src/catalog/QuickStartTileHeader.tsx +9 -13
  19. package/src/catalog/__tests__/QuickStartTile.spec.tsx +0 -1
  20. package/src/controller/QuickStartFooter.tsx +1 -0
  21. package/src/controller/QuickStartTaskHeaderList.tsx +2 -2
  22. package/src/controller/QuickStartTasks.tsx +1 -1
package/dist/quickstarts-vendor.css CHANGED
@@ -1,3 +1,30 @@
1
+ .pf-v6-c-clipboard-copy {
2
+ --pf-v6-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
3
+ --pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
4
+ --pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart: var(--pf-t--global--spacer--xs);
5
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
6
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
8
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
9
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
10
+ --pf-v6-c-clipboard-copy__expandable-content--BorderBlockStartWidth: var(--pf-t--global--border--width--control--default);
11
+ --pf-v6-c-clipboard-copy__expandable-content--BorderInlineEndWidth: var(--pf-t--global--border--width--control--default);
12
+ --pf-v6-c-clipboard-copy__expandable-content--BorderBlockEndWidth: var(--pf-t--global--border--width--control--default);
13
+ --pf-v6-c-clipboard-copy__expandable-content--BorderInlineStartWidth: var(--pf-t--global--border--width--control--default);
14
+ --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--default);
15
+ --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
16
+ --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
17
+ --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
18
+ --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
19
+ --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
20
+ --pf-v6-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
21
+ --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
22
+ --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--compact);
23
+ --pf-v6-c-clipboard-copy__actions-item--button--Color: var(--pf-t--global--icon--color--subtle);
24
+ --pf-v6-c-clipboard-copy__actions-item--button--hover--Color: var(--pf-t--global--icon--color--regular);
25
+ --pf-v6-c-clipboard-copy__text--m-code--FontFamily: var(--pf-t--global--font--family--mono);
26
+ --pf-v6-c-clipboard-copy__text--m-code--FontSize: var(--pf-t--global--font--size--body--default);
27
+ }
1
28
  .pf-v6-c-clipboard-copy.pf-m-inline {
2
29
  display: inline;
3
30
  padding-inline-start: var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart);
@@ -25,6 +52,23 @@
25
52
  --pf-v6-c-button--m-plain--hover__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
26
53
  }
27
54
 
55
+ .pf-v6-c-code-block {
56
+ --pf-v6-c-code-block--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
57
+ --pf-v6-c-code-block--BorderRadius: var(--pf-t--global--border--radius--medium);
58
+ --pf-v6-c-code-block__header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
59
+ --pf-v6-c-code-block__header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
60
+ --pf-v6-c-code-block__header--PaddingBlockStart: var(--pf-t--global--spacer--xs);
61
+ --pf-v6-c-code-block__header--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
62
+ --pf-v6-c-code-block__header--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
63
+ --pf-v6-c-code-block__header--PaddingInlineStart: var(--pf-t--global--spacer--sm);
64
+ --pf-v6-c-code-block__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
65
+ --pf-v6-c-code-block__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
66
+ --pf-v6-c-code-block__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
67
+ --pf-v6-c-code-block__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
68
+ --pf-v6-c-code-block__pre--FontFamily: var(--pf-t--global--font--family--mono);
69
+ --pf-v6-c-code-block__pre--FontSize: var(--pf-t--global--font--size--xs);
70
+ }
71
+
28
72
  .pf-v6-c-code-block {
29
73
  background-color: var(--pf-v6-c-code-block--BackgroundColor);
30
74
  border-radius: var(--pf-v6-c-code-block--BorderRadius);
package/dist/quickstarts.css CHANGED
@@ -207,7 +207,34 @@ button.pf-v6-c-wizard__nav-link::before {
207
207
  font-size: var(--pf-t--global--font--size--body--default);
208
208
  color: var(--pf-t--global--text--color--subtle);
209
209
  font-weight: var(--pf-t--global--font--weight--body);
210
- }.pf-v6-c-clipboard-copy.pf-m-inline {
210
+ }.pf-v6-c-clipboard-copy {
211
+ --pf-v6-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
212
+ --pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
213
+ --pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart: var(--pf-t--global--spacer--xs);
214
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
215
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
216
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
217
+ --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
218
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
219
+ --pf-v6-c-clipboard-copy__expandable-content--BorderBlockStartWidth: var(--pf-t--global--border--width--control--default);
220
+ --pf-v6-c-clipboard-copy__expandable-content--BorderInlineEndWidth: var(--pf-t--global--border--width--control--default);
221
+ --pf-v6-c-clipboard-copy__expandable-content--BorderBlockEndWidth: var(--pf-t--global--border--width--control--default);
222
+ --pf-v6-c-clipboard-copy__expandable-content--BorderInlineStartWidth: var(--pf-t--global--border--width--control--default);
223
+ --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--default);
224
+ --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
225
+ --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
226
+ --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
227
+ --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
228
+ --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
229
+ --pf-v6-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
230
+ --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--gap--action-to-action--plain);
231
+ --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--compact);
232
+ --pf-v6-c-clipboard-copy__actions-item--button--Color: var(--pf-t--global--icon--color--subtle);
233
+ --pf-v6-c-clipboard-copy__actions-item--button--hover--Color: var(--pf-t--global--icon--color--regular);
234
+ --pf-v6-c-clipboard-copy__text--m-code--FontFamily: var(--pf-t--global--font--family--mono);
235
+ --pf-v6-c-clipboard-copy__text--m-code--FontSize: var(--pf-t--global--font--size--body--default);
236
+ }
237
+ .pf-v6-c-clipboard-copy.pf-m-inline {
211
238
  display: inline;
212
239
  padding-inline-start: var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart);
213
240
  padding-inline-end: var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd);
@@ -234,6 +261,23 @@ button.pf-v6-c-wizard__nav-link::before {
234
261
  --pf-v6-c-button--m-plain--hover__icon--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
235
262
  }
236
263
 
264
+ .pf-v6-c-code-block {
265
+ --pf-v6-c-code-block--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
266
+ --pf-v6-c-code-block--BorderRadius: var(--pf-t--global--border--radius--medium);
267
+ --pf-v6-c-code-block__header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
268
+ --pf-v6-c-code-block__header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
269
+ --pf-v6-c-code-block__header--PaddingBlockStart: var(--pf-t--global--spacer--xs);
270
+ --pf-v6-c-code-block__header--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
271
+ --pf-v6-c-code-block__header--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
272
+ --pf-v6-c-code-block__header--PaddingInlineStart: var(--pf-t--global--spacer--sm);
273
+ --pf-v6-c-code-block__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
274
+ --pf-v6-c-code-block__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
275
+ --pf-v6-c-code-block__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
276
+ --pf-v6-c-code-block__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
277
+ --pf-v6-c-code-block__pre--FontFamily: var(--pf-t--global--font--family--mono);
278
+ --pf-v6-c-code-block__pre--FontSize: var(--pf-t--global--font--size--xs);
279
+ }
280
+
237
281
  .pf-v6-c-code-block {
238
282
  background-color: var(--pf-v6-c-code-block--BackgroundColor);
239
283
  border-radius: var(--pf-v6-c-code-block--BorderRadius);
package/dist/quickstarts.min.css CHANGED
@@ -1 +1 @@
1
- .pfext-quick-start-panel{--pf-v6-c-drawer__panel--PaddingBlockStart:0}.pfext-popover__base ul{list-style-type:var(--pf-t--global--list-style)}.pfext-markdown-view .h1,.pfext-markdown-view .h2,.pfext-markdown-view .h3,.pfext-markdown-view .h4,.pfext-markdown-view .h5,.pfext-markdown-view .h6,.pfext-markdown-view h1,.pfext-markdown-view h2,.pfext-markdown-view h3,.pfext-markdown-view h4,.pfext-markdown-view h5,.pfext-markdown-view h6{font-family:var(--pf-t--global--font--family--heading);font-weight:var(--pf-t--global--font--weight--heading);line-height:1.1;color:inherit}.pfext-markdown-view .h1,.pfext-markdown-view .h2,.pfext-markdown-view .h3,.pfext-markdown-view h1,.pfext-markdown-view h2,.pfext-markdown-view h3{margin-top:23px;margin-bottom:11.5px}.pfext-markdown-view .h4,.pfext-markdown-view .h5,.pfext-markdown-view .h6,.pfext-markdown-view h4,.pfext-markdown-view h5,.pfext-markdown-view h6{margin-top:11.5px;margin-bottom:11.5px}.pfext-markdown-view .h1,.pfext-markdown-view h1{font-size:var(--pf-t--global--font--size--heading--h1)}.pfext-markdown-view .h2,.pfext-markdown-view h2{font-size:var(--pf-t--global--font--size--heading--h2)}.pfext-markdown-view .h3,.pfext-markdown-view h3{font-size:var(--pf-t--global--font--size--heading--h3)}.pfext-markdown-view .h4,.pfext-markdown-view h4{font-size:var(--pf-t--global--font--size--heading--h4)}.pfext-markdown-view .h5,.pfext-markdown-view h5{font-size:var(--pf-t--global--font--size--heading--h5)}.pfext-markdown-view .h6,.pfext-markdown-view h6{font-size:var(--pf-t--global--font--size--heading--h6)}.pfext-markdown-view p{margin:0 0 11.5px}.pfext-markdown-view ol,.pfext-markdown-view ul{margin-top:0;margin-bottom:11.5px}.pfext-markdown-view ol ol,.pfext-markdown-view ol ul,.pfext-markdown-view ul ol,.pfext-markdown-view ul ul{margin-bottom:0}.pfext-markdown-view dl{margin-top:0;margin-bottom:23px}.pfext-markdown-view dd,.pfext-markdown-view dt{line-height:1.66666667}.pfext-markdown-view dt{font-weight:700}.pfext-markdown-view dd{margin-left:0}.pfext-markdown-view blockquote{padding:11.5px 23px;margin:0 0 23px;font-size:17.5px;border-left:5px solid #f1f1f1}.pfext-markdown-view blockquote ol:last-child,.pfext-markdown-view blockquote p:last-child,.pfext-markdown-view blockquote ul:last-child{margin-bottom:0}.pfext-markdown-view code,.pfext-markdown-view pre{font-family:Menlo,Monaco,Consolas,monospace}.pfext-markdown-view code{padding:2px 4px;font-size:90%;color:#004368;background-color:#def3ff;border-radius:1px}.pfext-markdown-view pre{display:block;padding:11px;margin:0 0 11.5px;font-size:13px;line-height:1.66666667;color:#363636;word-break:break-all;word-wrap:break-word;background-color:#fafafa;border:1px solid #ccc;border-radius:1px}.pfext-markdown-view pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}.pfext-markdown-view table{background-color:transparent}.pfext-markdown-view table col[class*=col-]{position:static;display:table-column;float:none}.pfext-markdown-view table td[class*=col-],.pfext-markdown-view table th[class*=col-]{position:static;display:table-cell;float:none}.pfext-markdown-view caption{padding-top:10px;padding-bottom:10px;color:#9c9c9c;text-align:left}.pfext-markdown-view th{text-align:left}.pfext-quick-start-panel-content{background-color:var(--pf-t--global--color--brand--default);color:var(--pf-t--global--text--color--inverse);padding:var(--pf-t--global--spacer--md) var(--pf-t--global--spacer--lg)}.pfext-quick-start-panel-content__body{display:flex;flex-direction:column}.pfext-quick-start-panel-content__close-button button.pf-v6-c-button{--pf-v6-c-button--Color:var(--pf-t--global--text--color--inverse)}.pf-v6-theme-dark .pfext-catalog-item-icon__img{filter:brightness(1.5) invert(1) hue-rotate(180deg) saturate(4)}.pf-v6-c-card__header-main .pf-v6-c-icon__content{display:contents}.pf-v6-c-card.pf-m-clickable::before,.pf-v6-c-card.pf-m-selectable::before{border:var(--pf-v6-c-card--BorderColor) var(--pf-v6-c-card--BorderStyle) var(--pf-v6-c-card--BorderWidth)!important}.pfext-quick-start-footer{padding-top:var(--pf-t--global--spacer--md)}.pfext-quick-start-task{flex:1 1 0;overflow:auto}.pfext-quick-start-task .pf-v6-c-accordion,.pfext-quick-start-task .pf-v6-c-alert,.pfext-quick-start-task .pf-v6-c-code-block{margin-block-end:var(--pf-v6-c-content--MarginBlockEnd)}button.pf-v6-c-wizard__nav-link{margin-bottom:var(--pf-t--global--spacer--md)}button.pf-v6-c-wizard__nav-link.pf-m-current{--pf-v6-c-wizard__nav-link-main--BackgroundColor:transparent}button.pf-v6-c-wizard__nav-link::before{background-color:var(--pf-v6-c-wizard__nav-link--m-current--before--BackgroundColor);color:var(--pf-v6-c-wizard__nav-link--m-current--before--Color);min-width:var(--pf-v6-c-wizard__nav-link--before--Width)}.pfext-quick-start-task-header button::before{content:none}.pfext-quick-start-task-header__title{font-family:var(--pf-t--global--font--family--body);font-weight:var(---pf-t--global--font--weight--body--bold);font-size:var(--pf-t--global--font--size--body--lg)}.pfext-quick-start-task-header__subtitle{font-size:var(--pf-t--global--font--size--body--default);color:var(--pf-t--global--text--color--subtle);font-weight:var(--pf-t--global--font--weight--body)}.pfext-quick-start-task-header__tryagain{display:block;font-size:var(--pf-t--global--font--size--body--default);color:var(--pf-t--global--text--color--subtle);font-weight:var(--pf-t--global--font--weight--body)}.pf-v6-c-clipboard-copy.pf-m-inline{display:inline;padding-inline-start:var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd);white-space:nowrap;background-color:var(--pf-v6-c-clipboard-copy--m-inline--BackgroundColor)}.pf-v6-c-clipboard-copy.pf-m-inline.pf-m-block{display:block}.pf-v6-c-clipboard-copy__text{word-break:break-word;white-space:normal}.pf-v6-c-clipboard-copy__actions{display:inline-flex;gap:var(--pf-v6-c-clipboard-copy__actions--Gap);margin-inline-start:var(--pf-v6-c-clipboard-copy__actions--MarginInlineStart)}.pf-v6-c-clipboard-copy__actions-item .pf-v6-c-button.pf-m-plain{--pf-v6-c-button--m-plain__icon--Color:var(--pf-v6-c-clipboard-copy__actions-item--button--Color);--pf-v6-c-button--m-plain--hover__icon--Color:var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color)}.pf-v6-c-code-block{background-color:var(--pf-v6-c-code-block--BackgroundColor);border-radius:var(--pf-v6-c-code-block--BorderRadius)}.pf-v6-c-code-block__header{display:flex;padding-block-start:var(--pf-v6-c-code-block__header--PaddingBlockStart);padding-block-end:var(--pf-v6-c-code-block__header--PaddingBlockEnd);padding-inline-start:var(--pf-v6-c-code-block__header--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-code-block__header--PaddingInlineEnd);border-block-end:var(--pf-v6-c-code-block__header--BorderBlockEndWidth) solid var(--pf-v6-c-code-block__header--BorderBlockEndColor)}.pf-v6-c-code-block__actions{display:flex;margin-inline-start:auto}.pf-v6-c-code-block__content{padding-block-start:var(--pf-v6-c-code-block__content--PaddingBlockStart);padding-block-end:var(--pf-v6-c-code-block__content--PaddingBlockEnd);padding-inline-start:var(--pf-v6-c-code-block__content--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-code-block__content--PaddingInlineEnd)}.pf-v6-c-code-block__pre{font-family:var(--pf-v6-c-code-block__pre--FontFamily);font-size:var(--pf-v6-c-code-block__pre--FontSize);overflow-wrap:break-word;white-space:pre-wrap}.pf-v6-c-code-block__code{font-family:var(--pf-v6-c-code-block__code--FontFamily,inherit)}
1
+ .pfext-quick-start-panel{--pf-v6-c-drawer__panel--PaddingBlockStart:0}.pfext-popover__base ul{list-style-type:var(--pf-t--global--list-style)}.pfext-markdown-view .h1,.pfext-markdown-view .h2,.pfext-markdown-view .h3,.pfext-markdown-view .h4,.pfext-markdown-view .h5,.pfext-markdown-view .h6,.pfext-markdown-view h1,.pfext-markdown-view h2,.pfext-markdown-view h3,.pfext-markdown-view h4,.pfext-markdown-view h5,.pfext-markdown-view h6{font-family:var(--pf-t--global--font--family--heading);font-weight:var(--pf-t--global--font--weight--heading);line-height:1.1;color:inherit}.pfext-markdown-view .h1,.pfext-markdown-view .h2,.pfext-markdown-view .h3,.pfext-markdown-view h1,.pfext-markdown-view h2,.pfext-markdown-view h3{margin-top:23px;margin-bottom:11.5px}.pfext-markdown-view .h4,.pfext-markdown-view .h5,.pfext-markdown-view .h6,.pfext-markdown-view h4,.pfext-markdown-view h5,.pfext-markdown-view h6{margin-top:11.5px;margin-bottom:11.5px}.pfext-markdown-view .h1,.pfext-markdown-view h1{font-size:var(--pf-t--global--font--size--heading--h1)}.pfext-markdown-view .h2,.pfext-markdown-view h2{font-size:var(--pf-t--global--font--size--heading--h2)}.pfext-markdown-view .h3,.pfext-markdown-view h3{font-size:var(--pf-t--global--font--size--heading--h3)}.pfext-markdown-view .h4,.pfext-markdown-view h4{font-size:var(--pf-t--global--font--size--heading--h4)}.pfext-markdown-view .h5,.pfext-markdown-view h5{font-size:var(--pf-t--global--font--size--heading--h5)}.pfext-markdown-view .h6,.pfext-markdown-view h6{font-size:var(--pf-t--global--font--size--heading--h6)}.pfext-markdown-view p{margin:0 0 11.5px}.pfext-markdown-view ol,.pfext-markdown-view ul{margin-top:0;margin-bottom:11.5px}.pfext-markdown-view ol ol,.pfext-markdown-view ol ul,.pfext-markdown-view ul ol,.pfext-markdown-view ul ul{margin-bottom:0}.pfext-markdown-view dl{margin-top:0;margin-bottom:23px}.pfext-markdown-view dd,.pfext-markdown-view dt{line-height:1.66666667}.pfext-markdown-view dt{font-weight:700}.pfext-markdown-view dd{margin-left:0}.pfext-markdown-view blockquote{padding:11.5px 23px;margin:0 0 23px;font-size:17.5px;border-left:5px solid #f1f1f1}.pfext-markdown-view blockquote ol:last-child,.pfext-markdown-view blockquote p:last-child,.pfext-markdown-view blockquote ul:last-child{margin-bottom:0}.pfext-markdown-view code,.pfext-markdown-view pre{font-family:Menlo,Monaco,Consolas,monospace}.pfext-markdown-view code{padding:2px 4px;font-size:90%;color:#004368;background-color:#def3ff;border-radius:1px}.pfext-markdown-view pre{display:block;padding:11px;margin:0 0 11.5px;font-size:13px;line-height:1.66666667;color:#363636;word-break:break-all;word-wrap:break-word;background-color:#fafafa;border:1px solid #ccc;border-radius:1px}.pfext-markdown-view pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}.pfext-markdown-view table{background-color:transparent}.pfext-markdown-view table col[class*=col-]{position:static;display:table-column;float:none}.pfext-markdown-view table td[class*=col-],.pfext-markdown-view table th[class*=col-]{position:static;display:table-cell;float:none}.pfext-markdown-view caption{padding-top:10px;padding-bottom:10px;color:#9c9c9c;text-align:left}.pfext-markdown-view th{text-align:left}.pfext-quick-start-panel-content{background-color:var(--pf-t--global--color--brand--default);color:var(--pf-t--global--text--color--inverse);padding:var(--pf-t--global--spacer--md) var(--pf-t--global--spacer--lg)}.pfext-quick-start-panel-content__body{display:flex;flex-direction:column}.pfext-quick-start-panel-content__close-button button.pf-v6-c-button{--pf-v6-c-button--Color:var(--pf-t--global--text--color--inverse)}.pf-v6-theme-dark .pfext-catalog-item-icon__img{filter:brightness(1.5) invert(1) hue-rotate(180deg) saturate(4)}.pf-v6-c-card__header-main .pf-v6-c-icon__content{display:contents}.pf-v6-c-card.pf-m-clickable::before,.pf-v6-c-card.pf-m-selectable::before{border:var(--pf-v6-c-card--BorderColor) var(--pf-v6-c-card--BorderStyle) var(--pf-v6-c-card--BorderWidth)!important}.pfext-quick-start-footer{padding-top:var(--pf-t--global--spacer--md)}.pfext-quick-start-task{flex:1 1 0;overflow:auto}.pfext-quick-start-task .pf-v6-c-accordion,.pfext-quick-start-task .pf-v6-c-alert,.pfext-quick-start-task .pf-v6-c-code-block{margin-block-end:var(--pf-v6-c-content--MarginBlockEnd)}button.pf-v6-c-wizard__nav-link{margin-bottom:var(--pf-t--global--spacer--md)}button.pf-v6-c-wizard__nav-link.pf-m-current{--pf-v6-c-wizard__nav-link-main--BackgroundColor:transparent}button.pf-v6-c-wizard__nav-link::before{background-color:var(--pf-v6-c-wizard__nav-link--m-current--before--BackgroundColor);color:var(--pf-v6-c-wizard__nav-link--m-current--before--Color);min-width:var(--pf-v6-c-wizard__nav-link--before--Width)}.pfext-quick-start-task-header button::before{content:none}.pfext-quick-start-task-header__title{font-family:var(--pf-t--global--font--family--body);font-weight:var(---pf-t--global--font--weight--body--bold);font-size:var(--pf-t--global--font--size--body--lg)}.pfext-quick-start-task-header__subtitle{font-size:var(--pf-t--global--font--size--body--default);color:var(--pf-t--global--text--color--subtle);font-weight:var(--pf-t--global--font--weight--body)}.pfext-quick-start-task-header__tryagain{display:block;font-size:var(--pf-t--global--font--size--body--default);color:var(--pf-t--global--text--color--subtle);font-weight:var(--pf-t--global--font--weight--body)}.pf-v6-c-clipboard-copy{--pf-v6-c-clipboard-copy__toggle-icon--Transition:.2s ease-in 0s;--pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate:90deg;--pf-v6-c-clipboard-copy__expandable-content--MarginBlockStart:var(--pf-t--global--spacer--xs);--pf-v6-c-clipboard-copy__expandable-content--PaddingBlockStart:var(--pf-t--global--spacer--md);--pf-v6-c-clipboard-copy__expandable-content--PaddingInlineEnd:var(--pf-t--global--spacer--md);--pf-v6-c-clipboard-copy__expandable-content--PaddingBlockEnd:var(--pf-t--global--spacer--md);--pf-v6-c-clipboard-copy__expandable-content--PaddingInlineStart:var(--pf-t--global--spacer--md);--pf-v6-c-clipboard-copy__expandable-content--BackgroundColor:var(--pf-t--global--background--color--primary--default);--pf-v6-c-clipboard-copy__expandable-content--BorderBlockStartWidth:var(--pf-t--global--border--width--control--default);--pf-v6-c-clipboard-copy__expandable-content--BorderInlineEndWidth:var(--pf-t--global--border--width--control--default);--pf-v6-c-clipboard-copy__expandable-content--BorderBlockEndWidth:var(--pf-t--global--border--width--control--default);--pf-v6-c-clipboard-copy__expandable-content--BorderInlineStartWidth:var(--pf-t--global--border--width--control--default);--pf-v6-c-clipboard-copy__expandable-content--BorderColor:var(--pf-t--global--border--color--default);--pf-v6-c-clipboard-copy__expandable-content--BorderRadius:var(--pf-t--global--border--radius--small);--pf-v6-c-clipboard-copy__expandable-content--OutlineOffset:var(--pf-t--global--spacer--xs);--pf-v6-c-clipboard-copy__group--Gap:var(--pf-t--global--spacer--gap--control-to-control--default);--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart:var(--pf-t--global--spacer--xs);--pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd:var(--pf-t--global--spacer--xs);--pf-v6-c-clipboard-copy--m-inline--BackgroundColor:var(--pf-t--global--background--color--secondary--default);--pf-v6-c-clipboard-copy__actions--Gap:var(--pf-t--global--spacer--gap--action-to-action--plain);--pf-v6-c-clipboard-copy__actions--MarginInlineStart:var(--pf-t--global--spacer--gap--text-to-element--compact);--pf-v6-c-clipboard-copy__actions-item--button--Color:var(--pf-t--global--icon--color--subtle);--pf-v6-c-clipboard-copy__actions-item--button--hover--Color:var(--pf-t--global--icon--color--regular);--pf-v6-c-clipboard-copy__text--m-code--FontFamily:var(--pf-t--global--font--family--mono);--pf-v6-c-clipboard-copy__text--m-code--FontSize:var(--pf-t--global--font--size--body--default)}.pf-v6-c-clipboard-copy.pf-m-inline{display:inline;padding-inline-start:var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd);white-space:nowrap;background-color:var(--pf-v6-c-clipboard-copy--m-inline--BackgroundColor)}.pf-v6-c-clipboard-copy.pf-m-inline.pf-m-block{display:block}.pf-v6-c-clipboard-copy__text{word-break:break-word;white-space:normal}.pf-v6-c-clipboard-copy__actions{display:inline-flex;gap:var(--pf-v6-c-clipboard-copy__actions--Gap);margin-inline-start:var(--pf-v6-c-clipboard-copy__actions--MarginInlineStart)}.pf-v6-c-clipboard-copy__actions-item .pf-v6-c-button.pf-m-plain{--pf-v6-c-button--m-plain__icon--Color:var(--pf-v6-c-clipboard-copy__actions-item--button--Color);--pf-v6-c-button--m-plain--hover__icon--Color:var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color)}.pf-v6-c-code-block{--pf-v6-c-code-block--BackgroundColor:var(--pf-t--global--background--color--secondary--default);--pf-v6-c-code-block--BorderRadius:var(--pf-t--global--border--radius--medium);--pf-v6-c-code-block__header--BorderBlockEndWidth:var(--pf-t--global--border--width--divider--default);--pf-v6-c-code-block__header--BorderBlockEndColor:var(--pf-t--global--border--color--default);--pf-v6-c-code-block__header--PaddingBlockStart:var(--pf-t--global--spacer--xs);--pf-v6-c-code-block__header--PaddingBlockEnd:var(--pf-t--global--spacer--xs);--pf-v6-c-code-block__header--PaddingInlineEnd:var(--pf-t--global--spacer--sm);--pf-v6-c-code-block__header--PaddingInlineStart:var(--pf-t--global--spacer--sm);--pf-v6-c-code-block__content--PaddingBlockStart:var(--pf-t--global--spacer--md);--pf-v6-c-code-block__content--PaddingInlineEnd:var(--pf-t--global--spacer--md);--pf-v6-c-code-block__content--PaddingBlockEnd:var(--pf-t--global--spacer--md);--pf-v6-c-code-block__content--PaddingInlineStart:var(--pf-t--global--spacer--md);--pf-v6-c-code-block__pre--FontFamily:var(--pf-t--global--font--family--mono);--pf-v6-c-code-block__pre--FontSize:var(--pf-t--global--font--size--xs)}.pf-v6-c-code-block{background-color:var(--pf-v6-c-code-block--BackgroundColor);border-radius:var(--pf-v6-c-code-block--BorderRadius)}.pf-v6-c-code-block__header{display:flex;padding-block-start:var(--pf-v6-c-code-block__header--PaddingBlockStart);padding-block-end:var(--pf-v6-c-code-block__header--PaddingBlockEnd);padding-inline-start:var(--pf-v6-c-code-block__header--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-code-block__header--PaddingInlineEnd);border-block-end:var(--pf-v6-c-code-block__header--BorderBlockEndWidth) solid var(--pf-v6-c-code-block__header--BorderBlockEndColor)}.pf-v6-c-code-block__actions{display:flex;margin-inline-start:auto}.pf-v6-c-code-block__content{padding-block-start:var(--pf-v6-c-code-block__content--PaddingBlockStart);padding-block-end:var(--pf-v6-c-code-block__content--PaddingBlockEnd);padding-inline-start:var(--pf-v6-c-code-block__content--PaddingInlineStart);padding-inline-end:var(--pf-v6-c-code-block__content--PaddingInlineEnd)}.pf-v6-c-code-block__pre{font-family:var(--pf-v6-c-code-block__pre--FontFamily);font-size:var(--pf-v6-c-code-block__pre--FontSize);overflow-wrap:break-word;white-space:pre-wrap}.pf-v6-c-code-block__code{font-family:var(--pf-v6-c-code-block__code--FontFamily,inherit)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/quickstarts",
3
- "version": "6.0.0-alpha.6",
3
+ "version": "6.0.0-prerelease.2",
4
4
  "description": "PatternFly quick starts",
5
5
  "files": [
6
6
  "src",
@@ -11,7 +11,7 @@
11
11
  "types": "dist/index.d.ts",
12
12
  "publishConfig": {
13
13
  "access": "public",
14
- "tag": "alpha"
14
+ "tag": "prerelease"
15
15
  },
16
16
  "repository": {
17
17
  "type": "git",
@@ -45,7 +45,7 @@
45
45
  "docs:copy": "mkdir -p dist/patternfly-docs && cp -R patternfly-docs/content/extensions/quick-starts dist/patternfly-docs"
46
46
  },
47
47
  "peerDependencies": {
48
- "@patternfly/react-core": "6.0.0-alpha.100",
48
+ "@patternfly/react-core": "6.0.0-prerelease.21",
49
49
  "react": ">=18.0.0",
50
50
  "react-dom": ">=18.0.0",
51
51
  "showdown": ">=2.1.0"
@@ -55,14 +55,14 @@
55
55
  "history": "^5.0.0"
56
56
  },
57
57
  "devDependencies": {
58
- "@patternfly/documentation-framework": "6.0.0-alpha.64",
59
- "@patternfly/patternfly": "6.0.0-alpha.205",
60
- "@patternfly/react-icons": "6.0.0-alpha.35",
61
- "@patternfly/react-styles": "6.0.0-alpha.34",
62
- "@patternfly/react-tokens": "6.0.0-alpha.34",
63
- "@patternfly/react-table": "6.0.0-alpha.101",
64
- "@patternfly/react-code-editor": "6.0.0-alpha.100",
65
- "@patternfly/react-core": "6.0.0-alpha.100",
58
+ "@patternfly/documentation-framework": "6.0.0-alpha.108",
59
+ "@patternfly/patternfly": "6.0.0-prerelease.15",
60
+ "@patternfly/react-icons": "6.0.0-prerelease.7",
61
+ "@patternfly/react-styles": "6.0.0-prerelease.6",
62
+ "@patternfly/react-tokens": "6.0.0-prerelease.7",
63
+ "@patternfly/react-table": "6.0.0-prerelease.22",
64
+ "@patternfly/react-code-editor": "6.0.0-prerelease.21",
65
+ "@patternfly/react-core": "6.0.0-prerelease.21",
66
66
  "@rollup/plugin-commonjs": "^17.0.0",
67
67
  "@rollup/plugin-json": "^4.1.0",
68
68
  "@rollup/plugin-node-resolve": "^11.1.0",
package/src/catalog/QuickStartCatalog.tsx CHANGED
@@ -15,7 +15,7 @@ const QuickStartCatalog: React.FC<QuickStartCatalogProps> = ({ quickStarts }) =>
15
15
 
16
16
  return (
17
17
  <div>
18
- <Gallery hasGutter>
18
+ <Gallery hasGutter className="pfext-quick-start-catalog__gallery">
19
19
  {quickStarts.map((quickStart, index) => {
20
20
  const {
21
21
  metadata: { name: id },
package/src/catalog/QuickStartTile.tsx CHANGED
@@ -20,7 +20,7 @@ import {
20
20
  ButtonProps,
21
21
  Flex,
22
22
  Stack,
23
- Label
23
+ Label,
24
24
  } from '@patternfly/react-core';
25
25
  import OutlinedClockIcon from '@patternfly/react-icons/dist/js/icons/outlined-clock-icon';
26
26
  import { StatusIcon } from '@console/shared';
@@ -65,7 +65,6 @@ const QuickStartTile: React.FC<QuickStartTileProps> = ({
65
65
  const { setActiveQuickStart, footer, getResource } =
66
66
  React.useContext<QuickStartContextValues>(QuickStartContext);
67
67
 
68
-
69
68
  const statusColorMap = {
70
69
  [QuickStartStatus.COMPLETE]: 'green',
71
70
  [QuickStartStatus.IN_PROGRESS]: 'purple',
@@ -153,11 +152,7 @@ const QuickStartTile: React.FC<QuickStartTileProps> = ({
153
152
  {quickStartIcon}
154
153
  </CardHeader>
155
154
  <CardTitle>
156
- <QuickStartTileHeader
157
- name={displayName}
158
- onSelect={onSelect}
159
- quickStartId={id}
160
- />
155
+ <QuickStartTileHeader name={displayName} onSelect={onSelect} quickStartId={id} />
161
156
  </CardTitle>
162
157
  <CardBody>
163
158
  <Stack hasGutter>
@@ -174,7 +169,7 @@ const QuickStartTile: React.FC<QuickStartTileProps> = ({
174
169
  {status !== QuickStartStatus.NOT_STARTED && (
175
170
  <Label
176
171
  variant="outline"
177
- color={statusColorMap[status] as "green" | "purple" | "grey"}
172
+ color={statusColorMap[status] as 'green' | 'purple' | 'grey'}
178
173
  icon={<StatusIcon status={status} />}
179
174
  data-test="status"
180
175
  >
package/src/catalog/QuickStartTileHeader.tsx CHANGED
@@ -1,6 +1,5 @@
1
1
  import * as React from 'react';
2
2
  import { Button, Flex, Title } from '@patternfly/react-core';
3
- import QuickStartMarkdownView from '../QuickStartMarkdownView';
4
3
 
5
4
  interface QuickStartTileHeaderProps {
6
5
  name: string;
@@ -12,17 +11,14 @@ const QuickStartTileHeader: React.FC<QuickStartTileHeaderProps> = ({
12
11
  name,
13
12
  quickStartId,
14
13
  onSelect,
15
- }) => {
16
-
17
- return (
18
- <Flex flexWrap={{ default: 'nowrap' }}>
19
- <Title headingLevel="h3" data-test="title" id={quickStartId}>
20
- <Button variant="link" isInline onClick={onSelect}>
21
- <QuickStartMarkdownView content={name} />
22
- </Button>
23
- </Title>
24
- </Flex>
25
- );
26
- };
14
+ }) => (
15
+ <Flex flexWrap={{ default: 'nowrap' }}>
16
+ <Title headingLevel="h3" data-test="title" id={quickStartId}>
17
+ <Button variant="link" isInline onClick={onSelect}>
18
+ {name}
19
+ </Button>
20
+ </Title>
21
+ </Flex>
22
+ );
27
23
 
28
24
  export default QuickStartTileHeader;
package/src/catalog/__tests__/QuickStartTile.spec.tsx CHANGED
@@ -19,7 +19,6 @@ describe('QuickStartTile', () => {
19
19
  );
20
20
  const catalogTile = wrapper.find(Card);
21
21
  expect(catalogTile.exists()).toBeTruthy();
22
- expect(catalogTile.prop('isSelected')).toBe(false);
23
22
  });
24
23
 
25
24
  it('should load proper catalog tile with featured property', () => {
package/src/controller/QuickStartFooter.tsx CHANGED
@@ -76,6 +76,7 @@ const QuickStartFooter: React.FC<QuickStartFooterProps> = ({
76
76
  () => (
77
77
  <Button
78
78
  variant="primary"
79
+ className="pfext-quick-start-footer__actionbtn"
79
80
  onClick={onNext}
80
81
  data-testid={`qs-drawer-${camelize(getPrimaryButtonText)}`}
81
82
  data-test={`${getPrimaryButtonText} button`}
package/src/controller/QuickStartTaskHeaderList.tsx CHANGED
@@ -14,7 +14,7 @@ const QuickStartTaskHeaderList: React.FC<QuickStartTaskHeaderListProps> = ({
14
14
  onTaskSelect,
15
15
  }) =>
16
16
  tasks?.length > 0 ? (
17
- <div className="pf-v6-c-wizard__nav-list">
17
+ <ul className="pf-v6-c-wizard pf-v6-c-wizard__nav-list">
18
18
  {tasks.map((task, index) => (
19
19
  <TaskHeader
20
20
  key={task.title}
@@ -25,7 +25,7 @@ const QuickStartTaskHeaderList: React.FC<QuickStartTaskHeaderListProps> = ({
25
25
  onTaskSelect={onTaskSelect}
26
26
  />
27
27
  ))}
28
- </div>
28
+ </ul>
29
29
  ) : null;
30
30
 
31
31
  export default QuickStartTaskHeaderList;
package/src/controller/QuickStartTasks.tsx CHANGED
@@ -25,7 +25,7 @@ const QuickStartTasks: React.FC<QuickStartTaskProps> = ({
25
25
  const { getResource, alwaysShowTaskReview } =
26
26
  React.useContext<QuickStartContextValues>(QuickStartContext);
27
27
  return (
28
- <div className="pf-v6-c-wizard__nav-list" style={{ padding: '0 0 0 0' }}>
28
+ <div className="pf-v6-c-wizard pf-v6-c-wizard__nav-list" style={{ padding: '0 0 0 0' }}>
29
29
  <ul>
30
30
  {tasks
31
31
  .filter((_, index) => allTaskStatuses[index] !== QuickStartTaskStatus.INIT)