@patternfly/patternfly 6.3.0-prerelease.64 → 6.3.0-prerelease.65

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.
@@ -500,7 +500,7 @@ cssPrefix: pf-v6-c-clipboard-copy
500
500
  ```html
501
501
  <div class="pf-v6-c-clipboard-copy pf-m-inline pf-m-truncate">
502
502
  <span class="pf-v6-c-clipboard-copy__text">
503
- <span class="pf-v6-c-truncate">
503
+ <span class="pf-v6-c-truncate" tabindex="0">
504
504
  <span
505
505
  class="pf-v6-c-truncate__start"
506
506
  >This lengthy, copyable content will be truncated with default settings when the truncation prop is simply set to true. This is useful for quickly applying truncation without needing to worry about any other properties to set.</span>
@@ -1885,6 +1885,7 @@ When a list item includes more than one block of content, it can be difficult fo
1885
1885
  </div>
1886
1886
  <div
1887
1887
  class="pf-v6-c-data-list__cell pf-m-truncate"
1888
+ tabindex="0"
1888
1889
  >This text will truncate because it is very very long.</div>
1889
1890
  <div
1890
1891
  class="pf-v6-c-data-list__cell pf-m-break-word"
@@ -1898,15 +1899,19 @@ When a list item includes more than one block of content, it can be difficult fo
1898
1899
  <div class="pf-v6-c-data-list__item-content">
1899
1900
  <div
1900
1901
  class="pf-v6-c-data-list__cell"
1902
+ tabindex="0"
1901
1903
  >This text will truncate because it is very very long. This text will truncate because it is very very long.</div>
1902
1904
  <div
1903
1905
  class="pf-v6-c-data-list__cell"
1906
+ tabindex="0"
1904
1907
  >This text will truncate because it is very very long. This text will truncate because it is very very long.</div>
1905
1908
  <div
1906
1909
  class="pf-v6-c-data-list__cell"
1910
+ tabindex="0"
1907
1911
  >This text will truncate because it is very very long. This text will truncate because it is very very long.</div>
1908
1912
  <div
1909
1913
  class="pf-v6-c-data-list__cell"
1914
+ tabindex="0"
1910
1915
  >This text will truncate because it is very very long. This text will truncate because it is very very long.</div>
1911
1916
  </div>
1912
1917
  </div>
@@ -1957,6 +1962,7 @@ When a list item includes more than one block of content, it can be difficult fo
1957
1962
  >This text will wrap to the next line because it has the default behavior of the data list cell.</span>
1958
1963
  <span
1959
1964
  class="pf-v6-c-data-list__text pf-m-truncate"
1965
+ tabindex="0"
1960
1966
  >This is data list text, you can apply `pf-m-truncate` directly to the text. This is data list text, you can apply `pf-m-truncate` directly to the text.</span>
1961
1967
  </div>
1962
1968
  <div class="pf-v6-c-data-list__cell">
@@ -285,16 +285,6 @@ extra large
285
285
  <span class="pf-v6-c-icon__content">
286
286
  <i class="fas fa-check-circle" aria-hidden="true"></i>
287
287
  </span>
288
- <span class="pf-v6-c-icon__progress">
289
- <svg
290
- class="pf-v6-c-spinner pf-m-md"
291
- role="progressbar"
292
- viewBox="0 0 100 100"
293
- aria-label="Loading..."
294
- >
295
- <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
296
- </svg>
297
- </span>
298
288
  </span>
299
289
 
300
290
  ```
@@ -336,6 +336,7 @@ cssPrefix: pf-v6-c-progress
336
336
  <div
337
337
  class="pf-v6-c-progress__description pf-m-truncate"
338
338
  id="progress-truncate-description-example-description"
339
+ tabindex="0"
339
340
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean quis ultricies lectus, eu lobortis mauris. Morbi pretium arcu id rhoncus mollis. Donec accumsan tincidunt enim nec varius. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Suspendisse potenti.</div>
340
341
  <div class="pf-v6-c-progress__status" aria-hidden="true">
341
342
  <span class="pf-v6-c-progress__measure">33%</span>
@@ -425,7 +426,7 @@ If the status that displays with the bar is not a percentage, then the ARIA tag
425
426
  When conveying status, you should ensure:
426
427
 
427
428
  * There is visible helper text that explains the status.
