@opentui/core 0.1.34 → 0.1.35

package/index.js

@@ -134,7 +134,7 @@ import {
   white,
   wrapWithDelegates,
   yellow
-} from "./index-x37wckj8.js";
+} from "./index-n8nbvvhk.js";
 // src/text-buffer-view.ts
 class TextBufferView {
   lib;
@@ -2570,10 +2570,7 @@ class TextBufferRenderable extends Renderable {
   }
   updateTextInfo() {
     if (this.lastLocalSelection) {
-      const changed = this.updateLocalSelection(this.lastLocalSelection);
-      if (changed) {
-        this.requestRender();
-      }
+      this.updateLocalSelection(this.lastLocalSelection);
     }
     this.yogaNode.markDirty();
     this.requestRender();
@@ -2636,6 +2633,9 @@ class TextBufferRenderable extends Renderable {
     this.markClean();
     this._ctx.addToHitGrid(this.x, this.y, this.width, this.height, this.num);
     this.renderSelf(buffer);
+    if (this.buffered && this.frameBuffer) {
+      buffer.drawFrameBuffer(this.x, this.y, this.frameBuffer);
+    }
   }
   renderSelf(buffer) {
     if (this.textBuffer.ptr) {
@@ -2665,10 +2665,14 @@ class CodeRenderable extends TextBufferRenderable {
   _conceal;
   _drawUnstyledText;
   _shouldRenderTextBuffer = true;
+  _streaming;
+  _hadInitialContent = false;
+  _lastHighlights = [];
   _contentDefaultOptions = {
     content: "",
     conceal: true,
-    drawUnstyledText: true
+    drawUnstyledText: true,
+    streaming: false
   };
   constructor(ctx, options) {
     super(ctx, options);
@@ -2678,6 +2682,7 @@ class CodeRenderable extends TextBufferRenderable {
     this._treeSitterClient = options.treeSitterClient ?? getTreeSitterClient();
     this._conceal = options.conceal ?? this._contentDefaultOptions.conceal;
     this._drawUnstyledText = options.drawUnstyledText ?? this._contentDefaultOptions.drawUnstyledText;
+    this._streaming = options.streaming ?? this._contentDefaultOptions.streaming;
     this.updateContent(this._content);
   }
   get content() {
@@ -2725,6 +2730,17 @@ class CodeRenderable extends TextBufferRenderable {
       this.scheduleUpdate();
     }
   }
+  get streaming() {
+    return this._streaming;
+  }
+  set streaming(value) {
+    if (this._streaming !== value) {
+      this._streaming = value;
+      this._hadInitialContent = false;
+      this._lastHighlights = [];
+      this.scheduleUpdate();
+    }
+  }
   get treeSitterClient() {
     return this._treeSitterClient;
   }
@@ -2753,22 +2769,47 @@ class CodeRenderable extends TextBufferRenderable {
     }
     this._currentHighlightId++;
     const highlightId = this._currentHighlightId;
+    const isInitialContent = this._streaming && !this._hadInitialContent;
+    if (isInitialContent) {
+      this._hadInitialContent = true;
+    }
+    const shouldDrawUnstyledNow = this._streaming ? isInitialContent && this._drawUnstyledText : this._drawUnstyledText;
     this.fallback(content);
-    if (!this._drawUnstyledText) {
+    if (!shouldDrawUnstyledNow) {
       this._shouldRenderTextBuffer = false;
     }
+    if (this._streaming && !isInitialContent && this._lastHighlights.length > 0) {
+      const chunks = treeSitterToTextChunks(content, this._lastHighlights, this._syntaxStyle, {
+        enabled: this._conceal
+      });
+      const partialStyledText = new StyledText(chunks);
+      if (this.isDestroyed)
+        return;
+      this.textBuffer.setStyledText(partialStyledText);
+      this._shouldRenderTextBuffer = true;
+      this.updateTextInfo();
+    }
     this._isHighlighting = true;
     this._pendingRehighlight = false;
     try {
-      const styledText = await treeSitterToStyledText(content, this._filetype, this._syntaxStyle, this._treeSitterClient, {
-        conceal: { enabled: this._conceal }
-      });
+      const result = await this._treeSitterClient.highlightOnce(content, this._filetype);
       if (highlightId !== this._currentHighlightId) {
         return;
       }
       if (this.isDestroyed)
         return;
-      this.textBuffer.setStyledText(styledText);
+      if (result.highlights && result.highlights.length > 0) {
+        if (this._streaming) {
+          this._lastHighlights = result.highlights;
+        }
+        const chunks = treeSitterToTextChunks(content, result.highlights, this._syntaxStyle, {
+          enabled: this._conceal
+        });
+        const styledText = new StyledText(chunks);
+        this.textBuffer.setStyledText(styledText);
+      } else {
+        this.fallback(content);
+      }
       this._shouldRenderTextBuffer = true;
       this.updateTextInfo();
     } catch (error) {
@@ -3131,6 +3172,7 @@ class InputRenderable extends Renderable {
   _focusedTextColor;
   _placeholderColor;
   _cursorColor;
+  _cursorStyle;
   _maxLength;
   _lastCommittedValue = "";
   _defaultOptions = {
@@ -3141,6 +3183,10 @@ class InputRenderable extends Renderable {
     placeholder: "",
     placeholderColor: "#666666",
     cursorColor: "#FFFFFF",
+    cursorStyle: {
+      style: "block",
+      blinking: true
+    },
     maxLength: 1000,
     value: ""
   };
@@ -3157,6 +3203,7 @@ class InputRenderable extends Renderable {
     this._maxLength = options.maxLength || this._defaultOptions.maxLength;
     this._placeholderColor = parseColor(options.placeholderColor || this._defaultOptions.placeholderColor);
     this._cursorColor = parseColor(options.cursorColor || this._defaultOptions.cursorColor);
+    this._cursorStyle = options.cursorStyle || this._defaultOptions.cursorStyle;
   }
   updateCursorPosition() {
     if (!this._focused)
@@ -3179,7 +3226,7 @@ class InputRenderable extends Renderable {
   }
   focus() {
     super.focus();
-    this._ctx.setCursorStyle("block", true);
+    this._ctx.setCursorStyle(this._cursorStyle.style, this._cursorStyle.blinking);
     this._ctx.setCursorColor(this._cursorColor);
     this.updateCursorPosition();
   }
@@ -3369,7 +3416,21 @@ class InputRenderable extends Renderable {
     const newColor = parseColor(value ?? this._defaultOptions.cursorColor);
     if (this._cursorColor !== newColor) {
       this._cursorColor = newColor;
-      this.requestRender();
+      if (this._focused) {
+        this._ctx.requestRender();
+      }
+    }
+  }
+  get cursorStyle() {
+    return this._cursorStyle;
+  }
+  set cursorStyle(style) {
+    const newStyle = style;
+    if (this.cursorStyle.style !== newStyle.style || this.cursorStyle.blinking !== newStyle.blinking) {
+      this._cursorStyle = newStyle;
+      if (this._focused) {
+        this._ctx.requestRender();
+      }
     }
   }
   updateFromLayout() {
@@ -3971,12 +4032,23 @@ class ArrowRenderable extends Renderable {
 // src/renderables/ScrollBox.ts
 class ContentRenderable extends BoxRenderable {
   viewport;
-  constructor(ctx, viewport, options) {
+  _viewportCulling;
+  constructor(ctx, viewport, viewportCulling, options) {
     super(ctx, options);
     this.viewport = viewport;
+    this._viewportCulling = viewportCulling;
+  }
+  get viewportCulling() {
+    return this._viewportCulling;
+  }
+  set viewportCulling(value) {
+    this._viewportCulling = value;
   }
   _getChildren() {
-    return getObjectsInViewport(this.viewport, this.getChildrenSortedByPrimaryAxis(), this.primaryAxis);
+    if (this._viewportCulling) {
+      return getObjectsInViewport(this.viewport, this.getChildrenSortedByPrimaryAxis(), this.primaryAxis);
+    }
+    return this.getChildrenSortedByPrimaryAxis();
   }
 }
 
@@ -4108,6 +4180,7 @@ class ScrollBoxRenderable extends BoxRenderable {
     scrollX = false,
     scrollY = true,
     scrollAcceleration,
+    viewportCulling = true,
     ...options
   }) {
     super(ctx, {
@@ -4143,7 +4216,7 @@ class ScrollBoxRenderable extends BoxRenderable {
       id: `scroll-box-viewport-${this.internalId}`
     });
     this.wrapper.add(this.viewport);
-    this.content = new ContentRenderable(ctx, this.viewport, {
+    this.content = new ContentRenderable(ctx, this.viewport, viewportCulling, {
       alignSelf: "flex-start",
       flexShrink: 0,
       ...scrollX ? { minWidth: "100%" } : { minWidth: "100%", maxWidth: "100%" },
@@ -4437,6 +4510,13 @@ class ScrollBoxRenderable extends BoxRenderable {
   set scrollAcceleration(value) {
     this.scrollAccel = value;
   }
+  get viewportCulling() {
+    return this.content.viewportCulling;
+  }
+  set viewportCulling(value) {
+    this.content.viewportCulling = value;
+    this.requestRender();
+  }
   destroySelf() {
     if (this.selectionListener) {
       this._ctx.off("selection", this.selectionListener);
@@ -4455,7 +4535,7 @@ var SelectRenderableEvents;
 class SelectRenderable extends Renderable {
   _focusable = true;
   _options = [];
-  selectedIndex = 0;
+  _selectedIndex = 0;
   scrollOffset = 0;
   maxVisibleItems;
   _backgroundColor;
@@ -4481,6 +4561,7 @@ class SelectRenderable extends Renderable {
     focusedTextColor: "#FFFFFF",
     selectedBackgroundColor: "#334455",
     selectedTextColor: "#FFFF00",
+    selectedIndex: 0,
     descriptionColor: "#888888",
     selectedDescriptionColor: "#CCCCCC",
     showScrollIndicator: false,
@@ -4491,11 +4572,13 @@ class SelectRenderable extends Renderable {
   };
   constructor(ctx, options) {
     super(ctx, { ...options, buffered: true });
+    this._options = options.options || [];
+    const requestedIndex = options.selectedIndex ?? this._defaultOptions.selectedIndex;
+    this._selectedIndex = this._options.length > 0 ? Math.min(requestedIndex, this._options.length - 1) : 0;
     this._backgroundColor = parseColor(options.backgroundColor || this._defaultOptions.backgroundColor);
     this._textColor = parseColor(options.textColor || this._defaultOptions.textColor);
     this._focusedBackgroundColor = parseColor(options.focusedBackgroundColor || this._defaultOptions.focusedBackgroundColor);
     this._focusedTextColor = parseColor(options.focusedTextColor || this._defaultOptions.focusedTextColor);
-    this._options = options.options || [];
     this._showScrollIndicator = options.showScrollIndicator ?? this._defaultOptions.showScrollIndicator;
     this._wrapSelection = options.wrapSelection ?? this._defaultOptions.wrapSelection;
     this._showDescription = options.showDescription ?? this._defaultOptions.showDescription;
@@ -4532,7 +4615,7 @@ class SelectRenderable extends Renderable {
     for (let i = 0;i < visibleOptions.length; i++) {
       const actualIndex = this.scrollOffset + i;
       const option = visibleOptions[i];
-      const isSelected = actualIndex === this.selectedIndex;
+      const isSelected = actualIndex === this._selectedIndex;
       const itemY = contentY + i * this.linesPerItem;
       if (itemY + this.linesPerItem - 1 >= contentY + contentHeight)
         break;
@@ -4573,7 +4656,7 @@ class SelectRenderable extends Renderable {
   renderScrollIndicatorToFrameBuffer(contentX, contentY, contentWidth, contentHeight) {
     if (!this.frameBuffer)
       return;
-    const scrollPercent = this.selectedIndex / Math.max(1, this._options.length - 1);
+    const scrollPercent = this._selectedIndex / Math.max(1, this._options.length - 1);
     const indicatorHeight = Math.max(1, contentHeight - 2);
     const indicatorY = contentY + 1 + Math.floor(scrollPercent * indicatorHeight);
     const indicatorX = contentX + contentWidth - 1;
@@ -4584,61 +4667,61 @@ class SelectRenderable extends Renderable {
   }
   set options(options) {
     this._options = options;
-    this.selectedIndex = Math.min(this.selectedIndex, Math.max(0, options.length - 1));
+    this._selectedIndex = Math.min(this._selectedIndex, Math.max(0, options.length - 1));
     this.updateScrollOffset();
     this.requestRender();
   }
   getSelectedOption() {
-    return this._options[this.selectedIndex] || null;
+    return this._options[this._selectedIndex] || null;
   }
   getSelectedIndex() {
-    return this.selectedIndex;
+    return this._selectedIndex;
   }
   moveUp(steps = 1) {
-    const newIndex = this.selectedIndex - steps;
+    const newIndex = this._selectedIndex - steps;
     if (newIndex >= 0) {
-      this.selectedIndex = newIndex;
+      this._selectedIndex = newIndex;
     } else if (this._wrapSelection && this._options.length > 0) {
-      this.selectedIndex = this._options.length - 1;
+      this._selectedIndex = this._options.length - 1;
     } else {
-      this.selectedIndex = 0;
+      this._selectedIndex = 0;
     }
     this.updateScrollOffset();
     this.requestRender();
-    this.emit("selectionChanged" /* SELECTION_CHANGED */, this.selectedIndex, this.getSelectedOption());
+    this.emit("selectionChanged" /* SELECTION_CHANGED */, this._selectedIndex, this.getSelectedOption());
   }
   moveDown(steps = 1) {
-    const newIndex = this.selectedIndex + steps;
+    const newIndex = this._selectedIndex + steps;
     if (newIndex < this._options.length) {
-      this.selectedIndex = newIndex;
+      this._selectedIndex = newIndex;
     } else if (this._wrapSelection && this._options.length > 0) {
-      this.selectedIndex = 0;
+      this._selectedIndex = 0;
     } else {
-      this.selectedIndex = this._options.length - 1;
+      this._selectedIndex = this._options.length - 1;
     }
     this.updateScrollOffset();
     this.requestRender();
-    this.emit("selectionChanged" /* SELECTION_CHANGED */, this.selectedIndex, this.getSelectedOption());
+    this.emit("selectionChanged" /* SELECTION_CHANGED */, this._selectedIndex, this.getSelectedOption());
   }
   selectCurrent() {
     const selected = this.getSelectedOption();
     if (selected) {
-      this.emit("itemSelected" /* ITEM_SELECTED */, this.selectedIndex, selected);
+      this.emit("itemSelected" /* ITEM_SELECTED */, this._selectedIndex, selected);
     }
   }
   setSelectedIndex(index) {
     if (index >= 0 && index < this._options.length) {
-      this.selectedIndex = index;
+      this._selectedIndex = index;
       this.updateScrollOffset();
       this.requestRender();
-      this.emit("selectionChanged" /* SELECTION_CHANGED */, this.selectedIndex, this.getSelectedOption());
+      this.emit("selectionChanged" /* SELECTION_CHANGED */, this._selectedIndex, this.getSelectedOption());
     }
   }
   updateScrollOffset() {
     if (!this._options)
       return;
     const halfVisible = Math.floor(this.maxVisibleItems / 2);
-    const newScrollOffset = Math.max(0, Math.min(this.selectedIndex - halfVisible, this._options.length - this.maxVisibleItems));
+    const newScrollOffset = Math.max(0, Math.min(this._selectedIndex - halfVisible, this._options.length - this.maxVisibleItems));
     if (newScrollOffset !== this.scrollOffset) {
       this.scrollOffset = newScrollOffset;
       this.requestRender();
@@ -4770,6 +4853,15 @@ class SelectRenderable extends Renderable {
   set fastScrollStep(step) {
     this._fastScrollStep = step;
   }
+  set selectedIndex(value) {
+    const newIndex = value ?? this._defaultOptions.selectedIndex;
+    const clampedIndex = this._options.length > 0 ? Math.min(Math.max(0, newIndex), this._options.length - 1) : 0;
+    if (this._selectedIndex !== clampedIndex) {
+      this._selectedIndex = clampedIndex;
+      this.updateScrollOffset();
+      this.requestRender();
+    }
+  }
 }
 // src/renderables/TabSelect.ts
 var TabSelectRenderableEvents;
@@ -5181,6 +5273,7 @@ class EditBufferRenderable extends Renderable {
   _scrollMargin = 0.2;
   _showCursor = true;
   _cursorColor;
+  _cursorStyle;
   lastLocalSelection = null;
   _tabIndicator;
   _tabIndicatorColor;
@@ -5199,6 +5292,10 @@ class EditBufferRenderable extends Renderable {
     scrollMargin: 0.2,
     showCursor: true,
     cursorColor: RGBA.fromValues(1, 1, 1, 1),
+    cursorStyle: {
+      style: "block",
+      blinking: true
+    },
     tabIndicator: undefined,
     tabIndicatorColor: undefined
   };
@@ -5214,6 +5311,7 @@ class EditBufferRenderable extends Renderable {
     this._scrollMargin = options.scrollMargin ?? this._defaultOptions.scrollMargin;
     this._showCursor = options.showCursor ?? this._defaultOptions.showCursor;
     this._cursorColor = parseColor(options.cursorColor ?? this._defaultOptions.cursorColor);
+    this._cursorStyle = options.cursorStyle ?? this._defaultOptions.cursorStyle;
     this._tabIndicator = options.tabIndicator ?? this._defaultOptions.tabIndicator;
     this._tabIndicatorColor = options.tabIndicatorColor ? parseColor(options.tabIndicatorColor) : this._defaultOptions.tabIndicatorColor;
     this.editBuffer = EditBuffer.create(this._ctx.widthMethod);
@@ -5356,7 +5454,21 @@ class EditBufferRenderable extends Renderable {
     const newColor = parseColor(value);
     if (this._cursorColor !== newColor) {
       this._cursorColor = newColor;
-      this.requestRender();
+      if (this._focused) {
+        this.requestRender();
+      }
+    }
+  }
+  get cursorStyle() {
+    return this._cursorStyle;
+  }
+  set cursorStyle(style) {
+    const newStyle = style;
+    if (this.cursorStyle.style !== newStyle.style || this.cursorStyle.blinking !== newStyle.blinking) {
+      this._cursorStyle = newStyle;
+      if (this._focused) {
+        this.requestRender();
+      }
     }
   }
   get tabIndicator() {
@@ -5471,11 +5583,11 @@ class EditBufferRenderable extends Renderable {
     const cursorY = this.y + visualCursor.visualRow + 1;
     this._ctx.setCursorPosition(cursorX, cursorY, true);
     this._ctx.setCursorColor(this._cursorColor);
-    this._ctx.setCursorStyle("block", true);
+    this._ctx.setCursorStyle(this._cursorStyle.style, this._cursorStyle.blinking);
   }
   focus() {
     super.focus();
-    this._ctx.setCursorStyle("block", true);
+    this._ctx.setCursorStyle(this._cursorStyle.style, this._cursorStyle.blinking);
     this._ctx.setCursorColor(this._cursorColor);
     this.requestRender();
   }
@@ -6222,5 +6334,5 @@ export {
   ASCIIFont
 };
 
-//# debugId=451BE98665FD310764756E2164756E21
+//# debugId=44707EEC392262B964756E2164756E21
 //# sourceMappingURL=index.js.map