@patternfly/react-data-view 7.0.0-prerelease.1 → 7.0.0-prerelease.3

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 (156) hide show
  1. package/dist/cjs/DataView/DataView.d.ts +12 -0
  2. package/dist/cjs/DataView/DataView.js +14 -3
  3. package/dist/cjs/DataView/DataView.test.js +3 -4
  4. package/dist/cjs/DataViewEventsContext/DataViewEventsContext.d.ts +16 -0
  5. package/dist/cjs/DataViewEventsContext/DataViewEventsContext.js +62 -0
  6. package/dist/cjs/DataViewEventsContext/DataViewEventsContext.test.d.ts +1 -0
  7. package/dist/cjs/DataViewEventsContext/DataViewEventsContext.test.js +72 -0
  8. package/dist/cjs/DataViewEventsContext/index.d.ts +2 -0
  9. package/dist/cjs/DataViewEventsContext/index.js +23 -0
  10. package/dist/cjs/DataViewTable/DataViewTable.d.ts +41 -0
  11. package/dist/cjs/DataViewTable/DataViewTable.js +18 -0
  12. package/dist/cjs/DataViewTable/DataViewTable.test.d.ts +1 -0
  13. package/dist/cjs/DataViewTable/DataViewTable.test.js +57 -0
  14. package/dist/cjs/DataViewTable/index.d.ts +2 -0
  15. package/dist/cjs/DataViewTable/index.js +23 -0
  16. package/dist/cjs/DataViewTableBasic/DataViewTableBasic.d.ts +18 -0
  17. package/dist/cjs/DataViewTableBasic/DataViewTableBasic.js +71 -0
  18. package/dist/cjs/DataViewTableBasic/DataViewTableBasic.test.d.ts +1 -0
  19. package/dist/cjs/DataViewTableBasic/DataViewTableBasic.test.js +43 -0
  20. package/dist/cjs/DataViewTableBasic/index.d.ts +2 -0
  21. package/dist/cjs/DataViewTableBasic/index.js +23 -0
  22. package/dist/cjs/DataViewTableHead/DataViewTableHead.d.ts +13 -0
  23. package/dist/cjs/DataViewTableHead/DataViewTableHead.js +57 -0
  24. package/dist/cjs/DataViewTableHead/DataViewTableHead.test.d.ts +1 -0
  25. package/dist/cjs/DataViewTableHead/DataViewTableHead.test.js +36 -0
  26. package/dist/cjs/DataViewTableHead/index.d.ts +2 -0
  27. package/dist/cjs/DataViewTableHead/index.js +23 -0
  28. package/dist/cjs/DataViewTableTree/DataViewTableTree.d.ts +24 -0
  29. package/dist/cjs/DataViewTableTree/DataViewTableTree.js +132 -0
  30. package/dist/cjs/DataViewTableTree/DataViewTableTree.test.d.ts +1 -0
  31. package/dist/cjs/DataViewTableTree/DataViewTableTree.test.js +90 -0
  32. package/dist/cjs/DataViewTableTree/index.d.ts +2 -0
  33. package/dist/cjs/DataViewTableTree/index.js +23 -0
  34. package/dist/cjs/DataViewToolbar/DataViewToolbar.d.ts +2 -0
  35. package/dist/cjs/DataViewToolbar/DataViewToolbar.js +2 -1
  36. package/dist/cjs/Hooks/pagination.d.ts +9 -5
  37. package/dist/cjs/Hooks/pagination.js +8 -8
  38. package/dist/cjs/Hooks/pagination.test.js +0 -52
  39. package/dist/cjs/Hooks/selection.d.ts +3 -3
  40. package/dist/cjs/Hooks/selection.js +4 -6
  41. package/dist/cjs/Hooks/selection.test.js +4 -4
  42. package/dist/cjs/InternalContext/InternalContext.d.ts +25 -0
  43. package/dist/cjs/InternalContext/InternalContext.js +40 -0
  44. package/dist/cjs/InternalContext/InternalContext.test.d.ts +1 -0
  45. package/dist/cjs/InternalContext/InternalContext.test.js +56 -0
  46. package/dist/cjs/InternalContext/index.d.ts +2 -0
  47. package/dist/cjs/InternalContext/index.js +23 -0
  48. package/dist/cjs/index.d.ts +12 -0
  49. package/dist/cjs/index.js +20 -2
  50. package/dist/dynamic/DataViewEventsContext/package.json +1 -0
  51. package/dist/dynamic/DataViewTable/package.json +1 -0
  52. package/dist/dynamic/DataViewTableBasic/package.json +1 -0
  53. package/dist/dynamic/DataViewTableHead/package.json +1 -0
  54. package/dist/dynamic/DataViewTableTree/package.json +1 -0
  55. package/dist/dynamic/InternalContext/package.json +1 -0
  56. package/dist/esm/DataView/DataView.d.ts +12 -0
  57. package/dist/esm/DataView/DataView.js +13 -2
  58. package/dist/esm/DataView/DataView.test.js +3 -4
  59. package/dist/esm/DataViewEventsContext/DataViewEventsContext.d.ts +16 -0
  60. package/dist/esm/DataViewEventsContext/DataViewEventsContext.js +34 -0
  61. package/dist/esm/DataViewEventsContext/DataViewEventsContext.test.d.ts +1 -0
  62. package/dist/esm/DataViewEventsContext/DataViewEventsContext.test.js +67 -0
  63. package/dist/esm/DataViewEventsContext/index.d.ts +2 -0
  64. package/dist/esm/DataViewEventsContext/index.js +2 -0
  65. package/dist/esm/DataViewTable/DataViewTable.d.ts +41 -0
  66. package/dist/esm/DataViewTable/DataViewTable.js +8 -0
  67. package/dist/esm/DataViewTable/DataViewTable.test.d.ts +1 -0
  68. package/dist/esm/DataViewTable/DataViewTable.test.js +52 -0
  69. package/dist/esm/DataViewTable/index.d.ts +2 -0
  70. package/dist/esm/DataViewTable/index.js +2 -0
  71. package/dist/esm/DataViewTableBasic/DataViewTableBasic.d.ts +18 -0
  72. package/dist/esm/DataViewTableBasic/DataViewTableBasic.js +44 -0
  73. package/dist/esm/DataViewTableBasic/DataViewTableBasic.test.d.ts +1 -0
  74. package/dist/esm/DataViewTableBasic/DataViewTableBasic.test.js +38 -0
  75. package/dist/esm/DataViewTableBasic/index.d.ts +2 -0
  76. package/dist/esm/DataViewTableBasic/index.js +2 -0
  77. package/dist/esm/DataViewTableHead/DataViewTableHead.d.ts +13 -0
  78. package/dist/esm/DataViewTableHead/DataViewTableHead.js +30 -0
  79. package/dist/esm/DataViewTableHead/DataViewTableHead.test.d.ts +1 -0
  80. package/dist/esm/DataViewTableHead/DataViewTableHead.test.js +31 -0
  81. package/dist/esm/DataViewTableHead/index.d.ts +2 -0
  82. package/dist/esm/DataViewTableHead/index.js +2 -0
  83. package/dist/esm/DataViewTableTree/DataViewTableTree.d.ts +24 -0
  84. package/dist/esm/DataViewTableTree/DataViewTableTree.js +105 -0
  85. package/dist/esm/DataViewTableTree/DataViewTableTree.test.d.ts +1 -0
  86. package/dist/esm/DataViewTableTree/DataViewTableTree.test.js +85 -0
  87. package/dist/esm/DataViewTableTree/index.d.ts +2 -0
  88. package/dist/esm/DataViewTableTree/index.js +2 -0
  89. package/dist/esm/DataViewToolbar/DataViewToolbar.d.ts +2 -0
  90. package/dist/esm/DataViewToolbar/DataViewToolbar.js +2 -1
  91. package/dist/esm/Hooks/pagination.d.ts +9 -5
  92. package/dist/esm/Hooks/pagination.js +9 -9
  93. package/dist/esm/Hooks/pagination.test.js +0 -52
  94. package/dist/esm/Hooks/selection.d.ts +3 -3
  95. package/dist/esm/Hooks/selection.js +4 -6
  96. package/dist/esm/Hooks/selection.test.js +4 -4
  97. package/dist/esm/InternalContext/InternalContext.d.ts +25 -0
  98. package/dist/esm/InternalContext/InternalContext.js +12 -0
  99. package/dist/esm/InternalContext/InternalContext.test.d.ts +1 -0
  100. package/dist/esm/InternalContext/InternalContext.test.js +51 -0
  101. package/dist/esm/InternalContext/index.d.ts +2 -0
  102. package/dist/esm/InternalContext/index.js +2 -0
  103. package/dist/esm/index.d.ts +12 -0
  104. package/dist/esm/index.js +12 -0
  105. package/dist/tsconfig.tsbuildinfo +1 -0
  106. package/package.json +11 -10
  107. package/patternfly-docs/content/extensions/data-view/examples/Components/Components.md +80 -5
  108. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewTableEmptyExample.tsx +57 -0
  109. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewTableErrorExample.tsx +45 -0
  110. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewTableExample.tsx +67 -0
  111. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewTableLoadingExample.tsx +27 -0
  112. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewTableTreeExample.tsx +71 -0
  113. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewToolbarActionsExample.tsx +27 -0
  114. package/patternfly-docs/content/extensions/data-view/examples/Components/DataViewToolbarExample.tsx +4 -4
  115. package/patternfly-docs/content/extensions/data-view/examples/EventsContext/EventsContext.md +32 -0
  116. package/patternfly-docs/content/extensions/data-view/examples/EventsContext/EventsExample.tsx +108 -0
  117. package/patternfly-docs/content/extensions/data-view/examples/Functionality/Functionality.md +12 -11
  118. package/patternfly-docs/content/extensions/data-view/examples/Functionality/PaginationExample.tsx +20 -37
  119. package/patternfly-docs/content/extensions/data-view/examples/Functionality/SelectionExample.tsx +15 -46
  120. package/patternfly-docs/content/extensions/data-view/examples/Layout/AbstractLayoutExample.tsx +3 -4
  121. package/patternfly-docs/content/extensions/data-view/examples/Layout/Layout.md +2 -1
  122. package/patternfly-docs/content/extensions/data-view/examples/Layout/PredefinedLayoutExample.tsx +20 -51
  123. package/patternfly-docs/pages/index.js +1 -1
  124. package/release.config.js +1 -5
  125. package/src/DataView/DataView.test.tsx +3 -4
  126. package/src/DataView/DataView.tsx +25 -3
  127. package/src/DataView/__snapshots__/DataView.test.tsx.snap +16 -16
  128. package/src/DataViewEventsContext/DataViewEventsContext.test.tsx +105 -0
  129. package/src/DataViewEventsContext/DataViewEventsContext.tsx +70 -0
  130. package/src/DataViewEventsContext/index.ts +2 -0
  131. package/src/DataViewTable/DataViewTable.test.tsx +80 -0
  132. package/src/DataViewTable/DataViewTable.tsx +37 -0
  133. package/src/DataViewTable/__snapshots__/DataViewTable.test.tsx.snap +1042 -0
  134. package/src/DataViewTable/index.ts +2 -0
  135. package/src/DataViewTableBasic/DataViewTableBasic.test.tsx +65 -0
  136. package/src/DataViewTableBasic/DataViewTableBasic.tsx +82 -0
  137. package/src/DataViewTableBasic/__snapshots__/DataViewTableBasic.test.tsx.snap +555 -0
  138. package/src/DataViewTableBasic/index.ts +2 -0
  139. package/src/DataViewTableHead/DataViewTableHead.test.tsx +50 -0
  140. package/src/DataViewTableHead/DataViewTableHead.tsx +53 -0
  141. package/src/DataViewTableHead/__snapshots__/DataViewTableHead.test.tsx.snap +227 -0
  142. package/src/DataViewTableHead/index.ts +2 -0
  143. package/src/DataViewTableTree/DataViewTableTree.test.tsx +113 -0
  144. package/src/DataViewTableTree/DataViewTableTree.tsx +164 -0
  145. package/src/DataViewTableTree/__snapshots__/DataViewTableTree.test.tsx.snap +1200 -0
  146. package/src/DataViewTableTree/index.ts +2 -0
  147. package/src/DataViewToolbar/DataViewToolbar.tsx +9 -2
  148. package/src/DataViewToolbar/__snapshots__/DataViewToolbar.test.tsx.snap +208 -166
  149. package/src/Hooks/pagination.test.tsx +0 -80
  150. package/src/Hooks/pagination.ts +22 -16
  151. package/src/Hooks/selection.test.tsx +5 -5
  152. package/src/Hooks/selection.ts +6 -7
  153. package/src/InternalContext/InternalContext.test.tsx +89 -0
  154. package/src/InternalContext/InternalContext.tsx +51 -0
  155. package/src/InternalContext/index.ts +2 -0
  156. package/src/index.ts +18 -0
