@patternfly/react-code-editor 5.0.0-alpha.8 → 5.0.0-alpha.80

package/src/components/CodeEditor/__test__/__snapshots__/CodeEditor.test.tsx.snap

@@ -30,12 +30,10 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
             >
               <svg
                 aria-hidden="true"
+                class="pf-svg"
                 fill="currentColor"
-                height="1em"
                 role="img"
-                style="vertical-align: -0.125em;"
                 viewBox="0 0 448 512"
-                width="1em"
               >
                 <path
                   d="M320 448v40c0 13.255-10.745 24-24 24H24c-13.255 0-24-10.745-24-24V120c0-13.255 10.745-24 24-24h72v296c0 30.879 25.121 56 56 56h168zm0-344V0H152c-13.255 0-24 10.745-24 24v368c0 13.255 10.745 24 24 24h272c13.255 0 24-10.745 24-24V128H344c-13.2 0-24-10.8-24-24zm120.971-31.029L375.029 7.029A24 24 0 0 0 358.059 0H352v96h96v-6.059a24 24 0 0 0-7.029-16.97z"
@@ -57,12 +55,10 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
             >
               <svg
                 aria-hidden="true"
+                class="pf-svg"
                 fill="currentColor"
-                height="1em"
                 role="img"
-                style="vertical-align: -0.125em;"
                 viewBox="0 0 512 512"
-                width="1em"
               >
                 <path
                   d="M296 384h-80c-13.3 0-24-10.7-24-24V192h-87.7c-17.8 0-26.7-21.5-14.1-34.1L242.3 5.7c7.5-7.5 19.8-7.5 27.3 0l152.2 152.2c12.6 12.6 3.7 34.1-14.1 34.1H320v168c0 13.3-10.7 24-24 24zm216-8v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h136v8c0 30.9 25.1 56 56 56h80c30.9 0 56-25.1 56-56v-8h136c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"
@@ -84,12 +80,10 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
             >
               <svg
                 aria-hidden="true"
+                class="pf-svg"
                 fill="currentColor"
-                height="1em"
                 role="img"
-                style="vertical-align: -0.125em;"
                 viewBox="0 0 512 512"
-                width="1em"
               >
                 <path
                   d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"
@@ -109,12 +103,10 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
           >
             <svg
               aria-hidden="true"
+              class="pf-svg"
               fill="currentColor"
-              height="1em"
               role="img"
-              style="vertical-align: -0.125em;"
               viewBox="0 0 640 512"
-              width="1em"
             >
               <path
                 d="M278.9 511.5l-61-17.7c-6.4-1.8-10-8.5-8.2-14.9L346.2 8.7c1.8-6.4 8.5-10 14.9-8.2l61 17.7c6.4 1.8 10 8.5 8.2 14.9L293.8 503.3c-1.9 6.4-8.5 10.1-14.9 8.2zm-114-112.2l43.5-46.4c4.6-4.9 4.3-12.7-.8-17.2L117 256l90.6-79.7c5.1-4.5 5.5-12.3.8-17.2l-43.5-46.4c-4.5-4.8-12.1-5.1-17-.5L3.8 247.2c-5.1 4.7-5.1 12.8 0 17.5l144.1 135.1c4.9 4.6 12.5 4.4 17-.5zm327.2.6l144.1-135.1c5.1-4.7 5.1-12.8 0-17.5L492.1 112.1c-4.8-4.5-12.4-4.3-17 .5L431.6 159c-4.6 4.9-4.3 12.7.8 17.2L523 256l-90.6 79.7c-5.1 4.5-5.5 12.3-.8 17.2l43.5 46.4c4.5 4.9 12.1 5.1 17 .6z"
@@ -142,7 +134,7 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
         >
           <div
             class="react-monaco-editor-container"
-            data-keybinding-context="1"
+            data-keybinding-context="2"
             data-mode-id="plaintext"
             style="height: 400px;"
           >
@@ -199,6 +191,11 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                       class="view-rulers"
                       role="presentation"
                     />
+                    <div
+                      aria-hidden="true"
+                      class="blockDecorations-container"
+                      role="presentation"
+                    />
                     <div
                       aria-hidden="true"
                       class="view-zones"
@@ -210,7 +207,7 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                       class="view-lines monaco-mouse-cursor-text"
                       data-mprt="7"
                       role="presentation"
-                      style="position: absolute; font-family: Consolas, 'Courier New', monospace; font-weight: normal; font-size: 14px; font-feature-settings: \\"liga\\" off, \\"calt\\" off; line-height: 19px; letter-spacing: 0px; width: 45px; height: 5px;"
+                      style="position: absolute; font-family: Consolas, 'Courier New', monospace; font-weight: normal; font-size: 14px; font-feature-settings: \\"liga\\" off, \\"calt\\" off; line-height: 19px; letter-spacing: 0px; width: 54px; height: 19px;"
                     >
                       <div
                         class="view-line"
@@ -256,7 +253,7 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                     aria-hidden="true"
                     class="decorationsOverviewRuler"
                     height="5"
-                    style="position: absolute; transform: translate3d(0px, 0px, 0px); contain: strict; top: 0px; right: 0px; width: 14px; height: 5px;"
+                    style="position: absolute; transform: translate3d(0px, 0px, 0px); contain: strict; top: 0px; right: 0px; width: 14px; height: 5px; display: block;"
                     width="14"
                   />
                   <div
