@patternfly/patternfly 6.3.0-prerelease.33 → 6.3.0-prerelease.35

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 (11) hide show
  1. package/components/FileUpload/file-upload.css +3 -3
  2. package/components/FileUpload/file-upload.scss +3 -3
  3. package/components/Table/table.css +9 -3
  4. package/components/Table/table.scss +10 -3
  5. package/components/_index.css +12 -6
  6. package/docs/components/Table/examples/Table.md +1 -0
  7. package/package.json +2 -2
  8. package/patternfly-no-globals.css +12 -6
  9. package/patternfly.css +12 -6
  10. package/patternfly.min.css +1 -1
  11. package/patternfly.min.css.map +1 -1
package/components/FileUpload/file-upload.css CHANGED
@@ -6,9 +6,9 @@
6
6
  --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7
7
  --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
8
8
  --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
9
- --pf-v6-c-file-upload--BorderColor: transparent;
10
- --pf-v6-c-file-upload--BorderStyle: solid;
11
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
9
+ --pf-v6-c-file-upload--BorderColor: var(--pf-t--global--border--color--default);
10
+ --pf-v6-c-file-upload--BorderStyle: dashed;
11
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
12
12
  --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
13
13
  --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
14
14
  --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
package/components/FileUpload/file-upload.scss CHANGED
@@ -8,11 +8,11 @@
8
8
  --#{$file-upload}--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
9
9
  --#{$file-upload}--BorderRadius: var(--pf-t--global--border--radius--small);
10
10
  --#{$file-upload}--BorderWidth: var(--pf-t--global--border--width--regular);
11
- --#{$file-upload}--BorderColor: transparent;
12
- --#{$file-upload}--BorderStyle: solid;
11
+ --#{$file-upload}--BorderColor: var(--pf-t--global--border--color--default);
12
+ --#{$file-upload}--BorderStyle: dashed;
13
13
 
14
14
  // pf-m-drag-hover
15
- --#{$file-upload}--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
15
+ --#{$file-upload}--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
16
16
  --#{$file-upload}--m-drag-hover--BorderStyle: dashed;
17
17
 
18
18
  // File select > Button
package/components/Table/table.css CHANGED
@@ -418,10 +418,10 @@
418
418
  display: revert;
419
419
  visibility: hidden;
420
420
  opacity: var(--pf-v6-c-table__expandable-row--Opacity);
421
- transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
421
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
422
422
  transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
423
- transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s;
424
- transition-property: opacity, translate, visibility;
423
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
424
+ transition-property: opacity, translate, visibility, background-color;
425
425
  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
426
426
  }
427
427
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
@@ -447,6 +447,12 @@
447
447
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
448
448
  max-height: 0;
449
449
  }
450
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row {
451
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
452
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
453
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
454
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
455
+ }
450
456
 
