@patternfly/documentation-framework 1.4.9 → 1.4.11

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.
 
+## 1.4.11 (2023-02-01)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 1.4.10 (2023-01-26)
+
+
+### Bug Fixes
+
+* update codesandbox dependencies per example import ([#3367](https://github.com/patternfly/patternfly-org/issues/3367)) ([31b75a3](https://github.com/patternfly/patternfly-org/commit/31b75a346dd0ba03bb697d9917a729a32dad76be))
+
+
+
+
+
 ## 1.4.9 (2023-01-25)
 
 **Note:** Version bump only for package @patternfly/documentation-framework

package/components/example/example.js

@@ -81,7 +81,11 @@ export const Example = ({
   // Show dark theme switcher on full page examples
   hasDarkThemeSwitcher = process.env.hasDarkThemeSwitcher,
   // Map of relative imports matched to their npm package import path (passed to Codesandbox)
-  relativeImports
+  relativeImports,
+  // md file location in node_modules, used to resolve relative import paths in examples
+  relPath = '',
+  // absolute url to hosted file
+  sourceLink = ''
 }) => {
   if (isFullscreenPreview) {
     isFullscreen = false;
@@ -160,13 +164,13 @@ export const Example = ({
   const codeBoxParams = getParameters(
     lang === 'html'
       ? getStaticParams(title, editorCode)
-      : getReactParams(title, editorCode, scope, lang, relativeImports)
+      : getReactParams(title, editorCode, scope, lang, relativeImports, relPath, sourceLink)
   );
   const fullscreenLink = loc.pathname.replace(/\/$/, '')
     + (loc.pathname.endsWith(source) ? '' : `/${source}`)
     + '/'
     + slugger(title);
-
+    
   return (
     <div className="ws-example">
       <div className="ws-example-header">

package/components/inlineAlert/inlineAlert.js

@@ -12,7 +12,7 @@ export const InlineAlert = ({
     className="pf-u-my-md"
     style={{ marginBottom: '1rem' }}
     isInline
-    titleHeadingLevel="h2"
+    component="h2"
   >
     {children}
   </Alert>

package/helpers/codesandbox.js

@@ -2,6 +2,7 @@ const { parse } = require('@patternfly/ast-helpers');
 const versions  = require('../versions.json');
 const overpass = require('./fonts');
 const { capitalize } = require('./capitalize');
+const path = require('path');
 const pathPrefix = process.env.pathPrefix;
 
 const getStaticParams = (title, html) => {
@@ -107,7 +108,7 @@ function prettyExampleCode(title, code, declaration, identifier) {
 }
 
 // TODO: Make React examples work and use a template that has our assets.
-function getReactParams(title, code, scope, lang, relativeImports) {
+function getReactParams(title, code, scope, lang, relativeImports, relPath, sourceLink) {
   let toRender = null;
   try {
     let declaration = getExampleDeclaration(code);
@@ -130,12 +131,18 @@ function getReactParams(title, code, scope, lang, relativeImports) {
   catch (err) {
     // Ignore
   }
-  // Update image imports to point to pf.org
-  const imgImportRegex = /import\s*(\w*).*['"](.*)(\.(png|jpe?g|webp|gif|svg))['"]/g;
-  let imgImportMatch;
-  while ((imgImportMatch = imgImportRegex.exec(code))) {
-    const imgName = imgImportMatch[1];
-    code = code.replace(imgImportMatch[0], `const ${imgName} = "https://www.patternfly.org/v4${scope[imgName]}"`);
+
+  // Point to sourcelink for @patternfly images
+  if (relPath.includes('@patternfly')) {
+    const imgImportRegex = /(import \W*(\w*)\W*[^'"`]*['"`](.*\.(?:png|jpe?g|webp|gif|svg))['"])/gm;
+    let imgImportMatch;
+    while ((imgImportMatch = imgImportRegex.exec(code))) {
+      const [match, importDeclaration, imgName, relImgPath] = imgImportMatch;
+      // Point to sourceLink hosted file
+      const sourceLinkPath = new URL(relImgPath, sourceLink.replace('/blob/', '/raw/')).href;
+      const hostedImageDeclaration = `const ${imgName} = "${sourceLinkPath}"`;
+      code = code.replace(importDeclaration, hostedImageDeclaration);
+    }
   }
 
   const relImportRegex = /(import[\s*{])([\w*{}\n\r\t, ]+)([\s*]from\s["']([\.\/]+.*)["'])/gm;
@@ -160,8 +167,7 @@ function getReactParams(title, code, scope, lang, relativeImports) {
     .filter(([pkg]) => code.includes(pkg))
     .forEach(([pkg, version]) => dependencies[pkg] = version);
 
-  
-  // Get any additional dependencies from example code
+  // Get any additional dependencies from example code, exclude relative imports
   const importMatch = /(?:import [^'"`]*)(?:['"`])((?!.\/)[^'"`]*)/gm;
   let depImport;
   while (depImport = importMatch.exec(code)) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly/documentation-framework",
   "description": "A framework to build documentation for PatternFly.",
-  "version": "1.4.9",
+  "version": "1.4.11",
   "author": "Red Hat",
   "license": "MIT",
   "private": false,
@@ -84,5 +84,5 @@
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0"
   },
-  "gitHead": "61f579285f5edfcfe92659f90ccc38b2616fc15d"
+  "gitHead": "0df1271cf0539cb5dc3ad7704ffe7bf328a6d672"
 }

package/routes.js

@@ -28,7 +28,7 @@ const isNull = o => o === null || o === undefined;
 const groupedRoutes = Object.entries(routes)
   .filter(([_slug, { id, section }]) => !isNull(id) && !isNull(section))
   .reduce((accum, [slug, pageData]) => {
-    const { section, subsection = null, id, title, source, katacodaLayout, hideNavItem } = pageData;
+    const { section, subsection = null, id, title, source, katacodaLayout, hideNavItem, relPath } = pageData;
     pageData.slug = slug;
     // add section to groupedRoutes obj if not yet created
     accum[section] = accum[section] || {};
@@ -41,7 +41,8 @@ const groupedRoutes = Object.entries(routes)
       slug: makeSlug(source, section, id, true, subsection),
       sources: [],
       katacodaLayout,
-      hideNavItem
+      hideNavItem,
+      relPath
     }
     // add page to groupedRoutes obj section or subsection
     if (subsection) {

package/scripts/md/parseMD.js

@@ -86,7 +86,8 @@ function toReactComponent(mdFilePath, source, buildMode) {
         sourceLink: frontmatter.sourceLink || `https://github.com/patternfly/${
           sourceRepo}/blob/main/${
           normalizedPath}`,
-        hideTOC: frontmatter.hideTOC || false
+        hideTOC: frontmatter.hideTOC || false,
+        relPath
       };
       // Temporarily override section for Demo tabs until we port this upstream
       if (frontmatter.section === 'demos' && routes[slug.replace('demos', 'components')]) {

package/versions.json

@@ -1,9 +1,27 @@
 {
   "Releases": [
     {
+      "name": "2023.01",
+      "date": "2022-01-31",
+      "latest": true,
+      "versions": {
+        "@patternfly/patternfly": "4.224.2",
+        "@patternfly/react-catalog-view-extension": "4.95.1",
+        "@patternfly/react-charts": "6.94.18",
+        "@patternfly/react-code-editor": "4.82.113",
+        "@patternfly/react-core": "4.276.6",
+        "@patternfly/react-icons": "4.93.6",
+        "@patternfly/react-inline-edit-extension": "4.86.118",
+        "@patternfly/react-log-viewer": "4.87.100",
+        "@patternfly/react-styles": "4.92.6",
+        "@patternfly/react-table": "4.112.39",
+        "@patternfly/react-tokens": "4.94.6",
+        "@patternfly/react-topology": "4.91.27",
+        "@patternfly/react-virtualized-extension": "4.88.113"
+      }
+    },{
       "name": "2022.16",
       "date": "2022-12-15",
-      "latest": true,
       "versions": {
         "@patternfly/patternfly": "4.222.4",
         "@patternfly/react-catalog-view-extension": "4.93.15",