@@ -6,32 +6,32 @@ exports[`DataViewToolbar component should render correctly 1`] = `
6
6
  "baseElement": <body>
7
7
  <div>
8
8
  <div
9
- class="pf-v5-c-toolbar"
9
+ class="pf-v6-c-toolbar"
10
10
  data-ouia-component-id="DataViewToolbar"
11
- data-ouia-component-type="PF5/Toolbar"
11
+ data-ouia-component-type="PF6/Toolbar"
12
12
  data-ouia-safe="true"
13
13
  id="pf-random-id-0"
14
14
  >
15
15
  <div
16
- class="pf-v5-c-toolbar__content"
16
+ class="pf-v6-c-toolbar__content"
17
17
  >
18
18
  <div
19
- class="pf-v5-c-toolbar__content-section"
19
+ class="pf-v6-c-toolbar__content-section"
20
20
  >
21
21
  <div
22
- class="pf-v5-c-toolbar__item pf-m-pagination"
22
+ class="pf-v6-c-toolbar__item pf-m-pagination"
23
23
  data-ouia-component-id="DataViewToolbar-pagination"
24
24
  >
25
25
  <div
26
- class="pf-v5-c-pagination"
26
+ class="pf-v6-c-pagination"
27
27
  data-ouia-component-id="OUIA-Generated-Pagination-top-1"
28
- data-ouia-component-type="PF5/Pagination"
28
+ data-ouia-component-type="PF6/Pagination"
29
29
  data-ouia-safe="true"
30
30
  id="options-menu-top-pagination"
31
- style="--pf-v5-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
31
+ style="--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
32
32
  >
33
33
  <div
34
- class="pf-v5-c-pagination__total-items"
34
+ class="pf-v6-c-pagination__total-items"
35
35
  >
36
36
  <b>
37
37
  1
@@ -46,16 +46,21 @@ exports[`DataViewToolbar component should render correctly 1`] = `
46
46
  </b>
47
47
 
48
48
  </div>
49
- <div>
49
+ <div
50
+ class="pf-v6-c-pagination__page-menu"
51
+ >
50
52
  <button
51
53
  aria-expanded="false"
52
54
  aria-haspopup="listbox"
53
- class="pf-v5-c-menu-toggle pf-m-plain pf-m-text"
55
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
56
+ data-ouia-component-id="OUIA-Generated-MenuToggle-plainText-1"
57
+ data-ouia-component-type="PF6/MenuToggle"
58
+ data-ouia-safe="true"
54
59
  id="options-menu-top-toggle"
55
60
  type="button"
56
61
  >
57
62
  <span
58
- class="pf-v5-c-menu-toggle__text"
63
+ class="pf-v6-c-menu-toggle__text"
59
64
  >
60
65
  <b>
61
66
  1
@@ -71,14 +76,14 @@ exports[`DataViewToolbar component should render correctly 1`] = `
71
76
 
72
77
  </span>
73
78
  <span
74
- class="pf-v5-c-menu-toggle__controls"
79
+ class="pf-v6-c-menu-toggle__controls"
75
80
  >
76
81
  <span
77
- class="pf-v5-c-menu-toggle__toggle-icon"
82
+ class="pf-v6-c-menu-toggle__toggle-icon"
78
83
  >
79
84
  <svg
80
85
  aria-hidden="true"
81
- class="pf-v5-svg"
86
+ class="pf-v6-svg"
82
87
  fill="currentColor"
83
88
  height="1em"
84
89
  role="img"
@@ -95,77 +100,85 @@ exports[`DataViewToolbar component should render correctly 1`] = `
95
100
  </div>
