chore(deps): Update PF deps to final alpha (#38)

* chore(deps): Update PF deps to final alpha

* chore(deps): Update to prerelease PF versions

.gitignore

@@ -9,6 +9,7 @@ coverage
 .cache
 .tmp
 .eslintcache
+.cache_*
 
 # package managers
 yarn-error.log

jest.config.js

@@ -15,6 +15,5 @@ module.exports = {
   moduleNameMapper: {
     '\\.(css|less)$': '<rootDir>/styleMock.js'
   },
-  testEnvironment: 'jsdom',
-  dryRun: true
+  testEnvironment: 'jsdom'
 };

packages/module/package.json

@@ -34,8 +34,8 @@
   },
   "dependencies": {
     "@novnc/novnc": "^1.3.0",
-    "@patternfly/react-core": "^5.0.0-alpha.72",
-    "@patternfly/react-styles": "^5.0.0-alpha.7",
+    "@patternfly/react-core": "5.0.0-prerelease.7",
+    "@patternfly/react-styles": "5.0.0-prerelease.2",
     "@spice-project/spice-html5": "^0.2.1",
     "file-saver": "^1.3.8",
     "xterm": "^4.8.1",
@@ -46,12 +46,14 @@
     "react-dom": "^16.8 || ^17 || ^18"
   },
   "devDependencies": {
-    "@patternfly/documentation-framework": "^2.0.0-alpha.29",
-    "@patternfly/patternfly": "^5.0.0-alpha.43",
+    "@patternfly/documentation-framework": "^2.0.0-alpha.57",
+    "@patternfly/patternfly": "5.0.0-prerelease.6",
     "@patternfly/patternfly-a11y": "^4.3.1",
-    "@patternfly/react-code-editor": "^5.0.0-alpha.79",
-    "@patternfly/react-table": "^5.0.0-alpha.80",
+    "@patternfly/react-code-editor": "5.0.0-prerelease.7",
+    "@patternfly/react-table": "5.0.0-prerelease.7",
     "rimraf": "^2.6.2",
-    "serve": "^14.1.2"
+    "serve": "^14.1.2",
+    "react-monaco-editor": "^0.51.0",
+    "monaco-editor": "^0.34.1"
   }
 }

packages/module/patternfly-docs/generated/extensions/react-console/react.js

@@ -13,7 +13,12 @@ const pageData = {
   "id": "React console",
   "section": "extensions",
   "subsection": "",
+  "deprecated": false,
+  "beta": true,
+  "demo": false,
+  "newImplementationLink": false,
   "source": "react",
+  "tabName": null,
   "slug": "/extensions/react-console/react",
   "sourceLink": "https://github.com/patternfly/react-console",
   "relPath": "packages/module/patternfly-docs/content/extensions/react-console/examples/ReactConsole.md",
@@ -345,7 +350,6 @@ const pageData = {
       ]
     }
   ],
-  "beta": true,
   "fullscreenExamples": [
     "Basic Usage"
   ]

packages/module/patternfly-docs/generated/index.js

@@ -7,6 +7,8 @@ module.exports = {
     section: "extensions",
     subsection: "",
     source: "react",
+    tabName: null,
+    beta: true,
     Component: () => import(/* webpackChunkName: "extensions/react-console/react/index" */ './extensions/react-console/react')
   }
 };

packages/module/release.config.js

@@ -1,4 +1,3 @@
-
 module.exports = {
   branches: [
     { name: 'v4', channel: 'prerelease' },
@@ -8,10 +7,18 @@ module.exports = {
     preset: 'angular'
   },
   plugins: [
-    '@semantic-release/commit-analyzer',
+    [
+      '@semantic-release/commit-analyzer',
+      {
+        preset: 'angular',
+        releaseRules: [
+          { type: 'chore', scope: 'deps', release: 'patch' }
+        ]
+      }
+    ],
     '@semantic-release/release-notes-generator',
     '@semantic-release/github',
     '@semantic-release/npm'
   ],
   tagFormat: 'prerelease-v${version}'
-};
+};

packages/module/src/components/AccessConsoles/AccessConsoles.tsx

