@patternfly/react-core 6.2.0-prerelease.13 → 6.2.0-prerelease.15

package/src/components/SearchInput/__tests__/__snapshots__/SearchInput.test.tsx.snap

@@ -49,7 +49,6 @@ exports[`SearchInput advanced search 1`] = `
             class="pf-v6-c-text-input-group__utilities"
           >
             <button
-              aria-disabled="false"
               aria-label="Reset"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -79,7 +78,6 @@ exports[`SearchInput advanced search 1`] = `
         class="pf-v6-c-input-group__item pf-m-plain"
       >
         <button
-          aria-disabled="false"
           aria-expanded="false"
           aria-label="Open advanced search"
           class="pf-v6-c-button pf-m-control"
@@ -108,7 +106,6 @@ exports[`SearchInput advanced search 1`] = `
         class="pf-v6-c-input-group__item"
       >
         <button
-          aria-disabled="false"
           aria-label="Search"
           class="pf-v6-c-button pf-m-control"
           type="submit"
@@ -202,7 +199,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
             class="pf-v6-c-text-input-group__utilities"
           >
             <button
-              aria-disabled="false"
               aria-label="Reset"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -232,7 +228,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
         class="pf-v6-c-input-group__item pf-m-plain"
       >
         <button
-          aria-disabled="false"
           aria-expanded="true"
           aria-label="Open advanced search"
           class="pf-v6-c-button pf-m-control pf-m-expanded"
@@ -261,7 +256,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
         class="pf-v6-c-input-group__item"
       >
         <button
-          aria-disabled="false"
           aria-label="Search"
           class="pf-v6-c-button pf-m-control"
           type="submit"
@@ -420,7 +414,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                   class="pf-v6-c-form__group-control"
                 >
                   <button
-                    aria-disabled="false"
                     class="pf-v6-c-button pf-m-link pf-m-inline"
                     type="button"
                   >
@@ -459,7 +452,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                     class="pf-v6-c-form__actions"
                   >
                     <button
-                      aria-disabled="false"
                       class="pf-v6-c-button pf-m-primary"
                       type="submit"
                     >
@@ -470,7 +462,6 @@ exports[`SearchInput advanced search with custom attributes 1`] = `
                       </span>
                     </button>
                     <button
-                      aria-disabled="false"
                       class="pf-v6-c-button pf-m-link"
                       type="reset"
                     >
@@ -541,7 +532,6 @@ exports[`SearchInput renders search input in strict mode 1`] = `
             class="pf-v6-c-text-input-group__utilities"
           >
             <button
-              aria-disabled="false"
               aria-label="Reset"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -571,7 +561,6 @@ exports[`SearchInput renders search input in strict mode 1`] = `
         class="pf-v6-c-input-group__item pf-m-plain"
       >
         <button
-          aria-disabled="false"
           aria-expanded="false"
           aria-label="Open advanced search"
           class="pf-v6-c-button pf-m-control"
@@ -600,7 +589,6 @@ exports[`SearchInput renders search input in strict mode 1`] = `
         class="pf-v6-c-input-group__item"
       >
         <button
-          aria-disabled="false"
           aria-label="Search"
           class="pf-v6-c-button pf-m-control"
           type="submit"
@@ -700,7 +688,6 @@ exports[`SearchInput search input with hint 1`] = `
             class="pf-v6-c-text-input-group__group"
           >
             <button
-              aria-disabled="false"
               aria-label="Previous"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -724,7 +711,6 @@ exports[`SearchInput search input with hint 1`] = `
               </span>
             </button>
             <button
-              aria-disabled="false"
               aria-label="Next"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -749,7 +735,6 @@ exports[`SearchInput search input with hint 1`] = `
             </button>
           </div>
           <button
-            aria-disabled="false"
             aria-label="Reset"
             class="pf-v6-c-button pf-m-plain"
             type="button"
@@ -779,7 +764,6 @@ exports[`SearchInput search input with hint 1`] = `
       class="pf-v6-c-input-group__item"
     >
       <button
-        aria-disabled="false"
         aria-label="Search"
         class="pf-v6-c-button pf-m-control"
         type="submit"
@@ -864,7 +848,6 @@ exports[`SearchInput simple search input 1`] = `
             class="pf-v6-c-text-input-group__group"
           >
             <button