96
101
  <nav
97
102
  aria-label="Pagination"
98
- class="pf-v5-c-pagination__nav"
103
+ class="pf-v6-c-pagination__nav"
99
104
  >
100
105
  <div
101
- class="pf-v5-c-pagination__nav-control pf-m-first"
106
+ class="pf-v6-c-pagination__nav-control pf-m-first"
102
107
  >
103
108
  <button
104
- aria-disabled="true"
109
+ aria-disabled="false"
105
110
  aria-label="Go to first page"
106
- class="pf-v5-c-button pf-m-plain pf-m-disabled"
111
+ class="pf-v6-c-button pf-m-plain"
107
112
  data-action="first"
108
113
  data-ouia-component-id="OUIA-Generated-Button-plain-1"
109
- data-ouia-component-type="PF5/Button"
114
+ data-ouia-component-type="PF6/Button"
110
115
  data-ouia-safe="true"
111
116
  disabled=""
112
117
  type="button"
113
118
  >
114
- <svg
115
- aria-hidden="true"
116
- class="pf-v5-svg"
117
- fill="currentColor"
118
- height="1em"
119
- role="img"
120
- viewBox="0 0 448 512"
121
- width="1em"
119
+ <span
120
+ class="pf-v6-c-button__icon"
122
121
  >
