@patternfly/patternfly 6.0.0-alpha.129 → 6.0.0-alpha.130

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.
@@ -75,7 +75,7 @@
75
75
  .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
76
76
  margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
77
77
  }
78
- .pf-v6-c-text-input-group__main .pf-v6-c-chip-group__main {
78
+ .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
79
79
  padding-block-start: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingBlockStart);
80
80
  padding-block-end: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingBlockEnd);
81
81
  padding-inline-end: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingInlineEnd);
@@ -102,7 +102,7 @@
102
102
  margin-inline-start: var(--#{$text-input-group}__main--first-child--not--text-input--MarginInlineStart);
103
103
  }
104
104
 
105
- .#{$chip-group}__main {
105
+ .#{$label-group}__main {
106
106
  padding-block-start: var(--#{$text-input-group}--c-chip-group__main--PaddingBlockStart);
107
107
  padding-block-end: var(--#{$text-input-group}--c-chip-group__main--PaddingBlockEnd);
108
108
  padding-inline-end: var(--#{$text-input-group}--c-chip-group__main--PaddingInlineEnd);
@@ -34,8 +34,8 @@
34
34
  .pf-v6-c-toolbar__content-section,
35
35
  .pf-v6-c-toolbar__group,
36
36
  .pf-v6-c-toolbar__item,
37
- .pf-v6-c-toolbar__group.pf-m-chip-group-container,
38
- .pf-v6-c-toolbar__group.pf-m-chip-group {
37
+ .pf-v6-c-toolbar__group.pf-m-label-group-container,
38
+ .pf-v6-c-toolbar__group.pf-m-label-group {
39
39
  --pf-v6-hidden-visible--visible--Display: flex;
40
40
  --pf-v6-hidden-visible--hidden--Display: none;
41
41
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
@@ -45,23 +45,23 @@
45
45
  .pf-v6-c-toolbar__content-section.pf-m-hidden,
46
46
  .pf-v6-c-toolbar__group.pf-m-hidden,
47
47
  .pf-v6-c-toolbar__item.pf-m-hidden,
48
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden,
49
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden {
48
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden,
49
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden {
50
50
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
51
51
  }
52
52
  @media screen and (min-width: 576px) {
53
53
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-sm,
54
54
  .pf-v6-c-toolbar__group.pf-m-hidden-on-sm,
55
55
  .pf-v6-c-toolbar__item.pf-m-hidden-on-sm,
56
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-sm,
57
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-sm {
56
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-sm,
57
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-sm {
58
58
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
59
59
  }
60
60
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-sm,
61
61
  .pf-v6-c-toolbar__group.pf-m-visible-on-sm,
62
62
  .pf-v6-c-toolbar__item.pf-m-visible-on-sm,
63
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-sm,
64
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-sm {
63
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-sm,
64
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-sm {
65
65
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
66
66
  }
67
67
  }
@@ -69,15 +69,15 @@
69
69
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-md,
70
70
  .pf-v6-c-toolbar__group.pf-m-hidden-on-md,
71
71
  .pf-v6-c-toolbar__item.pf-m-hidden-on-md,
72
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-md,
73
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-md {
72
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-md,
73
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-md {
74
74
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
75
75
  }
76
76
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-md,
77
77
  .pf-v6-c-toolbar__group.pf-m-visible-on-md,
78
78
  .pf-v6-c-toolbar__item.pf-m-visible-on-md,
79
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-md,
80
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-md {
79
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-md,
80
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-md {
81
81
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
82
82
  }
83
83
  }
@@ -85,15 +85,15 @@
85
85
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-lg,
86
86
  .pf-v6-c-toolbar__group.pf-m-hidden-on-lg,
87
87
  .pf-v6-c-toolbar__item.pf-m-hidden-on-lg,
88
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-lg,
89
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-lg {
88
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-lg,
89
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-lg {
90
90
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
91
91
  }
92
92
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-lg,
93
93
  .pf-v6-c-toolbar__group.pf-m-visible-on-lg,
94
94
  .pf-v6-c-toolbar__item.pf-m-visible-on-lg,
95
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-lg,
96
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-lg {
95
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-lg,
96
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-lg {
97
97
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
98
98
  }
99
99
  }
@@ -101,15 +101,15 @@
101
101
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-xl,
102
102
  .pf-v6-c-toolbar__group.pf-m-hidden-on-xl,
103
103
  .pf-v6-c-toolbar__item.pf-m-hidden-on-xl,
104
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-xl,
105
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-xl {
104
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-xl,
105
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-xl {
106
106
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
107
107
  }
108
108
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-xl,
109
109
  .pf-v6-c-toolbar__group.pf-m-visible-on-xl,
110
110
  .pf-v6-c-toolbar__item.pf-m-visible-on-xl,
111
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-xl,
112
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-xl {
111
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-xl,
112
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-xl {
113
113
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
114
114
  }
115
115
  }
@@ -117,15 +117,15 @@
117
117
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-2xl,
118
118
  .pf-v6-c-toolbar__group.pf-m-hidden-on-2xl,
119
119
  .pf-v6-c-toolbar__item.pf-m-hidden-on-2xl,
120
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-2xl,
121
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-2xl {
120
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-2xl,
121
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-2xl {
122
122
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
123
123
  }
124
124
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-2xl,
125
125
  .pf-v6-c-toolbar__group.pf-m-visible-on-2xl,
126
126
  .pf-v6-c-toolbar__item.pf-m-visible-on-2xl,
127
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-2xl,
128
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-2xl {
127
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-2xl,
128
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-2xl {
129
129
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
130
130
  }
131
131
  }
@@ -289,10 +289,10 @@
289
289
  .pf-v6-c-toolbar__group.pf-m-filter-group {
290
290
  column-gap: var(--pf-v6-c-toolbar__group--m-filter-group--ColumnGap);
291
291
  }
292
- .pf-v6-c-toolbar__group.pf-m-filter-group, .pf-v6-c-toolbar__group.pf-m-chip-group-container {
292
+ .pf-v6-c-toolbar__group.pf-m-filter-group, .pf-v6-c-toolbar__group.pf-m-label-group-container {
293
293
  flex-wrap: nowrap;
294
294
  }
295
- .pf-v6-c-toolbar__group.pf-m-chip-group {
295
+ .pf-v6-c-toolbar__group.pf-m-label-group {
296
296
  flex: 1;
297
297
  }
298
298
  .pf-v6-c-toolbar__group.pf-m-overflow-container {
@@ -63,12 +63,12 @@ $pf-v6--include-toolbar-breakpoints: true !default;
63
63
  --#{$toolbar}__item--m-label--FontWeight: var(--pf-t--global--font--weight--body--bold);
64
64
  }
65
65
 
66
- // - Toolbar content - Toolbar group - Toolbar item - Toolbar group chip container - Toolbar group chip group
66
+ // - Toolbar content - Toolbar group - Toolbar item - Toolbar group label container - Toolbar group label group
67
67
  .#{$toolbar}__content-section,
68
68
  .#{$toolbar}__group,
69
69
  .#{$toolbar}__item,
70
- .#{$toolbar}__group.pf-m-chip-group-container,
71
- .#{$toolbar}__group.pf-m-chip-group {
70
+ .#{$toolbar}__group.pf-m-label-group-container,
71
+ .#{$toolbar}__group.pf-m-label-group {
72
72
  @include pf-v6-hidden-visible(flex);
73
73
 
74
74
  flex-wrap: wrap;
@@ -230,14 +230,14 @@ $pf-v6--include-toolbar-breakpoints: true !default;
230
230
  column-gap: var(--#{$toolbar}__group--m-filter-group--ColumnGap);
231
231
  }
232
232
 
233
- // - Toolbar filter group - Toolbar chip container
233
+ // - Toolbar filter group - Toolbar label container
234
234
  &.pf-m-filter-group,
235
- &.pf-m-chip-group-container {
235
+ &.pf-m-label-group-container {
236
236
  flex-wrap: nowrap;
237
237
  }
238
238
 
239
- // - Toolbar chip group
240
- &.pf-m-chip-group {
239
+ // - Toolbar label group
240
+ &.pf-m-label-group {
241
241
  flex: 1;
242
242
  }
243
243
 
@@ -2504,191 +2504,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
2504
2504
  color: var(--pf-v6-c-check__label-required--Color);
2505
2505
  }
2506
2506
 
2507
- .pf-v6-c-chip {
2508
- --pf-v6-c-chip--PaddingBlockStart: var(--pf-v6-global--spacer--xs);
2509
- --pf-v6-c-chip--PaddingInlineEnd: var(--pf-v6-global--spacer--sm);
2510
- --pf-v6-c-chip--PaddingBlockEnd: var(--pf-v6-global--spacer--xs);
2511
- --pf-v6-c-chip--PaddingInlineStart: var(--pf-v6-global--spacer--sm);
2512
- --pf-v6-c-chip--BackgroundColor: var(--pf-v6-global--Color--light-100);
2513
- --pf-v6-c-chip--BorderRadius: var(--pf-v6-global--BorderRadius--sm);
2514
- --pf-v6-c-chip--before--BorderColor: var(--pf-v6-global--BorderColor--300);
2515
- --pf-v6-c-chip--before--BorderWidth: var(--pf-v6-global--BorderWidth--sm);
2516
- --pf-v6-c-chip--before--BorderRadius: var(--pf-v6-c-chip--BorderRadius);
2517
- --pf-v6-c-chip--m-overflow__text--Color: var(--pf-v6-global--primary-color--100);
2518
- --pf-v6-c-chip--m-draggable--BackgroundColor: var(--pf-v6-global--BackgroundColor--200);
2519
- --pf-v6-c-chip--m-draggable--BoxShadow: var(--pf-v6-global--BoxShadow--sm);
2520
- --pf-v6-c-chip--m-draggable__icon--FontSize: var(--pf-v6-global--icon--FontSize--sm);
2521
- --pf-v6-c-chip__content--FontSize: var(--pf-v6-global--FontSize--xs);
2522
- --pf-v6-c-chip__content--ColumnGap: var(--pf-v6-global--spacer--xs);
2523
- --pf-v6-c-chip__text--Color: var(--pf-v6-global--Color--100);
2524
- --pf-v6-c-chip__text--MaxWidth: 16ch;
2525
- --pf-v6-c-chip__c-badge--MarginInlineStart: var(--pf-v6-global--spacer--xs);
2526
- --pf-v6-c-chip__actions--FontSize: var(--pf-v6-global--FontSize--xs);
2527
- --pf-v6-c-chip__actions--c-button--PaddingBlockStart: var(--pf-v6-global--spacer--xs);
2528
- --pf-v6-c-chip__actions--c-button--PaddingInlineEnd: var(--pf-v6-global--spacer--sm);
2529
- --pf-v6-c-chip__actions--c-button--PaddingBlockEnd: var(--pf-v6-global--spacer--xs);
2530
- --pf-v6-c-chip__actions--c-button--PaddingInlineStart: var(--pf-v6-global--spacer--sm);
2531
- --pf-v6-c-chip__actions--c-button--MarginBlockStart: calc(var(--pf-v6-c-chip--PaddingBlockStart) * -1);
2532
- --pf-v6-c-chip__actions--c-button--MarginInlineEnd: calc(var(--pf-v6-c-chip--PaddingInlineEnd) / 2 * -1);
2533
- --pf-v6-c-chip__actions--c-button--MarginBlockEnd: calc(var(--pf-v6-c-chip--PaddingBlockEnd) * -1);
2534
- --pf-v6-c-chip__actions--c-button--FontSize: var(--pf-v6-global--FontSize--xs);
2535
- --pf-v6-c-chip__icon--MarginInlineStart: var(--pf-v6-global--spacer--sm);
2536
- position: relative;
2537
- display: inline-flex;
2538
- align-items: center;
2539
- min-width: 0;
2540
- padding-block-start: var(--pf-v6-c-chip--PaddingBlockStart);
2541
- padding-block-end: var(--pf-v6-c-chip--PaddingBlockEnd);
2542
- padding-inline-start: var(--pf-v6-c-chip--PaddingInlineStart);
2543
- padding-inline-end: var(--pf-v6-c-chip--PaddingInlineEnd);
2544
- list-style: none;
2545
- background-color: var(--pf-v6-c-chip--BackgroundColor);
2546
- border-radius: var(--pf-v6-c-chip--BorderRadius);
2547
- }
2548
- .pf-v6-c-chip::before {
2549
- position: absolute;
2550
- inset-block-start: 0;
2551
- inset-block-end: 0;
2552
- inset-inline-start: 0;
2553
- inset-inline-end: 0;
2554
- content: "";
2555
- border: var(--pf-v6-c-chip--before--BorderWidth) solid var(--pf-v6-c-chip--before--BorderColor);
2556
- border-radius: var(--pf-v6-c-chip--before--BorderRadius);
2557
- }
2558
- .pf-v6-c-chip.pf-m-overflow {
2559
- border: 0;
2560
- }
2561
- .pf-v6-c-chip.pf-m-overflow .pf-v6-c-chip__text {
2562
- color: var(--pf-v6-c-chip--m-overflow__text--Color);
2563
- }
2564
- .pf-v6-c-chip.pf-m-draggable {
2565
- --pf-v6-c-chip--BackgroundColor: var(--pf-v6-c-chip--m-draggable--BackgroundColor);
2566
- box-shadow: var(--pf-v6-c-chip--m-draggable--BoxShadow);
2567
- }
2568
- .pf-v6-c-chip.pf-m-draggable .pf-v6-c-chip__icon {
2569
- font-size: var(--pf-v6-c-chip--m-draggable__icon--FontSize);
2570
- }
2571
-
2572
- .pf-v6-c-chip__text {
2573
- overflow: hidden;
2574
- text-overflow: ellipsis;
2575
- white-space: nowrap;
2576
- position: relative;
2577
- max-width: var(--pf-v6-c-chip__text--MaxWidth);
2578
- color: var(--pf-v6-c-chip__text--Color);
2579
- }
2580
- .pf-v6-c-chip__text .pf-v6-c-badge {
2581
- margin-inline-start: var(--pf-v6-c-chip__c-badge--MarginInlineStart);
2582
- }
2583
-
2584
- .pf-v6-c-chip__icon + .pf-v6-c-chip__text,
2585
- .pf-v6-c-chip__text + .pf-v6-c-chip__icon {
2586
- margin-inline-start: var(--pf-v6-c-chip__icon--MarginInlineStart);
2587
- }
2588
-
2589
- .pf-v6-c-chip__content {
2590
- display: flex;
2591
- column-gap: var(--pf-v6-c-chip__content--ColumnGap);
2592
- align-items: center;
2593
- font-size: var(--pf-v6-c-chip__content--FontSize);
2594
- }
2595
-
2596
- .pf-v6-c-chip__actions {
2597
- font-size: var(--pf-v6-c-chip__actions--FontSize);
2598
- }
2599
- .pf-v6-c-chip__actions .pf-v6-c-button {
2600
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-chip__actions--c-button--PaddingBlockStart);
2601
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-chip__actions--c-button--PaddingInlineEnd);
2602
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-chip__actions--c-button--PaddingBlockEnd);
2603
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-chip__actions--c-button--PaddingInlineStart);
2604
- --pf-v6-c-button--FontSize: var(--pf-v6-c-chip__actions--c-button--FontSize);
2605
- margin-block-start: var(--pf-v6-c-chip__actions--c-button--MarginBlockStart);
2606
- margin-block-end: var(--pf-v6-c-chip__actions--c-button--MarginBlockEnd);
2607
- margin-inline-end: var(--pf-v6-c-chip__actions--c-button--MarginInlineEnd);
2608
- line-height: 1;
2609
- }
2610
-
2611
- .pf-v6-c-chip-group {
2612
- --pf-v6-c-chip-group--PaddingBlockStart: 0;
2613
- --pf-v6-c-chip-group--PaddingInlineEnd: 0;
2614
- --pf-v6-c-chip-group--PaddingBlockEnd: 0;
2615
- --pf-v6-c-chip-group--PaddingInlineStart: 0;
2616
- --pf-v6-c-chip-group--RowGap: var(--pf-v6-global--spacer--sm);
2617
- --pf-v6-c-chip-group--ColumnGap: 0;
2618
- --pf-v6-c-chip-group__main--RowGap: var(--pf-v6-global--spacer--xs);
2619
- --pf-v6-c-chip-group__main--ColumnGap: var(--pf-v6-global--spacer--sm);
2620
- --pf-v6-c-chip-group__list--RowGap: var(--pf-v6-global--spacer--xs);
2621
- --pf-v6-c-chip-group__list--ColumnGap: var(--pf-v6-global--spacer--xs);
2622
- --pf-v6-c-chip-group--m-category--PaddingBlockStart: var(--pf-v6-global--spacer--xs);
2623
- --pf-v6-c-chip-group--m-category--PaddingInlineEnd: var(--pf-v6-global--spacer--xs);
2624
- --pf-v6-c-chip-group--m-category--PaddingBlockEnd: var(--pf-v6-global--spacer--xs);
2625
- --pf-v6-c-chip-group--m-category--PaddingInlineStart: var(--pf-v6-global--spacer--sm);
2626
- --pf-v6-c-chip-group--m-category--BorderRadius: var(--pf-v6-global--BorderRadius--sm);
2627
- --pf-v6-c-chip-group--m-category--BackgroundColor: var(--pf-v6-global--BackgroundColor--200);
2628
- --pf-v6-c-chip-group__label--FontSize: var(--pf-v6-global--FontSize--sm);
2629
- --pf-v6-c-chip-group__label--MaxWidth: 18ch;
2630
- --pf-v6-c-chip-group__close--MarginBlockStart: calc(var(--pf-v6-global--spacer--xs) * -1);
2631
- --pf-v6-c-chip-group__close--MarginBlockEnd: calc(var(--pf-v6-global--spacer--xs) * -1);
2632
- row-gap: var(--pf-v6-c-chip-group--RowGap);
2633
- column-gap: var(--pf-v6-c-chip-group--ColumnGap);
2634
- max-width: 100%;
2635
- padding-block-start: var(--pf-v6-c-chip-group--PaddingBlockStart);
2636
- padding-block-end: var(--pf-v6-c-chip-group--PaddingBlockEnd);
2637
- padding-inline-start: var(--pf-v6-c-chip-group--PaddingInlineStart);
2638
- padding-inline-end: var(--pf-v6-c-chip-group--PaddingInlineEnd);
2639
- }
2640
- .pf-v6-c-chip-group.pf-m-category {
2641
- --pf-v6-c-chip-group--PaddingBlockStart: var(--pf-v6-c-chip-group--m-category--PaddingBlockStart);
2642
- --pf-v6-c-chip-group--PaddingInlineEnd: var(--pf-v6-c-chip-group--m-category--PaddingInlineEnd);
2643
- --pf-v6-c-chip-group--PaddingBlockEnd: var(--pf-v6-c-chip-group--m-category--PaddingBlockEnd);
2644
- --pf-v6-c-chip-group--PaddingInlineStart: var(--pf-v6-c-chip-group--m-category--PaddingInlineStart);
2645
- background-color: var(--pf-v6-c-chip-group--m-category--BackgroundColor);
2646
- border-radius: var(--pf-v6-c-chip-group--m-category--BorderRadius);
2647
- }
2648
-
2649
- .pf-v6-c-chip-group__main {
2650
- display: flex;
2651
- flex: 1;
2652
- flex-wrap: wrap;
2653
- row-gap: var(--pf-v6-c-chip-group__main--RowGap);
2654
- column-gap: var(--pf-v6-c-chip-group__main--ColumnGap);
2655
- align-items: baseline;
2656
- min-width: 0;
2657
- }
2658
-
2659
- .pf-v6-c-chip-group,
2660
- .pf-v6-c-chip-group__list {
2661
- display: inline-flex;
2662
- flex-wrap: wrap;
2663
- align-items: center;
2664
- min-width: 0;
2665
- }
2666
-
2667
- .pf-v6-c-chip-group__list {
2668
- row-gap: var(--pf-v6-c-chip-group__list--RowGap);
2669
- column-gap: var(--pf-v6-c-chip-group__list--ColumnGap);
2670
- }
2671
-
2672
- .pf-v6-c-chip-group__list-item {
2673
- display: inline-flex;
2674
- min-width: 0;
2675
- }
2676
-
2677
- .pf-v6-c-chip-group__label {
2678
- overflow: hidden;
2679
- text-overflow: ellipsis;
2680
- white-space: nowrap;
2681
- max-width: var(--pf-v6-c-chip-group__label--MaxWidth);
2682
- font-size: var(--pf-v6-c-chip-group__label--FontSize);
2683
- }
2684
-
2685
- .pf-v6-c-chip-group__close {
2686
- display: flex;
2687
- align-self: flex-start;
2688
- margin-block-start: var(--pf-v6-c-chip-group__close--MarginBlockStart);
2689
- margin-block-end: var(--pf-v6-c-chip-group__close--MarginBlockEnd);
2690
- }
2691
-
2692
2507
  :where(:root, .pf-v6-c-clipboard-copy) {
2693
2508
  --pf-v6-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
2694
2509
  --pf-v6-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
@@ -19188,7 +19003,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19188
19003
  .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
19189
19004
  margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
19190
19005
  }
19191
- .pf-v6-c-text-input-group__main .pf-v6-c-chip-group__main {
19006
+ .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
19192
19007
  padding-block-start: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingBlockStart);
19193
19008
  padding-block-end: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingBlockEnd);
19194
19009
  padding-inline-end: var(--pf-v6-c-text-input-group--c-chip-group__main--PaddingInlineEnd);
@@ -19659,8 +19474,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19659
19474
  .pf-v6-c-toolbar__content-section,
19660
19475
  .pf-v6-c-toolbar__group,
19661
19476
  .pf-v6-c-toolbar__item,
19662
- .pf-v6-c-toolbar__group.pf-m-chip-group-container,
19663
- .pf-v6-c-toolbar__group.pf-m-chip-group {
19477
+ .pf-v6-c-toolbar__group.pf-m-label-group-container,
19478
+ .pf-v6-c-toolbar__group.pf-m-label-group {
19664
19479
  --pf-v6-hidden-visible--visible--Display: flex;
19665
19480
  --pf-v6-hidden-visible--hidden--Display: none;
19666
19481
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
@@ -19670,23 +19485,23 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19670
19485
  .pf-v6-c-toolbar__content-section.pf-m-hidden,
19671
19486
  .pf-v6-c-toolbar__group.pf-m-hidden,
19672
19487
  .pf-v6-c-toolbar__item.pf-m-hidden,
19673
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden,
19674
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden {
19488
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden,
19489
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden {
19675
19490
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19676
19491
  }
19677
19492
  @media screen and (min-width: 576px) {
19678
19493
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-sm,
19679
19494
  .pf-v6-c-toolbar__group.pf-m-hidden-on-sm,
19680
19495
  .pf-v6-c-toolbar__item.pf-m-hidden-on-sm,
19681
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-sm,
19682
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-sm {
19496
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-sm,
19497
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-sm {
19683
19498
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19684
19499
  }
19685
19500
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-sm,
19686
19501
  .pf-v6-c-toolbar__group.pf-m-visible-on-sm,
19687
19502
  .pf-v6-c-toolbar__item.pf-m-visible-on-sm,
19688
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-sm,
19689
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-sm {
19503
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-sm,
19504
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-sm {
19690
19505
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
19691
19506
  }
19692
19507
  }
@@ -19694,15 +19509,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19694
19509
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-md,
19695
19510
  .pf-v6-c-toolbar__group.pf-m-hidden-on-md,
19696
19511
  .pf-v6-c-toolbar__item.pf-m-hidden-on-md,
19697
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-md,
19698
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-md {
19512
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-md,
19513
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-md {
19699
19514
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19700
19515
  }
19701
19516
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-md,
19702
19517
  .pf-v6-c-toolbar__group.pf-m-visible-on-md,
19703
19518
  .pf-v6-c-toolbar__item.pf-m-visible-on-md,
19704
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-md,
19705
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-md {
19519
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-md,
19520
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-md {
19706
19521
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
19707
19522
  }
19708
19523
  }
@@ -19710,15 +19525,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19710
19525
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-lg,
19711
19526
  .pf-v6-c-toolbar__group.pf-m-hidden-on-lg,
19712
19527
  .pf-v6-c-toolbar__item.pf-m-hidden-on-lg,
19713
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-lg,
19714
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-lg {
19528
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-lg,
19529
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-lg {
19715
19530
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19716
19531
  }
19717
19532
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-lg,
19718
19533
  .pf-v6-c-toolbar__group.pf-m-visible-on-lg,
19719
19534
  .pf-v6-c-toolbar__item.pf-m-visible-on-lg,
19720
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-lg,
19721
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-lg {
19535
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-lg,
19536
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-lg {
19722
19537
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
19723
19538
  }
19724
19539
  }
@@ -19726,15 +19541,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19726
19541
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-xl,
19727
19542
  .pf-v6-c-toolbar__group.pf-m-hidden-on-xl,
19728
19543
  .pf-v6-c-toolbar__item.pf-m-hidden-on-xl,
19729
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-xl,
19730
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-xl {
19544
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-xl,
19545
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-xl {
19731
19546
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19732
19547
  }
19733
19548
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-xl,
19734
19549
  .pf-v6-c-toolbar__group.pf-m-visible-on-xl,
19735
19550
  .pf-v6-c-toolbar__item.pf-m-visible-on-xl,
19736
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-xl,
19737
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-xl {
19551
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-xl,
19552
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-xl {
19738
19553
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
19739
19554
  }
19740
19555
  }
@@ -19742,15 +19557,15 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19742
19557
  .pf-v6-c-toolbar__content-section.pf-m-hidden-on-2xl,
19743
19558
  .pf-v6-c-toolbar__group.pf-m-hidden-on-2xl,
19744
19559
  .pf-v6-c-toolbar__item.pf-m-hidden-on-2xl,
19745
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-hidden-on-2xl,
19746
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-hidden-on-2xl {
19560
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-hidden-on-2xl,
19561
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-hidden-on-2xl {
19747
19562
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
19748
19563
  }
19749
19564
  .pf-v6-c-toolbar__content-section.pf-m-visible-on-2xl,
19750
19565
  .pf-v6-c-toolbar__group.pf-m-visible-on-2xl,
19751
19566
  .pf-v6-c-toolbar__item.pf-m-visible-on-2xl,
19752
- .pf-v6-c-toolbar__group.pf-m-chip-group-container.pf-m-visible-on-2xl,
19753
- .pf-v6-c-toolbar__group.pf-m-chip-group.pf-m-visible-on-2xl {
19567
+ .pf-v6-c-toolbar__group.pf-m-label-group-container.pf-m-visible-on-2xl,
19568
+ .pf-v6-c-toolbar__group.pf-m-label-group.pf-m-visible-on-2xl {
19754
19569
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
19755
19570
  }
19756
19571
  }
@@ -19914,10 +19729,10 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19914
19729
  .pf-v6-c-toolbar__group.pf-m-filter-group {
19915
19730
  column-gap: var(--pf-v6-c-toolbar__group--m-filter-group--ColumnGap);
19916
19731
  }
19917
- .pf-v6-c-toolbar__group.pf-m-filter-group, .pf-v6-c-toolbar__group.pf-m-chip-group-container {
19732
+ .pf-v6-c-toolbar__group.pf-m-filter-group, .pf-v6-c-toolbar__group.pf-m-label-group-container {
19918
19733
  flex-wrap: nowrap;
19919
19734
  }
19920
- .pf-v6-c-toolbar__group.pf-m-chip-group {
19735
+ .pf-v6-c-toolbar__group.pf-m-label-group {
19921
19736
  flex: 1;
19922
19737
  }
19923
19738
  .pf-v6-c-toolbar__group.pf-m-overflow-container {
@@ -15,8 +15,6 @@
15
15
  @use "./CalendarMonth/calendar-month";
16
16
  @use "./Card/card";
17
17
  @use "./Check/check";
18
- @use "./Chip/chip";
19
- @use "./Chip/chip-group";
20
18
  @use "./ClipboardCopy/clipboard-copy";
21
19
  @use "./CodeBlock/code-block";
22
20
  @use "./CodeEditor/code-editor";
@@ -514,7 +514,7 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
514
514
  | Class | Applied to | Outcome |
515
515
  | -- | -- | -- |
516
516
  | `.pf-m-[show/hide][-on-[sm/md/lg/xl/2xl]]` | `.pf-v6-c-toolbar__group.pf-m-toggle-group`, `.pf-v6-c-toolbar__expandable-content` | Modifies toolbar element visibility. |
517
- | `.pf-m-chip-container` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group` | Modifies the toolbar element for applied filters layout. |
517
+ | `.pf-m-label-container` | `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group` | Modifies the toolbar element for applied filters layout. |
518
518
  | `.pf-m-expanded` | `.pf-v6-c-toolbar__expandable-content`, `.pf-v6-c-toolbar__toggle` | Modifies the component for the expanded state. |
519
519
 
520
520
  ### Selected
@@ -703,7 +703,7 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
703
703
  id="toolbar-selected-filters-toggle-group-collapsed-example-expandable-content"
704
704
  hidden
705
705
  >
706
- <div class="pf-v6-c-toolbar__group pf-m-chip-container">
706
+ <div class="pf-v6-c-toolbar__group pf-m-label-container">
707
707
  <div class="pf-v6-c-toolbar__group pf-m-grow">
708
708
  <div class="pf-v6-c-toolbar__item">
709
709
  <div class="pf-v6-c-label-group pf-m-category">
@@ -1085,7 +1085,7 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1085
1085
  </button>
1086
1086
  </div>
1087
1087
  </div>
1088
- <div class="pf-v6-c-toolbar__group pf-m-chip-container">
1088
+ <div class="pf-v6-c-toolbar__group pf-m-label-container">
1089
1089
  <div class="pf-v6-c-toolbar__group pf-m-grow">
1090
1090
  <div class="pf-v6-c-toolbar__item">
1091
1091
  <div class="pf-v6-c-label-group pf-m-category">
@@ -1449,7 +1449,7 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1449
1449
  </div>
1450
1450
  </div>
1451
1451
  </div>
1452
- <div class="pf-v6-c-toolbar__content pf-m-chip-container">
1452
+ <div class="pf-v6-c-toolbar__content pf-m-label-container">
1453
1453
  <div class="pf-v6-c-toolbar__group">
1454
1454
  <div class="pf-v6-c-toolbar__group">
1455
1455
  <div class="pf-v6-c-toolbar__item">
@@ -2421,7 +2421,7 @@ As the toolbar component is a hybrid layout and component, some of its elements
2421
2421
  | `.pf-m-expanded` | `.pf-v6-c-toolbar__item.pf-m-expand-all` | Modifies an expand all button for the expanded state. |
2422
2422
  | `.pf-m-icon-button-group` | `.pf-v6-c-toolbar__group` | Initiates icon button group spacing. |
2423
2423
  | `.pf-m-filter-group` | `.pf-v6-c-toolbar__group` | Initiates filter group spacing. |
2424
- | `.pf-m-chip-container` | `.pf-v6-c-toolbar__content`, `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group` | Modifies the toolbar element for applied filters layout. |
2424
+ | `.pf-m-label-container` | `.pf-v6-c-toolbar__content`, `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group` | Modifies the toolbar element for applied filters layout. |
2425
2425
  | `.pf-m-overflow-container` | `.pf-v6-c-toolbar__item`, `.pf-v6-c-toolbar__group` | Modifies the toolbar element to hide overflow and respond to available space. Used for horizontal navigation. |
2426
2426
  | `.pf-m-expanded` | `.pf-v6-c-toolbar__expandable-content`, `.pf-v6-c-toolbar__toggle` | Modifies the component for the expanded state. |
2427
2427
  | `.pf-m-[wrap/nowrap]` | `.pf-v6-c-toolbar__content`, `.pf-v6-c-toolbar__content-section`, `.pf-v6-c-toolbar__group`, `.pf-v6-c-toolbar__item` | Modifies the toolbar element to wrap/not wrap. |
@@ -2171,8 +2171,8 @@ section: components
2171
2171
  hidden
2172
2172
  ></div>
2173
2173
  </div>
2174
- <div class="pf-v6-c-toolbar__content pf-m-chip-container">
2175
- <div class="pf-v6-c-toolbar__item pf-m-chip-group">
2174
+ <div class="pf-v6-c-toolbar__content pf-m-label-container">
2175
+ <div class="pf-v6-c-toolbar__item pf-m-label-group">
2176
2176
  <div class="pf-v6-c-label-group pf-m-category">
2177
2177
  <div class="pf-v6-c-label-group__main">
2178
2178
  <span
@@ -2590,7 +2590,7 @@ section: components
2590
2590
  </div>
2591
2591
  </div>
2592
2592
  </div>
2593
- <div class="pf-v6-c-toolbar__item pf-m-chip-group">
2593
+ <div class="pf-v6-c-toolbar__item pf-m-label-group">
2594
2594
  <div class="pf-v6-c-label-group pf-m-category">
2595
2595
  <div class="pf-v6-c-label-group__main">
2596
2596
  <span
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.0.0-alpha.129",
4
+ "version": "6.0.0-alpha.130",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {