@patternfly/patternfly 6.3.0-prerelease.51 → 6.3.0-prerelease.52

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 (8) hide show
  1. package/components/Accordion/accordion.css +19 -15
  2. package/components/Accordion/accordion.scss +19 -18
  3. package/components/_index.css +19 -15
  4. package/package.json +4 -3
  5. package/patternfly-no-globals.css +19 -15
  6. package/patternfly.css +19 -15
  7. package/patternfly.min.css +1 -1
  8. package/patternfly.min.css.map +1 -1
package/components/Accordion/accordion.css CHANGED
@@ -21,15 +21,22 @@
21
21
  --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
22
22
  --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
23
23
  --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
24
+ --pf-v6-c-accordion__toggle-icon--Rotate: 0;
24
25
  --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
25
26
  --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
26
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
27
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: 0;
27
28
  --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
28
29
  --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
29
30
  --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
30
31
  --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
31
32
  --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
33
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: 0;
32
34
  --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
35
+ --pf-v6-c-accordion__expandable-content--MaxHeight: 0;
36
+ --pf-v6-c-accordion__expandable-content--Visibility: hidden;
37
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility: visible;
38
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight: 99999px;
39
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
33
40
  --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
34
41
  --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
35
42
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
@@ -127,6 +134,7 @@
127
134
  .pf-v6-c-accordion__item.pf-m-expanded {
128
135
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
129
136
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
137
+ --pf-v6-c-accordion__toggle-icon--Rotate: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate);
130
138
  --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
131
139
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
132
140
  --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
@@ -135,9 +143,11 @@
135
143
  --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
136
144
  --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
137
145
  --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
138
- }
139
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
140
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
146
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd);
147
+ --pf-v6-c-accordion__expandable-content--MaxHeight: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight);
148
+ --pf-v6-c-accordion__expandable-content--Visibility: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility);
149
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: 0s;
150
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
141
151
  }
142
152
 
143
153
  .pf-v6-c-accordion__toggle {
@@ -173,6 +183,7 @@
173
183
 
174
184
  .pf-v6-c-accordion__toggle-icon {
175
185
  transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
186
+ transform: rotate(var(--pf-v6-c-accordion__toggle-icon--Rotate));
176
187
  }
177
188
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
178
189
  scale: -1 1;
@@ -183,12 +194,13 @@
183
194
  }
184
195
 
185
196
  .pf-v6-c-accordion__expandable-content {
186
- max-height: 0;
197
+ max-height: var(--pf-v6-c-accordion__expandable-content--MaxHeight);
198
+ margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
187
199
  margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
188
200
  margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
189
201
  font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
190
202
  color: var(--pf-v6-c-accordion__expandable-content--Color);
191
- visibility: hidden;
203
+ visibility: var(--pf-v6-c-accordion__expandable-content--Visibility);
192
204
  background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
193
205
  border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
194
206
  opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
@@ -199,17 +211,9 @@
199
211
  translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
200
212
  }
201
213
  .pf-v6-c-accordion__expandable-content.pf-m-fixed {
214
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base);
202
215
  overflow-y: auto;
203
216
  }
204
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
205
- max-height: 99999px;
206
- margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
207
- visibility: revert;
208
- transition-delay: 0s;
209
- }
210
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content.pf-m-fixed {
211
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
212
- }
213
217
 