123
- <path
124
- d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
125
- />
126
- </svg>
122
+ <svg
123
+ aria-hidden="true"
124
+ class="pf-v6-svg"
125
+ fill="currentColor"
126
+ height="1em"
127
+ role="img"
128
+ viewBox="0 0 448 512"
129
+ width="1em"
130
+ >
131
+ <path
132
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
133
+ />
134
+ </svg>
135
+ </span>
127
136
  </button>
128
137
  </div>
129
138
  <div
130
- class="pf-v5-c-pagination__nav-control"
139
+ class="pf-v6-c-pagination__nav-control"
131
140
  >
132
141
  <button
133
- aria-disabled="true"
142
+ aria-disabled="false"
134
143
  aria-label="Go to previous page"
135
- class="pf-v5-c-button pf-m-plain pf-m-disabled"
144
+ class="pf-v6-c-button pf-m-plain"
136
145
  data-action="previous"
137
146
  data-ouia-component-id="OUIA-Generated-Button-plain-2"
138
- data-ouia-component-type="PF5/Button"
147
+ data-ouia-component-type="PF6/Button"
139
148
  data-ouia-safe="true"
140
149
  disabled=""
141
150
  type="button"
142
151
  >
143
- <svg
144
- aria-hidden="true"
145
- class="pf-v5-svg"
146
- fill="currentColor"
147
- height="1em"
148
- role="img"
149
- viewBox="0 0 256 512"
150
- width="1em"
152
+ <span
153
+ class="pf-v6-c-button__icon"
151
154
  >
152
- <path
153
- d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
154
- />
155
- </svg>
155
+ <svg
156
+ aria-hidden="true"
157
+ class="pf-v6-svg"
158
+ fill="currentColor"
159
+ height="1em"
160
+ role="img"
161
+ viewBox="0 0 256 512"
162
+ width="1em"
163
+ >
164
+ <path
165
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
166
+ />
167
+ </svg>
168
+ </span>
156
169
  </button>
157
170
  </div>
158
171
  <div
159
- class="pf-v5-c-pagination__nav-page-select"
172
+ class="pf-v6-c-pagination__nav-page-select"
160
173
  >
161
174
  <span
162
- class="pf-v5-c-form-control"
175
+ class="pf-v6-c-form-control"
163
176
  >
164
177
  <input
165
178
  aria-invalid="false"
166
179
  aria-label="Current page"
167
180
  data-ouia-component-id="OUIA-Generated-TextInputBase-1"
168
- data-ouia-component-type="PF5/TextInput"
181
+ data-ouia-component-type="PF6/TextInput"
169
182
  data-ouia-safe="true"
170
183
  max="2"
171
184
  min="1"
