fix drawer in hyperbook studio

.changeset/strange-bobcats-walk.md

@@ -0,0 +1,7 @@
+---
+"@hyperbook/next-watch": patch
+"hyperbook-studio": patch
+"@hyperbook/fs": patch
+---
+
+Fix drawer in hyperbook-studio

package.json

@@ -14,6 +14,7 @@
     "version-packages": "changeset version",
     "release": "changeset publish",
     "platform:web:dev": "pnpm --filter @platforms/web dev",
+    "platform:vscode:dev": "pnpm --filter hyperbook-studio watch",
     "examples:setup": "cd examples && HYPERBOOK_LOCAL_DEV=1 node ../packages/hyperbook/dist/index.js setup",
     "examples:build": "cd examples && HYPERBOOK_LOCAL_DEV=1 node ../packages/hyperbook/dist/index.js build",
     "website:setup": "cd website && HYPERBOOK_LOCAL_DEV=1 node ../packages/hyperbook/dist/index.js setup",

packages/fs/src/index.ts

@@ -10,6 +10,7 @@ export {
   VFilePublic,
   VFileArchive,
   VFileSnippet,
+  getMarkdown,
 } from "./vfile";
 
 export { hyperlibrary, hyperbook, hyperproject, vfile };

platforms/vscode/app/App.tsx

@@ -64,7 +64,7 @@ export const App = () => {
   }, []);
 
   if (!state) {
-    return <div>...</div>;
+    return <div>...Loading</div>;
   }
 
   return (

platforms/vscode/app/index.scss

@@ -1,3 +1,4 @@
+@import "@hyperbook/drawer/index.css";
 @import "@hyperbook/shell/index.css";
 @import "@hyperbook/markdown/katex.css";
 @import "@hyperbook/markdown/index.css";
@@ -23,9 +24,20 @@
 @import "@hyperbook/element-online-ide/index.css";
 @import "@hyperbook/element-sql-ide/index.css";
 
+html,
 body {
   padding: 0;
   margin: 0;
+  overflow: hidden;
+}
+
+body {
+  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none; /* Firefox */
+}
+
+body::-webkit-scrollbar {
+  display: none;
 }
 
 #root {

platforms/vscode/package.json

@@ -181,6 +181,7 @@
     "webpack-cli": "4.10.0"
   },
   "dependencies": {
+    "@hyperbook/drawer": "workspace:*",
     "@hyperbook/element-audio": "workspace:*",
     "@hyperbook/element-video": "workspace:*",
     "@hyperbook/element-alert": "workspace:*",

platforms/vscode/src/Preview.ts

@@ -7,6 +7,7 @@ import {
   VFileGlossary,
   vfile,
   VFile,
+  getMarkdown,
 } from "@hyperbook/fs";
 import { htmlTemplate } from "./html-template";
 import { disposeAll } from "./utils/dispose";
@@ -193,6 +194,12 @@ export default class Preview {
       this._vfile
     ) {
       console.log("Partial update");
+
+      this._vfile = {
+        ...this._vfile,
+        markdown: await getMarkdown(this._vfile),
+      };
+
       this.postMessage({
         type: "CHANGE",
         payload: await this.getState(false),