@@ -267,7 +264,7 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                   >
                     <div
                       class="slider"
-                      style="position: absolute; top: 0px; left: 0px; width: 14px; transform: translate3d(0px, 0px, 0px); contain: strict; height: 5px;"
+                      style="position: absolute; top: 0px; left: 0px; width: 14px; transform: translate3d(0px, 0px, 0px); contain: strict; height: 20px;"
                     />
                   </div>
                 </div>
@@ -286,7 +283,6 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                   autocorrect="off"
                   class="inputarea monaco-mouse-cursor-text"
                   data-mprt="6"
-                  readonly="true"
                   role="textbox"
                   spellcheck="false"
                   style="font-family: Consolas, 'Courier New', monospace; font-weight: normal; font-size: 14px; font-feature-settings: \\"liga\\" off, \\"calt\\" off; line-height: 19px; letter-spacing: 0px; top: 0px; left: 0px; width: 1px; height: 1px;"
@@ -343,11 +339,6 @@ exports[`CodeEditor matches snapshot with all props 1`] = `
                 class="overflowingContentWidgets"
                 data-mprt="2"
               />
-              <div
-                aria-hidden="true"
-                class="context-view"
-                style="display: none;"
-              />
             </div>
           </div>
         </div>
@@ -437,6 +428,11 @@ exports[`CodeEditor matches snapshot without props 1`] = `
                     class="view-rulers"
                     role="presentation"
                   />
+                  <div
+                    aria-hidden="true"
+                    class="blockDecorations-container"
+                    role="presentation"
+                  />
                   <div
                     aria-hidden="true"
                     class="view-zones"
@@ -448,7 +444,7 @@ exports[`CodeEditor matches snapshot without props 1`] = `
                     class="view-lines monaco-mouse-cursor-text"
                     data-mprt="7"
                     role="presentation"
-                    style="position: absolute; font-family: Consolas, 'Courier New', monospace; font-weight: normal; font-size: 14px; font-feature-settings: \\"liga\\" off, \\"calt\\" off; line-height: 19px; letter-spacing: 0px; width: 26px; height: 5px;"
+                    style="position: absolute; font-family: Consolas, 'Courier New', monospace; font-weight: normal; font-size: 14px; font-feature-settings: \\"liga\\" off, \\"calt\\" off; line-height: 19px; letter-spacing: 0px; width: 35px; height: 19px;"
                   >
                     <div
                       class="view-line"
@@ -490,7 +486,7 @@ exports[`CodeEditor matches snapshot without props 1`] = `
                   aria-hidden="true"
                   class="decorationsOverviewRuler"
                   height="5"
-                  style="position: absolute; transform: translate3d(0px, 0px, 0px); contain: strict; top: 0px; right: 0px; width: 14px; height: 5px;"
+                  style="position: absolute; transform: translate3d(0px, 0px, 0px); contain: strict; top: 0px; right: 0px; width: 14px; height: 5px; display: block;"
                   width="14"
                 />
                 <div
@@ -501,7 +497,7 @@ exports[`CodeEditor matches snapshot without props 1`] = `
                 >
                   <div
                     class="slider"
-                    style="position: absolute; top: 0px; left: 0px; width: 14px; transform: translate3d(0px, 0px, 0px); contain: strict; height: 5px;"
+                    style="position: absolute; top: 0px; left: 0px; width: 14px; transform: translate3d(0px, 0px, 0px); contain: strict; height: 20px;"
                   />
                 </div>
               </div>
@@ -576,11 +572,6 @@ exports[`CodeEditor matches snapshot without props 1`] = `
               class="overflowingContentWidgets"
               data-mprt="2"
             />
-            <div
-              aria-hidden="true"
-              class="context-view"
-              style="display: none;"
-            />
           </div>
         </div>
       </div>

package/src/components/CodeEditor/examples/CodeEditorBasic.tsx

@@ -40,7 +40,7 @@ export const CodeEditorBasic: React.FunctionComponent = () => {
       <Checkbox
         label="Dark theme"
         isChecked={isDarkTheme}
-        onChange={toggleDarkTheme}
+        onChange={(_event, checked) => toggleDarkTheme(checked)}
         aria-label="dark theme checkbox"
         id="toggle-theme"
         name="toggle-theme"
@@ -48,7 +48,7 @@ export const CodeEditorBasic: React.FunctionComponent = () => {
       <Checkbox
         label="Line numbers"
         isChecked={isLineNumbersVisible}
-        onChange={toggleLineNumbers}
+        onChange={(_event, checked) => toggleLineNumbers(checked)}
         aria-label="line numbers checkbox"
         id="toggle-line-numbers"
         name="toggle-line-numbers"
@@ -56,7 +56,7 @@ export const CodeEditorBasic: React.FunctionComponent = () => {
       <Checkbox
         label="Read only"
         isChecked={isReadOnly}
-        onChange={toggleReadOnly}
+        onChange={(_event, checked) => toggleReadOnly(checked)}
         aria-label="read only checkbox"
         id="toggle-read-only"
         name="toggle-read-only"
@@ -64,7 +64,7 @@ export const CodeEditorBasic: React.FunctionComponent = () => {
       <Checkbox
         label="Minimap"
         isChecked={isMinimapVisible}
-        onChange={toggleMinimap}
+        onChange={(_event, checked) => toggleMinimap(checked)}
         aria-label="display minimap checkbox"
         id="toggle-minimap"
         name="toggle-minimap"