428
- * The helper text includes the status icon, as seen in our [basic helper text example](/components/helper-text/html#basic).
429
+ * The helper text includes the status icon, as seen in our HTML [helper text component](/components/helper-text).
429
430
  * The helper text is linked to the `.pf-v6-c-progress__bar[role="progressbar"]` element via an `aria-describedby` attribute, as seen in the [progress helper text example](#helper-text).
430
431
 
431
432
  ### Success
@@ -8,13 +8,15 @@ cssPrefix: pf-v6-c-truncate
8
8
 
9
9
  The default behavior of the truncate component is to truncate based on whether the content can fit within the width of its parent container, and to prevent text from wrapping. The following examples that use this default behavior render the truncate component inside a resizable container, allowing you to see how the parent container width affects the truncation.
10
10
 
11
+ Note that when content is truncated, a tabindex of 0 should also be added to the element to ensure it remains accessible. The examples below however, add a tabindex in both cases as the content is static.
12
+
11
13
  ### Default
12
14
 
13
15
  When only the `.pf-v6-c-truncate__start` element is used, truncation will occur at the end of the string.
14
16
 
15
17
  ```html
16
18
  <div class="pf-v6-c-truncate--example">
17
- <span class="pf-v6-c-truncate">
19
+ <span class="pf-v6-c-truncate" tabindex="0">
18
20
  <span
19
21
  class="pf-v6-c-truncate__start"
20
22
  >redhat_logo_black_and_white_reversed_simple_with_fedora_container.zip</span>
@@ -29,7 +31,7 @@ When both `.pf-v6-c-truncate__start` and `.pf-v6-c-truncate__end` elements are u
29
31
 
30
32
  ```html
31
33
  <div class="pf-v6-c-truncate--example">
32
- <span class="pf-v6-c-truncate">
34
+ <span class="pf-v6-c-truncate" tabindex="0">
33
35
  <span
34
36
  class="pf-v6-c-truncate__start"
35
37
  >redhat_logo_black_and_white_reversed_simple_</span>
@@ -45,7 +47,7 @@ When only the `.pf-v6-c-truncate__end` element is used, truncation will occur at
45
47
 
46
48
  ```html
47
49
  <div class="pf-v6-c-truncate--example">
48
- <span class="pf-v6-c-truncate">
50
+ <span class="pf-v6-c-truncate" tabindex="0">
49
51
  <span
50
52
  class="pf-v6-c-truncate__end"
51
53
  >redhat_logo_black_and_white_reversed_simple_with_fedora_container.zip</span>
@@ -60,7 +62,7 @@ Apply the `.pf-m-fixed` class to the `.pf-v6-c-truncate` element to implement tr
60
62
 
61
63
  ```html
62
64
  <div>Truncated at end position:</div>
63
- <span class="pf-v6-c-truncate pf-m-fixed">
65
+ <span class="pf-v6-c-truncate pf-m-fixed" tabindex="0">
64
66
  <span
65
67
  class="pf-v6-c-truncate__text"
66
68
  >redhat_logo_black_and_white_reversed_simple_with_</span>
@@ -70,7 +72,7 @@ Apply the `.pf-m-fixed` class to the `.pf-v6-c-truncate` element to implement tr
70
72
  <br />
71
73
  <br />
72
74
  <div>Truncated at middle position:</div>
73
- <span class="pf-v6-c-truncate pf-m-fixed">
75
+ <span class="pf-v6-c-truncate pf-m-fixed" tabindex="0">
74
76
  <span class="pf-v6-c-truncate__text">redhat_logo_black_and_</span>
75
77
  <span class="pf-v6-screen-reader">white_reversed_simple_with_</span>
76
78
 
@@ -80,7 +82,7 @@ Apply the `.pf-m-fixed` class to the `.pf-v6-c-truncate` element to implement tr
80
82
  <br />
81
83
  <br />
82
84
  <div>Truncated at start position:</div>
83
- <span class="pf-v6-c-truncate pf-m-fixed">
85
+ <span class="pf-v6-c-truncate pf-m-fixed" tabindex="0">
84
86
  <span class="pf-v6-screen-reader">redhat_logo_black_</span>
85
87
 
86
88
  <span class="pf-v6-c-truncate__omission" aria-hidden="true">&hellip;</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.3.0-prerelease.64",
4
+ "version": "6.3.0-prerelease.65",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "engines": {
@@ -51,7 +51,7 @@
51
51
  "@commitlint/config-conventional": "^19.1.0",
52
52
  "@fortawesome/fontawesome": "^1.1.8",
53
53
  "@octokit/rest": "^20.1.0",
54
- "@patternfly/documentation-framework": "6.22.4",
54
+ "@patternfly/documentation-framework": "6.22.5",
55
55
  "@patternfly/patternfly-a11y": "5.1.0",
56
56
  "@patternfly/react-code-editor": "6.3.1",
57
57
  "@patternfly/react-core": "6.3.1",