@@ -118,7 +118,7 @@ export const AccessConsoles: React.FunctionComponent<AccessConsolesProps> = ({
           <Select
             aria-label={textSelectConsoleType}
             placeholderText={textSelectConsoleType}
-            toggleId="pf-c-console__type-selector"
+            toggleId="pf-v5-c-console__type-selector"
             variant={SelectVariant.single}
             onSelect={(_, selection, __) => {
               setType(selection as SelectOptionObject);

packages/module/src/components/AccessConsoles/__snapshots__/AccessConsoles.test.tsx.snap

@@ -3,60 +3,62 @@
 exports[`AccessConsoles Empty 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   />
 </DocumentFragment>
 `;
 
 exports[`AccessConsoles with DesktopViewer 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   />
 </DocumentFragment>
 `;
 
 exports[`AccessConsoles with SerialConsole and VncConsole as children 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   >
     <div
-      class="pf-c-console__actions"
+      class="pf-v5-c-console__actions"
     >
       <div
-        class="pf-c-select"
+        class="pf-v5-c-select"
         data-ouia-component-id="OUIA-Generated-Select-single-1"
-        data-ouia-component-type="PF4/Select"
+        data-ouia-component-type="PF5/Select"
         data-ouia-safe="true"
       >
         <button
           aria-expanded="false"
           aria-haspopup="listbox"
           aria-label="Options menu"
-          aria-labelledby=" pf-c-console__type-selector"
-          class="pf-c-select__toggle"
-          id="pf-c-console__type-selector"
+          aria-labelledby=" pf-v5-c-console__type-selector"
+          class="pf-v5-c-select__toggle"
+          id="pf-v5-c-console__type-selector"
           type="button"
         >
           <div
-            class="pf-c-select__toggle-wrapper"
+            class="pf-v5-c-select__toggle-wrapper"
           >
             <span
-              class="pf-c-select__toggle-text"
+              class="pf-v5-c-select__toggle-text"
             >
               Select console type
             </span>
           </div>
           <span
-            class="pf-c-select__toggle-arrow"
+            class="pf-v5-c-select__toggle-arrow"
           >
             <svg
               aria-hidden="true"
-              class="pf-svg"
+              class="pf-v5-svg"
               fill="currentColor"
+              height="1em"
               role="img"
               viewBox="0 0 320 512"
+              width="1em"
             >
               <path
                 d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"
@@ -73,79 +75,83 @@ exports[`AccessConsoles with SerialConsole and VncConsole as children 1`] = `
 exports[`AccessConsoles with SerialConsole as a single child 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   />
 </DocumentFragment>
 `;
 
 exports[`AccessConsoles with VncConsole as a single child 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   />
 </DocumentFragment>
 `;
 
 exports[`AccessConsoles with preselected SerialConsole 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   >
     <div
-      class="pf-c-console__actions-serial"
+      class="pf-v5-c-console__actions-serial"
     >
       <button
         aria-disabled="false"
-        class="pf-c-button pf-m-secondary"
+        class="pf-v5-c-button pf-m-secondary"
         data-ouia-component-id="OUIA-Generated-Button-secondary-1"
-        data-ouia-component-type="PF4/Button"
+        data-ouia-component-type="PF5/Button"
         data-ouia-safe="true"
         type="button"
       >
         Disconnect
       </button>
       <button
         aria-disabled="false"
-        class="pf-c-button pf-m-secondary"
+        class="pf-v5-c-button pf-m-secondary"
         data-ouia-component-id="OUIA-Generated-Button-secondary-2"
-        data-ouia-component-type="PF4/Button"
+        data-ouia-component-type="PF5/Button"
         data-ouia-safe="true"
         type="button"
       >
         Reset
       </button>
     </div>
     <div
-      class="pf-c-console__serial"
+      class="pf-v5-c-console__serial"
     >
       <div
-        class="pf-c-empty-state"
+        class="pf-v5-c-empty-state"
       >
         <div
-          class="pf-c-empty-state__content"
+          class="pf-v5-c-empty-state__content"
         >
           <div
-            class="pf-c-empty-state__icon"
+            class="pf-v5-c-empty-state__header"
           >
-            <svg
-              aria-hidden="false"
-              aria-label="Contents"
-              aria-valuetext="Loading..."
-              class="pf-c-spinner pf-m-xl"
-              role="progressbar"
-              viewBox="0 0 100 100"
+            <div
+              class="pf-v5-c-empty-state__icon"
             >
-              <circle
-                class="pf-c-spinner__path"
-                cx="50"
-                cy="50"
-                fill="none"
-                r="45"
-              />
-            </svg>
+              <svg
+                aria-hidden="false"
+                aria-label="Contents"
+                aria-valuetext="Loading..."
+                class="pf-v5-c-spinner pf-m-xl"
+                role="progressbar"
+                viewBox="0 0 100 100"
+              >
+                <circle
+                  class="pf-v5-c-spinner__path"
+                  cx="50"
+                  cy="50"
+                  fill="none"
+                  r="45"
+                />
+              </svg>
+            </div>
           </div>
           <div
-            class="pf-c-empty-state__body"
+            class="pf-v5-c-empty-state__body"
           >
             Loading ...
           </div>
@@ -159,7 +165,7 @@ exports[`AccessConsoles with preselected SerialConsole 1`] = `
 exports[`AccessConsoles with wrapped SerialConsole as a child 1`] = `
 <DocumentFragment>
   <div
-    class="pf-c-console"
+    class="pf-v5-c-console"
   >
     <p>
       Serial console text

packages/module/src/components/DesktopViewer/ConnectWithRemoteViewer.tsx

@@ -97,13 +97,13 @@ export const ConnectWithRemoteViewer: React.FunctionComponent<ConnectWithRemoteV
   // RDP button is rendered only if the protocol is available
   // If none of Spice or VNC is available, the .vv button is disabled (but rendered)
   return (
-    <div className="pf-c-console__remote-viewer">
-      <div className="pf-c-console__remote-viewer-launch">
-        <Button className="pf-c-console__remote-viewer-launch-vv" onClick={onClickVV} isDisabled={!_console}>
+    <div className="pf-v5-c-console__remote-viewer">
+      <div className="pf-v5-c-console__remote-viewer-launch">
+        <Button className="pf-v5-c-console__remote-viewer-launch-vv" onClick={onClickVV} isDisabled={!_console}>
           {textConnectWithRemoteViewer}
         </Button>
         {!!rdp && (
-          <Button onClick={onClickRDP} className="pf-c-console__remote-viewer-launch-rdp">
+          <Button onClick={onClickRDP} className="pf-v5-c-console__remote-viewer-launch-rdp">
             {textConnectWithRDP}
           </Button>
         )}
@@ -112,7 +112,7 @@ export const ConnectWithRemoteViewer: React.FunctionComponent<ConnectWithRemoteV
         <ExpandableSection
           toggleText={textMoreInfo}
           isExpanded={isExpandedDefault}
-          onToggle={isExpanded => setIsExpandedDefault(isExpanded)}
+          onToggle={(_event, isExpanded) => setIsExpandedDefault(isExpanded)}
         >
           <MoreInformationDefaultContent textMoreInfoContent={textMoreInfoContent} />
         </ExpandableSection>
@@ -121,7 +121,7 @@ export const ConnectWithRemoteViewer: React.FunctionComponent<ConnectWithRemoteV
         <ExpandableSection
           toggleText={textMoreRDPInfo}
           isExpanded={isExpandedRDP}
-          onToggle={isExpanded => setIsExpandedRDP(isExpanded)}
+          onToggle={(_event, isExpanded) => setIsExpandedRDP(isExpanded)}
         >
           <MoreInformationDefaultRDPContent textMoreRDPInfoContent={textMoreRDPInfoContent} />
         </ExpandableSection>

packages/module/src/components/DesktopViewer/ManualConnection.tsx

@@ -61,7 +61,7 @@ export const ManualConnection: React.FunctionComponent<ManualConnectionProps> =
   const rdpAddress = rdp && rdp.address !== address ? rdp.address : null;
 
   return (
-    <div className="pf-c-console__manual-connection">
+    <div className="pf-v5-c-console__manual-connection">
       <Title headingLevel="h2" size="3xl">
         {textManualConnection}
       </Title>