@@ -175,59 +188,67 @@ exports[`DataViewToolbar component should render correctly 1`] = `
175
188
  </span>
176
189
  </div>
177
190
  <div
178
- class="pf-v5-c-pagination__nav-control"
191
+ class="pf-v6-c-pagination__nav-control"
179
192
  >
180
193
  <button
181
194
  aria-disabled="false"
182
195
  aria-label="Go to next page"
183
- class="pf-v5-c-button pf-m-plain"
196
+ class="pf-v6-c-button pf-m-plain"
184
197
  data-action="next"
185
198
  data-ouia-component-id="OUIA-Generated-Button-plain-3"
186
- data-ouia-component-type="PF5/Button"
199
+ data-ouia-component-type="PF6/Button"
187
200
  data-ouia-safe="true"
188
201
  type="button"
189
202
  >
190
- <svg
191
- aria-hidden="true"
192
- class="pf-v5-svg"
193
- fill="currentColor"
194
- height="1em"
195
- role="img"
196
- viewBox="0 0 256 512"
197
- width="1em"
203
+ <span
204
+ class="pf-v6-c-button__icon"
198
205
  >
199
- <path
200
- d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
201
- />
202
- </svg>
206
+ <svg
207
+ aria-hidden="true"
208
+ class="pf-v6-svg"
209
+ fill="currentColor"
210
+ height="1em"
211
+ role="img"
212
+ viewBox="0 0 256 512"
213
+ width="1em"
214
+ >
215
+ <path
216
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
217
+ />
218
+ </svg>
219
+ </span>
203
220
  </button>
204
221
  </div>
205
222
  <div
206
- class="pf-v5-c-pagination__nav-control pf-m-last"
223
+ class="pf-v6-c-pagination__nav-control pf-m-last"
207
224
  >
208
225
  <button
209
226
  aria-disabled="false"
210
227
  aria-label="Go to last page"
211
- class="pf-v5-c-button pf-m-plain"
228
+ class="pf-v6-c-button pf-m-plain"
212
229
  data-action="last"
213
230
  data-ouia-component-id="OUIA-Generated-Button-plain-4"
214
- data-ouia-component-type="PF5/Button"
231
+ data-ouia-component-type="PF6/Button"
215
232
  data-ouia-safe="true"
216
233
  type="button"
217
234
  >
218
- <svg
219
- aria-hidden="true"
220
- class="pf-v5-svg"
221
- fill="currentColor"
222
- height="1em"
223
- role="img"
224
- viewBox="0 0 448 512"
225
- width="1em"
235
+ <span
236
+ class="pf-v6-c-button__icon"
226
237
  >
227
- <path
228
- d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
229
- />
230
- </svg>
238
+ <svg
239
+ aria-hidden="true"
240
+ class="pf-v6-svg"
241
+ fill="currentColor"
242
+ height="1em"
243
+ role="img"
244
+ viewBox="0 0 448 512"
245
+ width="1em"
246
+ >
247
+ <path
248
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
249
+ />
250
+ </svg>
251
+ </span>
231
252
  </button>
232
253
  </div>
233
254
  </nav>
@@ -236,11 +257,11 @@ exports[`DataViewToolbar component should render correctly 1`] = `
236
257
  </div>
237
258
  </div>
238
259
  <div
239
- class="pf-v5-c-toolbar__content pf-m-hidden"
260
+ class="pf-v6-c-toolbar__content pf-m-hidden"
240
261
  hidden=""
241
262
  >
242
263
  <div
243
- class="pf-v5-c-toolbar__group"
264
+ class="pf-v6-c-toolbar__group"
244
265
  />
245
266
  </div>
246
267
  </div>
@@ -248,32 +269,32 @@ exports[`DataViewToolbar component should render correctly 1`] = `
248
269
  </body>,
249
270
  "container": <div>
250
271
  <div
251
- class="pf-v5-c-toolbar"
272
+ class="pf-v6-c-toolbar"
252
273
  data-ouia-component-id="DataViewToolbar"
253
- data-ouia-component-type="PF5/Toolbar"
274
+ data-ouia-component-type="PF6/Toolbar"
254
275
  data-ouia-safe="true"
255
276
  id="pf-random-id-0"
256
277
  >
257
278
  <div
258
- class="pf-v5-c-toolbar__content"
279
+ class="pf-v6-c-toolbar__content"
259
280
  >
260
281
  <div
261
- class="pf-v5-c-toolbar__content-section"
282
+ class="pf-v6-c-toolbar__content-section"
262
283
  >
263
284
  <div
264
- class="pf-v5-c-toolbar__item pf-m-pagination"
285
+ class="pf-v6-c-toolbar__item pf-m-pagination"
265
286
  data-ouia-component-id="DataViewToolbar-pagination"
266
287
  >
267
288
  <div
268
- class="pf-v5-c-pagination"
289
+ class="pf-v6-c-pagination"
269
290
  data-ouia-component-id="OUIA-Generated-Pagination-top-1"
270
- data-ouia-component-type="PF5/Pagination"
291
+ data-ouia-component-type="PF6/Pagination"
271
292
  data-ouia-safe="true"
272
293
  id="options-menu-top-pagination"
273
- style="--pf-v5-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
294
+ style="--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
274
295
  >
275
296
  <div
276
- class="pf-v5-c-pagination__total-items"
297
+ class="pf-v6-c-pagination__total-items"
277
298
  >
278
299
  <b>
279
300
  1
@@ -288,16 +309,21 @@ exports[`DataViewToolbar component should render correctly 1`] = `
288
309
  </b>
289
310
 
290
311
  </div>
291
- <div>
312
+ <div
313
+ class="pf-v6-c-pagination__page-menu"
314
+ >
292
315
  <button
293
316
  aria-expanded="false"
294
317
  aria-haspopup="listbox"