214
218
  .pf-v6-c-accordion__expandable-content-body {
215
219
  padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
package/components/Accordion/accordion.scss CHANGED
@@ -35,17 +35,24 @@
35
35
  --#{$accordion}__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
36
36
  --#{$accordion}__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
37
37
  --#{$accordion}__toggle-icon--Transition: transform var(--#{$accordion}__toggle-icon--TransitionDuration) var(--#{$accordion}__toggle-icon--TransitionTimingFunction); // TODO remove in breaking change along with shorthand property
38
+ --#{$accordion}__toggle-icon--Rotate: 0;
38
39
  --#{$accordion}__toggle--m-expanded__toggle-icon--Rotate: 90deg;
39
40
 
40
41
  // accordion expandable content
41
42
  --#{$accordion}__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
42
- --#{$accordion}__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
43
+ --#{$accordion}__expandable-content--MarginBlockEnd: 0;
43
44
  --#{$accordion}__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
44
45
  --#{$accordion}__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
45
46
  --#{$accordion}__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
46
47
  --#{$accordion}__expandable-content--Color: var(--pf-t--global--text--color--regular);
47
48
  --#{$accordion}__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
49
+ --#{$accordion}__expandable-content--m-fixed--MaxHeight--base: 0;
48
50
  --#{$accordion}__expandable-content--m-fixed--MaxHeight: #{pf-size-prem(150px)};
51
+ --#{$accordion}__expandable-content--MaxHeight: 0;
52
+ --#{$accordion}__expandable-content--Visibility: hidden;
53
+ --#{$accordion}__item--m-expanded__expandable-content--Visibility: visible;
54
+ --#{$accordion}__item--m-expanded__expandable-content--MaxHeight: 99999px;
55
+ --#{$accordion}__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
49
56
 
50
57
  // expand animation
51
58
  --#{$accordion}__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
@@ -155,6 +162,7 @@
155
162
  &.pf-m-expanded {
156
163
  --#{$accordion}__toggle--PaddingBlockEnd: var(--#{$accordion}__toggle--m-expanded--PaddingBlockEnd);
157
164
  --#{$accordion}__toggle-text--FontWeight: var(--#{$accordion}__toggle--m-expanded__toggle-text--FontWeight);
165
+ --#{$accordion}__toggle-icon--Rotate: var(--#{$accordion}__toggle--m-expanded__toggle-icon--Rotate);
158
166
  --#{$accordion}__item--before--TransitionDuration--slide: var(--#{$accordion}__item--before--TransitionDuration--expand--slide);
159
167
  --#{$accordion}__item--before--TransitionDuration--fade: var(--#{$accordion}__item--before--TransitionDuration--expand--fade);
160
168
  --#{$accordion}__item--before--Opacity: var(--#{$accordion}__item--m-expanded--before--Opacity);
@@ -163,10 +171,11 @@
163
171
  --#{$accordion}__expandable-content--TransitionDuration--fade: var(--#{$accordion}__expandable-content--TransitionDuration--expand--fade);
164
172
  --#{$accordion}__expandable-content--Opacity: var(--#{$accordion}__item--m-expanded__expandable-content--Opacity);
165
173
  --#{$accordion}__expandable-content--TranslateY: var(--#{$accordion}__item--m-expanded__expandable-content--TranslateY);
166
-
167
- .#{$accordion}__toggle-icon {
168
- transform: rotate(var(--#{$accordion}__toggle--m-expanded__toggle-icon--Rotate));
169
- }
174
+ --#{$accordion}__expandable-content--MarginBlockEnd: var(--#{$accordion}__item--m-expanded__expandable-content--MarginBlockEnd);
175
+ --#{$accordion}__expandable-content--MaxHeight: var(--#{$accordion}__item--m-expanded__expandable-content--MaxHeight);
176
+ --#{$accordion}__expandable-content--Visibility: var(--#{$accordion}__item--m-expanded__expandable-content--Visibility);
177
+ --#{$accordion}__expandable-content--TransitionDuration--fade: 0s;
178
+ --#{$accordion}__expandable-content--m-fixed--MaxHeight--base: var(--#{$accordion}__expandable-content--m-fixed--MaxHeight);
170
179
  }
171
180
  }
172
181
 
@@ -205,6 +214,7 @@
205
214
  @include pf-v6-mirror-inline-on-rtl;
206
215
 
207
216
  transition: var(--#{$accordion}__toggle-icon--Transition); // TODO remove shorthand property in breaking change
217
+ transform: rotate(var(--#{$accordion}__toggle-icon--Rotate));
208
218
  }
209
219
 
210
220
  .#{$accordion}__expandable-content:where([hidden]) {
@@ -212,12 +222,13 @@
212
222
  }
213
223
 
214
224
  .#{$accordion}__expandable-content {
215
- max-height: 0;
225
+ max-height: var(--#{$accordion}__expandable-content--MaxHeight);
226
+ margin-block-end: var(--#{$accordion}__expandable-content--MarginBlockEnd);
216
227
  margin-inline-start: var(--#{$accordion}__expandable-content--MarginInlineStart);
217
228
  margin-inline-end: var(--#{$accordion}__expandable-content--MarginInlineEnd);
218
229
  font-size: var(--#{$accordion}__expandable-content--FontSize);
219
230
  color: var(--#{$accordion}__expandable-content--Color);
220
- visibility: hidden;
231
+ visibility: var(--#{$accordion}__expandable-content--Visibility);
221
232
  background-color: var(--#{$accordion}__expandable-content--BackgroundColor);
222
233
  border-radius: var(--#{$accordion}__expandable-content--BorderRadius);
223
234
  opacity: var(--#{$accordion}__expandable-content--Opacity);
@@ -228,19 +239,9 @@
228
239
  translate: 0 var(--#{$accordion}__expandable-content--TranslateY);
229
240
 
230
241
  &.pf-m-fixed {
242
+ max-height: var(--#{$accordion}__expandable-content--m-fixed--MaxHeight--base);
231
243
  overflow-y: auto;
232
244
  }
233
-
234
- .#{$accordion}__item.pf-m-expanded & {
235
- max-height: 99999px;
236
- margin-block-end: var(--#{$accordion}__expandable-content--MarginBlockEnd);
237
- visibility: revert;
238
- transition-delay: 0s;
239
-
240
- &.pf-m-fixed {
241
- max-height: var(--#{$accordion}__expandable-content--m-fixed--MaxHeight);
242
- }
243
- }
244
245
  }
245
246
 
246
247
  .#{$accordion}__expandable-content-body {
package/components/_index.css CHANGED
@@ -214,15 +214,22 @@
214
214
  --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
215
215
  --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
216
216
  --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
217
+ --pf-v6-c-accordion__toggle-icon--Rotate: 0;
217
218
  --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
218
219
  --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
219
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
220
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: 0;
220
221
  --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
221
222
  --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
222
223
  --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
223
224
  --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
224
225
  --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
226
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: 0;
225
227
  --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
228
+ --pf-v6-c-accordion__expandable-content--MaxHeight: 0;
229
+ --pf-v6-c-accordion__expandable-content--Visibility: hidden;
230
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility: visible;
231
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight: 99999px;
232
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
226
233
  --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
227
234
  --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
228
235
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
@@ -320,6 +327,7 @@
320
327
  .pf-v6-c-accordion__item.pf-m-expanded {
321
328
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
322
329
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
330
+ --pf-v6-c-accordion__toggle-icon--Rotate: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate);
323
331
  --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
324
332
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
325
333
  --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
@@ -328,9 +336,11 @@
328
336
  --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
329
337
  --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
330
338
  --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
331
- }
332
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
333
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
339
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd);
340
+ --pf-v6-c-accordion__expandable-content--MaxHeight: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight);
341
+ --pf-v6-c-accordion__expandable-content--Visibility: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility);
342
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: 0s;
343
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
334
344
  }
335
345
 
336
346
  .pf-v6-c-accordion__toggle {
@@ -366,6 +376,7 @@
366
376
 
367
377
  .pf-v6-c-accordion__toggle-icon {
368
378
  transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
379
+ transform: rotate(var(--pf-v6-c-accordion__toggle-icon--Rotate));
369
380
  }
370
381
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
371
382
  scale: -1 1;
@@ -376,12 +387,13 @@
376
387
  }
377
388
 
378
389
  .pf-v6-c-accordion__expandable-content {
379
- max-height: 0;
390
+ max-height: var(--pf-v6-c-accordion__expandable-content--MaxHeight);
391
+ margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
380
392
  margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
381
393
  margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
382
394
  font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
383
395
  color: var(--pf-v6-c-accordion__expandable-content--Color);
384
- visibility: hidden;
396
+ visibility: var(--pf-v6-c-accordion__expandable-content--Visibility);
385
397
  background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
386
398
  border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
387
399
  opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
@@ -392,17 +404,9 @@
392
404
  translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
393
405
  }
394
406
  .pf-v6-c-accordion__expandable-content.pf-m-fixed {
407
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base);
395
408
  overflow-y: auto;
396
409
  }
397
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
398
- max-height: 99999px;
399
- margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
400
- visibility: revert;
401
- transition-delay: 0s;
402
- }
403
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content.pf-m-fixed {
404
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
405
- }
406
410
 
407
411
  .pf-v6-c-accordion__expandable-content-body {
408
412
  padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.3.0-prerelease.51",
4
+ "version": "6.3.0-prerelease.52",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "engines": {
@@ -50,7 +50,7 @@
50
50
  "@commitlint/config-conventional": "^19.1.0",
51
51
  "@fortawesome/fontawesome": "^1.1.8",
52
52
  "@octokit/rest": "^20.1.0",
53
- "@patternfly/documentation-framework": "6.18.7",
53
+ "@patternfly/documentation-framework": "6.19.0",
54
54
  "@patternfly/patternfly-a11y": "5.1.0",
55
55
  "@patternfly/react-code-editor": "6.3.1",
56
56
  "@patternfly/react-core": "6.3.1",
@@ -102,7 +102,8 @@
102
102
  },
103
103
  "resolutions": {
104
104
  "@babel/preset-env": "7.18.2",
105
- "monaco-editor": "0.34.1"
105
+ "monaco-editor": "0.34.1",
106
+ "on-headers": "~1.1.0"
106
107
  },
107
108
  "repository": {
108
109
  "type": "git",
package/patternfly-no-globals.css CHANGED
@@ -7710,15 +7710,22 @@
7710
7710
  --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7711
7711
  --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
7712
7712
  --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
7713
+ --pf-v6-c-accordion__toggle-icon--Rotate: 0;
7713
7714
  --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
7714
7715
  --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
7715
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
7716
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: 0;
7716
7717
  --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
7717
7718
  --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7718
7719
  --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
7719
7720
  --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
7720
7721
  --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
7722
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: 0;
7721
7723
  --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
7724
+ --pf-v6-c-accordion__expandable-content--MaxHeight: 0;
7725
+ --pf-v6-c-accordion__expandable-content--Visibility: hidden;
7726
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility: visible;
7727
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight: 99999px;
7728
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
7722
7729
  --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
7723
7730
  --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
7724
7731
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
@@ -7816,6 +7823,7 @@
7816
7823
  .pf-v6-c-accordion__item.pf-m-expanded {
7817
7824
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
7818
7825
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
7826
+ --pf-v6-c-accordion__toggle-icon--Rotate: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate);
7819
7827
  --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
7820
7828
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
7821
7829
  --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
@@ -7824,9 +7832,11 @@
7824
7832
  --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
7825
7833
  --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
7826
7834
  --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
7827
- }
7828
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
7829
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
7835
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd);
7836
+ --pf-v6-c-accordion__expandable-content--MaxHeight: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight);
7837
+ --pf-v6-c-accordion__expandable-content--Visibility: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility);
7838
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: 0s;
7839
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
7830
7840
  }
7831
7841
 
7832
7842
  .pf-v6-c-accordion__toggle {
@@ -7862,6 +7872,7 @@
7862
7872
 
7863
7873
  .pf-v6-c-accordion__toggle-icon {
7864
7874
  transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
7875
+ transform: rotate(var(--pf-v6-c-accordion__toggle-icon--Rotate));
7865
7876
  }
7866
7877
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
7867
7878
  scale: -1 1;
@@ -7872,12 +7883,13 @@
7872
7883
  }
7873
7884
 
7874
7885
  .pf-v6-c-accordion__expandable-content {
7875
- max-height: 0;
7886
+ max-height: var(--pf-v6-c-accordion__expandable-content--MaxHeight);
7887
+ margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
7876
7888
  margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
7877
7889
  margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
7878
7890
  font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
7879
7891
  color: var(--pf-v6-c-accordion__expandable-content--Color);
7880
- visibility: hidden;
7892
+ visibility: var(--pf-v6-c-accordion__expandable-content--Visibility);
7881
7893
  background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
7882
7894
  border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
7883
7895
  opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
@@ -7888,17 +7900,9 @@
7888
7900
  translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
7889
7901
  }
7890
7902
  .pf-v6-c-accordion__expandable-content.pf-m-fixed {
7903
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base);
7891
7904
  overflow-y: auto;
7892
7905
  }
7893
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
7894
- max-height: 99999px;
7895
- margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
7896
- visibility: revert;
7897
- transition-delay: 0s;
7898
- }
7899
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content.pf-m-fixed {
7900
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
7901
- }
7902
7906
 
7903
7907
  .pf-v6-c-accordion__expandable-content-body {
7904
7908
  padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
package/patternfly.css CHANGED
@@ -7850,15 +7850,22 @@ button) {
7850
7850
  --pf-v6-c-accordion__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
7851
7851
  --pf-v6-c-accordion__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
7852
7852
  --pf-v6-c-accordion__toggle-icon--Transition: transform var(--pf-v6-c-accordion__toggle-icon--TransitionDuration) var(--pf-v6-c-accordion__toggle-icon--TransitionTimingFunction);
7853
+ --pf-v6-c-accordion__toggle-icon--Rotate: 0;
7853
7854
  --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
7854
7855
  --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
7855
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
7856
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: 0;
7856
7857
  --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
7857
7858
  --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7858
7859
  --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
7859
7860
  --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
7860
7861
  --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
7862
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: 0;
7861
7863
  --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
7864
+ --pf-v6-c-accordion__expandable-content--MaxHeight: 0;
7865
+ --pf-v6-c-accordion__expandable-content--Visibility: hidden;
7866
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility: visible;
7867
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight: 99999px;
7868
+ --pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
7862
7869
  --pf-v6-c-accordion__item--before--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
7863
7870
  --pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
7864
7871
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--collapse--fade);
@@ -7956,6 +7963,7 @@ button) {
7956
7963
  .pf-v6-c-accordion__item.pf-m-expanded {
7957
7964
  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
7958
7965
  --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
7966
+ --pf-v6-c-accordion__toggle-icon--Rotate: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate);
7959
7967
  --pf-v6-c-accordion__item--before--TransitionDuration--slide: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--slide);
7960
7968
  --pf-v6-c-accordion__item--before--TransitionDuration--fade: var(--pf-v6-c-accordion__item--before--TransitionDuration--expand--fade);
7961
7969
  --pf-v6-c-accordion__item--before--Opacity: var(--pf-v6-c-accordion__item--m-expanded--before--Opacity);
@@ -7964,9 +7972,11 @@ button) {
7964
7972
  --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: var(--pf-v6-c-accordion__expandable-content--TransitionDuration--expand--fade);
7965
7973
  --pf-v6-c-accordion__expandable-content--Opacity: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Opacity);
