@vemjs/renderer-vecto 0.1.0

package/CHANGELOG.md

@@ -0,0 +1,53 @@
+# @vemjs/renderer-vecto
+
+## 0.1.1
+
+### Patch Changes
+
+- 0498765: chore: release infrastructure, package metadata, and documentation scaffolding
+
+  This changeset covers all release preparation work for the initial 0.1.0 publish:
+
+  **Package metadata** — Added `license`, `repository`, `keywords`, and `publishConfig` fields to
+  all four packages so they display correctly on npmjs.com with proper source links, license badges,
+  and searchable tags.
+
+  **CI/CD pipeline** — Rewrote `.github/workflows/ci.yml` and `release.yml`:
+
+  - `quality` job: build → test → lint (oxlint) → dead-code scan (knip) on every PR and push
+  - `publish` job: automatic `changeset publish` to npm on every merge to `main` via
+    `changesets/action@v1` using the `NPM_TOKEN` org secret
+
+  **Changesets** — Initialized `.changeset/` with a `config.json` configured for public access and
+  patch-level internal dependency updates, enabling a fully automated release flow.
+
+  **Tooling** — Added `knip.config.ts` (dead-code detection), `oxlintrc.json` (TypeScript-aware
+  lint rules), `.lintstagedrc.json` (auto-fix staged files on commit), and updated root
+  `package.json` scripts: `build`, `test`, `lint`, `knip`, `changeset`, `version-packages`,
+  `release`.
+
+  **Dependabot** — Configured weekly npm dependency scanning with dev/prod groups and
+  `@vectojs/*` major-version pin to avoid upstream breaking changes.
+
+  **Repository** — Updated root `README.md` with CI/npm/license badges and package table.
+  Updated `SECURITY.md` with all four `@vemjs/*` packages and coordinated-disclosure guidance.
+  Added GitHub topics (vim, editor, typescript, vectojs, canvas, modal-editing, lsp) and branch
+  protection requiring the `quality` status check before merging to `main`.
+
+  **Build hygiene** — Cleaned all `dist/` directories and rebuilt from source to ensure no
+  test artefacts are included in published tarballs. Verified `knip` reports zero issues.
+
+- Updated dependencies [0498765]
+- Updated dependencies [3fa4848]
+  - @vemjs/core@0.2.0
+
+## 0.1.0
+
+### Features
+
+- `VemEditorEntity` — zero-DOM canvas text editor with line numbers, cursor blink, VISUAL selection highlights, scroll, gutter
+- `CommandBar` — VectoUI `Input`-based command palette (`:w`, `:q`, `:vsp`, `:sp`)
+- `WorkspaceLayout` — resizable `PanelGroup` / `Panel` split panes (vertical + horizontal)
+- `VemWorkspace` — tabbed multi-file workspace using VectoUI `Tabs`
+- `WorkspaceExplorer` — sidebar `TreeView` file picker + editor area, File System Access API integration
+- `FileSystemHandler` — recursive directory handle mapper with lazy expansion and folder-first sort

package/README.md

