@gridland/web 0.2.15 → 0.2.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -108,6 +108,14 @@ declare class BrowserBuffer {
108
108
  private opacityStack;
109
109
  linkRegistry: Map<number, string>;
110
110
  private nextLinkId;
111
+ /** Cursor rendering config -- set by renderer before pipeline, read by drawEditorView */
112
+ cursorColor: RGBA | null;
113
+ cursorStyleType: CursorStyle;
114
+ /** Line cursor position -- set by drawEditorView during pipeline, read by renderer after */
115
+ lineCursorPosition: {
116
+ x: number;
117
+ y: number;
118
+ } | null;
111
119
  constructor(width: number, height: number, options?: {
112
120
  respectAlpha?: boolean;
113
121
  id?: string;
@@ -189,6 +197,9 @@ declare class BrowserRenderContext extends EventEmitter implements RenderContext
189
197
  private _onRenderRequest;
190
198
  private _lifecyclePasses;
191
199
  private _focusedRenderable;
200
+ cursorColor: RGBA | null;
201
+ cursorStyleType: CursorStyle;
202
+ cursorBlinking: boolean;
192
203
  keyInput: BrowserKeyHandler;
193
204
  _internalKeyInput: BrowserInternalKeyHandler;
194
205
  constructor(width: number, height: number, widthMethod?: WidthMethod$1);
@@ -206,8 +217,8 @@ declare class BrowserRenderContext extends EventEmitter implements RenderContext
206
217
  clearHitGridScissorRects(): void;
207
218
  requestRender(): void;
208
219
  setCursorPosition(_x: number, _y: number, _visible: boolean): void;
209
- setCursorStyle(_options: CursorStyleOptions): void;
210
- setCursorColor(_color: RGBA): void;
220
+ setCursorStyle(options: CursorStyleOptions): void;
221
+ setCursorColor(color: RGBA): void;
211
222
  setMousePointer(_shape: MousePointerStyle): void;
212
223
  requestLive(): void;
213
224
  dropLive(): void;
@@ -249,6 +260,13 @@ declare class SelectionManager {
249
260
  getSelectedText(buffer: BrowserBuffer): string;
250
261
  }
251
262
 
263
+ /** Cursor overlay info produced by the render pipeline, consumed by the painter */
264
+ interface CursorOverlay {
265
+ x: number;
266
+ y: number;
267
+ color: RGBA;
268
+ blinking: boolean;
269
+ }
252
270
  interface CanvasPainterOptions {
253
271
  fontFamily?: string;
254
272
  fontSize?: number;
@@ -268,7 +286,7 @@ declare class CanvasPainter {
268
286
  width: number;
269
287
  height: number;
270
288
  };
271
- paint(ctx: CanvasRenderingContext2D, buffer: BrowserBuffer, selection?: SelectionManager): void;
289
+ paint(ctx: CanvasRenderingContext2D, buffer: BrowserBuffer, selection?: SelectionManager, cursor?: CursorOverlay | null): void;
272
290
  }
273
291
 
274
292
  declare class BrowserRenderer {
@@ -298,6 +316,7 @@ declare class BrowserRenderer {
298
316
  start(): void;
299
317
  stop(): void;
300
318
  private loop;
319
+ private buildCursorOverlay;
301
320
  resize(cols: number, rows: number): void;
302
321
  private static PREVENT_DEFAULT_KEYS;
303
322
  private static MODIFIER_KEYS;
package/dist/next.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { T as TUI, e as TUIProps } from './next-CxYMg6AG.js';
1
+ export { T as TUI, e as TUIProps } from './next-BWTklBmN.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'events';
package/dist/next.js CHANGED
@@ -39878,6 +39878,9 @@ var BrowserRenderContext = class extends EventEmitter {
39878
39878
  _onRenderRequest = null;
39879
39879
  _lifecyclePasses = /* @__PURE__ */ new Set();
39880
39880
  _focusedRenderable = null;
39881
+ cursorColor = null;
39882
+ cursorStyleType = "block";
39883
+ cursorBlinking = false;
39881
39884
  keyInput;
39882
39885
  _internalKeyInput;
39883
39886
  constructor(width, height, widthMethod = "wcwidth") {
@@ -39931,9 +39934,19 @@ var BrowserRenderContext = class extends EventEmitter {
39931
39934
  }
39932
39935
  setCursorPosition(_x, _y, _visible) {
39933
39936
  }
39934
- setCursorStyle(_options) {
39937
+ setCursorStyle(options) {
39938
+ if (options.color) {
39939
+ this.cursorColor = options.color;
39940
+ }
39941
+ if (options.style) {
39942
+ this.cursorStyleType = options.style;
39943
+ }
39944
+ if (options.blinking !== void 0) {
39945
+ this.cursorBlinking = options.blinking;
39946
+ }
39935
39947
  }
39936
- setCursorColor(_color) {
39948
+ setCursorColor(color) {
39949
+ this.cursorColor = color;
39937
39950
  }
39938
39951
  setMousePointer(_shape) {
39939
39952
  }
@@ -41546,6 +41559,11 @@ var BrowserBuffer = class _BrowserBuffer {
41546
41559
  // Link registry for clickable links
41547
41560
  linkRegistry = /* @__PURE__ */ new Map();
41548
41561
  nextLinkId = 1;
41562
+ /** Cursor rendering config -- set by renderer before pipeline, read by drawEditorView */
41563
+ cursorColor = null;
41564
+ cursorStyleType = "block";
41565
+ /** Line cursor position -- set by drawEditorView during pipeline, read by renderer after */
41566
+ lineCursorPosition = null;
41549
41567
  constructor(width, height, options = {}) {
41550
41568
  this._width = width;
41551
41569
  this._height = height;
@@ -41993,7 +42011,7 @@ var BrowserBuffer = class _BrowserBuffer {
41993
42011
  };
41994
42012
  const visibleRows = viewport.height > 0 ? viewport.height : this._height - y2;
41995
42013
  if (text === "" && editorView._placeholderChunks && editorView._placeholderChunks.length > 0) {
41996
- let curX = x2;
42014
+ let curX = this.cursorStyleType === "line" ? x2 + 1 : x2;
41997
42015
  for (const chunk of editorView._placeholderChunks) {
41998
42016
  const chunkFg = chunk.fg ?? dfg;
41999
42017
  const chunkBg = chunk.bg ?? dbg;
@@ -42027,10 +42045,22 @@ var BrowserBuffer = class _BrowserBuffer {
42027
42045
  const cursorX = x2 + cursor.visualCol;
42028
42046
  const cursorY = y2 + cursor.visualRow;
42029
42047
  if (cursorX >= 0 && cursorX < this._width && cursorY >= 0 && cursorY < this._height) {
42030
- const idx = cursorY * this._width + cursorX;
42031
- const charCode = this.char[idx];
42032
- const ch = charCode === 0 || charCode === 32 ? " " : String.fromCodePoint(charCode);
42033
- this.setCell(cursorX, cursorY, ch, dfg, dbg, 32);
42048
+ const cursorFg = this.cursorColor ?? dfg;
42049
+ if (this.cursorStyleType === "line") {
42050
+ this.lineCursorPosition = { x: cursorX, y: cursorY };
42051
+ } else {
42052
+ const idx = cursorY * this._width + cursorX;
42053
+ const charCode = this.char[idx];
42054
+ const ch = charCode === 0 || charCode === 32 ? " " : String.fromCodePoint(charCode);
42055
+ const offset = idx * 4;
42056
+ const cellBg = {
42057
+ r: this.bg[offset],
42058
+ g: this.bg[offset + 1],
42059
+ b: this.bg[offset + 2],
42060
+ a: this.bg[offset + 3] || 1
42061
+ };
42062
+ this.setCell(cursorX, cursorY, ch, cursorFg, cellBg, 32);
42063
+ }
42034
42064
  }
42035
42065
  }
42036
42066
  }
@@ -42067,6 +42097,8 @@ var TextAttributes3 = {
42067
42097
  UNDERLINE_DOTTED: 1 << 6
42068
42098
  };
42069
42099
  var CONTINUATION2 = 3221225472;
42100
+ var LINE_CURSOR_WIDTH = 8;
42101
+ var CURSOR_BLINK_INTERVAL_MS = 530;
42070
42102
  var BOX_DRAWING_MAP = {
42071
42103
  // Light lines
42072
42104
  9472: { left: true, right: true, type: "light" },
@@ -42346,7 +42378,7 @@ var CanvasPainter = class {
42346
42378
  getCellSize() {
42347
42379
  return { width: this.cellWidth, height: this.cellHeight };
42348
42380
  }
42349
- paint(ctx, buffer, selection) {
42381
+ paint(ctx, buffer, selection, cursor) {
42350
42382
  const { char, fg: fg2, bg: bg2, attributes } = buffer;
42351
42383
  const cols = buffer.width;
42352
42384
  const rows = buffer.height;
@@ -42543,6 +42575,13 @@ var CanvasPainter = class {
42543
42575
  }
42544
42576
  }
42545
42577
  }
42578
+ if (cursor) {
42579
+ const visible = !cursor.blinking || Math.floor(performance.now() / CURSOR_BLINK_INTERVAL_MS) % 2 === 0;
42580
+ if (visible) {
42581
+ ctx.fillStyle = rgbaToCSS(cursor.color.r, cursor.color.g, cursor.color.b, cursor.color.a ?? 1);
42582
+ ctx.fillRect(cursor.x * cw, cursor.y * ch, LINE_CURSOR_WIDTH, ch);
42583
+ }
42584
+ }
42546
42585
  if (selection?.active) {
42547
42586
  ctx.fillStyle = "rgba(51, 153, 255, 0.3)";
42548
42587
  for (let row = 0; row < rows; row++) {
@@ -42875,9 +42914,17 @@ var BrowserRenderer = class _BrowserRenderer {
42875
42914
  const now = performance.now();
42876
42915
  const deltaTime = now - this.lastTime;
42877
42916
  this.lastTime = now;
42878
- if (!this.needsRender) return;
42879
- this.needsRender = false;
42880
- executeRenderPipeline(this.buffer, this.renderContext, this.root, deltaTime);
42917
+ let didRender = false;
42918
+ if (this.needsRender) {
42919
+ this.needsRender = false;
42920
+ didRender = true;
42921
+ this.buffer.cursorColor = this.renderContext.cursorColor;
42922
+ this.buffer.cursorStyleType = this.renderContext.cursorStyleType;
42923
+ this.buffer.lineCursorPosition = null;
42924
+ executeRenderPipeline(this.buffer, this.renderContext, this.root, deltaTime);
42925
+ }
42926
+ const cursorOverlay = this.buildCursorOverlay();
42927
+ if (!didRender && !cursorOverlay?.blinking) return;
42881
42928
  const dpr = window.devicePixelRatio || 1;
42882
42929
  this.ctx2d.setTransform(dpr, 0, 0, dpr, 0, 0);
42883
42930
  if (this.backgroundColor) {
@@ -42886,8 +42933,18 @@ var BrowserRenderer = class _BrowserRenderer {
42886
42933
  } else {
42887
42934
  this.ctx2d.clearRect(0, 0, this.canvas.width, this.canvas.height);
42888
42935
  }
42889
- this.painter.paint(this.ctx2d, this.buffer, this.selection);
42936
+ this.painter.paint(this.ctx2d, this.buffer, this.selection, cursorOverlay);
42890
42937
  };
42938
+ buildCursorOverlay() {
42939
+ const pos = this.buffer.lineCursorPosition;
42940
+ if (!pos || !this.renderContext.cursorColor) return null;
42941
+ return {
42942
+ x: pos.x,
42943
+ y: pos.y,
42944
+ color: this.renderContext.cursorColor,
42945
+ blinking: this.renderContext.cursorBlinking
42946
+ };
42947
+ }
42891
42948
  resize(cols, rows) {
42892
42949
  this.cols = cols;
42893
42950
  this.rows = rows;
@@ -42932,7 +42989,7 @@ var BrowserRenderer = class _BrowserRenderer {
42932
42989
  PageDown: "pagedown"
42933
42990
  };
42934
42991
  handleKeyDown(event) {
42935
- if (_BrowserRenderer.PREVENT_DEFAULT_KEYS.has(event.key)) {
42992
+ if (_BrowserRenderer.PREVENT_DEFAULT_KEYS.has(event.key) || event.key.length === 1 && !event.metaKey && !event.ctrlKey) {
42936
42993
  event.preventDefault();
42937
42994
  }
42938
42995
  if (this.selection.active && (event.key === "c" || event.key === "\xE7") && (event.metaKey || event.ctrlKey || event.altKey)) {