7966
7974
  --pf-v6-c-accordion__expandable-content--TranslateY: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--TranslateY);
7967
- }
7968
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
7969
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
7975
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MarginBlockEnd);
7976
+ --pf-v6-c-accordion__expandable-content--MaxHeight: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--MaxHeight);
7977
+ --pf-v6-c-accordion__expandable-content--Visibility: var(--pf-v6-c-accordion__item--m-expanded__expandable-content--Visibility);
7978
+ --pf-v6-c-accordion__expandable-content--TransitionDuration--fade: 0s;
7979
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
7970
7980
  }
7971
7981
 
7972
7982
  .pf-v6-c-accordion__toggle {
@@ -8002,6 +8012,7 @@ button) {
8002
8012
 
8003
8013
  .pf-v6-c-accordion__toggle-icon {
8004
8014
  transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
8015
+ transform: rotate(var(--pf-v6-c-accordion__toggle-icon--Rotate));
8005
8016
  }
8006
8017
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
8007
8018
  scale: -1 1;
@@ -8012,12 +8023,13 @@ button) {
8012
8023
  }
8013
8024
 
8014
8025
  .pf-v6-c-accordion__expandable-content {
8015
- max-height: 0;
8026
+ max-height: var(--pf-v6-c-accordion__expandable-content--MaxHeight);
8027
+ margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
8016
8028
  margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
8017
8029
  margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
8018
8030
  font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
8019
8031
  color: var(--pf-v6-c-accordion__expandable-content--Color);
8020
- visibility: hidden;
8032
+ visibility: var(--pf-v6-c-accordion__expandable-content--Visibility);
8021
8033
  background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
8022
8034
  border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
8023
8035
  opacity: var(--pf-v6-c-accordion__expandable-content--Opacity);
@@ -8028,17 +8040,9 @@ button) {
8028
8040
  translate: 0 var(--pf-v6-c-accordion__expandable-content--TranslateY);
8029
8041
  }
8030
8042
  .pf-v6-c-accordion__expandable-content.pf-m-fixed {
8043
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight--base);
8031
8044
  overflow-y: auto;
8032
8045
  }
8033
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content {
8034
- max-height: 99999px;
8035
- margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
8036
- visibility: revert;
8037
- transition-delay: 0s;
8038
- }
8039
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__expandable-content.pf-m-fixed {
8040
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
8041
- }
8042
8046
 
8043
8047
  .pf-v6-c-accordion__expandable-content-body {
8044
8048
  padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);