295
- class="pf-v5-c-menu-toggle pf-m-plain pf-m-text"
318
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
319
+ data-ouia-component-id="OUIA-Generated-MenuToggle-plainText-1"
320
+ data-ouia-component-type="PF6/MenuToggle"
321
+ data-ouia-safe="true"
296
322
  id="options-menu-top-toggle"
297
323
  type="button"
298
324
  >
299
325
  <span
300
- class="pf-v5-c-menu-toggle__text"
326
+ class="pf-v6-c-menu-toggle__text"
301
327
  >
302
328
  <b>
303
329
  1
@@ -313,14 +339,14 @@ exports[`DataViewToolbar component should render correctly 1`] = `
313
339
 
314
340
  </span>
315
341
  <span
316
- class="pf-v5-c-menu-toggle__controls"
342
+ class="pf-v6-c-menu-toggle__controls"
317
343
  >
318
344
  <span
319
- class="pf-v5-c-menu-toggle__toggle-icon"
345
+ class="pf-v6-c-menu-toggle__toggle-icon"
320
346
  >
321
347
  <svg
322
348
  aria-hidden="true"
323
- class="pf-v5-svg"
349
+ class="pf-v6-svg"
324
350
  fill="currentColor"
325
351
  height="1em"
326
352
  role="img"
@@ -337,77 +363,85 @@ exports[`DataViewToolbar component should render correctly 1`] = `
337
363
  </div>
338
364
  <nav
339
365
  aria-label="Pagination"
340
- class="pf-v5-c-pagination__nav"
366
+ class="pf-v6-c-pagination__nav"
341
367
  >
342
368
  <div
343
- class="pf-v5-c-pagination__nav-control pf-m-first"
369
+ class="pf-v6-c-pagination__nav-control pf-m-first"
344
370
  >
345
371
  <button
346
- aria-disabled="true"
372
+ aria-disabled="false"
347
373
  aria-label="Go to first page"
348
- class="pf-v5-c-button pf-m-plain pf-m-disabled"
374
+ class="pf-v6-c-button pf-m-plain"
349
375
  data-action="first"
350
376
  data-ouia-component-id="OUIA-Generated-Button-plain-1"
351
- data-ouia-component-type="PF5/Button"
377
+ data-ouia-component-type="PF6/Button"
352
378
  data-ouia-safe="true"
353
379
  disabled=""
354
380
  type="button"
355
381
  >
356
- <svg
357
- aria-hidden="true"
358
- class="pf-v5-svg"
359
- fill="currentColor"
360
- height="1em"
361
- role="img"
362
- viewBox="0 0 448 512"
363
- width="1em"
382
+ <span
383
+ class="pf-v6-c-button__icon"
364
384
  >
365
- <path
366
- d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
367
- />
368
- </svg>
385
+ <svg
386
+ aria-hidden="true"
387
+ class="pf-v6-svg"
388
+ fill="currentColor"
389
+ height="1em"
390
+ role="img"
391
+ viewBox="0 0 448 512"
392
+ width="1em"
393
+ >
394
+ <path
395
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
396
+ />
397
+ </svg>
398
+ </span>
369
399
  </button>
370
400
  </div>
371
401
  <div
372
- class="pf-v5-c-pagination__nav-control"
402
+ class="pf-v6-c-pagination__nav-control"
373
403
  >
374
404
  <button
375
- aria-disabled="true"
405
+ aria-disabled="false"
376
406
  aria-label="Go to previous page"
377
- class="pf-v5-c-button pf-m-plain pf-m-disabled"
407
+ class="pf-v6-c-button pf-m-plain"
378
408
  data-action="previous"
379
409
  data-ouia-component-id="OUIA-Generated-Button-plain-2"
380
- data-ouia-component-type="PF5/Button"
410
+ data-ouia-component-type="PF6/Button"
381
411
  data-ouia-safe="true"
382
412
  disabled=""
383
413
  type="button"
384
414
  >
385
- <svg
386
- aria-hidden="true"
387
- class="pf-v5-svg"
388
- fill="currentColor"
389
- height="1em"
390
- role="img"
391
- viewBox="0 0 256 512"
392
- width="1em"
415
+ <span
416
+ class="pf-v6-c-button__icon"
393
417
  >
394
- <path
395
- d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
396
- />
397
- </svg>
418
+ <svg
419
+ aria-hidden="true"
420
+ class="pf-v6-svg"
421
+ fill="currentColor"
422
+ height="1em"
423
+ role="img"
424
+ viewBox="0 0 256 512"
425
+ width="1em"
426
+ >
427
+ <path
428
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
429
+ />
430
+ </svg>
431
+ </span>
398
432
  </button>