@@ -0,0 +1,115 @@
+# @vemjs/renderer-vecto
+
+[![npm version](https://img.shields.io/npm/v/@vemjs/renderer-vecto.svg)](https://www.npmjs.com/package/@vemjs/renderer-vecto)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)
+
+The high-performance, **zero-DOM Canvas 2D** rendering layer for the **Vem Editor**, powered by the [VectoJS](https://github.com/vectojs/vectojs) Entity-Component-System (ECS) engine. It provides the full visual editor layout, including multi-pane split windows, file explorers, tab bars, gutters, line numbers, visual highlights, and the interactive Command Bar.
+
+## Features
+
+- **Zero-DOM Rendering Core**: Every pixel — from individual code glyphs and blinking cursors to selection highlights and sidebar files — is drawn directly to a single HTML5 `<canvas>` via VectoJS ECS entities.
+- **Split Windows Layout**: Integrated `WorkspaceLayout` that provides dynamic, resizable vertical and horizontal panels without layout thrashing.
+- **Lazy File Explorer Tree**: High-performance sidebar tree component with lazy node expansion leveraging the Web File System Access API.
+- **Command Bar Component**: Smooth command-line overlay supporting Vim command history and interactive autocomplete suggestions.
+- **Keyboard Event Router**: Advanced physical key event capturing and routing that bypasses browser-native DOM inputs to support Vim normal, insert, visual, and command modes natively.
+
+## Installation
+
+This package requires `@vemjs/core` and `@vectojs/core` as peer dependencies.
+
+```bash
+bun add @vemjs/renderer-vecto @vemjs/core @vectojs/core
+# or via npm
+npm install @vemjs/renderer-vecto @vemjs/core @vectojs/core
+```
+
+## Quick Start
+
+Initialize the renderer within a VectoJS Scene, mount the editor shell, and attach a canvas element:
+
+```typescript
+import { VemEditorState } from '@vemjs/core';
+import { WorkspaceExplorer, VectoRenderer } from '@vemjs/renderer-vecto';
+import { Scene } from '@vectojs/core';
+
+// 1. Create Core Editor State
+const editorState = new VemEditorState('// Press :w to write, :q to quit\nconsole.log("Vem");');
+
+// 2. Initialize VectoJS Scene on an HTML5 canvas
+const canvas = document.querySelector('canvas') as HTMLCanvasElement;
+const scene = new Scene(canvas);
+
+// 3. Instantiate the high-level Workspace Explorer layout
+const explorer = new WorkspaceExplorer(editorState);
+
+// 4. Add the explorer entity to the VectoJS Scene hierarchy
+scene.add(explorer);
+
+// 5. Start the render loop
+scene.start();
+
+// 6. Connect high-level keystroke router
+canvas.focus();
+canvas.addEventListener('keydown', (e) => {
+  // Let Vem handle Vim key mappings natively
+  explorer.handleKeyEvent(e);
+});
+```
+
+## API Reference
+
+### `VectoRenderer`
+
+Lower-level binding utility to attach editor states to canvas render cycles.
+
+- `constructor(editorState: VemEditorState)`: Binds editor state context.
+- `attach(canvas: HTMLCanvasElement): void`: Instantiates a VectoJS scene, adds a `VemEditorEntity`, and begins the execution loop.
+- `render(): void`: Triggers manual state evaluation and update.
+
+### `WorkspaceExplorer`
+
+High-level workspace GUI structure containing the sidebar explorer, file tree picker, and the active editor workspaces.
+
+- `constructor(editorState: VemEditorState)`: Creates the layout hierarchy.
+- `getWorkspace(): VemWorkspace`: Returns the active editor workspace tab group.
+- `handleKeyEvent(e: KeyboardEvent): void`: Translates and routes physical keyboard events into the modal state machine.
+
+### `VemEditorEntity`
+
+The individual text editing Canvas entity. Handles rendering lines of code, cursors, line selections, and relative gutters. Inherits from `Vecto.Entity`.
+
+---
+
+## VectoJS Zero-DOM Philosophy
+
+Traditional web text editors (e.g. Monaco, VS Code, CodeMirror) rely heavily on absolute-positioned HTML elements or inline `<span>` tags. When rendering large files with complex syntax tokenization, this causes heavy layout thrashing, DOM node pollution, and GC overhead.
+
+Vem rejects this overhead. Under our **Zero-DOM Canvas 2D Philosophy**:
+
+1. **ECS-Driven Rendering**: Every visual piece is a VectoJS `Entity`. Layout is computed on raw float coordinates in memory.
+2. **Text Caching**: Font glyphs are cached or drawn using fast sub-pixel Canvas text routines, allowing rendering speeds exceeding 60 FPS even with 10,000 lines of code.
+3. **Zero HTML/CSS pollution**: Outside of the single `<canvas>` container, no extra DOM elements are spawned. Gutters, selections, and menus are purely drawn visually.
+4. **Portability**: Because the renderer is decoupled from browser-native DOM nodes, Vem can run seamlessly inside Node.js, Web Workers, or Native Tauri containers without changing any styling systems.
+
+## Architecture
+
+```mermaid
+graph TD
+    Canvas[HTML5 Canvas Element] --> Scene[VectoJS Scene]
+    Scene --> Explorer[WorkspaceExplorer Entity]
+    Explorer --> Sidebar[Sidebar TreeView Entity]
+    Explorer --> Layout[WorkspaceLayout PanelGroup]
+    Layout --> EditorPane[EditorPane Entity]
+    EditorPane --> EditorEntity[VemEditorEntity]
+    EditorEntity --> Gutter[Gutter rendering]
+    EditorEntity --> Selection[Visual Selection highlights]
+    Explorer --> CmdBar[CommandBar Input Entity]
+```
+
+## Contributing
+
+Please review [CONTRIBUTING.md](../../CONTRIBUTING.md) for details on our workflow and engineering guidelines.
+
+## License
+
+This package is licensed under the MIT License - see the LICENSE file for details.

package/dist/CommandBar.d.ts

@@ -0,0 +1,13 @@
+import { UIComponent } from '@vectojs/ui';
+import type { IRenderer } from '@vectojs/core';
+import type { VemEditorState } from '@vemjs/core';
+export declare class CommandBar extends UIComponent {
+    private editorState;
+    private prefixText;
+    private input;
+    constructor(editorState: VemEditorState, width: number);
+    updateWidth(width: number): void;
+    clear(): void;
+    render(r: IRenderer): void;
+}
+//# sourceMappingURL=CommandBar.d.ts.map

package/dist/CommandBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommandBar.d.ts","sourceRoot":"","sources":["../src/CommandBar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAe,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,qBAAa,UAAW,SAAQ,WAAW;IACzC,OAAO,CAAC,WAAW,CAAiB;IACpC,OAAO,CAAC,UAAU,CAAO;IACzB,OAAO,CAAC,KAAK,CAAQ;gBAET,WAAW,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM;IAyC/C,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKhC,KAAK,IAAI,IAAI;IAIb,MAAM,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI;CASlC"}

package/dist/CommandBar.js

@@ -0,0 +1,60 @@
+import { UIComponent, Text, Input } from '@vectojs/ui';
+export class CommandBar extends UIComponent {
+    editorState;
+    prefixText;
+    input;
+    constructor(editorState, width) {
+        super();
+        this.editorState = editorState;
+        this.width = width;
+        this.height = 30;
+        this.prefixText = new Text(':', {
+            font: 'bold 14px monospace',
+            color: '#38bdf8', // sky-400
+        });
+        this.prefixText.setPosition(5, 5);
+        this.input = new Input({
+            width: width - 20,
+            height: 25,
+            font: '14px monospace',
+            color: '#e2e8f0',
+            bg: '#1e293b', // slate-800
+            border: 'transparent',
+            onChange: (value) => {
+                // Mirror changes to editorState command buffer
+                this.editorState.commandText = value;
+            },
+        });
+        this.input.id = 'vem-command-input';
+        this.input.setPosition(15, 2);
+        // Watch for Escape and Enter on the input component to bridge to editorState
+        this.input.on('keydown', (e) => {
+            const key = e.nativeEvent?.key || e.key;
+            if (key === 'Escape') {
+                this.editorState.handleKey('Escape');
+            }
+            else if (key === 'Enter') {
+                this.editorState.handleKey('Enter');
+            }
+        });
+        this.add(this.prefixText);
+        this.add(this.input);
+    }
+    updateWidth(width) {
+        this.width = width;
+        this.input.width = width - 20;
+    }
+    clear() {
+        this.input.value = '';
+    }
+    render(r) {
+        r.beginPath();
+        r.moveTo(0, 0);
+        r.lineTo(this.width, 0);
+        r.lineTo(this.width, this.height);
+        r.lineTo(0, this.height);
+        r.closePath();
+        r.fill('#1e293b'); // slate-800
+    }
+}
+//# sourceMappingURL=CommandBar.js.map

package/dist/CommandBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommandBar.js","sourceRoot":"","sources":["../src/CommandBar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAIvD,MAAM,OAAO,UAAW,SAAQ,WAAW;IACjC,WAAW,CAAiB;IAC5B,UAAU,CAAO;IACjB,KAAK,CAAQ;IAErB,YAAY,WAA2B,EAAE,KAAa;QACpD,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC;QAEjB,IAAI,CAAC,UAAU,GAAG,IAAI,IAAI,CAAC,GAAG,EAAE;YAC9B,IAAI,EAAE,qBAAqB;YAC3B,KAAK,EAAE,SAAS,EAAE,UAAU;SAC7B,CAAC,CAAC;QACH,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAElC,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC;YACrB,KAAK,EAAE,KAAK,GAAG,EAAE;YACjB,MAAM,EAAE,EAAE;YACV,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,SAAS;YAChB,EAAE,EAAE,SAAS,EAAE,YAAY;YAC3B,MAAM,EAAE,aAAa;YACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;gBAClB,+CAA+C;gBAC9C,IAAI,CAAC,WAAmB,CAAC,WAAW,GAAG,KAAK,CAAC;YAChD,CAAC;SACF,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,mBAAmB,CAAC;QACpC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QAE9B,6EAA6E;QAC7E,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,SAAS,EAAE,CAAC,CAAM,EAAE,EAAE;YAClC,MAAM,GAAG,GAAG,CAAC,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG,CAAC;YACxC,IAAI,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACrB,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;YACvC,CAAC;iBAAM,IAAI,GAAG,KAAK,OAAO,EAAE,CAAC;gBAC3B,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC1B,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC;IAEM,WAAW,CAAC,KAAa;QAC9B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,EAAE,CAAC;IAChC,CAAC;IAEM,KAAK;QACV,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC;IACxB,CAAC;IAEM,MAAM,CAAC,CAAY;QACxB,CAAC,CAAC,SAAS,EAAE,CAAC;QACd,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACf,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACxB,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAClC,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,CAAC,SAAS,EAAE,CAAC;QACd,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY;IACjC,CAAC;CACF"}

package/dist/FileSystemHandler.d.ts

@@ -0,0 +1,9 @@
+import type { TreeNode } from '@vectojs/ui';
+export declare class FileSystemHandler {
+    private fileHandles;
+    readDirectory(dirHandle: FileSystemDirectoryHandle, pathPrefix?: string): Promise<TreeNode[]>;
+    getFileHandle(path: string): FileSystemFileHandle | undefined;
+    readFile(fileHandle: FileSystemFileHandle): Promise<string>;
+    saveFile(fileHandle: FileSystemFileHandle, content: string): Promise<void>;
+}
+//# sourceMappingURL=FileSystemHandler.d.ts.map

package/dist/FileSystemHandler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSystemHandler.d.ts","sourceRoot":"","sources":["../src/FileSystemHandler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,WAAW,CAA2C;IAEjD,aAAa,CACxB,SAAS,EAAE,yBAAyB,EACpC,UAAU,SAAK,GACd,OAAO,CAAC,QAAQ,EAAE,CAAC;IAqCf,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,oBAAoB,GAAG,SAAS;IAIvD,QAAQ,CAAC,UAAU,EAAE,oBAAoB,GAAG,OAAO,CAAC,MAAM,CAAC;IAK3D,QAAQ,CAAC,UAAU,EAAE,oBAAoB,EAAE,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;CAKxF"}

package/dist/FileSystemHandler.js

@@ -0,0 +1,51 @@
+export class FileSystemHandler {
+    fileHandles = new Map();
+    async readDirectory(dirHandle, pathPrefix = '') {
+        const nodes = [];
+        for await (const entry of dirHandle.values()) {
+            const fullPath = pathPrefix ? `${pathPrefix}/${entry.name}` : entry.name;
+            if (entry.kind === 'directory') {
+                nodes.push({
+                    id: fullPath,
+                    label: entry.name,
+                    icon: '📁',
+                    children: async () => {
+                        return this.readDirectory(entry, fullPath);
+                    },
+                });
+            }
+            else if (entry.kind === 'file') {
+                this.fileHandles.set(fullPath, entry);
+                nodes.push({
+                    id: fullPath,
+                    label: entry.name,
+                    icon: '📄',
+                });
+            }
+        }
+        // Sort: directories first, then files alphabetically
+        nodes.sort((a, b) => {
+            const aIsDir = a.icon === '📁';
+            const bIsDir = b.icon === '📁';
+            if (aIsDir && !bIsDir)
+                return -1;
+            if (!aIsDir && bIsDir)
+                return 1;
+            return a.label.localeCompare(b.label);
+        });
+        return nodes;
+    }
+    getFileHandle(path) {
+        return this.fileHandles.get(path);
+    }
+    async readFile(fileHandle) {
+        const file = await fileHandle.getFile();
+        return await file.text();
+    }
+    async saveFile(fileHandle, content) {
+        const writable = await fileHandle.createWritable();
+        await writable.write(content);
+        await writable.close();
+    }
+}
+//# sourceMappingURL=FileSystemHandler.js.map

package/dist/FileSystemHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSystemHandler.js","sourceRoot":"","sources":["../src/FileSystemHandler.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,iBAAiB;IACpB,WAAW,GAAG,IAAI,GAAG,EAAgC,CAAC;IAEvD,KAAK,CAAC,aAAa,CACxB,SAAoC,EACpC,UAAU,GAAG,EAAE;QAEf,MAAM,KAAK,GAAe,EAAE,CAAC;QAE7B,IAAI,KAAK,EAAE,MAAM,KAAK,IAAK,SAAiB,CAAC,MAAM,EAAE,EAAE,CAAC;YACtD,MAAM,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;YAEzE,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;gBAC/B,KAAK,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,QAAQ;oBACZ,KAAK,EAAE,KAAK,CAAC,IAAI;oBACjB,IAAI,EAAE,IAAI;oBACV,QAAQ,EAAE,KAAK,IAAI,EAAE;wBACnB,OAAO,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;oBAC7C,CAAC;iBACK,CAAC,CAAC;YACZ,CAAC;iBAAM,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;gBACjC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;gBACtC,KAAK,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,QAAQ;oBACZ,KAAK,EAAE,KAAK,CAAC,IAAI;oBACjB,IAAI,EAAE,IAAI;iBACX,CAAC,CAAC;YACL,CAAC;QACH,CAAC;QAED,qDAAqD;QACrD,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YAClB,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC;YAC/B,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC;YAC/B,IAAI,MAAM,IAAI,CAAC,MAAM;gBAAE,OAAO,CAAC,CAAC,CAAC;YACjC,IAAI,CAAC,MAAM,IAAI,MAAM;gBAAE,OAAO,CAAC,CAAC;YAChC,OAAO,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QACxC,CAAC,CAAC,CAAC;QAEH,OAAO,KAAK,CAAC;IACf,CAAC;IAEM,aAAa,CAAC,IAAY;QAC/B,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;IAEM,KAAK,CAAC,QAAQ,CAAC,UAAgC;QACpD,MAAM,IAAI,GAAG,MAAM,UAAU,CAAC,OAAO,EAAE,CAAC;QACxC,OAAO,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAEM,KAAK,CAAC,QAAQ,CAAC,UAAgC,EAAE,OAAe;QACrE,MAAM,QAAQ,GAAG,MAAO,UAAkB,CAAC,cAAc,EAAE,CAAC;QAC5D,MAAM,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC9B,MAAM,QAAQ,CAAC,KAAK,EAAE,CAAC;IACzB,CAAC;CACF"}

package/dist/VemEditorEntity.d.ts

@@ -0,0 +1,16 @@
+import { UIComponent } from '@vectojs/ui';
+import type { IRenderer } from '@vectojs/core';
+import type { VemEditorState } from '@vemjs/core';
+export declare class VemEditorEntity extends UIComponent {
+    private editorState;
+    private gutterText;
+    private bodyText;
+    private commandBar;
+    private charWidth;
+    private lineHeight;
+    private scrollY;
+    constructor(editorState: VemEditorState);
+    updateFromState(): void;
+    render(r: IRenderer): void;
+}
+//# sourceMappingURL=VemEditorEntity.d.ts.map

package/dist/VemEditorEntity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VemEditorEntity.d.ts","sourceRoot":"","sources":["../src/VemEditorEntity.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAkB,MAAM,aAAa,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAGlD,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,OAAO,CAAC,WAAW,CAAiB;IACpC,OAAO,CAAC,UAAU,CAAO;IACzB,OAAO,CAAC,QAAQ,CAAW;IAC3B,OAAO,CAAC,UAAU,CAAa;IAE/B,OAAO,CAAC,SAAS,CAAO;IACxB,OAAO,CAAC,UAAU,CAAM;IACxB,OAAO,CAAC,OAAO,CAAK;gBAER,WAAW,EAAE,cAAc;IAsChC,eAAe,IAAI,IAAI;IAmDvB,MAAM,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI;CAkIlC"}

package/dist/VemEditorEntity.js

@@ -0,0 +1,209 @@
+import { UIComponent, Text, RichText } from '@vectojs/ui';
+import { CommandBar } from './CommandBar';
+export class VemEditorEntity extends UIComponent {
+    editorState;
+    gutterText;
+    bodyText;
+    commandBar;
+    charWidth = 8.4;
+    lineHeight = 20;
+    scrollY = 0; // scroll offset in lines
+    constructor(editorState) {
+        super();
+        this.editorState = editorState;
+        this.width = 800;
+        this.height = 600;
+        this.clipChildren = true;
+        this.gutterText = new Text('', {
+            font: '14px monospace',
+            color: '#64748b', // slate-500
+            lineHeight: this.lineHeight,
+        });
+        // Editor body text
+        this.bodyText = new RichText([], {
+            font: '14px monospace',
+            color: '#e2e8f0', // slate-200
+        });
+        this.commandBar = new CommandBar(editorState, this.width);
+        this.commandBar.setPosition(0, this.height - 30);
+        this.add(this.gutterText);
+        this.add(this.bodyText);
+        // Try to measure the exact monospace char width if running in browser
+        if (typeof document !== 'undefined') {
+            const canvas = document.createElement('canvas');
+            const ctx = canvas.getContext('2d');
+            if (ctx) {
+                ctx.font = '14px monospace';
+                this.charWidth = ctx.measureText('A').width;
+            }
+        }
+        this.updateFromState();
+    }
+    updateFromState() {
+        const buffer = this.editorState.getBuffer();
+        const cursor = this.editorState.getCursor();
+        const lineCount = buffer.getLineCount();
+        // 1. Calculate gutter width dynamically
+        const maxLineDigits = Math.max(2, lineCount.toString().length);
+        const gutterWidth = maxLineDigits * this.charWidth + 15;
+        // 2. Set line numbers text
+        const lineNums = [];
+        for (let i = 1; i <= lineCount; i++) {
+            lineNums.push(i.toString().padStart(maxLineDigits, ' '));
+        }
+        this.gutterText.setText(lineNums.join('\n'));
+        this.gutterText.setPosition(5, 5);
+        // 3. Set editor body text
+        const spans = buffer.getLines().map((line, idx) => {
+            const suffix = idx === lineCount - 1 ? '' : '\n';
+            return { text: line + suffix };
+        });
+        this.bodyText.setSpans(spans);
+        this.bodyText.setPosition(gutterWidth + 5, 5);
+        // 4. Handle viewport scrolling to keep cursor visible
+        const visibleLines = Math.floor((this.height - 35) / this.lineHeight); // reserve 35px for status bar
+        if (cursor.line >= this.scrollY + visibleLines) {
+            this.scrollY = cursor.line - visibleLines + 1;
+        }
+        else if (cursor.line < this.scrollY) {
+            this.scrollY = cursor.line;
+        }
+        // Update children scroll positions
+        const scrollOffsetY = -this.scrollY * this.lineHeight;
+        this.gutterText.setPosition(5, 5 + scrollOffsetY);
+        this.bodyText.setPosition(gutterWidth + 5, 5 + scrollOffsetY);
+        // 5. Handle CommandBar visibility
+        if (this.editorState.getMode() === 'COMMAND') {
+            if (!this.children.includes(this.commandBar)) {
+                this.add(this.commandBar);
+            }
+            this.commandBar.clear();
+        }
+        else {
+            if (this.children.includes(this.commandBar)) {
+                this.remove(this.commandBar);
+            }
+        }
+    }
+    render(r) {
+        // 1. Draw editor background
+        r.beginPath();
+        r.moveTo(0, 0);
+        r.lineTo(this.width, 0);
+        r.lineTo(this.width, this.height);
+        r.lineTo(0, this.height);
+        r.closePath();
+        r.fill('#0f172a'); // slate-900
+        const lineCount = this.editorState.getBuffer().getLineCount();
+        const maxLineDigits = Math.max(2, lineCount.toString().length);
+        const gutterWidth = maxLineDigits * this.charWidth + 15;
+        // 2. Draw gutter background
+        r.beginPath();
+        r.moveTo(0, 0);
+        r.lineTo(gutterWidth, 0);
+        r.lineTo(gutterWidth, this.height);
+        r.lineTo(0, this.height);
+        r.closePath();
+        r.fill('#1e293b'); // slate-800
+        // Apply scrolling transformation for cursor and selections
+        r.save();
+        r.translate(0, -this.scrollY * this.lineHeight);
+        // 3. Draw Visual Mode selections
+        const selection = this.editorState.getVisualSelection();
+        if (selection) {
+            const type = selection.type;
+            let s = { ...selection.anchor };
+            let e = { ...selection.active };
+            if (s.line > e.line || (s.line === e.line && s.character > e.character)) {
+                const temp = s;
+                s = e;
+                e = temp;
+            }
+            const drawSelRect = (lineIdx, startChar, endChar) => {
+                const x = gutterWidth + 5 + startChar * this.charWidth;
+                const y = 5 + lineIdx * this.lineHeight;
+                const w = (endChar - startChar) * this.charWidth;
+                const h = this.lineHeight;
+                r.beginPath();
+                r.moveTo(x, y);
+                r.lineTo(x + w, y);
+                r.lineTo(x + w, y + h);
+                r.lineTo(x, y + h);
+                r.closePath();
+                r.fill('rgba(56, 189, 248, 0.3)'); // sky-400 opacity
+            };
+            if (type === 'line') {
+                for (let l = s.line; l <= e.line; l++) {
+                    const lineText = this.editorState.getBuffer().getLine(l);
+                    drawSelRect(l, 0, Math.max(1, lineText.length));
+                }
+            }
+            else if (type === 'char') {
+                if (s.line === e.line) {
+                    drawSelRect(s.line, s.character, e.character + 1);
+                }
+                else {
+                    const sLineText = this.editorState.getBuffer().getLine(s.line);
+                    drawSelRect(s.line, s.character, Math.max(s.character + 1, sLineText.length + 1));
+                    for (let l = s.line + 1; l < e.line; l++) {
+                        const lText = this.editorState.getBuffer().getLine(l);
+                        drawSelRect(l, 0, lText.length + 1);
+                    }
+                    drawSelRect(e.line, 0, e.character + 1);
+                }
+            }
+            else if (type === 'block') {
+                const minCol = Math.min(selection.anchor.character, selection.active.character);
+                const maxCol = Math.max(selection.anchor.character, selection.active.character);
+                for (let l = s.line; l <= e.line; l++) {
+                    drawSelRect(l, minCol, maxCol + 1);
+                }
+            }
+        }
+        // 4. Draw Vim cursor
+        const cursor = this.editorState.getCursor();
+        const cursorX = gutterWidth + 5 + cursor.character * this.charWidth;
+        const cursorY = 5 + cursor.line * this.lineHeight;
+        const mode = this.editorState.getMode();
+        r.beginPath();
+        if (mode === 'INSERT') {
+            r.moveTo(cursorX, cursorY);
+            r.lineTo(cursorX + 2, cursorY);
+            r.lineTo(cursorX + 2, cursorY + this.lineHeight);
+            r.lineTo(cursorX, cursorY + this.lineHeight);
+            r.closePath();
+            r.fill('#f43f5e'); // rose-500
+        }
+        else {
+            r.moveTo(cursorX, cursorY);
+            r.lineTo(cursorX + this.charWidth, cursorY);
+            r.lineTo(cursorX + this.charWidth, cursorY + this.lineHeight);
+            r.lineTo(cursorX, cursorY + this.lineHeight);
+            r.closePath();
+            r.fill('rgba(56, 189, 248, 0.7)'); // sky-400 opacity
+        }
+        r.restore(); // Restore scroll transform
+        // 5. Draw status bar at the bottom
+        const statusBarHeight = 30;
+        const statusY = this.height - statusBarHeight;
+        r.beginPath();
+        r.moveTo(0, statusY);
+        r.lineTo(this.width, statusY);
+        r.lineTo(this.width, this.height);
+        r.lineTo(0, this.height);
+        r.closePath();
+        r.fill('#1e293b'); // slate-800
+        if (mode !== 'COMMAND') {
+            const modeText = `-- ${mode} --`;
+            const posText = `${cursor.line + 1}:${cursor.character + 1}`;
+            const pendingKeys = this.editorState.getPendingKeys();
+            const pendingText = pendingKeys.length > 0 ? pendingKeys.join('') : '';
+            r.fillText(modeText, 10, statusY + 18, 'bold 12px monospace', '#38bdf8');
+            if (pendingText) {
+                r.fillText(pendingText, 120, statusY + 18, '12px monospace', '#e2e8f0');
+            }
+            r.fillText(posText, this.width - 60, statusY + 18, '12px monospace', '#94a3b8');
+        }
+    }
+}
+//# sourceMappingURL=VemEditorEntity.js.map

package/dist/VemEditorEntity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VemEditorEntity.js","sourceRoot":"","sources":["../src/VemEditorEntity.ts"],"names":[],"mappings":"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"}

package/dist/Workspace.d.ts

@@ -0,0 +1,13 @@
+import { UIComponent } from '@vectojs/ui';
+import type { IRenderer } from '@vectojs/core';
+import { WorkspaceLayout } from './WorkspaceLayout';
+export declare class VemWorkspace extends UIComponent {
+    private tabsComponent;
+    private layouts;
+    constructor(width: number, height: number, initialText?: string);
+    addTab(initialText?: string): void;
+    update(dt: number, time: number): void;
+    getActiveLayout(): WorkspaceLayout | null;
+    render(_r: IRenderer): void;
+}
+//# sourceMappingURL=Workspace.d.ts.map

package/dist/Workspace.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Workspace.d.ts","sourceRoot":"","sources":["../src/Workspace.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAQ,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,qBAAa,YAAa,SAAQ,WAAW;IAC3C,OAAO,CAAC,aAAa,CAAqB;IAC1C,OAAO,CAAC,OAAO,CAAyB;gBAE5B,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM;IAmBxD,MAAM,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI;IAelC,MAAM,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAQtC,eAAe,IAAI,eAAe,GAAG,IAAI;IAWzC,MAAM,CAAC,EAAE,EAAE,SAAS,GAAG,IAAI;CAGnC"}

package/dist/Workspace.js

@@ -0,0 +1,55 @@
+import { UIComponent, Tabs } from '@vectojs/ui';
+import { WorkspaceLayout } from './WorkspaceLayout';
+export class VemWorkspace extends UIComponent {
+    tabsComponent = null;
+    layouts = [];
+    constructor(width, height, initialText) {
+        super();
+        this.width = width;
+        this.height = height;
+        const initialLayout = new WorkspaceLayout(width, height - 30, initialText || '');
+        this.layouts.push(initialLayout);
+        this.tabsComponent = new Tabs({
+            width: this.width,
+            height: this.height,
+            tabHeight: 30,
+            tabs: [{ id: 'tab-1', label: 'Tab 1', content: initialLayout }],
+            value: 'tab-1',
+        });
+        this.add(this.tabsComponent);
+    }
+    addTab(initialText) {
+        const nextIndex = this.layouts.length + 1;
+        const newLayout = new WorkspaceLayout(this.width, this.height - 30, initialText || '');
+        this.layouts.push(newLayout);
+        const updatedTabs = this.layouts.map((layout, idx) => ({
+            id: `tab-${idx + 1}`,
+            label: `Tab ${idx + 1}`,
+            content: layout,
+        }));
+        this.tabsComponent.tabs = updatedTabs;
+        this.tabsComponent.value = `tab-${nextIndex}`;
+    }
+    update(dt, time) {
+        super.update(dt, time);
+        if (this.tabsComponent) {
+            this.tabsComponent.width = this.width;
+            this.tabsComponent.height = this.height;
+        }
+    }
+    getActiveLayout() {
+        if (!this.tabsComponent)
+            return null;
+        const activeId = this.tabsComponent.value;
+        const match = activeId.match(/tab-(\d+)/);
+        if (match) {
+            const idx = parseInt(match[1], 10) - 1;
+            return this.layouts[idx] || null;
+        }
+        return null;
+    }
+    render(_r) {
+        // Handled by tabsComponent
+    }
+}
+//# sourceMappingURL=Workspace.js.map

package/dist/Workspace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Workspace.js","sourceRoot":"","sources":["../src/Workspace.ts"],"names":[],"mappings":"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"}