@dui-toolkit/plugin-tui 0.1.1-next.2 → 0.1.1-next.4

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { stripAnsi, truncateByCells, visibleLength } from "@bdocs/dui";
+import { splitGraphemes, stripAnsi, truncateByCells, visibleLength } from "@bdocs/dui";
 import { readFileSync } from "node:fs";
 //#region src/widget.ts
 var BaseWidget = class {
@@ -72,8 +72,11 @@ var TextInput = class extends BaseWidget {
 	/** Set the text value programmatically. */
 	setValue(value) {
 		const max = this.data.maxLength;
-		this.data.value = max > 0 ? value.slice(0, max) : value;
-		this.cursorPos = this.data.value.length;
+		if (max > 0) {
+			const g = splitGraphemes(value);
+			this.data.value = g.slice(0, max).join("");
+		} else this.data.value = value;
+		this.cursorPos = splitGraphemes(this.data.value).length;
 		this.data.onChange?.(this.data.value);
 	}
 	/** Get the current text value. */
@@ -86,16 +89,18 @@ var TextInput = class extends BaseWidget {
 		const value = this.data.mask ? this.data.mask.repeat(this.data.value.length) : this.data.value;
 		const display = value || this.data.placeholder;
 		const isEmpty = !value;
-		const cursorInDisplay = this.cursorPos;
-		let before = display.slice(0, cursorInDisplay);
-		let cursor = display[cursorInDisplay] || " ";
-		let after = display.slice(cursorInDisplay + 1);
+		const graphemes = splitGraphemes(display);
+		const cursorInDisplay = Math.min(this.cursorPos, graphemes.length);
+		let before = graphemes.slice(0, cursorInDisplay).join("");
+		let cursor = graphemes[cursorInDisplay] || " ";
+		let after = graphemes.slice(cursorInDisplay + 1).join("");
+		graphemes.slice(cursorInDisplay + 1);
 		const maxVisible = width - 4;
 		if (visibleLength(display) > maxVisible) {
 			const start = Math.max(0, cursorInDisplay - Math.floor(maxVisible / 2));
-			before = display.slice(start, cursorInDisplay);
-			cursor = display[cursorInDisplay] || " ";
-			after = display.slice(cursorInDisplay + 1, start + maxVisible);
+			before = graphemes.slice(start, cursorInDisplay).join("");
+			cursor = graphemes[cursorInDisplay] || " ";
+			after = graphemes.slice(cursorInDisplay + 1, start + maxVisible).join("");
 		}
 		const lines = [];
 		lines.push(`┌${"─".repeat(width - 2)}┐`);
@@ -138,14 +143,18 @@ var TextInput = class extends BaseWidget {
 				return true;
 			case "Backspace":
 				if (this.cursorPos > 0) {
-					this.data.value = this.data.value.slice(0, this.cursorPos - 1) + this.data.value.slice(this.cursorPos);
-					this.cursorPos--;
+					const g = splitGraphemes(this.data.value);
+					const pos = Math.min(this.cursorPos, g.length);
+					this.data.value = g.slice(0, pos - 1).join("") + g.slice(pos).join("");
+					this.cursorPos = pos - 1;
 					this.data.onChange?.(this.data.value);
 				}
 				return true;
 			case "Delete":
 				if (this.cursorPos < this.data.value.length) {
-					this.data.value = this.data.value.slice(0, this.cursorPos) + this.data.value.slice(this.cursorPos + 1);
+					const g = splitGraphemes(this.data.value);
+					const pos = Math.min(this.cursorPos, g.length);
+					this.data.value = g.slice(0, pos).join("") + g.slice(pos + 1).join("");
 					this.data.onChange?.(this.data.value);
 				}
 				return true;
@@ -175,9 +184,13 @@ var TextInput = class extends BaseWidget {
 		}
 		if (char && char.length === 1 && char >= " ") {
 			const max = this.data.maxLength;
-			if (max > 0 && this.data.value.length >= max) return true;
-			this.data.value = this.data.value.slice(0, this.cursorPos) + char + this.data.value.slice(this.cursorPos);
-			this.cursorPos++;
+			if (max > 0) {
+				if (splitGraphemes(this.data.value).length >= max) return true;
+			}
+			const g = splitGraphemes(this.data.value);
+			const pos = Math.min(this.cursorPos, g.length);
+			this.data.value = g.slice(0, pos).join("") + char + g.slice(pos).join("");
+			this.cursorPos = pos + 1;
 			this.data.onChange?.(this.data.value);
 			return true;
 		}
@@ -280,7 +293,7 @@ var SelectList = class extends BaseWidget {
 		if (!this.focused) return false;
 		const { key, char, ctrl } = event;
 		const items = this.getFilteredItems();
-		const maxVisible = Math.max(1, this.viewportHeight - 2);
+		const maxVisible = Math.max(1, this.viewportHeight - (this.data.filterActive ? 4 : 2));
 		if (this.data.filterActive) {
 			if (key === "Escape") {
 				this.data.filterActive = false;
@@ -307,28 +320,30 @@ var SelectList = class extends BaseWidget {
 		}
 		switch (key) {
 			case "ArrowUp":
-				if (this.data.selectedIndex > 0) {
+				if (items.length > 0 && this.data.selectedIndex > 0) {
 					this.data.selectedIndex--;
 					if (this.data.selectedIndex < this.data.scrollOffset) this.data.scrollOffset = this.data.selectedIndex;
 				}
-				this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
+				if (items[this.data.selectedIndex]) this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
 				return true;
 			case "ArrowDown":
-				if (this.data.selectedIndex < items.length - 1) {
+				if (items.length > 0 && this.data.selectedIndex < items.length - 1) {
 					this.data.selectedIndex++;
 					if (this.data.selectedIndex >= this.data.scrollOffset + maxVisible) this.data.scrollOffset = this.data.selectedIndex - maxVisible + 1;
 				}
-				this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
+				if (items[this.data.selectedIndex]) this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
 				return true;
 			case "Home":
 				this.data.selectedIndex = 0;
 				this.data.scrollOffset = 0;
-				this.data.onSelect?.(items[0], 0);
+				if (items[0]) this.data.onSelect?.(items[0], 0);
 				return true;
 			case "End":
-				this.data.selectedIndex = items.length - 1;
-				if (items.length > maxVisible) this.data.scrollOffset = items.length - maxVisible;
-				this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
+				if (items.length > 0) {
+					this.data.selectedIndex = items.length - 1;
+					if (items.length > maxVisible) this.data.scrollOffset = items.length - maxVisible;
+					this.data.onSelect?.(items[this.data.selectedIndex], this.data.selectedIndex);
+				}
 				return true;
 			case "Enter": {
 				const sel = items[this.data.selectedIndex];
@@ -368,7 +383,28 @@ var SelectList = class extends BaseWidget {
 * corrupts terminal state) or wide glyphs (CJK / emoji). These helpers stay
 * cell-aware and never split an escape sequence.
 */
-const CSI_RE = /\x1b\[[0-9;:<=>?]*[ -/]*[@-~]/;
+const CSI_RE = /\x1b\[[0-9;:<=>?]*[ -\/]*[@-~]/;
+/**
+* Skip past a single escape sequence starting at `rest[0]`.
+* Returns the length of the escape sequence, or 0 if `rest` does not start
+* with a recognised escape.
+*/
+function escapeLength(rest) {
+	if (!rest.startsWith("\x1B")) return 0;
+	const csi = CSI_RE.exec(rest);
+	if (csi && csi[0].length > 0) return csi[0].length;
+	if (rest.length >= 2) {
+		if (rest[1] === "]") {
+			for (let i = 2; i < rest.length; i++) {
+				if (rest[i] === "\x07") return i + 1;
+				if (rest[i] === "\x1B" && rest[i + 1] === "\\") return i + 2;
+			}
+			return rest.length;
+		}
+		return 2;
+	}
+	return 1;
+}
 /**
 * Truncate an ANSI-wrapped string to `maxCells` terminal cells.
 *
@@ -384,22 +420,20 @@ function truncateAnsi(text, maxCells) {
 	const target = Math.max(0, maxCells - 1);
 	let out = "";
 	let used = 0;
-	let rest = text;
-	while (rest.length > 0 && used < target) {
-		if (rest.startsWith("\x1B")) {
-			const m = CSI_RE.exec(rest);
-			if (m && m[0].length > 0) {
-				out += m[0];
-				rest = rest.slice(m[0].length);
-				continue;
-			}
+	let pos = 0;
+	while (pos < text.length && used < target) {
+		const escLen = escapeLength(text.slice(pos));
+		if (escLen > 0) {
+			out += text.slice(pos, pos + escLen);
+			pos += escLen;
+			continue;
 		}
-		const ch = rest.charAt(0);
+		const ch = text.charAt(pos);
 		const w = visibleLength(ch);
 		if (used + w > target) break;
 		out += ch;
 		used += w;
-		rest = rest.slice(1);
+		pos++;
 	}
 	return out + "…";
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dui-toolkit/plugin-tui",
-  "version": "0.1.1-next.2",
+  "version": "0.1.1-next.4",
   "description": "TUI widget toolkit plugin for @bdocs/dui — text inputs, select lists, modals, status bars, and more.",
   "main": "dist/index.mjs",
   "types": "dist/index.d.mts",
@@ -28,7 +28,7 @@
   "license": "MIT",
   "type": "module",
   "dependencies": {
-    "@bdocs/dui": "0.7.0-next.4"
+    "@bdocs/dui": "0.7.0-next.6"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",
@@ -36,6 +36,9 @@
     "typescript": "^5.9.3",
     "vitest": "^3.0.0"
   },
+  "peerDependencies": {
+    "@bdocs/dui": "0.7.0-next.6"
+  },
   "scripts": {
     "build": "tsdown --config-loader unrun",
     "dev": "tsdown --watch --config-loader unrun",