399
433
  </div>
400
434
  <div
401
- class="pf-v5-c-pagination__nav-page-select"
435
+ class="pf-v6-c-pagination__nav-page-select"
402
436
  >
403
437
  <span
404
- class="pf-v5-c-form-control"
438
+ class="pf-v6-c-form-control"
405
439
  >
406
440
  <input
407
441
  aria-invalid="false"
408
442
  aria-label="Current page"
409
443
  data-ouia-component-id="OUIA-Generated-TextInputBase-1"
410
- data-ouia-component-type="PF5/TextInput"
444
+ data-ouia-component-type="PF6/TextInput"
411
445
  data-ouia-safe="true"
412
446
  max="2"
413
447
  min="1"
@@ -417,59 +451,67 @@ exports[`DataViewToolbar component should render correctly 1`] = `
417
451
  </span>
418
452
  </div>
419
453
  <div
420
- class="pf-v5-c-pagination__nav-control"
454
+ class="pf-v6-c-pagination__nav-control"
421
455
  >
422
456
  <button
423
457
  aria-disabled="false"
424
458
  aria-label="Go to next page"
425
- class="pf-v5-c-button pf-m-plain"
459
+ class="pf-v6-c-button pf-m-plain"
426
460
  data-action="next"
427
461
  data-ouia-component-id="OUIA-Generated-Button-plain-3"
428
- data-ouia-component-type="PF5/Button"
462
+ data-ouia-component-type="PF6/Button"
429
463
  data-ouia-safe="true"
430
464
  type="button"
431
465
  >
432
- <svg
433
- aria-hidden="true"
434
- class="pf-v5-svg"
435
- fill="currentColor"
436
- height="1em"
437
- role="img"
438
- viewBox="0 0 256 512"
439
- width="1em"
466
+ <span
467
+ class="pf-v6-c-button__icon"
440
468
  >
441
- <path
442
- d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
443
- />
444
- </svg>
469
+ <svg
470
+ aria-hidden="true"
471
+ class="pf-v6-svg"
472
+ fill="currentColor"
473
+ height="1em"
474
+ role="img"
475
+ viewBox="0 0 256 512"
476
+ width="1em"
477
+ >
478
+ <path
479
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
480
+ />
481
+ </svg>
482
+ </span>
445
483
  </button>
446
484
  </div>
447
485
  <div
448
- class="pf-v5-c-pagination__nav-control pf-m-last"
486
+ class="pf-v6-c-pagination__nav-control pf-m-last"
449
487
  >
450
488
  <button
451
489
  aria-disabled="false"
452
490
  aria-label="Go to last page"
453
- class="pf-v5-c-button pf-m-plain"
491
+ class="pf-v6-c-button pf-m-plain"
454
492
  data-action="last"
455
493
  data-ouia-component-id="OUIA-Generated-Button-plain-4"
456
- data-ouia-component-type="PF5/Button"
494
+ data-ouia-component-type="PF6/Button"
457
495
  data-ouia-safe="true"
458
496
  type="button"
459
497
  >
460
- <svg
461
- aria-hidden="true"
462
- class="pf-v5-svg"
463
- fill="currentColor"
464
- height="1em"
465
- role="img"
466
- viewBox="0 0 448 512"
467
- width="1em"
498
+ <span
499
+ class="pf-v6-c-button__icon"
468
500
  >
469
- <path
470
- d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
471
- />
472
- </svg>
501
+ <svg
502
+ aria-hidden="true"
503
+ class="pf-v6-svg"
504
+ fill="currentColor"
505
+ height="1em"
506
+ role="img"
507
+ viewBox="0 0 448 512"
508
+ width="1em"
509
+ >
510
+ <path
511
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
512
+ />
513
+ </svg>
514
+ </span>
473
515
  </button>
474
516
  </div>
475
517
  </nav>
@@ -478,11 +520,11 @@ exports[`DataViewToolbar component should render correctly 1`] = `
478
520
  </div>
479
521
  </div>
480
522
  <div
481
- class="pf-v5-c-toolbar__content pf-m-hidden"
523
+ class="pf-v6-c-toolbar__content pf-m-hidden"
482
524
  hidden=""
483
525
  >
484
526
  <div
485
- class="pf-v5-c-toolbar__group"
527
+ class="pf-v6-c-toolbar__group"
486
528
  />
487
529
  </div>
488
530
  </div>