@patternfly/patternfly 5.1.0-prerelease.1 → 5.1.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.
- package/docs/components/Chip/examples/Chip.md +30 -10
- package/docs/components/Select/deprecated/Select.md +3 -3
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +2 -2
- package/docs/components/Toolbar/examples/Toolbar.md +6 -12
- package/docs/demos/Toolbar/examples/Toolbar.md +2 -4
- package/package.json +1 -1
|
@@ -93,7 +93,11 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
93
93
|
### Simple inline chip group with overflow
|
|
94
94
|
|
|
95
95
|
```html
|
|
96
|
-
<div
|
|
96
|
+
<div
|
|
97
|
+
class="pf-v5-c-chip-group"
|
|
98
|
+
role="group"
|
|
99
|
+
aria-label="simple inline chip group with overflow"
|
|
100
|
+
>
|
|
97
101
|
<div class="pf-v5-c-chip-group__main">
|
|
98
102
|
<ul
|
|
99
103
|
class="pf-v5-c-chip-group__list"
|
|
@@ -179,7 +183,11 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
179
183
|
### Simple inline chip group expanded
|
|
180
184
|
|
|
181
185
|
```html
|
|
182
|
-
<div
|
|
186
|
+
<div
|
|
187
|
+
class="pf-v5-c-chip-group"
|
|
188
|
+
role="group"
|
|
189
|
+
aria-label="simple inline chip group expanded"
|
|
190
|
+
>
|
|
183
191
|
<div class="pf-v5-c-chip-group__main">
|
|
184
192
|
<ul
|
|
185
193
|
class="pf-v5-c-chip-group__list"
|
|
@@ -307,11 +315,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
307
315
|
### Chip group with categories
|
|
308
316
|
|
|
309
317
|
```html
|
|
310
|
-
<div
|
|
318
|
+
<div
|
|
319
|
+
class="pf-v5-c-chip-group pf-m-category"
|
|
320
|
+
role="group"
|
|
321
|
+
aria-labelledby="chip-group-with-categories-label"
|
|
322
|
+
>
|
|
311
323
|
<div class="pf-v5-c-chip-group__main">
|
|
312
324
|
<span
|
|
313
325
|
class="pf-v5-c-chip-group__label"
|
|
314
|
-
aria-hidden="true"
|
|
315
326
|
id="chip-group-with-categories-label"
|
|
316
327
|
>Category one</span>
|
|
317
328
|
<ul
|
|
@@ -391,11 +402,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
391
402
|
### Chip group with categories and overflow
|
|
392
403
|
|
|
393
404
|
```html
|
|
394
|
-
<div
|
|
405
|
+
<div
|
|
406
|
+
class="pf-v5-c-chip-group pf-m-category"
|
|
407
|
+
role="group"
|
|
408
|
+
aria-labelledby="chip-group-with-categories-overflow-label"
|
|
409
|
+
>
|
|
395
410
|
<div class="pf-v5-c-chip-group__main">
|
|
396
411
|
<span
|
|
397
412
|
class="pf-v5-c-chip-group__label"
|
|
398
|
-
aria-hidden="true"
|
|
399
413
|
id="chip-group-with-categories-overflow-label"
|
|
400
414
|
>Category one</span>
|
|
401
415
|
<ul
|
|
@@ -482,11 +496,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
482
496
|
### Chip group with categories and overflow expanded
|
|
483
497
|
|
|
484
498
|
```html
|
|
485
|
-
<div
|
|
499
|
+
<div
|
|
500
|
+
class="pf-v5-c-chip-group pf-m-category"
|
|
501
|
+
role="group"
|
|
502
|
+
aria-labelledby="chip-group-with-categories-overflow-expanded-label"
|
|
503
|
+
>
|
|
486
504
|
<div class="pf-v5-c-chip-group__main">
|
|
487
505
|
<span
|
|
488
506
|
class="pf-v5-c-chip-group__label"
|
|
489
|
-
aria-hidden="true"
|
|
490
507
|
id="chip-group-with-categories-overflow-expanded-label"
|
|
491
508
|
>Category one</span>
|
|
492
509
|
<ul
|
|
@@ -615,11 +632,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
|
|
|
615
632
|
### Chip group with removable categories
|
|
616
633
|
|
|
617
634
|
```html
|
|
618
|
-
<div
|
|
635
|
+
<div
|
|
636
|
+
class="pf-v5-c-chip-group pf-m-category"
|
|
637
|
+
role="group"
|
|
638
|
+
aria-labelledby="chip-group-with-categories-removable-label"
|
|
639
|
+
>
|
|
619
640
|
<div class="pf-v5-c-chip-group__main">
|
|
620
641
|
<span
|
|
621
642
|
class="pf-v5-c-chip-group__label"
|
|
622
|
-
aria-hidden="true"
|
|
623
643
|
id="chip-group-with-categories-removable-label"
|
|
624
644
|
>Category one</span>
|
|
625
645
|
<ul
|
|
@@ -1022,7 +1022,7 @@ The single select typeahead should be used when the user is selecting one option
|
|
|
1022
1022
|
|
|
1023
1023
|
<div class="pf-v5-c-select__toggle pf-m-typeahead">
|
|
1024
1024
|
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1025
|
-
<div class="pf-v5-c-chip-group">
|
|
1025
|
+
<div class="pf-v5-c-chip-group" role="group">
|
|
1026
1026
|
<div class="pf-v5-c-chip-group__main">
|
|
1027
1027
|
<ul
|
|
1028
1028
|
class="pf-v5-c-chip-group__list"
|
|
@@ -1208,7 +1208,7 @@ The single select typeahead should be used when the user is selecting one option
|
|
|
1208
1208
|
|
|
1209
1209
|
<div class="pf-v5-c-select__toggle pf-m-typeahead">
|
|
1210
1210
|
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1211
|
-
<div class="pf-v5-c-chip-group">
|
|
1211
|
+
<div class="pf-v5-c-chip-group" role="group">
|
|
1212
1212
|
<div class="pf-v5-c-chip-group__main">
|
|
1213
1213
|
<ul
|
|
1214
1214
|
class="pf-v5-c-chip-group__list"
|
|
@@ -1350,7 +1350,7 @@ The single select typeahead should be used when the user is selecting one option
|
|
|
1350
1350
|
|
|
1351
1351
|
<div class="pf-v5-c-select__toggle pf-m-typeahead">
|
|
1352
1352
|
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1353
|
-
<div class="pf-v5-c-chip-group">
|
|
1353
|
+
<div class="pf-v5-c-chip-group" role="group">
|
|
1354
1354
|
<div class="pf-v5-c-chip-group__main">
|
|
1355
1355
|
<ul
|
|
1356
1356
|
class="pf-v5-c-chip-group__list"
|
|
@@ -79,7 +79,7 @@ cssPrefix: pf-v5-c-text-input-group
|
|
|
79
79
|
```html
|
|
80
80
|
<div class="pf-v5-c-text-input-group">
|
|
81
81
|
<div class="pf-v5-c-text-input-group__main">
|
|
82
|
-
<div class="pf-v5-c-chip-group">
|
|
82
|
+
<div class="pf-v5-c-chip-group" role="group">
|
|
83
83
|
<div class="pf-v5-c-chip-group__main">
|
|
84
84
|
<ul
|
|
85
85
|
class="pf-v5-c-chip-group__list"
|
|
@@ -249,7 +249,7 @@ cssPrefix: pf-v5-c-text-input-group
|
|
|
249
249
|
```html
|
|
250
250
|
<div class="pf-v5-c-text-input-group">
|
|
251
251
|
<div class="pf-v5-c-text-input-group__main">
|
|
252
|
-
<div class="pf-v5-c-chip-group">
|
|
252
|
+
<div class="pf-v5-c-chip-group" role="group">
|
|
253
253
|
<div class="pf-v5-c-chip-group__main">
|
|
254
254
|
<ul
|
|
255
255
|
class="pf-v5-c-chip-group__list"
|
|
@@ -1551,11 +1551,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
1551
1551
|
>
|
|
1552
1552
|
<div class="pf-v5-c-toolbar__group pf-m-chip-container">
|
|
1553
1553
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
1554
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
1554
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
1555
1555
|
<div class="pf-v5-c-chip-group__main">
|
|
1556
1556
|
<span
|
|
1557
1557
|
class="pf-v5-c-chip-group__label"
|
|
1558
|
-
aria-hidden="true"
|
|
1559
1558
|
id="toolbar-selected-filters-toggle-group-collapsed-example-chip-group-status-chip-group-label"
|
|
1560
1559
|
>Status</span>
|
|
1561
1560
|
<ul
|
|
@@ -1631,11 +1630,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
1631
1630
|
</div>
|
|
1632
1631
|
</div>
|
|
1633
1632
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
1634
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
1633
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
1635
1634
|
<div class="pf-v5-c-chip-group__main">
|
|
1636
1635
|
<span
|
|
1637
1636
|
class="pf-v5-c-chip-group__label"
|
|
1638
|
-
aria-hidden="true"
|
|
1639
1637
|
id="toolbar-selected-filters-toggle-group-collapsed-example-chip-group-risk-chip-group-label"
|
|
1640
1638
|
>Risk</span>
|
|
1641
1639
|
<ul
|
|
@@ -2138,11 +2136,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
2138
2136
|
<div class="pf-v5-c-toolbar__group pf-m-chip-container">
|
|
2139
2137
|
<div class="pf-v5-c-toolbar__group">
|
|
2140
2138
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2141
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2139
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2142
2140
|
<div class="pf-v5-c-chip-group__main">
|
|
2143
2141
|
<span
|
|
2144
2142
|
class="pf-v5-c-chip-group__label"
|
|
2145
|
-
aria-hidden="true"
|
|
2146
2143
|
id="toolbar-selected-filters-toggle-group-expanded-example-chip-group-status-chip-group-label"
|
|
2147
2144
|
>Status</span>
|
|
2148
2145
|
<ul
|
|
@@ -2218,11 +2215,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
2218
2215
|
</div>
|
|
2219
2216
|
</div>
|
|
2220
2217
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2221
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2218
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2222
2219
|
<div class="pf-v5-c-chip-group__main">
|
|
2223
2220
|
<span
|
|
2224
2221
|
class="pf-v5-c-chip-group__label"
|
|
2225
|
-
aria-hidden="true"
|
|
2226
2222
|
id="toolbar-selected-filters-toggle-group-expanded-example-chip-group-risk-chip-group-label"
|
|
2227
2223
|
>Risk</span>
|
|
2228
2224
|
<ul
|
|
@@ -2676,11 +2672,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
2676
2672
|
<div class="pf-v5-c-toolbar__content pf-m-chip-container">
|
|
2677
2673
|
<div class="pf-v5-c-toolbar__group">
|
|
2678
2674
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2679
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2675
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2680
2676
|
<div class="pf-v5-c-chip-group__main">
|
|
2681
2677
|
<span
|
|
2682
2678
|
class="pf-v5-c-chip-group__label"
|
|
2683
|
-
aria-hidden="true"
|
|
2684
2679
|
id="toolbar-selected-filters-example-chip-group-status-chip-group-label"
|
|
2685
2680
|
>Status</span>
|
|
2686
2681
|
<ul
|
|
@@ -2756,11 +2751,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
|
|
|
2756
2751
|
</div>
|
|
2757
2752
|
</div>
|
|
2758
2753
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2759
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2754
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2760
2755
|
<div class="pf-v5-c-chip-group__main">
|
|
2761
2756
|
<span
|
|
2762
2757
|
class="pf-v5-c-chip-group__label"
|
|
2763
|
-
aria-hidden="true"
|
|
2764
2758
|
id="toolbar-selected-filters-example-chip-group-risk-chip-group-label"
|
|
2765
2759
|
>Risk</span>
|
|
2766
2760
|
<ul
|
|
@@ -2392,11 +2392,10 @@ section: components
|
|
|
2392
2392
|
</div>
|
|
2393
2393
|
<div class="pf-v5-c-toolbar__content pf-m-chip-container">
|
|
2394
2394
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2395
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2395
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2396
2396
|
<div class="pf-v5-c-chip-group__main">
|
|
2397
2397
|
<span
|
|
2398
2398
|
class="pf-v5-c-chip-group__label"
|
|
2399
|
-
aria-hidden="true"
|
|
2400
2399
|
id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-group-chip-group-label"
|
|
2401
2400
|
>Status</span>
|
|
2402
2401
|
<ul
|
|
@@ -2782,11 +2781,10 @@ section: components
|
|
|
2782
2781
|
</div>
|
|
2783
2782
|
</div>
|
|
2784
2783
|
<div class="pf-v5-c-toolbar__item pf-m-chip-group">
|
|
2785
|
-
<div class="pf-v5-c-chip-group pf-m-category">
|
|
2784
|
+
<div class="pf-v5-c-chip-group pf-m-category" role="group">
|
|
2786
2785
|
<div class="pf-v5-c-chip-group__main">
|
|
2787
2786
|
<span
|
|
2788
2787
|
class="pf-v5-c-chip-group__label"
|
|
2789
|
-
aria-hidden="true"
|
|
2790
2788
|
id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-group-chip-group-label"
|
|
2791
2789
|
>Status</span>
|
|
2792
2790
|
<ul
|