@barocss/math-editor 0.2.1 → 0.4.0

package/dist/vertical-navigation.js

@@ -0,0 +1,145 @@
+import { documentRows, isGrid, isLiteralText, textNodes, } from './model.js';
+/** Candidate slots in semantic order; paired scripts may also move along their shared column. */
+function verticalSlots(node, slot, direction) {
+    if (isGrid(node)) {
+        const target = slot + direction * node.columns;
+        return target >= 0 && target < node.slots.length ? [target] : [];
+    }
+    switch (node.type) {
+        case 'fraction':
+        case 'binomial':
+        case 'indexedRoot':
+        case 'overset':
+        case 'overbrace':
+        case 'xrightarrow':
+        case 'xleftarrow':
+        case 'subscript':
+            return slot + direction >= 0 && slot + direction < 2 ? [slot + direction] : [];
+        case 'underset':
+        case 'underbrace':
+            return slot - direction >= 0 && slot - direction < 2 ? [slot - direction] : [];
+        case 'superscript':
+            return slot - direction >= 0 && slot - direction < 2 ? [slot - direction] : [];
+        case 'scripts':
+            if (slot === 0)
+                return [direction === -1 ? 2 : 1];
+            if (slot === 1 && direction === -1)
+                return [0, 2];
+            if (slot === 2 && direction === 1)
+                return [0, 1];
+            return [];
+        case 'limit':
+        case 'limsup':
+        case 'liminf':
+            return slot - direction >= 0 && slot - direction < 2 ? [slot - direction] : [];
+        case 'sum':
+        case 'product':
+        case 'integral':
+        case 'doubleIntegral':
+        case 'tripleIntegral':
+        case 'contourIntegral':
+            if (slot === 2)
+                return [direction === -1 ? 1 : 0];
+            if (slot === 0 && direction === -1)
+                return [2, 1];
+            if (slot === 1 && direction === 1)
+                return [2, 0];
+            return [];
+        default:
+            return [];
+    }
+}
+function caretOffsets(text) {
+    const offsets = [0];
+    for (const character of text)
+        offsets.push(offsets.at(-1) + character.length);
+    return offsets;
+}
+function focusRows(state, targets, direction, geometry) {
+    const nodes = targets.flatMap((root) => textNodes({ version: 1, root }));
+    if (!nodes.length)
+        return state;
+    const origin = geometry?.({
+        id: state.caret.id,
+        offset: state.caret.start,
+        affinity: state.caret.affinity,
+    });
+    let nearest;
+    let horizontal = Infinity;
+    let vertical = Infinity;
+    if (origin && Number.isFinite(origin.x) && Number.isFinite(origin.y)) {
+        for (const node of nodes) {
+            for (const offset of caretOffsets(node.text)) {
+                // React renders adjacent lexical tokens with distinct physical caret positions.
+                for (const affinity of ['backward', 'forward']) {
+                    const point = { id: node.id, offset, affinity };
+                    const position = geometry?.(point);
+                    if (!position || !Number.isFinite(position.x) || !Number.isFinite(position.y))
+                        continue;
+                    const dy = (position.y - origin.y) * direction;
+                    if (dy <= 0)
+                        continue;
+                    const dx = Math.abs(position.x - origin.x);
+                    if (dx < horizontal - 0.5 || (Math.abs(dx - horizontal) <= 0.5 && dy < vertical)) {
+                        nearest = point;
+                        horizontal = dx;
+                        vertical = dy;
+                    }
+                }
+            }
+        }
+    }
+    // Without layout, preserve the existing offset/clamping behavior in the first target slot.
+    const fallback = nodes[0];
+    const offset = nearest?.offset ??
+        caretOffsets(fallback.text)
+            .filter((at) => at <= state.caret.start)
+            .at(-1);
+    return {
+        ...state,
+        caret: {
+            id: nearest?.id ?? fallback.id,
+            start: offset,
+            end: offset,
+            ...(nearest ? { affinity: nearest.affinity } : {}),
+        },
+    };
+}
+/**
+ * Move through the nearest vertical structure, then enclosing grids and equation lines.
+ * Geometry is optional so the same operation works in headless sessions and either renderer.
+ * Native text selections and literal text retain their own arrow-key behavior.
+ */
+export function moveVertical(state, direction, geometry) {
+    if (state.caret.start !== state.caret.end || isLiteralText(state.document, state.caret.id))
+        return state;
+    const path = [];
+    const find = (row) => {
+        for (const node of row.children) {
+            if (node.type === 'text') {
+                if (node.id === state.caret.id)
+                    return true;
+            }
+            else {
+                for (let slot = 0; slot < node.slots.length; slot++) {
+                    path.push({ structure: node, slot });
+                    if (find(node.slots[slot]))
+                        return true;
+                    path.pop();
+                }
+            }
+        }
+        return false;
+    };
+    const lines = documentRows(state.document);
+    const line = lines.findIndex(find);
+    if (line < 0)
+        return state;
+    for (const { structure, slot } of path.reverse()) {
+        const targets = verticalSlots(structure, slot, direction).map((index) => structure.slots[index]);
+        if (targets.length)
+            return focusRows(state, targets, direction, geometry);
+    }
+    const target = lines[line + direction];
+    return target ? focusRows(state, [target], direction, geometry) : state;
+}

package/dist/vue.d.ts

@@ -2,4 +2,3 @@ import type { ObjectDirective } from 'vue';
 import { type DOMMathEditorOptions } from './dom.js';
 /** Use as v-math-editor. session/defaultValue are mount-only. */
 export declare const vMathEditor: ObjectDirective<HTMLElement, DOMMathEditorOptions>;
-//# sourceMappingURL=vue.d.ts.map

package/dist/vue.js

@@ -13,4 +13,3 @@ export const vMathEditor = {
         instances.delete(host);
     },
 };
-//# sourceMappingURL=vue.js.map

package/dist/web-component.d.ts

@@ -7,4 +7,3 @@ export interface MathEditorElement extends HTMLElement {
 }
 /** Explicit registration; importing this module is safe without a browser. Uses light DOM. */
 export declare function defineMathEditor(tagName?: string): CustomElementConstructor;
-//# sourceMappingURL=web-component.d.ts.map

package/dist/web-component.js

@@ -64,4 +64,3 @@ export function defineMathEditor(tagName = 'barocss-math-editor') {
     customElements.define(tagName, EditorElement);
     return EditorElement;
 }
-//# sourceMappingURL=web-component.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barocss/math-editor",
-  "version": "0.2.1",
+  "version": "0.4.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",