-              aria-disabled="false"
               aria-label="Previous"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -888,7 +871,6 @@ exports[`SearchInput simple search input 1`] = `
               </span>
             </button>
             <button
-              aria-disabled="false"
               aria-label="Next"
               class="pf-v6-c-button pf-m-plain"
               type="button"
@@ -913,7 +895,6 @@ exports[`SearchInput simple search input 1`] = `
             </button>
           </div>
           <button
-            aria-disabled="false"
             aria-label="Reset"
             class="pf-v6-c-button pf-m-plain"
             type="button"
@@ -943,7 +924,6 @@ exports[`SearchInput simple search input 1`] = `
       class="pf-v6-c-input-group__item"
     >
       <button
-        aria-disabled="false"
         aria-label="Search"
         class="pf-v6-c-button pf-m-control"
         type="submit"

package/src/components/SkipToContent/__tests__/__snapshots__/SkipToContent.test.tsx.snap

@@ -6,7 +6,6 @@ exports[`Verify Skip To Content 1`] = `
     class="pf-v6-c-skip-to-content"
   >
     <a
-      aria-disabled="false"
       class="pf-v6-c-button pf-m-primary"
       data-ouia-component-id="OUIA-Generated-Button-primary-1"
       data-ouia-component-type="PF6/Button"

package/src/components/Slider/__tests__/__snapshots__/Slider.test.tsx.snap

@@ -552,7 +552,6 @@ exports[`slider renders slider with input actions 1`] = `
       class="pf-v6-c-slider__actions"
     >
       <button
-        aria-disabled="false"
         aria-label="Minus"
         class="pf-v6-c-button pf-m-plain"
         data-ouia-component-id="OUIA-Generated-Button-plain-1"
@@ -612,7 +611,6 @@ exports[`slider renders slider with input actions 1`] = `
       class="pf-v6-c-slider__actions"
     >
       <button
-        aria-disabled="false"
         aria-label="Plus"
         class="pf-v6-c-button pf-m-plain"
         data-ouia-component-id="OUIA-Generated-Button-plain-2"

package/src/components/Tabs/__tests__/__snapshots__/Tab.test.tsx.snap

@@ -26,7 +26,6 @@ exports[`renders tab action 1`] = `
       class="pf-v6-c-tabs__item-action"
     >
       <button
-        aria-disabled="false"
         aria-label="Tab action"
         class="pf-v6-c-button pf-m-plain"
         data-ouia-component-id="OUIA-Generated-Button-plain-1"

package/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap

@@ -407,7 +407,6 @@ exports[`should render expandable vertical tabs 1`] = `
         class="pf-v6-c-tabs__toggle-button"
       >
         <button
-          aria-disabled="false"
           aria-labelledby="generated-id-text generated-id-button"
           class="pf-v6-c-button pf-m-plain"
           data-ouia-component-id="OUIA-Generated-Button-plain-3"

package/src/components/Toolbar/__tests__/__snapshots__/Toolbar.test.tsx.snap

@@ -69,7 +69,6 @@ exports[`Toolbar should render with custom label content 1`] = `
             class="pf-v6-c-toolbar__toggle"
           >
             <button
-              aria-disabled="false"
               aria-haspopup="false"
               aria-label="Show Filters"
               class="pf-v6-c-button pf-m-plain"
@@ -143,7 +142,6 @@ exports[`Toolbar should render with custom label content 1`] = `
                       class="pf-v6-c-label__actions"
                     >
                       <button
-                        aria-disabled="false"
                         aria-label="Close New"
                         class="pf-v6-c-button pf-m-plain pf-m-no-padding"
                         data-ouia-component-id="OUIA-Generated-Button-plain-2"
@@ -191,7 +189,6 @@ exports[`Toolbar should render with custom label content 1`] = `
                       class="pf-v6-c-label__actions"
                     >
                       <button
-                        aria-disabled="false"
                         aria-label="Close Pending"
                         class="pf-v6-c-button pf-m-plain pf-m-no-padding"
                         data-ouia-component-id="OUIA-Generated-Button-plain-3"
@@ -226,7 +223,6 @@ exports[`Toolbar should render with custom label content 1`] = `
               class="pf-v6-c-label-group__close"
             >
               <button