451
457
  [class*=pf-v6-c-table].pf-m-truncate {
452
458
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
package/components/Table/table.scss CHANGED
@@ -587,10 +587,10 @@
587
587
  display: revert;
588
588
  visibility: hidden;
589
589
  opacity: var(--#{$table}__expandable-row--Opacity);
590
- transition-delay: 0s, 0s, var(--#{$table}__expandable-row--TransitionDuration--collapse--fade);
590
+ transition-delay: 0s, 0s, var(--#{$table}__expandable-row--TransitionDuration--collapse--fade), var(--#{$table}__expandable-row--TransitionDuration--collapse--fade);
591
591
  transition-timing-function: var(--#{$table}__expandable-row--TransitionTimingFunction);
592
- transition-duration: var(--#{$table}__expandable-row--TransitionDuration--collapse--fade), var(--#{$table}__expandable-row--TransitionDuration--collapse--slide), 0s;
593
- transition-property: opacity, translate, visibility;
592
+ transition-duration: var(--#{$table}__expandable-row--TransitionDuration--collapse--fade), var(--#{$table}__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
593
+ transition-property: opacity, translate, visibility, background-color;
594
594
  translate: 0 var(--#{$table}__expandable-row--TranslateY);
595
595
 
596
596
  &[hidden] {
@@ -627,6 +627,13 @@
627
627
  }
628
628
  }
629
629
  }
630
+
631
+ > .#{$table}__control-row.pf-m-no-animate-expand ~ .#{$table}__expandable-row {
632
+ --#{$table}__expandable-row--TransitionDuration--collapse--fade: 0s;
633
+ --#{$table}__expandable-row--TransitionDuration--collapse--slide: 0s;
634
+ --#{$table}__expandable-row--TransitionDuration--expand--fade: 0s;
635
+ --#{$table}__expandable-row--TransitionDuration--expand--slide: 0s;
636
+ }
630
637
  }
631
638
  }
632
639
  // stylelint-enable max-nesting-depth, selector-max-class
package/components/_index.css CHANGED
@@ -6713,9 +6713,9 @@ ul) {
6713
6713
  --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6714
6714
  --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
6715
6715
  --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
6716
- --pf-v6-c-file-upload--BorderColor: transparent;
6717
- --pf-v6-c-file-upload--BorderStyle: solid;
6718
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
6716
+ --pf-v6-c-file-upload--BorderColor: var(--pf-t--global--border--color--default);
6717
+ --pf-v6-c-file-upload--BorderStyle: dashed;
6718
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
6719
6719
  --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
6720
6720
  --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
6721
6721
  --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
@@ -17639,10 +17639,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17639
17639
  display: revert;
17640
17640
  visibility: hidden;
17641
17641
  opacity: var(--pf-v6-c-table__expandable-row--Opacity);
17642
- transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
17642
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
17643
17643
  transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
17644
- transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s;
17645
- transition-property: opacity, translate, visibility;
17644
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
17645
+ transition-property: opacity, translate, visibility, background-color;
17646
17646
  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
17647
17647
  }
17648
17648
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
@@ -17668,6 +17668,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
17668
17668
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
17669
17669
  max-height: 0;
17670
17670
  }
17671
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row {
17672
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
17673
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
17674
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
17675
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
17676
+ }
17671
17677
 
17672
17678
  [class*=pf-v6-c-table].pf-m-truncate {
17673
17679
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
package/docs/components/Table/examples/Table.md CHANGED
@@ -7677,6 +7677,7 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7677
7677
  | `.pf-m-animate-expand` | `.pf-v6-c-table` | Modifies the table to animate expansion. |
7678
7678
  | `.pf-m-expanded` | `.pf-v6-c-table__tbody`, `.pf-v6-c-table__control-row`, `.pf-v6-c-table__compound-expansion-toggle` | Modifies a `<tbody>`, control row, and item in a control row for the expanded state. |
7679
7679
  | `.pf-m-no-background` | `.pf-v6-c-table__expandable-row-content` | Modifies the expandable row content to have a transparent background. For in compound expandable when the parent expandable row has no padding with `.pf-m-no-padding`. |
7680
+ | `.pf-m-no-animate-expand` | `.pf-v6-c-table__control-row.pf-m-expanded` | Disables animation on a compound expandable row. **Note:** Used to disable the animation when clicking between compound expandable items. |
7680
7681
 
7681
7682
  ## Compact variant
7682
7683
 
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.33",
4
+ "version": "6.3.0-prerelease.35",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -47,7 +47,7 @@
47
47
  "@commitlint/config-conventional": "^19.1.0",
48
48
  "@fortawesome/fontawesome": "^1.1.8",
49
49
  "@octokit/rest": "^20.1.0",
50
- "@patternfly/documentation-framework": "6.10.31",
50
+ "@patternfly/documentation-framework": "6.11.2",
51
51
  "@patternfly/patternfly-a11y": "5.1.0",
52
52
  "@patternfly/react-code-editor": "6.2.2",
53
53
  "@patternfly/react-core": "6.2.2",
package/patternfly-no-globals.css CHANGED
@@ -14209,9 +14209,9 @@ ul) {
14209
14209
  --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
14210
14210
  --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
14211
14211
  --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
14212
- --pf-v6-c-file-upload--BorderColor: transparent;
14213
- --pf-v6-c-file-upload--BorderStyle: solid;
14214
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
14212
+ --pf-v6-c-file-upload--BorderColor: var(--pf-t--global--border--color--default);
14213
+ --pf-v6-c-file-upload--BorderStyle: dashed;
14214
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
14215
14215
  --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
14216
14216
  --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
14217
14217
  --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
@@ -25135,10 +25135,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
25135
25135
  display: revert;
25136
25136
  visibility: hidden;
25137
25137
  opacity: var(--pf-v6-c-table__expandable-row--Opacity);
25138
- transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
25138
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
25139
25139
  transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
25140
- transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s;
25141
- transition-property: opacity, translate, visibility;
25140
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
25141
+ transition-property: opacity, translate, visibility, background-color;
25142
25142
  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
25143
25143
  }
25144
25144
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
@@ -25164,6 +25164,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
25164
25164
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
25165
25165
  max-height: 0;
25166
25166
  }
25167
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row {
25168
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
25169
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
25170
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
25171
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
25172
+ }
25167
25173
 
25168
25174
  [class*=pf-v6-c-table].pf-m-truncate {
25169
25175
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);
package/patternfly.css CHANGED
@@ -14345,9 +14345,9 @@ ul) {
14345
14345
  --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
14346
14346
  --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
14347
14347
  --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
14348
- --pf-v6-c-file-upload--BorderColor: transparent;
14349
- --pf-v6-c-file-upload--BorderStyle: solid;
14350
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
14348
+ --pf-v6-c-file-upload--BorderColor: var(--pf-t--global--border--color--default);
14349
+ --pf-v6-c-file-upload--BorderStyle: dashed;
14350
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--border--color--clicked);
14351
14351
  --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
14352
14352
  --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
14353
14353
  --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
@@ -25271,10 +25271,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
25271
25271
  display: revert;
25272
25272
  visibility: hidden;
25273
25273
  opacity: var(--pf-v6-c-table__expandable-row--Opacity);
25274
- transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
25274
+ transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
25275
25275
  transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
25276
- transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s;
25277
- transition-property: opacity, translate, visibility;
25276
+ transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
25277
+ transition-property: opacity, translate, visibility, background-color;
25278
25278
  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
25279
25279
  }
25280
25280
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
@@ -25300,6 +25300,12 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
25300
25300
  .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row:not(.pf-m-expanded) > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
25301
25301
  max-height: 0;
25302
25302
  }
25303
+ .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__control-row.pf-m-no-animate-expand ~ .pf-v6-c-table__expandable-row {
25304
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade: 0s;
25305
+ --pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide: 0s;
25306
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--fade: 0s;
25307
+ --pf-v6-c-table__expandable-row--TransitionDuration--expand--slide: 0s;
25308
+ }
25303
25309
 
25304
25310
  [class*=pf-v6-c-table].pf-m-truncate {
25305
25311
  --pf-v6-c-table--cell--MinWidth: var(--pf-v6-c-table--m-truncate--cell--MinWidth);