vzcode 0.16.0 → 0.18.0

package/README.md

@@ -1,10 +1,11 @@
 # VZCode: Multiplayer Code Editor
 
-VZCode offers a multiplayer code editing environment that caters to a real-time collaborative development experience. 
+VZCode offers a multiplayer code editing environment that caters to a real-time collaborative development experience.
 
 ![VZCode Interface](https://user-images.githubusercontent.com/68416/224690259-293c75c5-5970-4066-80e4-b9dee568e10d.png)
 
 ## Table of Contents
+
 - [Development](#development)
 - [Features](#features)
 - [Use Cases](#use-cases)
@@ -20,17 +21,20 @@ VZCode offers a multiplayer code editing environment that caters to a real-time
 - **Backlog & Issues**: Use our [Kanban Board](https://github.com/orgs/vizhub-core/projects/2/views/1) to track the backlog, [good first issues](https://github.com/orgs/vizhub-core/projects/2/views/1?filterQuery=label%3A%22good+first+issue%22), and [known bugs](https://github.com/orgs/vizhub-core/projects/2/views/1?filterQuery=label%3Abug).
 
 - **Local Setup**:
-    ```bash
-    cd vzcode
-    npm install
-    npm run test-interactive
-    ```
-    For hot reloading (client-side only), run:
-    ```bash
-    npm run dev
-    ```
 
-    You can also use [npm link](https://docs.npmjs.com/cli/v8/commands/npm-link) to set up the `vzcode` NPM package in another project to point to your clone of the repository. This can be useful when testing out how `vzcode` functions as a dependency.
+  ```bash
+  cd vzcode
+  npm install
+  npm run test-interactive
+  ```
+
+  For hot reloading (client-side only), run:
+
+  ```bash
+  npm run dev
+  ```
+
+  You can also use [npm link](https://docs.npmjs.com/cli/v8/commands/npm-link) to set up the `vzcode` NPM package in another project to point to your clone of the repository. This can be useful when testing out how `vzcode` functions as a dependency.
 
 ## Features
 
@@ -47,37 +51,41 @@ VZCode offers a multiplayer code editing environment that caters to a real-time
 ## Use Cases
 
 - **Local Editor**:
-    Use VZCode like VSCode or Vim:
-    ```bash
-    npm install -g vzcode
-    cd myProject
-    vzcode
-    ```
-
-- **Project-specific Editor**: 
-    Embed VZCode within your project for developers who might not have a preferred IDE, or to provide an editing experience that seamlessly integrates with hot reloading.
-    ```json
-    {
-      "name": "example-project",
-      "scripts": {
-        "edit": "vzcode"
-      },
-      "dependencies": {
-        "vzcode": "^0.1.0"
-      }
+  Use VZCode like VSCode or Vim:
+
+  ```bash
+  npm install -g vzcode
+  cd myProject
+  vzcode
+  ```
+
+- **Project-specific Editor**:
+  Embed VZCode within your project for developers who might not have a preferred IDE, or to provide an editing experience that seamlessly integrates with hot reloading.
+
+  ```json
+  {
+    "name": "example-project",
+    "scripts": {
+      "edit": "vzcode"
+    },
+    "dependencies": {
+      "vzcode": "^0.1.0"
     }
-    ```
-    Run using `npm run edit`.
+  }
+  ```
 
-    For example, as the editor of [Vite D3 Template](https://github.com/curran/vite-d3-template), which showcases the throttled auto-save behavior of VZCode while using the interactive widgets in the context of editing files served by the Vite dev server which supports hot reloading.
+  Run using `npm run edit`.
+
+  For example, as the editor of [Vite D3 Template](https://github.com/curran/vite-d3-template), which showcases the throttled auto-save behavior of VZCode while using the interactive widgets in the context of editing files served by the Vite dev server which supports hot reloading.
 
 - **Hosting with Ngrok**: Allow external collaborators to join your VZCode session.
-  
+
   - **With Ngrok Globally Installed**: (Requires authenticated Ngrok account)
-      ```bash
-      vzcode
-      ngrok http 3030
-      ```
+
+    ```bash
+    vzcode
+    ngrok http 3030
+    ```
 
   - **Through VZCode**: Coming soon!
 
@@ -109,7 +117,7 @@ The project aims to:
 
 ## Prior Work
 
-VZCode is inspired by [VizHub v2](https://github.com/vizhub-core/vizhub/). VizHub V2's code editor supports real-time collaboration using older versions of libraries such as CodeMirror 5 and JSON0 OT. For VZCode, the aim is to leverage the latest technologies to deliver a more streamlined experience. 
+VZCode is inspired by [VizHub v2](https://github.com/vizhub-core/vizhub/). VizHub V2's code editor supports real-time collaboration using older versions of libraries such as CodeMirror 5 and JSON0 OT. For VZCode, the aim is to leverage the latest technologies to deliver a more streamlined experience.
 
 ![Prior Work Image](https://user-images.githubusercontent.com/68416/213894278-51c7c9a9-dc11-42bc-ba10-c23109c473cd.png)
 
@@ -129,7 +137,7 @@ For detailed progress, visit the [VZCode Kanban Board](https://github.com/orgs/v
 
 - **Curran Kelleher**
 - **Anooj Pai** from [RPI RCOS](https://rcos.io/)
-  
+
   We welcome contributions!
 
 ## Spaces

package/dist/assets/index-0053b846.css

@@ -0,0 +1 @@
+.vz-code-editor{flex:1;display:flex;font-family:var(--vzcode-font-family);overflow-x:auto}.vz-code-editor .cm-editor{flex:1}.vz-sidebar{height:100%;background:rgb(54,65,89);display:flex;flex-direction:column;justify-content:space-between}.vz-sidebar .full-box{padding:7px;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.vz-sidebar .files{overflow:auto}.vz-sidebar .file-or-directory{display:flex;flex-direction:row;align-items:center;justify-content:space-between;cursor:pointer;margin:0 10px;color:#dbdde1;border-radius:5px}.vz-sidebar .link-name{margin-top:30px;margin-left:10px;color:#9aa0ac;font-size:12px;text-decoration:none}.vz-sidebar .new-btn{justify-content:right;margin-right:10px;cursor:pointer}.vz-sidebar .utils{display:flex}.vz-sidebar .utilities{margin-right:3px}.vz-sidebar .file-or-directory:hover,.vz-sidebar .settings:hover{background-color:#4a5469}.vz-sidebar .name{display:flex;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.vz-sidebar .indentation{margin-left:20px}.vz-sidebar .arrow-wrapper{margin-right:4px}.vz-sidebar .settings{height:30px;color:#dbdde1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:14px 0;margin:10px;border-radius:5px}.vz-tab-list{display:flex;background-color:#252526}.vz-tab-list .tab{background:rgb(45,45,45);color:#fff;font-family:var(--vzcode-font-family);align-items:center;display:flex;padding-top:2px;padding-left:10px;padding-right:10px;border-top-left-radius:10px;border-top-right-radius:10px;margin-top:5px;margin-left:2px;margin-right:2px;cursor:pointer}.vz-tab-list .tab .tab-close{margin-left:5px}.vz-tab-list .tab .tab-close:hover{border-radius:30%;background-color:#252526}.vz-tab-list .tab.active{background-color:#292c34}.vz-resizer{position:absolute;top:0;left:0;bottom:0}.vz-resizer:hover{cursor:col-resize}.vz-resizer .vz-resizer-thumb{position:absolute;top:0;bottom:0;transition:background-color .15s .25s}.vz-resizer:hover .vz-resizer-thumb{background-color:#0078d4}:root{--vzcode-font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;--vz-bg-color: rgb( 41, 44, 52 )}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--app-bg-color)}::-webkit-scrollbar-thumb{background:rgb(37,37,38)}::-webkit-scrollbar-thumb:hover{background:#555}html,body,#root,.app{height:100%}.app{background-color:var(--vz-bg-color);font-family:Poppins,sans-serif;display:flex;position:relative}.app .left,.app .right{display:flex}.app .right{flex:1;flex-direction:column;min-width:0}