@patternfly/documentation-framework 2.0.0-alpha.2 → 2.0.0-alpha.21

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 (25) hide show
  1. package/CHANGELOG.md +182 -0
  2. package/app.js +12 -10
  3. package/components/cssVariables/cssSearch.js +3 -4
  4. package/components/cssVariables/cssVariables.js +69 -67
  5. package/components/propsTable/propsTable.js +85 -79
  6. package/components/sideNav/sideNav.js +10 -3
  7. package/helpers/getTitle.js +2 -2
  8. package/layouts/sideNavLayout/sideNavLayout.css +0 -4
  9. package/layouts/sideNavLayout/sideNavLayout.js +48 -35
  10. package/package.json +26 -25
  11. package/pages/404/index.js +3 -3
  12. package/routes.js +19 -5
  13. package/scripts/cli/build.js +6 -0
  14. package/scripts/cli/cli.js +1 -0
  15. package/scripts/cli/start.js +6 -8
  16. package/scripts/md/parseMD.js +11 -8
  17. package/scripts/webpack/webpack.base.config.js +33 -31
  18. package/scripts/webpack/webpack.client.config.js +11 -13
  19. package/scripts/webpack/webpack.server.config.js +26 -10
  20. package/templates/html.ejs +1 -3
  21. package/templates/mdx.css +0 -5
  22. package/templates/mdx.js +15 -15
  23. package/templates/patternfly-docs/content/extensions/extension/design-guidelines/design-guidelines.md +2 -0
  24. package/templates/patternfly-docs/content/extensions/extension/examples/basic.md +2 -0
  25. package/versions.json +29 -9
package/scripts/webpack/webpack.server.config.js CHANGED
@@ -2,8 +2,11 @@ const path = require('path');
2
2
  const webpack = require('webpack');
3
3
  const { merge } = require('webpack-merge');
4
4
  const baseConfig = require('./webpack.base.config');
5
+ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
6
+ const reactCSSRegex = /(react-[\w-]+\/dist|react-styles\/css)\/.*\.css$/;
5
7
 
6
- const serverConfig = () => {
8
+ const serverConfig = async (env, argv) => {
9
+ const isProd = argv.mode === 'production';
7
10
  return {
8
11
  output: {
9
12
  path: path.resolve('.cache/ssr-build'), // Don't bloat `public` dir
@@ -25,13 +28,26 @@ const serverConfig = () => {
25
28
  rules: [
26
29
  {
27
30
  test: /\.css$/,
28
- use: 'null-loader'
31
+ use: [
32
+ {
33
+ loader: 'css-loader'
34
+ },
35
+ {
36
+ loader: 'postcss-loader',
37
+ options: {
38
+ postcssOptions: {
39
+ plugins: [
40
+ require('autoprefixer')({
41
+ env: '>0.25%, not ie 11, not op_mini all',
42
+ flexbox: false,
43
+ grid: false
44
+ })
45
+ ]
46
+ }
47
+ }
48
+ }
49
+ ]
29
50
  },
30
- // This does weird things to document
31
- {
32
- test: /(novnc-core|@novnc\/novnc)\/.*\.js/,
33
- use: 'null-loader'
34
- }
35
51
  ]
36
52
  },
37
53
  resolve: {
@@ -41,7 +57,7 @@ const serverConfig = () => {
41
57
  // The maintainer will not allow his bundle to be required from a node context
42
58
  // https://github.com/xtermjs/xterm.js/pull/3134
43
59
  'xterm': '@patternfly/documentation-framework/helpers/xterm',
44
- 'xterm-addon-fit': '@patternfly/documentation-framework/helpers/xterm-addon-fit'
60
+ 'xterm-addon-fit': '@patternfly/documentation-framework/helpers/xterm-addon-fit',
45
61
  },
46
62
  },
47
63
  // Load in prerender.js instead
@@ -49,7 +65,7 @@ const serverConfig = () => {
49
65
  };
50
66
  }
51
67
 
52
- module.exports = (env = {}, argv) => merge(
68
+ module.exports = async (env = {}, argv) => merge(
53
69
  baseConfig(env, argv),
54
- serverConfig(env, argv)
70
+ await serverConfig(env, argv)
55
71
  );
package/templates/html.ejs CHANGED
@@ -16,9 +16,7 @@
16
16
  <%= htmlWebpackPlugin.tags.headTags %>
17
17
  </head>
18
18
  <body class="pf-m-redhat-updated-font pf-m-redhatmono-font">
19
- <div id="root">
20
- <%= prerendering %>
21
- </div>
19
+ <div id="root"><%= prerendering %></div>
22
20
  <%= htmlWebpackPlugin.tags.bodyTags %>
23
21
  <% if (algolia) { %>
24
22
  <script
package/templates/mdx.css CHANGED
@@ -297,11 +297,6 @@
297
297
  max-width: 832px;
298
298
  }
299
299
 
300
- .ws-mdx-content-katacoda {
301
- flex-grow: 1;
302
- padding: 0;
303
- }
304
-
305
300
  /* Overlay the footer */
306
301
  .ws-back-to-top {
307
302
  z-index: 2;
package/templates/mdx.js CHANGED
@@ -19,9 +19,7 @@ const MDXChildTemplate = ({
19
19
  sourceLink,
20
20
  cssPrefix = [],
21
21
  optIn,
22
- beta,
23
- katacodaBroken,
24
- katacodaLayout
22
+ beta
25
23
  } = Component.getPageData();
26
24
  const cssVarsTitle = cssPrefix.length > 0 && 'CSS variables';
27
25
  const propsTitle = propComponents.length > 0 && 'Props';
@@ -59,11 +57,6 @@ const MDXChildTemplate = ({
59
57
  To learn more about the process, visit our <Link to="/get-started/about#beta-components">about page</Link> or our <a href="https://github.com/patternfly/patternfly-org/tree/main/beta-component-promotion">Beta components</a> page on GitHub.
60
58
  </InlineAlert>
61
59
  )}
62
- {katacodaBroken && (
63
- <InlineAlert variant="warning" title="Down for maintenance">
64
- The embedded version of our tutorials are broken, but you can still access our tutorials on <a href="https://www.katacoda.com/patternfly">Katacoda.com <ExternalLinkAltIcon /></a>.
65
- </InlineAlert>
66
- )}
67
60
  </React.Fragment>
68
61
  );
69
62
  // Create dynamic component for @reach/router
@@ -72,8 +65,8 @@ const MDXChildTemplate = ({
72
65
  {toc.length > 1 && (
73
66
  <TableOfContents items={toc} />
74
67
  )}
75
- <div className={katacodaLayout? "ws-mdx-content-katacoda" : "ws-mdx-content"}>
76
- <div className={katacodaLayout ? "" : "ws-mdx-content-content"}>
68
+ <div className="ws-mdx-content">
69
+ <div className="ws-mdx-content-content">
77
70
  {InlineAlerts}
78
71
  <Component />
79
72
  {propsTitle && (
@@ -100,7 +93,7 @@ const MDXChildTemplate = ({
100
93
  <CSSVariables prefix={cssPrefix} />
101
94
  </React.Fragment>
102
95
  )}
103
- {!katacodaLayout && sourceLink && (
96
+ {sourceLink && (
104
97
  <React.Fragment>
105
98
  <br />
106
99
  <a href={sourceLink} target="_blank" onClick={() => trackEvent('view_source_click', 'click_event', source.toUpperCase())}>View source on GitHub</a>
@@ -121,7 +114,15 @@ export const MDXTemplate = ({
121
114
  id,
122
115
  componentsData
123
116
  }) => {
124
- const sourceKeys = sources.map(v => v.source);
117
+ // Build obj mapping source names to text displayed on tabs
118
+ const tabNames = sources.reduce((acc, curSrc) => {
119
+ const { source, tabName } = curSrc;
120
+ // use tabName for tab name if present, otherwise default to source
121
+ const tabLinkText = tabName || capitalize(source.replace('html', 'HTML').replace(/-/g, ' '));
122
+ acc[source] = tabLinkText;
123
+ return acc;
124
+ }, {});
125
+ const sourceKeys = Object.keys(tabNames);
125
126
  const isSinglePage = sourceKeys.length === 1;
126
127
 
127
128
  let isDevResources, isComponent, isExtension, isChart, isDemo, isLayout, isUtility;
@@ -159,7 +160,6 @@ export const MDXTemplate = ({
159
160
  (e) => e.includes("pages") || e.includes("training")
160
161
  );
161
162
  const { pathname } = useLocation();
162
- const { katacodaLayout } = sources[0].Component.getPageData();
163
163
  let activeSource = pathname.replace(/\/$/, '').split('/').pop();
164
164
  // get summary text, convert to JSX to display above tabs on component pages
165
165
  const componentDasherized = id.split(' ').join('-').toLowerCase();
@@ -201,7 +201,7 @@ export const MDXTemplate = ({
201
201
  isWidthLimited
202
202
  >
203
203
  <TextContent>
204
- {!katacodaLayout && <Title headingLevel='h1' size='4xl' id="ws-page-title">{title}</Title>}
204
+ <Title headingLevel='h1' size='4xl' id="ws-page-title">{title}</Title>
205
205
  {isComponent && summary && (<SummaryComponent />)}
206
206
  </TextContent>
207
207
  </PageSection>
@@ -223,7 +223,7 @@ export const MDXTemplate = ({
223
223
  onClick={() => trackEvent('tab_click', 'click_event', source.toUpperCase())}
224
224
  >
225
225
  <Link className="pf-c-tabs__link" to={`${path}${index === 0 ? '' : '/' + source}`}>
226
- {capitalize(source.replace('html', 'HTML').replace(/-/g, ' '))}
226
+ {tabNames[source]}
227
227
  </Link>
228
228
  </li>
229
229
  ))}
package/templates/patternfly-docs/content/extensions/extension/design-guidelines/design-guidelines.md CHANGED
@@ -7,6 +7,8 @@ section: extensions
7
7
  id: My extension
8
8
  # Tab (react | react-demos | html | html-demos | design-guidelines | accessibility)
9
9
  source: design-guidelines
10
+ # Optional custom text to display in tab in place of source
11
+ tabName: My custom tab-name
10
12
  ---
11
13
 
12
14
  Design guidelines intro
package/templates/patternfly-docs/content/extensions/extension/examples/basic.md CHANGED
@@ -7,6 +7,8 @@ section: extensions
7
7
  id: My extension
8
8
  # Tab (react | react-demos | html | html-demos | design-guidelines | accessibility)
9
9
  source: react
10
+ # Optional custom text to display in tab in place of source
11
+ tabName: My custom tab-name
10
12
  # If you use typescript, the name of the interface to display props for
11
13
  # These are found through the sourceProps function provdided in patternfly-docs.source.js
12
14
  # Can also pass object { component: string, source: string } allowing to specify the source
package/versions.json CHANGED
@@ -5,25 +5,45 @@
5
5
  "date": "2022-02-08",
6
6
  "latest": true,
7
7
  "versions": {
8
- "@patternfly/patternfly": "5.0.0-alpha.13",
8
+ "@patternfly/patternfly": "5.0.0-alpha.37",
9
+ "@patternfly/react-charts": "^7.0.0-alpha.14",
10
+ "@patternfly/react-code-editor": "^5.0.0-alpha.54",
11
+ "@patternfly/react-core": "^5.0.0-alpha.53",
12
+ "@patternfly/react-icons": "^5.0.0-alpha.8",
13
+ "@patternfly/react-styles": "^5.0.0-alpha.6",
14
+ "@patternfly/react-table": "^5.0.0-alpha.54",
15
+ "@patternfly/react-tokens": "^5.0.0-alpha.6",
9
16
  "@patternfly/react-catalog-view-extension": "4.95.1",
10
- "@patternfly/react-charts": "7.0.0-alpha.3",
11
- "@patternfly/react-code-editor": "5.0.0-alpha.7",
12
- "@patternfly/react-core": "5.0.0-alpha.7",
13
- "@patternfly/react-icons": "5.0.0-alpha.2",
17
+ "@patternfly/react-drag-drop": "5.0.0-alpha.0",
14
18
  "@patternfly/react-inline-edit-extension": "4.86.118",
15
19
  "@patternfly/react-log-viewer": "4.87.100",
16
- "@patternfly/react-styles": "5.0.0-alpha.2",
17
- "@patternfly/react-table": "5.0.0-alpha.7",
18
- "@patternfly/react-tokens": "5.0.0-alpha.2",
19
20
  "@patternfly/react-topology": "4.91.27",
20
21
  "@patternfly/react-virtualized-extension": "4.88.113"
21
22
  }
22
23
  },
24
+ {
25
+ "name": "2023.02",
26
+ "date": "2022-03-27",
27
+ "versions": {
28
+ "@patternfly/patternfly": "4.224.4",
29
+ "@patternfly/react-catalog-view-extension": "4.96.0",
30
+ "@patternfly/react-charts": "6.94.19",
31
+ "@patternfly/react-code-editor": "4.82.115",
32
+ "@patternfly/react-console": "4.95.5",
33
+ "@patternfly/react-core": "4.276.8",
34
+ "@patternfly/react-icons": "4.93.6",
35
+ "@patternfly/react-inline-edit-extension": "4.86.122",
36
+ "@patternfly/react-log-viewer": "4.87.100",
37
+ "@patternfly/react-styles": "4.92.6",
38
+ "@patternfly/react-table": "4.113.0",
39
+ "@patternfly/react-tokens": "4.94.6",
40
+ "@patternfly/react-topology": "4.91.40",
41
+ "@patternfly/react-virtualized-extension": "4.88.115"
42
+ }
43
+ },
23
44
  {
24
45
  "name": "2023.01",
25
46
  "date": "2022-01-31",
26
- "latest": true,
27
47
  "versions": {
28
48
  "@patternfly/patternfly": "4.224.2",
29
49
  "@patternfly/react-catalog-view-extension": "4.95.1",