0.1.5: draggable split between manager and editor (#1)

LibreService · Jan 13, 2024 · a536062 · a536062
1 parent c353cc7
commit a536062
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 44 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -1,6 +1,10 @@
 name: build
 
-on: push
+on:
+  push:
+    branches:
+      - master
+  pull_request:
 
 jobs:
   build:

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@libreservice/wasm-code",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "main": "dist/index.js",
   "type": "module",
   "files": [
@@ -22,24 +22,24 @@
   },
   "sideEffects": false,
   "devDependencies": {
-    "@babel/runtime": "^7.23.1",
-    "@codemirror/language": "^6.9.1",
-    "@codemirror/state": "^6.2.1",
-    "@codemirror/view": "^6.20.2",
-    "@typescript-eslint/eslint-plugin": "^6.7.3",
-    "@uiw/codemirror-theme-vscode": "^4.21.18",
+    "@babel/runtime": "^7.23.8",
+    "@codemirror/language": "^6.10.0",
+    "@codemirror/state": "^6.4.0",
+    "@codemirror/view": "^6.23.0",
+    "@typescript-eslint/eslint-plugin": "^6.18.1",
+    "@uiw/codemirror-theme-vscode": "^4.21.21",
     "@vicons/material": "^0.12.0",
-    "@vitejs/plugin-vue": "^4.3.4",
+    "@vitejs/plugin-vue": "^5.0.3",
     "client-zip": "^2.4.4",
     "codemirror": "^6.0.1",
-    "eslint": "^8.50.0",
+    "eslint": "^8.56.0",
     "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-vue": "^9.17.0",
-    "naive-ui": "^2.34.4",
-    "typescript": "^5.2.2",
-    "vite": "^4.4.9",
-    "vue": "^3.3.4",
-    "vue-tsc": "^1.8.15"
+    "eslint-plugin-vue": "^9.20.1",
+    "naive-ui": "^2.37.3",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.11",
+    "vue": "^3.4.13",
+    "vue-tsc": "^1.8.27"
   },
   "peerDependencies": {
     "vue": "^3.2.0",

diff --git a/src/WasmCodeCore.vue b/src/WasmCodeCore.vue
@@ -1,6 +1,6 @@
 <script lang="ts">
 import { computed, ref, toRaw, toRefs } from 'vue'
-import { NConfigProvider, darkTheme, useOsTheme, NLayout } from 'naive-ui'
+import { NConfigProvider, darkTheme, useOsTheme, NLayout, NSplit } from 'naive-ui'
 import { StreamParser } from '@codemirror/language'
 import FileManager from './FileManager.vue'
 import CodeEditor from './CodeEditor.vue'
@@ -94,36 +94,43 @@ defineExpose({
   >
     <n-layout>
       <!-- Provide background color for theme -->
-      <div style="display: flex">
-        <div style="width: 20%; margin-top: 17px">
-          <file-manager
-            ref="fm"
+      <n-split
+        direction="horizontal"
+        :default-size="0.2"
+      >
+        <template #1>
+          <div style="margin-top: 17px">
+            <file-manager
+              ref="fm"
+              :fs="fs"
+              :height="height"
+              :hide-path="hidePath"
+              :on-open-file="onOpenFile"
+              :on-new-file="onNewFile"
+              :on-new-folder="onNewFolder"
+              :on-error-paste="onErrorPaste"
+              :on-upload="onUpload"
+              :on-rename="onRename"
+              :on-delete-file="onDeleteFile"
+              :on-delete-folder="onDeleteFolder"
+              :on-error-download="onErrorDownload"
+            />
+          </div>
+        </template>
+        <template #2>
+          <code-editor
+            ref="ce"
+            style="width: 80%"
             :fs="fs"
             :height="height"
-            :hide-path="hidePath"
-            :on-open-file="onOpenFile"
-            :on-new-file="onNewFile"
-            :on-new-folder="onNewFolder"
-            :on-error-paste="onErrorPaste"
-            :on-upload="onUpload"
-            :on-rename="onRename"
-            :on-delete-file="onDeleteFile"
-            :on-delete-folder="onDeleteFolder"
-            :on-error-download="onErrorDownload"
+            :theme="_theme!"
+            :lang-parser-map="langParserMap"
+            :ext-lang-map="extLangMap"
+            :on-close-unsaved="onCloseUnsaved"
+            :on-error-save-file="onErrorSaveFile"
           />
-        </div>
-        <code-editor
-          ref="ce"
-          style="width: 80%"
-          :fs="fs"
-          :height="height"
-          :theme="_theme!"
-          :lang-parser-map="langParserMap"
-          :ext-lang-map="extLangMap"
-          :on-close-unsaved="onCloseUnsaved"
-          :on-error-save-file="onErrorSaveFile"
-        />
-      </div>
+        </template>
+      </n-split>
     </n-layout>
   </n-config-provider>
 </template>