npm - @patternfly/react-core - Versions diffs - 6.0.0-alpha.74 → 6.0.0-alpha.76 - Mend

@patternfly/react-core 6.0.0-alpha.74 → 6.0.0-alpha.76

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 (439) hide show

package/src/components/OverflowMenu/examples/OverflowMenuGroupTypes.tsx CHANGED Viewed

@@ -79,19 +79,13 @@ export const OverflowMenuGroupTypes: React.FunctionComponent = () => {
         </OverflowMenuGroup>
         <OverflowMenuGroup groupType="icon">
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align left">
-              <AlignLeftIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align left" icon={<AlignLeftIcon />} />
           </OverflowMenuItem>
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align center">
-              <AlignCenterIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align center" icon={<AlignCenterIcon />} />
           </OverflowMenuItem>
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align right">
-              <AlignRightIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align right" icon={<AlignRightIcon />} />
           </OverflowMenuItem>
         </OverflowMenuGroup>
       </OverflowMenuContent>

package/src/components/OverflowMenu/examples/OverflowMenuMultiGroup.tsx CHANGED Viewed

@@ -68,19 +68,13 @@ export const OverflowMenuMultiGroup: React.FunctionComponent = () => {
         </OverflowMenuGroup>
         <OverflowMenuGroup groupType="icon">
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align left">
-              <AlignLeftIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align left" icon={<AlignLeftIcon />} />
           </OverflowMenuItem>
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align center">
-              <AlignCenterIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align center" icon={<AlignCenterIcon />} />
           </OverflowMenuItem>
           <OverflowMenuItem>
-            <Button variant={ButtonVariant.plain} aria-label="Align right">
-              <AlignRightIcon />
-            </Button>
+            <Button variant={ButtonVariant.plain} aria-label="Align right" icon={<AlignRightIcon />} />
           </OverflowMenuItem>
         </OverflowMenuGroup>
       </OverflowMenuContent>

package/src/components/Page/__tests__/__snapshots__/Page.test.tsx.snap CHANGED Viewed

@@ -921,7 +921,11 @@ exports[`Page Check page to verify skip to content points to main content region
         data-ouia-safe="true"
         href="#main-content-page-layout-test-nav"
       >
-        Skip to Content
+        <span
+          class="pf-v6-c-button__text"
+        >
+          Skip to Content
+        </span>
       </a>
     </div>
     <header

package/src/components/Pagination/Navigation.tsx CHANGED Viewed

@@ -195,9 +195,8 @@ class Navigation extends React.Component<NavigationProps, NavigationState> {
                 this.handleNewPage(event, 1);
                 this.setState({ userInputPage: 1 });
               }}
-            >
-              <AngleDoubleLeftIcon />
-            </Button>
+              icon={<AngleDoubleLeftIcon />}
+            />
           </div>
         )}
         <div className={styles.paginationNavControl}>
@@ -212,9 +211,8 @@ class Navigation extends React.Component<NavigationProps, NavigationState> {
               this.setState({ userInputPage: newPage });
             }}
             aria-label={toPreviousPageAriaLabel}
-          >
-            <AngleLeftIcon />
-          </Button>
+            icon={<AngleLeftIcon />}
+          />
         </div>
         {!isCompact && (
           <div className={styles.paginationNavPageSelect}>
@@ -249,9 +247,8 @@ class Navigation extends React.Component<NavigationProps, NavigationState> {
               this.handleNewPage(event, newPage);
               this.setState({ userInputPage: newPage });
             }}
-          >
-            <AngleRightIcon />
-          </Button>
+            icon={<AngleRightIcon />}
+          />
         </div>
         {!isCompact && (
           <div className={css(styles.paginationNavControl, styles.modifiers.last)}>
@@ -265,9 +262,8 @@ class Navigation extends React.Component<NavigationProps, NavigationState> {
                 this.handleNewPage(event, lastPage);
                 this.setState({ userInputPage: lastPage });
               }}
-            >
-              <AngleDoubleRightIcon />
-            </Button>
+              icon={<AngleDoubleRightIcon />}
+            />
           </div>
         )}
       </nav>

package/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap CHANGED Viewed

@@ -25,19 +25,23 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
         data-ouia-safe="true"
         type="button"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v6-svg"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 448 512"
-          width="1em"
+        <span
+          class="pf-v6-c-button__icon pf-m-start"
         >
-          <path
-            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"
-          />
-        </svg>
+          <svg
+            aria-hidden="true"
+            class="pf-v6-svg"
+            fill="currentColor"
+            height="1em"
+            role="img"
+            viewBox="0 0 448 512"
+            width="1em"
+          >
+            <path
+              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"
+            />
+          </svg>
+        </span>
       </button>
     </div>
     <div
@@ -53,19 +57,23 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
         data-ouia-safe="true"
         type="button"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v6-svg"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 256 512"
-          width="1em"
+        <span
+          class="pf-v6-c-button__icon pf-m-start"
         >
-          <path
-            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"
-          />
-        </svg>
+          <svg
+            aria-hidden="true"
+            class="pf-v6-svg"
+            fill="currentColor"
+            height="1em"
+            role="img"
+            viewBox="0 0 256 512"
+            width="1em"
+          >
+            <path
+              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"
+            />
+          </svg>
+        </span>
       </button>
     </div>
     <div
@@ -100,19 +108,23 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
         data-ouia-safe="true"
         type="button"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v6-svg"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 256 512"
-          width="1em"
+        <span
+          class="pf-v6-c-button__icon pf-m-start"
         >
-          <path
-            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"
-          />
-        </svg>
+          <svg
+            aria-hidden="true"
+            class="pf-v6-svg"
+            fill="currentColor"
+            height="1em"
+            role="img"
+            viewBox="0 0 256 512"
+            width="1em"
+          >
+            <path
+              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"
+            />
+          </svg>
+        </span>
       </button>
     </div>
     <div
@@ -128,19 +140,23 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
         data-ouia-safe="true"
         type="button"
       >
-        <svg
-          aria-hidden="true"
-          class="pf-v6-svg"
-          fill="currentColor"
-          height="1em"
-          role="img"
-          viewBox="0 0 448 512"
-          width="1em"
+        <span
+          class="pf-v6-c-button__icon pf-m-start"
         >
-          <path
-            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"
-          />
-        </svg>
+          <svg
+            aria-hidden="true"
+            class="pf-v6-svg"
+            fill="currentColor"
+            height="1em"
+            role="img"
+            viewBox="0 0 448 512"
+            width="1em"
+          >
+            <path
+              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"
+            />
+          </svg>
+        </span>
       </button>
     </div>
   </nav>