@patternfly/documentation-framework 6.31.3 → 6.31.5

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.31.5 (2025-11-17)
+
+
+### Bug Fixes
+
+* Reorganizes and renames nav items for new design. ([#4861](https://github.com/patternfly/patternfly-org/issues/4861)) ([595e6a2](https://github.com/patternfly/patternfly-org/commit/595e6a2a83842fa1b7a211bef34feb7bda62c778))
+
+
+
+
+
+## 6.31.4 (2025-11-12)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
 ## 6.31.3 (2025-11-12)
 
 

package/components/example/exampleToolbar.jsx

@@ -195,6 +195,16 @@ export const ExampleToolbar = ({
   // TODO: check if worth adding react, patternfly, and example types
   // https://microsoft.github.io/monaco-editor/api/interfaces/monaco.languages.typescript.languageservicedefaults.html#addextralib
   const onEditorDidMount = (_editor, monaco) => {
+    // Configure Monaco environment for web workers (required for Monaco 0.54+)
+    if (typeof window !== 'undefined' && !window.MonacoEnvironment) {
+      window.MonacoEnvironment = {
+        getWorker() {
+          // Return empty worker since we disable all diagnostics below anyway
+          return new Worker(URL.createObjectURL(new Blob([''], { type: 'application/javascript' })));
+        }
+      };
+    }
+
     monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
       jsx: true,
       ...monaco.languages.typescript.typescriptDefaults.getCompilerOptions()

package/components/footer/footer.js

@@ -30,68 +30,12 @@ export const Footer = ({ isDarkTheme }) => (
           <Grid className="pf-v6-u-py-xl">
             <GridItem
               sm={6}
-              md={4}
+              md={6}
               className="pf-v6-u-ml-md pf-v6-u-ml-0-on-md pf-v6-u-mb-xl pf-v6-u-mb-0-on-md"
-            >
-              <p className="ws-org-pfsite-footer-menu-list-title">What's new</p>
-              <nav aria-label="Quick Links">
-                <List isPlain className="ws-org-pfsite-footer-menu-list">
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/get-started/upgrade"
-                      aria-label="Latest PatternFly upgrade guide"
-                    >
-                      Upgrade
-                    </Link>
-                  </ListItem>
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/get-started/release-highlights/"
-                      aria-label="PatternFly release highlights"
-                    >
-                      Releases
-                    </Link>
-                  </ListItem>
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/patternfly-ai/about-ai"
-                      aria-label="PatternFly's new AI resources"
-                    >
-                      PatternFly AI
-                    </Link>
-                  </ListItem>
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/tokens/about-tokens"
-                      aria-label="PatternFly's new token system"
-                    >
-                      Tokens
-                    </Link>
-                  </ListItem>
-                </List>
-              </nav>
-            </GridItem>
-            <GridItem
-              sm={6}
-              md={4}
-              className="pf-v6-u-mt-lg pf-v6-u-mt-0-on-sm pf-v6-u-ml-md pf-v6-u-ml-0-on-md pf-v6-u-mb-xl pf-v6-u-mb-0-on-md"
             >
               <p className="ws-org-pfsite-footer-menu-list-title">Contribute</p>
               <nav aria-label="Contribute">
                 <List isPlain className="ws-org-pfsite-footer-menu-list">
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/get-started/about-patternfly"
-                      aria-label="Learn about PatternFly"
-                    >
-                      About PatternFly
-                    </Link>
-                  </ListItem>
                   <ListItem className="ws-org-pfsite-footer-menu-list-item">
                     <Link
                       className="ws-org-pfsite-footer-menu-link"
@@ -101,22 +45,13 @@ export const Footer = ({ isDarkTheme }) => (
                       Code of conduct
                     </Link>
                   </ListItem>
-                  <ListItem className="ws-org-pfsite-footer-menu-list-item">
-                    <Link
-                      className="ws-org-pfsite-footer-menu-link"
-                      to="/get-started/contribute"
-                      aria-label="Learn how to contribute to PatternFly"
-                    >
-                      Contribute
-                    </Link>
-                  </ListItem>
                 </List>
               </nav>
             </GridItem>
             <GridItem
               sm={6}
-              md={4}
-              className="pf-v6-u-mt-lg pf-v6-u-mt-0-on-md pf-v6-u-ml-md pf-v6-u-ml-0-on-md"
+              md={6}
+              className="pf-v6-u-mt-lg pf-v6-u-mt-0-on-sm pf-v6-u-ml-md pf-v6-u-ml-0-on-md"
             >
               <p className="ws-org-pfsite-footer-menu-list-title">Community</p>
               <nav aria-label="Stay in touch">
@@ -138,7 +73,7 @@ export const Footer = ({ isDarkTheme }) => (
                       target="top"
                       aria-label="Read the PatternFly blog"
                     >
-                      Blog
+                      Medium
                     </Link>
                   </ListItem>
                   <ListItem className="ws-org-pfsite-footer-menu-list-item">
@@ -167,7 +102,7 @@ export const Footer = ({ isDarkTheme }) => (
                       target="top"
                       aria-label="Visit the PatternFly discussion forum"
                     >
-                      Discussions
+                      GitHub Discussions
                     </Link>
                   </ListItem>
                 </List>

package/components/index.js

@@ -5,6 +5,7 @@ export * from './example/example';
 export * from './footer/footer';
 export * from './gdprBanner/gdprBanner';
 export * from './propsTable/propsTable';
+export * from './navAnnouncementBanner/navAnnouncementBanner';
 export * from './sideNav/sideNav';
 export * from './topNav/topNav';
 export * from './link/link';

package/components/navAnnouncementBanner/navAnnouncementBanner.css

@@ -0,0 +1,20 @@
+.ws-nav-announcement-banner-container {
+    position: fixed;
+    top: 20px;
+    left: 0;
+    right: 0;
+    width: 100%;
+    z-index: 300;
+    display: flex;
+    justify-content: center;
+    padding: 0 var(--pf-t--global--spacer--xl);
+    pointer-events: none;
+  }
+  
+  .ws-nav-announcement-banner {
+    max-width: 85vw;
+    width: 100%;
+    box-shadow: var(--pf-t--global--box-shadow--md);
+    pointer-events: auto;
+  }
+  

package/components/navAnnouncementBanner/navAnnouncementBanner.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Alert, AlertActionCloseButton } from '@patternfly/react-core';
+import './navAnnouncementBanner.css';
+
+export const NavAnnouncementBanner = () => {
+  const initialBannerOpen = typeof window !== 'undefined' && window.localStorage && !localStorage.getItem('nav-announcement-banner-closed');
+  const [ isBannerOpen, setBannerOpen ] = React.useState(initialBannerOpen);
+
+  const closeBanner = () => {
+    localStorage.setItem('nav-announcement-banner-closed', 'true');
+    setBannerOpen(false);
+  }
+
+  return !isBannerOpen ? null : (
+    <div className="ws-nav-announcement-banner-container">
+      <Alert
+        variant="info"
+        isInline
+        actionClose={<AlertActionCloseButton onClose={closeBanner} />}
+        className="ws-nav-announcement-banner"
+        title={<>We've redesigned our website's navigation menu to make it easier to find the information you need. Learn more about the changes on <a href="https://medium.com/patternfly" target="_blank" rel="noopener noreferrer">Medium</a> and share any thoughts in our <a href="https://www.feedback.redhat.com/jfe/form/SV_9MKBjq8H7muINMy" target="_blank" rel="noopener noreferrer">user feedback survey</a>.</>}
+      />
+    </div>
+  );
+}

package/components/sideNav/sideNav.js

@@ -16,8 +16,8 @@ import { css } from '@patternfly/react-styles';
 import { Location } from '@reach/router';
 
 const DIVIDER_STYLES = {
-  marginTop: 'var(--pf-t--global--spacer--md)',
-  marginBottom: 'var(--pf-t--global--spacer--md)'
+  marginTop: 'var(--pf-t--global--spacer--xs)',
+  marginBottom: 'var(--pf-t--global--spacer--xs)'
 };
 import { makeSlug } from '../../helpers';
 import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_xl';

package/layouts/sideNavLayout/sideNavLayout.js

@@ -27,7 +27,7 @@ import {
 } from '@patternfly/react-core';
 import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
 import GithubIcon from '@patternfly/react-icons/dist/esm/icons/github-icon';
-import { SideNav, TopNav, GdprBanner, ThemeSelector } from '../../components';
+import { SideNav, TopNav, GdprBanner, NavAnnouncementBanner, ThemeSelector } from '../../components';
 import staticVersions from '../../versions.json';
 import { Footer } from '@patternfly/documentation-framework/components';
 import { useTheme, THEME_TYPES } from '../../hooks/useTheme';
@@ -363,7 +363,10 @@ export const SideNavLayout = ({ children, groupedRoutes, navOpen: navOpenProp })
           {children}
           {process.env.hasFooter && <Footer isDarkTheme={isDarkTheme} />}
         </Page>
-        <div id="ws-page-banners">{hasGdprBanner && <GdprBanner />}</div>
+        <div id="ws-page-banners">
+          <NavAnnouncementBanner />
+          {hasGdprBanner && <GdprBanner />}
+        </div>
       </RtlContext.Provider>
     </React.Fragment>
   );

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly/documentation-framework",
   "description": "A framework to build documentation for PatternFly.",
-  "version": "6.31.3",
+  "version": "6.31.5",
   "author": "Red Hat",
   "license": "MIT",
   "bin": {
@@ -12,7 +12,7 @@
     "@babel/preset-env": "7.27.1",
     "@babel/preset-react": "^7.24.1",
     "@mdx-js/util": "1.6.16",
-    "@patternfly/ast-helpers": "^1.4.0-alpha.312",
+    "@patternfly/ast-helpers": "^1.4.0-alpha.314",
     "@reach/router": "npm:@gatsbyjs/reach-router@1.3.9",
     "autoprefixer": "10.4.19",
     "babel-loader": "^9.1.3",
@@ -66,10 +66,10 @@
     "webpack-merge": "5.8.0"
   },
   "peerDependencies": {
-    "@patternfly/patternfly": "^6.5.0-prerelease.23",
-    "@patternfly/react-code-editor": "^6.5.0-prerelease.11",
-    "@patternfly/react-core": "^6.5.0-prerelease.11",
-    "@patternfly/react-table": "^6.5.0-prerelease.11",
+    "@patternfly/patternfly": "^6.5.0-prerelease.27",
+    "@patternfly/react-code-editor": "^6.5.0-prerelease.13",
+    "@patternfly/react-core": "^6.5.0-prerelease.13",
+    "@patternfly/react-table": "^6.5.0-prerelease.13",
     "react": "^17.0.0 || ^18.0.0",
     "react-dom": "^17.0.0 || ^18.0.0"
   },
@@ -89,5 +89,5 @@
     "http-cache-semantics": ">=4.1.1",
     "nanoid": "3.3.8"
   },
-  "gitHead": "565db67ba97927efc15c4428ebf0b2be5f9a21f9"
+  "gitHead": "02941db2079dfea27b0f3ee5547f530c088b8988"
 }

package/pages/404/index.js

@@ -77,7 +77,7 @@ const Page404 = () => {
           body="Learn about designing and developing with PatternFly."
           link={{
             text: 'View getting started resources',
-            to: '/get-started/about-patternfly',
+            to: '/about-us',
           }}
         />
         <Card404

package/routes.js

@@ -106,6 +106,7 @@ const getDefaultDesignGuidelines = ({ id, section, slug, title }) => {
     section,
     slug: `${slug}/design-guidelines`,
     source: 'design-guidelines',
+    tabName: 'design-guidelines',
     title,
     Component
   };

package/scripts/webpack/webpack.base.config.js

@@ -144,6 +144,9 @@ module.exports = (_env, argv) => {
         patterns: [{ from: path.join(__dirname, '../../assets'), to: 'assets' }]
       })
     ],
-    stats: 'minimal'
+    stats: 'minimal',
+    performance: {
+      hints: false // Disable performance hints to avoid [object Object] warnings
+    }
   };
 };

package/scripts/webpack/webpack.client.config.js

@@ -81,7 +81,20 @@ const clientConfig = async (env, argv) => {
       rules: [
         {
           test: /\.css$/,
-          exclude: reactCSSRegex,
+          exclude: (modulePath) => {
+            // Exclude react-*/dist CSS files, but allow catalog-view-extension
+            const pathStr = modulePath.toString();
+            if (reactCSSRegex.test(pathStr)) {
+              // Allow catalog-view-extension through (don't exclude it)
+              if (pathStr.includes('react-catalog-view-extension/dist/css/')) {
+                return false;
+              }
+              // Exclude other react-*/dist CSS files
+              return true;
+            }
+            // Don't exclude files that don't match reactCSSRegex
+            return false;
+          },
           use: [
             {
               loader: rspack.CssExtractRspackPlugin.loader
@@ -103,6 +116,7 @@ const clientConfig = async (env, argv) => {
         },
         {
           test: reactCSSRegex,
+          exclude: /react-catalog-view-extension\/dist\/css\/.*\.css$/,
           use: 'null-loader'
         },
       ]
@@ -111,9 +125,12 @@ const clientConfig = async (env, argv) => {
       new rspack.DefinePlugin({
         'process.env.PRERENDER': false,
       }),
-      new rspack.CssExtractRspackPlugin(!isProd ? {} : {
+      new rspack.CssExtractRspackPlugin(!isProd ? {
+        ignoreOrder: true // Suppress CSS order warnings in dev mode
+      } : {
         filename: 'css/[name].[contenthash].css',
         chunkFilename: 'css/[name].[contenthash].css',
+        ignoreOrder: true // Suppress CSS order warnings (Monaco vs highlight.js conflicts)
       }),
       new rspack.CopyRspackPlugin({
         patterns: [

package/templates/mdx.js

@@ -81,7 +81,7 @@ const MDXChildTemplate = ({ Component, source, toc = [], index = 0, id }) => {
             Slack
           </a>
           . To learn more about the process, visit our{' '}
-          <Link to="/get-started/about-patternfly#beta-components">about page</Link> or our{' '}
+          <Link to="/about-us#beta-features">about page</Link> or our{' '}
           <a href="https://github.com/patternfly/patternfly-org/tree/main/beta-component-promotion">Beta components</a>{' '}
           page on GitHub.
         </InlineAlert>

package/versions.json

@@ -5,25 +5,25 @@
       "date": "2025-11-06",
       "latest": true,
       "versions": {
-        "@patternfly/patternfly": "6.5.0-prerelease.23",
+        "@patternfly/patternfly": "6.5.0-prerelease.27",
         "@patternfly/react-catalog-view-extension": "6.2.0",
-        "@patternfly/react-charts": "8.5.0-prerelease.4",
-        "@patternfly/react-code-editor": "6.5.0-prerelease.11",
-        "@patternfly/react-component-groups": "6.4.0",
-        "@patternfly/react-core": "6.5.0-prerelease.11",
+        "@patternfly/react-charts": "8.5.0-prerelease.6",
+        "@patternfly/react-code-editor": "6.5.0-prerelease.13",
+        "@patternfly/react-component-groups": "6.4.0-prerelease.6",
+        "@patternfly/react-core": "6.5.0-prerelease.13",
         "@patternfly/react-drag-drop": "6.5.0-prerelease.11",
         "@patternfly/react-icons": "6.5.0-prerelease.4",
         "@patternfly/react-log-viewer": "6.3.0",
         "@patternfly/react-styles": "6.5.0-prerelease.4",
-        "@patternfly/react-table": "6.5.0-prerelease.11",
+        "@patternfly/react-table": "6.5.0-prerelease.13",
         "@patternfly/react-tokens": "6.5.0-prerelease.4",
-        "@patternfly/react-topology": "6.4.0",
+        "@patternfly/react-topology": "6.5.0-prerelease.2",
         "@patternfly/react-user-feedback": "6.2.0",
         "@patternfly/react-console": "6.1.0",
         "@patternfly/quickstarts": "6.4.0",
         "@patternfly/react-virtualized-extension": "6.1.0",
         "@patternfly/react-templates": "6.5.0-prerelease.11",
-        "@patternfly/chatbot": "6.5.0-prerelease.10",
+        "@patternfly/chatbot": "6.5.0-prerelease.18",
         "@patternfly/react-data-view": "6.4.0"
       }
     },
@@ -33,7 +33,7 @@
       "hidden": true,
       "versions": {
         "@patternfly/patternfly": "6.4.0",
-        "@patternfly/react-catalog-view-extension": "6.2.0",
+        "@patternfly/react-catalog-view-extension": "6.3.0",
         "@patternfly/react-charts": "8.4.0",
         "@patternfly/react-code-editor": "6.4.0",
         "@patternfly/react-component-groups": "6.4.0",