diff --git a/package-lock.json b/package-lock.json index fdd6455a..2d8092ab 100644 --- a/package-lock.json +++ b/package-lock.json @@ -42,7 +42,7 @@ "multer": "^1.4.2", "mustache-express": "^1.3.0", "neuroweblab": "github:neuroanatomy/neuroweblab", - "nwl-components": "^0.0.24", + "nwl-components": "^1.0.0", "pako": "^1.0.11", "passport": "^0.4.1", "passport-github": "^1.1.0", @@ -56,7 +56,6 @@ "tracer": "^0.8.15", "url": "^0.11.0", "validator": "^13.7.0", - "vue": "^3.2.31", "webpage": "^0.3.0", "ws": "^6.2.2", "y-webrtc": "^10.2.3", @@ -90,7 +89,6 @@ "svg-inline-loader": "^0.8.2", "url-loader": "^4.1.1", "vue-loader": "^17.0.0", - "vue-template-compiler": "^2.6.14", "webpack": "^4.43.0", "webpack-cli": "^3.3.11", "webworkify-webpack": "^2.1.5" @@ -883,6 +881,7 @@ "node_modules/@vue/compiler-core": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@babel/parser": "^7.16.4", "@vue/shared": "3.2.31", @@ -893,6 +892,7 @@ "node_modules/@vue/compiler-dom": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/compiler-core": "3.2.31", "@vue/shared": "3.2.31" @@ -986,6 +986,7 @@ "node_modules/@vue/compiler-ssr": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/compiler-dom": "3.2.31", "@vue/shared": "3.2.31" @@ -994,6 +995,7 @@ "node_modules/@vue/reactivity": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/shared": "3.2.31" } @@ -1029,6 +1031,7 @@ "node_modules/@vue/runtime-core": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/reactivity": "3.2.31", "@vue/shared": "3.2.31" @@ -1037,6 +1040,7 @@ "node_modules/@vue/runtime-dom": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/runtime-core": "3.2.31", "@vue/shared": "3.2.31", @@ -1046,6 +1050,7 @@ "node_modules/@vue/server-renderer": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/compiler-ssr": "3.2.31", "@vue/shared": "3.2.31" @@ -1056,7 +1061,8 @@ }, "node_modules/@vue/shared": { "version": "3.2.31", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/@webassemblyjs/ast": { "version": "1.9.0", @@ -3267,7 +3273,8 @@ }, "node_modules/csstype": { "version": "2.6.20", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/cyclist": { "version": "1.0.1", @@ -3309,11 +3316,6 @@ "node": "*" } }, - "node_modules/de-indent": { - "version": "1.0.2", - "dev": true, - "license": "MIT" - }, "node_modules/debug": { "version": "3.1.0", "license": "MIT", @@ -7338,8 +7340,7 @@ }, "node_modules/lodash-es": { "version": "4.17.21", - "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", - "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" + "license": "MIT" }, "node_modules/lodash.flattendeep": { "version": "4.4.0", @@ -8687,16 +8688,17 @@ } }, "node_modules/nwl-components": { - "version": "0.0.24", - "resolved": "https://registry.npmjs.org/nwl-components/-/nwl-components-0.0.24.tgz", - "integrity": "sha512-RGTaQuymt3jz5PfzjDJj5BIvQikMAQInTvfs7uZsyIlrLU7dwgPf8XNY4e3cf4jvA4DfSAk0Ib0VhOuQC8GNIA==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/nwl-components/-/nwl-components-1.0.0.tgz", + "integrity": "sha512-lQNIuZnZs5MQGs7wIcr9dzmp6RvTkx2/xHMLZH/nAvWr6MhAPN2uXPYNyqB4mLUQlSTRvESrHR67dPSJw9NEVQ==", "dependencies": { "dompurify": "^2.3.6", "jdenticon": "^3.1.1", "lodash-es": "^4.17.21", "md5": "^2.3.0", "nanoid": "^3.3.1", - "splitpanes": "^3.1.0" + "splitpanes": "^3.1.0", + "vue-resizable": "^2.1.5" }, "peerDependencies": { "vue": "^3.2.25" @@ -8704,16 +8706,14 @@ }, "node_modules/nwl-components/node_modules/canvas-renderer": { "version": "2.2.0", - "resolved": "https://registry.npmjs.org/canvas-renderer/-/canvas-renderer-2.2.0.tgz", - "integrity": "sha512-Itdq9pwXcs4IbbkRCXc7reeGBk6i6tlDtZTjE1yc+KvYkx1Mt3WLf6tidZ/Ixbm7Vmi+jpWKG0dRBor67x9yGw==", + "license": "MIT", "dependencies": { "@types/node": "*" } }, "node_modules/nwl-components/node_modules/jdenticon": { "version": "3.1.1", - "resolved": "https://registry.npmjs.org/jdenticon/-/jdenticon-3.1.1.tgz", - "integrity": "sha512-/m0Kk5ou7tPHjW6YovCysRETqPlFcTabWG96r8NbbSsEK+eQ3jHiGULaGOtp4XBqkRxWS1XMopLRGwdhet5ezw==", + "license": "MIT", "dependencies": { "canvas-renderer": "~2.2.0" }, @@ -8726,8 +8726,7 @@ }, "node_modules/nwl-components/node_modules/nanoid": { "version": "3.3.4", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", - "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==", + "license": "MIT", "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -11233,8 +11232,7 @@ }, "node_modules/splitpanes": { "version": "3.1.1", - "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-3.1.1.tgz", - "integrity": "sha512-VUkxDJfIGSvTM/fm/+OSrx8ha9URwE/9B8FPvfzoBuAxVELIHBWpsfnJXIXv77zVwuex//QQL4kTU9SDBPeHjA==" + "license": "MIT" }, "node_modules/sprintf-js": { "version": "1.0.3", @@ -12719,6 +12717,7 @@ "node_modules/vue": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@vue/compiler-dom": "3.2.31", "@vue/compiler-sfc": "3.2.31", @@ -12828,18 +12827,14 @@ "node": ">=8" } }, - "node_modules/vue-template-compiler": { - "version": "2.6.14", - "dev": true, - "license": "MIT", - "dependencies": { - "de-indent": "^1.0.2", - "he": "^1.1.0" - } + "node_modules/vue-resizable": { + "version": "2.1.5", + "license": "MIT" }, "node_modules/vue/node_modules/@vue/compiler-sfc": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@babel/parser": "^7.16.4", "@vue/compiler-core": "3.2.31", @@ -12856,6 +12851,7 @@ "node_modules/vue/node_modules/@vue/reactivity-transform": { "version": "3.2.31", "license": "MIT", + "peer": true, "dependencies": { "@babel/parser": "^7.16.4", "@vue/compiler-core": "3.2.31", @@ -12867,6 +12863,7 @@ "node_modules/vue/node_modules/nanoid": { "version": "3.3.4", "license": "MIT", + "peer": true, "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -12887,6 +12884,7 @@ } ], "license": "MIT", + "peer": true, "dependencies": { "nanoid": "^3.3.4", "picocolors": "^1.0.0", @@ -14647,6 +14645,7 @@ }, "@vue/compiler-core": { "version": "3.2.31", + "peer": true, "requires": { "@babel/parser": "^7.16.4", "@vue/shared": "3.2.31", @@ -14656,6 +14655,7 @@ }, "@vue/compiler-dom": { "version": "3.2.31", + "peer": true, "requires": { "@vue/compiler-core": "3.2.31", "@vue/shared": "3.2.31" @@ -14724,6 +14724,7 @@ }, "@vue/compiler-ssr": { "version": "3.2.31", + "peer": true, "requires": { "@vue/compiler-dom": "3.2.31", "@vue/shared": "3.2.31" @@ -14731,6 +14732,7 @@ }, "@vue/reactivity": { "version": "3.2.31", + "peer": true, "requires": { "@vue/shared": "3.2.31" } @@ -14764,6 +14766,7 @@ }, "@vue/runtime-core": { "version": "3.2.31", + "peer": true, "requires": { "@vue/reactivity": "3.2.31", "@vue/shared": "3.2.31" @@ -14771,6 +14774,7 @@ }, "@vue/runtime-dom": { "version": "3.2.31", + "peer": true, "requires": { "@vue/runtime-core": "3.2.31", "@vue/shared": "3.2.31", @@ -14779,13 +14783,15 @@ }, "@vue/server-renderer": { "version": "3.2.31", + "peer": true, "requires": { "@vue/compiler-ssr": "3.2.31", "@vue/shared": "3.2.31" } }, "@vue/shared": { - "version": "3.2.31" + "version": "3.2.31", + "peer": true }, "@webassemblyjs/ast": { "version": "1.9.0", @@ -16280,7 +16286,8 @@ } }, "csstype": { - "version": "2.6.20" + "version": "2.6.20", + "peer": true }, "cyclist": { "version": "1.0.1", @@ -16313,10 +16320,6 @@ "dateformat": { "version": "3.0.3" }, - "de-indent": { - "version": "1.0.2", - "dev": true - }, "debug": { "version": "3.1.0", "requires": { @@ -18918,9 +18921,7 @@ "version": "4.17.21" }, "lodash-es": { - "version": "4.17.21", - "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", - "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" + "version": "4.17.21" }, "lodash.flattendeep": { "version": "4.4.0", @@ -19845,38 +19846,33 @@ } }, "nwl-components": { - "version": "0.0.24", - "resolved": "https://registry.npmjs.org/nwl-components/-/nwl-components-0.0.24.tgz", - "integrity": "sha512-RGTaQuymt3jz5PfzjDJj5BIvQikMAQInTvfs7uZsyIlrLU7dwgPf8XNY4e3cf4jvA4DfSAk0Ib0VhOuQC8GNIA==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/nwl-components/-/nwl-components-1.0.0.tgz", + "integrity": "sha512-lQNIuZnZs5MQGs7wIcr9dzmp6RvTkx2/xHMLZH/nAvWr6MhAPN2uXPYNyqB4mLUQlSTRvESrHR67dPSJw9NEVQ==", "requires": { "dompurify": "^2.3.6", "jdenticon": "^3.1.1", "lodash-es": "^4.17.21", "md5": "^2.3.0", "nanoid": "^3.3.1", - "splitpanes": "^3.1.0" + "splitpanes": "^3.1.0", + "vue-resizable": "^2.1.5" }, "dependencies": { "canvas-renderer": { "version": "2.2.0", - "resolved": "https://registry.npmjs.org/canvas-renderer/-/canvas-renderer-2.2.0.tgz", - "integrity": "sha512-Itdq9pwXcs4IbbkRCXc7reeGBk6i6tlDtZTjE1yc+KvYkx1Mt3WLf6tidZ/Ixbm7Vmi+jpWKG0dRBor67x9yGw==", "requires": { "@types/node": "*" } }, "jdenticon": { "version": "3.1.1", - "resolved": "https://registry.npmjs.org/jdenticon/-/jdenticon-3.1.1.tgz", - "integrity": "sha512-/m0Kk5ou7tPHjW6YovCysRETqPlFcTabWG96r8NbbSsEK+eQ3jHiGULaGOtp4XBqkRxWS1XMopLRGwdhet5ezw==", "requires": { "canvas-renderer": "~2.2.0" } }, "nanoid": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", - "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + "version": "3.3.4" } } }, @@ -21542,9 +21538,7 @@ } }, "splitpanes": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/splitpanes/-/splitpanes-3.1.1.tgz", - "integrity": "sha512-VUkxDJfIGSvTM/fm/+OSrx8ha9URwE/9B8FPvfzoBuAxVELIHBWpsfnJXIXv77zVwuex//QQL4kTU9SDBPeHjA==" + "version": "3.1.1" }, "sprintf-js": { "version": "1.0.3", @@ -22576,6 +22570,7 @@ }, "vue": { "version": "3.2.31", + "peer": true, "requires": { "@vue/compiler-dom": "3.2.31", "@vue/compiler-sfc": "3.2.31", @@ -22586,6 +22581,7 @@ "dependencies": { "@vue/compiler-sfc": { "version": "3.2.31", + "peer": true, "requires": { "@babel/parser": "^7.16.4", "@vue/compiler-core": "3.2.31", @@ -22601,6 +22597,7 @@ }, "@vue/reactivity-transform": { "version": "3.2.31", + "peer": true, "requires": { "@babel/parser": "^7.16.4", "@vue/compiler-core": "3.2.31", @@ -22610,10 +22607,12 @@ } }, "nanoid": { - "version": "3.3.4" + "version": "3.3.4", + "peer": true }, "postcss": { "version": "8.4.14", + "peer": true, "requires": { "nanoid": "^3.3.4", "picocolors": "^1.0.0", @@ -22683,13 +22682,8 @@ } } }, - "vue-template-compiler": { - "version": "2.6.14", - "dev": true, - "requires": { - "de-indent": "^1.0.2", - "he": "^1.1.0" - } + "vue-resizable": { + "version": "2.1.5" }, "w3c-hr-time": { "version": "1.0.2", diff --git a/package.json b/package.json index a11988a0..7a7107e7 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,7 @@ "multer": "^1.4.2", "mustache-express": "^1.3.0", "neuroweblab": "github:neuroanatomy/neuroweblab", - "nwl-components": "^0.0.24", + "nwl-components": "^1.0.0", "pako": "^1.0.11", "passport": "^0.4.1", "passport-github": "^1.1.0", @@ -71,7 +71,6 @@ "tracer": "^0.8.15", "url": "^0.11.0", "validator": "^13.7.0", - "vue": "^3.2.31", "webpage": "^0.3.0", "ws": "^6.2.2", "y-webrtc": "^10.2.3", @@ -105,7 +104,6 @@ "svg-inline-loader": "^0.8.2", "url-loader": "^4.1.1", "vue-loader": "^17.0.0", - "vue-template-compiler": "^2.6.14", "webpack": "^4.43.0", "webpack-cli": "^3.3.11", "webworkify-webpack": "^2.1.5" diff --git a/view/brainbox/src/components/MRIPage.vue b/view/brainbox/src/components/MRIPage.vue index f9fa8250..10ab7aad 100644 --- a/view/brainbox/src/components/MRIPage.vue +++ b/view/brainbox/src/components/MRIPage.vue @@ -243,6 +243,10 @@ main { .tools { width: 100%; } +:deep(button), :deep(.group) { + height: 24px; + margin: 1px; +} @media(max-width: 1300px) { .left, .right { diff --git a/view/brainbox/src/components/ProjectPage.vue b/view/brainbox/src/components/ProjectPage.vue index bdcff8fc..380435d8 100644 --- a/view/brainbox/src/components/ProjectPage.vue +++ b/view/brainbox/src/components/ProjectPage.vue @@ -60,7 +60,7 @@ import { ProjectPage, TextAnnotations, VolumeAnnotations, -} from "nwl-components"; +} from "nwl-components/dist/nwl-components.umd.js"; import * as Vue from "vue"; const { annotationsAccessLevel, BrainBox, AtlasMakerWidget } = window; diff --git a/view/brainbox/src/components/Tools.vue b/view/brainbox/src/components/Tools.vue index daf8d425..acaba863 100644 --- a/view/brainbox/src/components/Tools.vue +++ b/view/brainbox/src/components/Tools.vue @@ -6,135 +6,140 @@ @update:modelValue="sliceChange" /> - - - - - - - - + + + + + - - + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - + + @@ -176,7 +181,8 @@ > - + +
{ @@ -264,7 +271,7 @@ const toggleFullscreen = async () => { fullscreen.value = !fullscreen.value; setTimeout(() => { AtlasMakerWidget.resizeWindow(); - }, 250) + }, 250); }; const render3D = () => { @@ -348,7 +355,8 @@ button img.icon { .text:hover { opacity: 1; } -:deep(.group), :deep(button) { +:deep(.group), +:deep(button) { flex-grow: 1; } diff --git a/webpack.pages.config.js b/webpack.pages.config.js index d66dca15..56e65d79 100644 --- a/webpack.pages.config.js +++ b/webpack.pages.config.js @@ -43,10 +43,5 @@ module.exports = (env, argv) => ({ loader: 'vue-loader' } ] - }, - resolve: { - symlinks: false, - alias: { - } } });