Merge pull request #1261 from cylc/renovate/lumino-widgets-2.x

fix(deps): update dependency @lumino/widgets to v2

package.json

@@ -23,9 +23,8 @@
   "dependencies": {
     "@apollo/client": "^3.5.8",
     "@hpcc-js/wasm": "^2.8.0",
-    "@lumino/algorithm": "^1.9.1",
     "@lumino/default-theme": "^2.0.0",
-    "@lumino/widgets": "^1.31.1",
+    "@lumino/widgets": "^2.0.0",
     "@unhead/vue": "^1.1.17",
     "axios": "^1.0.0",
     "dedent": "^0.7.0",

src/styles/cylc/_workflow.scss

@@ -39,31 +39,32 @@
       flex: 1 1 auto;
       .lm-TabBar-content {
         padding-left: 0;
-
-        .lm-TabBar-tab {
-          display: flex;
-          align-items: center;
-          border-bottom: 1px solid #C0C0C0;
-        }
-
-        .lm-TabBar-tabLabel {
-          font-family: settings.$body-font-family;
-          font-size: 1rem;
-        }
-
-        .lm-TabBar-tabCloseIcon {
-          color: inherit;
-          cursor: pointer;
-        }
-
-        .lm-TabBar-tabCloseIcon:before {
-          content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='width:24px;height:24px' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z' /%3E%3C/svg%3E");
-          display: block;
-          width: 1rem;
-          height: 1rem;
-        }
       }
     }
   }
+}
 
+.lm-TabBar-tab {
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #C0C0C0;
+}
+.lm-TabBar-tabLabel {
+  font-family: settings.$body-font-family;
+  font-size: 1rem;
+}
+.lm-TabBar-tabCloseIcon {
+  color: inherit;
+  cursor: pointer;
+}
+.lm-TabBar-tabCloseIcon:before {
+  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='width:24px;height:24px' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z' /%3E%3C/svg%3E") !important;
+  display: block;
+  width: 1rem;
+  height: 1rem;
+}
+// Workaround https://github.com/jupyterlab/lumino/issues/593:
+.lm-mod-drag-image {
+  top: -10px;
+  left: -60px;
 }

src/views/Workspace.vue

@@ -38,7 +38,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 <script>
 import { defineAsyncComponent } from 'vue'
 import { uniqueId } from 'lodash'
-import { toArray } from '@lumino/algorithm'
 import {
   mdiChartLine,
   mdiFileDocumentMultipleOutline,
@@ -156,7 +155,7 @@ export default {
      * Remove all the widgets present in the DockPanel.
      */
     removeAllWidgets () {
-      toArray(this.$refs.lumino.dock.widgets())
+      Array.from(this.$refs.lumino.dock.widgets())
         .forEach(widget => widget.close())
     },
     /**