@sinhala-typer/typing-engine-dom

The browser <textarea> adapter for @sinhala-typer/typing-engine — binds the engine's host-agnostic Edit descriptors to a real textarea: caret placement, resync after paste/selection-replace/cursor-move, and Ctrl+Z/Ctrl+Shift+Z undo/redo. This is the only package in the ecosystem that touches document/window for text composition — no document.execCommand (deprecated, browser-only); edits are applied by directly splicing textarea.value and repositioning selectionStart/selectionEnd.

Install

@sinhala-typer/typing-engine is a peer dependency, not bundled — like react/react-dom, install both:

npm install @sinhala-typer/typing-engine @sinhala-typer/typing-engine-dom

(Not a plain dependency deliberately: typing-engine exports a module-level language registry, and a peer dependency guarantees your app and this adapter share the exact same instance of it, rather than each resolving their own copy — see docs/adr/0010-publish-typing-engine-dom.md.)

Usage

import { getLanguage } from "@sinhala-typer/typing-engine";
import { attachTypingController } from "@sinhala-typer/typing-engine-dom";

const sinhala = getLanguage("si")!;
const phonetic = sinhala.inputMethods.find((m) => m.id === "phonetic")!;

const textarea = document.querySelector("textarea")!;
const controller = attachTypingController(textarea, phonetic);

// Later, e.g. from a keyboard-mode dropdown:
controller.setInputMethod(wijesekara);
controller.setEnabled(false); // plain-English passthrough typing
controller.undo();
controller.redo();
controller.clear();
controller.destroy(); // detach when the textarea unmounts

See apps/web/src/components/TypingArea.tsx in the main repo for a complete React integration.

API

attachTypingController(textarea, initialMethod) returns a TypingController:

• setInputMethod(method) — swap input methods; resyncs composition state from whatever's currently in the buffer.
• setEnabled(enabled) / isEnabled() — toggle composition on/off entirely (plain passthrough typing when off).
• undo() / redo() / canUndo() / canRedo().
• clear() — empties the textarea and resets composition state and undo history.
• destroy() — detaches the internal keydown listener.

License

MIT