-                aria-disabled="false"
                 aria-label="Close label group"
                 aria-labelledby="remove_group_generated-id generated-id"
                 class="pf-v6-c-button pf-m-plain pf-m-no-padding"
@@ -270,7 +266,6 @@ exports[`Toolbar should render with custom label content 1`] = `
           class="pf-v6-c-toolbar__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-link pf-m-inline"
             data-ouia-component-id="OUIA-Generated-Button-link-1"
             data-ouia-component-type="PF6/Button"
@@ -288,7 +283,6 @@ exports[`Toolbar should render with custom label content 1`] = `
           class="pf-v6-c-toolbar__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-link pf-m-inline"
             data-ouia-component-id="OUIA-Generated-Button-link-2"
             data-ouia-component-type="PF6/Button"

package/src/components/Toolbar/examples/Toolbar.md

@@ -24,16 +24,6 @@ Note: This example does not demonstrate responsive toolbar behavior. Responsive
 
 ```
 
-### Toolbar item spacers
-
-You may adjust the space between toolbar items to arrange them into groups. Read our spacers documentation to learn more about using spacers.
-
-Items are spaced “16px” apart by default via their parents' `gap` or `columnGap` property. You can set the property values at multiple breakpoints, including "default", "md", "lg", "xl", and "2xl".
-
-```ts file="./ToolbarSpacers.tsx"
-
-```
-
 ### With adjusted inset
 
 To adjust a toolbar’s inset, use the `inset` property. You can set the inset value at multiple breakpoints, including "default", "md", "lg, "xl", and "2xl". Inset values include “insetNone”, “insetSm”, “insetMd”, “insetLg”, “insetXl”, and “inset2xl”.
@@ -120,3 +110,20 @@ When all of a toolbar's required elements cannot fit in a single line, you can s
 ```ts file="./ToolbarStacked.tsx"
 
 ```
+
+## Examples with toolbar spacers
+You may adjust the space between toolbar items to arrange them into groups. Read our spacers documentation to learn more about using spacers.
+
+Items are spaced “16px” apart by default and can be modified by changing their or their parents' `gap`, `columnGap`, and `rowGap` properties. You can set the property values at multiple breakpoints, including "default", "md", "lg", "xl", and "2xl".
+
+### Toolbar group spacers
+
+```ts file="./ToolbarGroupSpacers.tsx"
+
+```
+
+### Toolbar item spacers
+
+```ts file="./ToolbarItemSpacers.tsx"
+
+```

package/src/components/Toolbar/examples/ToolbarGroupSpacers.tsx

@@ -0,0 +1,185 @@
+import React from 'react';
+import { Toolbar, ToolbarItem, ToolbarGroup, ToolbarContent } from '@patternfly/react-core';
+import { Button } from '@patternfly/react-core';
+
+export const ToolbarGroupSpacers: React.FunctionComponent = () => {
+  const groupGapItems = (
+    <React.Fragment>
+      <ToolbarGroup>
+        <ToolbarItem>
+          <Button variant="secondary">Default Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Default Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarItem variant="separator"></ToolbarItem>
+      <ToolbarGroup gap={{ default: 'gapNone' }}>
+        <ToolbarItem>
+          <Button variant="secondary">No Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarItem variant="separator"></ToolbarItem>
+      <ToolbarGroup gap={{ default: 'gapSm' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Small Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarItem variant="separator"></ToolbarItem>
+      <ToolbarGroup gap={{ default: 'gapXl' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  const groupColumnGapItems = (
+    <React.Fragment>
+      <ToolbarGroup columnGap={{ default: 'columnGapNone' }}>
+        <ToolbarItem>
+          <Button variant="secondary">No Column Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Column Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarItem variant="separator"></ToolbarItem>
+      <ToolbarGroup columnGap={{ default: 'columnGapSm' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Small Column Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Column Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarItem variant="separator"></ToolbarItem>
+      <ToolbarGroup columnGap={{ default: 'columnGapXl' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Column Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Column Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  const groupRowGapItems = (
+    <React.Fragment>
+      <ToolbarGroup className="pf-m-wrap" rowGap={{ default: 'rowGapNone' }}>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarGroup className="pf-m-wrap" rowGap={{ default: 'rowGapSm' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+      </ToolbarGroup>
+      <ToolbarGroup className="pf-m-wrap" rowGap={{ default: 'rowGapXl' }}>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  return (
+    <>
+      Using gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{groupGapItems}</ToolbarContent>
+      </Toolbar>
+      Using column gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{groupColumnGapItems}</ToolbarContent>
+      </Toolbar>
+      Using row gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{groupRowGapItems}</ToolbarContent>
+      </Toolbar>
+      <br />
+    </>
+  );
+};

package/src/components/Toolbar/examples/ToolbarItemSpacers.tsx

@@ -0,0 +1,91 @@
+import React from 'react';
+import { Toolbar, ToolbarItem, ToolbarGroup, ToolbarContent } from '@patternfly/react-core';
+import { Button } from '@patternfly/react-core';
+
+export const ToolbarItemSpacers: React.FunctionComponent = () => {
+  const itemGapItems = (
+    <React.Fragment>
+      <ToolbarGroup className="pf-m-wrap">
+        <ToolbarItem gap={{ default: 'gapNone' }}>
+          <Button variant="secondary">No Gap</Button>
+          <Button variant="secondary">No Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem gap={{ default: 'gapSm' }}>
+          <Button variant="secondary">Small Gap</Button>
+          <Button variant="secondary">Small Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem gap={{ default: 'gapXl' }}>
+          <Button variant="secondary">Extra Large Gap</Button>
+          <Button variant="secondary">Extra Large Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  const itemColumnGapItems = (
+    <React.Fragment>
+      <ToolbarGroup className="pf-m-wrap">
+        <ToolbarItem columnGap={{ default: 'columnGapNone' }}>
+          <Button variant="secondary">No Column Gap</Button>
+          <Button variant="secondary">No Column Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem columnGap={{ default: 'columnGapSm' }}>
+          <Button variant="secondary">Small Column Gap</Button>
+          <Button variant="secondary">Small Column Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem columnGap={{ default: 'columnGapXl' }}>
+          <Button variant="secondary">Extra Large Column Gap</Button>
+          <Button variant="secondary">Extra Large Column Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  const itemRowGapItems = (
+    <React.Fragment>
+      <ToolbarGroup>
+        <ToolbarItem className="pf-m-wrap" rowGap={{ default: 'rowGapNone' }}>
+          <Button variant="secondary">No Row Gap</Button>
+          <Button variant="secondary">No Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem className="pf-m-wrap" rowGap={{ default: 'rowGapSm' }}>
+          <Button variant="secondary">Small Row Gap</Button>
+          <Button variant="secondary">Small Row Gap</Button>
+        </ToolbarItem>
+        <ToolbarItem variant="separator"></ToolbarItem>
+        <ToolbarItem className="pf-m-wrap" rowGap={{ default: 'rowGapXl' }}>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+          <Button variant="secondary">Extra Large Row Gap</Button>
+        </ToolbarItem>
+      </ToolbarGroup>
+    </React.Fragment>
+  );
+
+  return (
+    <>
+      Using gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{itemGapItems}</ToolbarContent>
+      </Toolbar>
+      Using column gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{itemColumnGapItems}</ToolbarContent>
+      </Toolbar>
+      Using row gap
+      <br />
+      <br />
+      <Toolbar id="toolbar-spacers">
+        <ToolbarContent>{itemRowGapItems}</ToolbarContent>
+      </Toolbar>
+    </>
+  );
+};

package/src/deprecated/components/Chip/__tests__/__snapshots__/Chip.test.tsx.snap

@@ -23,7 +23,6 @@ exports[`Matches snapshot 1`] = `
       class="pf-v6-c-label__actions"
     >
       <button
-        aria-disabled="false"
         aria-label="Close Chip text"
         class="pf-v6-c-button pf-m-plain pf-m-no-padding"
         data-ouia-component-id="OUIA-Generated-Button-plain-17"