@flowtty/core 1.0.0-alpha.7 → 1.0.0-alpha.9

package/dist/host/index.js

@@ -32,7 +32,10 @@ function applyProps(inst, props, _Yoga) {
   n.setFlexDirection(
     props.flexDirection === "row" ? FlexDirection.Row : FlexDirection.Column
   );
-  n.setPositionType(props.position === "absolute" ? PositionType.Absolute : PositionType.Static);
+  const isViewport = props.scrollTop !== void 0 || props.scrollBottom !== void 0;
+  n.setPositionType(
+    props.position === "absolute" ? PositionType.Absolute : isViewport ? PositionType.Relative : PositionType.Static
+  );
   if (props.top !== void 0) n.setPosition(Edge.Top, props.top);
   if (props.left !== void 0) n.setPosition(Edge.Left, props.left);
   if (props.right !== void 0) n.setPosition(Edge.Right, props.right);

package/dist/index.d.ts

@@ -82,6 +82,10 @@ declare function stringWidth(str: string): number;
 
 interface EditorState {
     value: string;
+    /** UTF-16 index into `value` (so `value.slice(0, cursor)` is the text before
+     *  the caret). It only ever rests on a character boundary: movement and
+     *  deletion step over a whole code point, and a cursor handed in between the
+     *  two halves of a surrogate pair is snapped back before anything else. */
     cursor: number;
 }
 type EditorAction = {
@@ -115,6 +119,8 @@ interface InputRow {
     continuation: boolean;
 }
 declare function inputRows(value: string, width: number, cursor?: number): InputRow[];
+/** UTF-16 index of character column `col` within `row` (clamped to its end). */
+declare function rowIndexAt(row: InputRow, col: number): number;
 declare function caretPosition(value: string, cursor: number, width: number): {
     row: number;
     col: number;
@@ -164,4 +170,4 @@ type MultiSelectAction = {
 };
 declare function reduce<T>(items: SelectItem<T>[], state: MultiSelectState, key: Key): MultiSelectAction;
 
-export { type EditorAction, type EditorOptions, type EditorState, type InputRow, Key, type MultiSelectAction, type MultiSelectState, type SelectAction, type SelectItem, type SelectState, type VisualLine, type WrapMode, caretPosition, charWidth, reduce$2 as editorReducer, inputRows, reduce as multiSelectReducer, reduce$1 as selectReducer, splitVisualLines, stringWidth, visibleIndices, windowAround, wrapText };
+export { type EditorAction, type EditorOptions, type EditorState, type InputRow, Key, type MultiSelectAction, type MultiSelectState, type SelectAction, type SelectItem, type SelectState, type VisualLine, type WrapMode, caretPosition, charWidth, reduce$2 as editorReducer, inputRows, reduce as multiSelectReducer, rowIndexAt, reduce$1 as selectReducer, splitVisualLines, stringWidth, visibleIndices, windowAround, wrapText };

package/dist/index.js

@@ -287,13 +287,17 @@ function inputRows(value, width, cursor) {
   const rows = [];
   let lineStart = 0;
   for (const line of value.split("\n")) {
-    if (line.length === 0) {
+    const chars = [...line];
+    if (chars.length === 0) {
       rows.push({ text: "", start: lineStart, continuation: false });
     } else {
-      for (let at = 0; at < line.length; at += w) {
-        rows.push({ text: line.slice(at, at + w), start: lineStart + at, continuation: at > 0 });
+      let start = lineStart;
+      for (let at = 0; at < chars.length; at += w) {
+        const text = chars.slice(at, at + w).join("");
+        rows.push({ text, start, continuation: at > 0 });
+        start += text.length;
       }
-      if (cursor === lineStart + line.length && line.length % w === 0) {
+      if (cursor === lineStart + line.length && chars.length % w === 0) {
         rows.push({ text: "", start: cursor, continuation: true });
       }
     }
@@ -301,17 +305,26 @@ function inputRows(value, width, cursor) {
   }
   return rows;
 }
+function rowIndexAt(row, col) {
+  return row.start + [...row.text].slice(0, Math.max(0, col)).join("").length;
+}
 function caretPosition(value, cursor, width) {
   const c = Math.max(0, Math.min(value.length, cursor));
   const rows = inputRows(value, width, c);
   for (let r = rows.length - 1; r >= 0; r--) {
     const row = rows[r];
-    if (row.start <= c && c <= row.start + row.text.length) return { row: r, col: c - row.start };
+    if (row.start <= c && c <= row.start + row.text.length) {
+      return { row: r, col: [...value.slice(row.start, c)].length };
+    }
   }
   return { row: 0, col: 0 };
 }
 
 // src/editor.ts
+var isHigh = (u) => u !== void 0 && u >= "\uD800" && u <= "\uDBFF";
+var isLow = (u) => u !== void 0 && u >= "\uDC00" && u <= "\uDFFF";
+var prevIndex = (v, i) => i >= 2 && isLow(v[i - 1]) && isHigh(v[i - 2]) ? i - 2 : Math.max(0, i - 1);
+var nextIndex = (v, i) => isHigh(v[i]) && isLow(v[i + 1]) ? i + 2 : Math.min(v.length, i + 1);
 var OPT_MAP = {
   " ": ["\xA0"],
   // U+00A0 NBSP
@@ -336,8 +349,9 @@ function wordRight(value, cursor) {
   return c;
 }
 function reduce(state, key, opts = {}) {
-  const { value, cursor } = state;
-  const clamp = (n) => Math.max(0, Math.min(value.length, n));
+  const { value } = state;
+  let cursor = Math.max(0, Math.min(value.length, state.cursor));
+  if (isLow(value[cursor]) && isHigh(value[cursor - 1])) cursor--;
   const multiline = opts.multiline === true;
   const lineStart = multiline ? value.lastIndexOf("\n", cursor - 1) + 1 : 0;
   const nextBreak = multiline ? value.indexOf("\n", cursor) : -1;
@@ -347,7 +361,8 @@ function reduce(state, key, opts = {}) {
     state: { value: value.slice(0, cursor) + text + value.slice(cursor), cursor: cursor + text.length }
   });
   if (key.name === "paste") {
-    const text = multiline ? key.text ?? "" : (key.text ?? "").replace(/\n/g, " ");
+    const pasted = (key.text ?? "").replace(/\r\n?/g, "\n");
+    const text = multiline ? pasted : pasted.replace(/\n/g, " ");
     if (text === "") return { kind: "noop" };
     return insert(text);
   }
@@ -364,15 +379,15 @@ function reduce(state, key, opts = {}) {
       if (target < 0) return { kind: "edit", state: { value, cursor: 0 } };
       if (target >= rows.length) return { kind: "edit", state: { value, cursor: value.length } };
       const row = rows[target];
-      return { kind: "edit", state: { value, cursor: row.start + Math.min(at.col, row.text.length) } };
+      return { kind: "edit", state: { value, cursor: rowIndexAt(row, at.col) } };
     }
   }
   if (key.name === "left" && key.meta) return { kind: "edit", state: { value, cursor: wordLeft(value, cursor) } };
   if (key.name === "b" && key.meta) return { kind: "edit", state: { value, cursor: wordLeft(value, cursor) } };
   if (key.name === "right" && key.meta) return { kind: "edit", state: { value, cursor: wordRight(value, cursor) } };
   if (key.name === "f" && key.meta) return { kind: "edit", state: { value, cursor: wordRight(value, cursor) } };
-  if (key.name === "left") return { kind: "edit", state: { value, cursor: clamp(cursor - 1) } };
-  if (key.name === "right") return { kind: "edit", state: { value, cursor: clamp(cursor + 1) } };
+  if (key.name === "left") return { kind: "edit", state: { value, cursor: prevIndex(value, cursor) } };
+  if (key.name === "right") return { kind: "edit", state: { value, cursor: nextIndex(value, cursor) } };
   if (key.name === "home") return { kind: "edit", state: { value, cursor: lineStart } };
   if (key.name === "end") return { kind: "edit", state: { value, cursor: lineEnd } };
   if (key.name === "a" && key.ctrl) return { kind: "edit", state: { value, cursor: lineStart } };
@@ -405,19 +420,17 @@ function reduce(state, key, opts = {}) {
     return { kind: "edit", state: { value: value.slice(0, cursor) + ch + value.slice(cursor), cursor: cursor + 1 } };
   }
   if (key.name === "backspace") {
-    if (cursor === 0) return { kind: "edit", state };
-    return { kind: "edit", state: { value: value.slice(0, cursor - 1) + value.slice(cursor), cursor: cursor - 1 } };
+    if (cursor === 0) return { kind: "edit", state: { value, cursor } };
+    const from = prevIndex(value, cursor);
+    return { kind: "edit", state: { value: value.slice(0, from) + value.slice(cursor), cursor: from } };
   }
   if (key.name === "delete" || key.name === "d" && key.ctrl) {
-    if (cursor === value.length) return { kind: "edit", state };
-    return { kind: "edit", state: { value: value.slice(0, cursor) + value.slice(cursor + 1), cursor } };
+    if (cursor === value.length) return { kind: "edit", state: { value, cursor } };
+    return { kind: "edit", state: { value: value.slice(0, cursor) + value.slice(nextIndex(value, cursor)), cursor } };
   }
   if (key.name === "return") return { kind: "submit" };
   if (key.name === "escape") return { kind: "cancel" };
-  if (!key.ctrl && !key.meta && key.name.length === 1) {
-    const ch = key.name;
-    return { kind: "edit", state: { value: value.slice(0, cursor) + ch + value.slice(cursor), cursor: cursor + 1 } };
-  }
+  if (!key.ctrl && !key.meta && [...key.name].length === 1) return insert(key.name);
   return { kind: "noop" };
 }
 
@@ -477,4 +490,4 @@ function reduce3(items, state, key) {
   return { kind: "noop" };
 }
 
-export { caretPosition, charWidth, reduce as editorReducer, inputRows, reduce3 as multiSelectReducer, reduce2 as selectReducer, splitVisualLines, stringWidth, visibleIndices, windowAround };
+export { caretPosition, charWidth, reduce as editorReducer, inputRows, reduce3 as multiSelectReducer, rowIndexAt, reduce2 as selectReducer, splitVisualLines, stringWidth, visibleIndices, windowAround };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flowtty/core",
-  "version": "1.0.0-alpha.7",
+  "version": "1.0.0-alpha.9",
   "type": "module",
   "license": "MIT",
   "repository": {