@intentface/chat 0.1.0

package/dist/composer/store.js

@@ -0,0 +1,451 @@
+"use client";
+// Composer store — all reactive composer state in one store, so useComposer
+// can offer Zustand-style selectors and components re-render only for the
+// slice they read. Actions and refs are created once and survive every
+// update; a slice's identity changes only when that slice's data changes.
+//
+// Instance model: every Composer.Root owns a store (an explicit
+// Composer.createStore() handle, or one created per mount) and provides it via
+// ComposerStoreContext. Inside the tree, useComposer resolves it implicitly;
+// outside, useComposerStore(store, selector) and store.controller take an
+// explicit handle — no global fallback, so state is never read or driven by
+// accident. SSR-safe by invariant: every write happens in an effect or event
+// handler (client-only), so server renders only ever read the pristine
+// snapshot.
+import { createContext, use, useSyncExternalStore } from "react";
+import { revokeAttachmentUrl, toAttachmentItem, } from "../attachments/index.js";
+import { INITIAL_ASK_USER_STATE, isLastStep, transitionAskUser, } from "./ask-user-machine.js";
+import { attachmentReducer, INITIAL_ATTACHMENT_STATE, } from "./attachments-machine.js";
+import { interpretAskUserKey } from "./keyboard.js";
+const createEditorController = (editorRef) => ({
+    focus: () => editorRef.current?.focus(),
+    blur: () => editorRef.current?.blur(),
+    clear: () => editorRef.current?.clear(),
+    insertText: (text) => editorRef.current?.insertText(text),
+    insertChip: (chip) => editorRef.current?.insertChip(chip),
+    getText: () => editorRef.current?.getText() ?? "",
+    setText: (text) => editorRef.current?.setText(text),
+    serialize: () => editorRef.current?.serialize() ?? { text: "" },
+    ensureFocus: () => {
+        const editor = editorRef.current;
+        if (editor && !editor.isFocused())
+            editor.focus();
+    },
+});
+// ---------------------------------------------------------------------------
+// Ask-user keydown — the document-level handler for question mode, kept out of
+// the store factory so activateAskUser reads as just "blur, listen, unlisten".
+// ---------------------------------------------------------------------------
+// Scope a document-level listener to this composer: keystrokes aimed at
+// another editable or inside another composer's options are theirs; our own
+// options/editor and unclaimed targets (body — e.g. after a click on panel
+// chrome dropped focus) are ours, so arrows and "type to answer" keep working.
+const isEventForComposer = (event, editorDom, optionsElement) => {
+    const target = event.target;
+    const editableHost = target?.closest('input, textarea, [contenteditable="true"]');
+    if (editableHost)
+        return editableHost === editorDom;
+    const optionsHost = target?.closest("[data-ask-user-options]");
+    if (optionsHost)
+        return optionsHost === optionsElement;
+    return true;
+};
+// Interpret a key (pure) and drive the machine + editor controller. Mirrors the
+// action union from interpretAskUserKey one-to-one.
+const createAskUserKeydownHandler = ({ controller, optionsRef, editorRef, dispatch }) => (event) => {
+    const scopedOptionsElement = optionsRef.current?.getElement() ?? null;
+    if (!isEventForComposer(event, editorRef.current?.getRootElement() ?? undefined, scopedOptionsElement)) {
+        return;
+    }
+    const optionsHandle = optionsRef.current;
+    const action = interpretAskUserKey({
+        key: event.key,
+        ctrlKey: event.ctrlKey,
+        metaKey: event.metaKey,
+        altKey: event.altKey,
+        defaultPrevented: event.defaultPrevented,
+    }, { hasHighlight: optionsHandle?.highlightedValue != null });
+    if (!action)
+        return;
+    event.preventDefault();
+    switch (action.type) {
+        case "dismiss-step":
+            dispatch({ type: "dismiss-step" });
+            return;
+        case "navigate-options": {
+            const newValue = optionsHandle?.navigate(action.direction);
+            if (newValue === null)
+                controller.focus();
+            return;
+        }
+        case "select-option": {
+            const item = optionsHandle?.select();
+            if (item)
+                dispatch({ type: "select-option", label: item.value });
+            return;
+        }
+        case "go-back":
+            dispatch({ type: "step-back", currentText: controller.getText() });
+            return;
+        case "go-next":
+            dispatch({ type: "step-forward", currentText: controller.getText() });
+            return;
+        case "insert-character":
+            optionsHandle?.clearHighlight();
+            controller.focus();
+            controller.insertText(action.character);
+            return;
+    }
+};
+// ---------------------------------------------------------------------------
+// Store factory
+// ---------------------------------------------------------------------------
+export const createComposerStore = () => {
+    // --- Subscriptions & refs
+    const listeners = new Set();
+    const notify = () => {
+        for (const listener of listeners)
+            listener();
+    };
+    // Per-store editor engine behind a null-safe controller.
+    const editorRef = { current: null };
+    const controller = createEditorController(editorRef);
+    const registerEditor = (editor) => {
+        editorRef.current = editor;
+        return () => {
+            if (editorRef.current === editor)
+                editorRef.current = null;
+        };
+    };
+    // Imperative refs co-located with the store; not reactive.
+    const containerRef = { current: null };
+    const optionsRef = { current: null };
+    const fileInputRef = { current: null };
+    const globalDropRef = { current: false };
+    // Permissive defaults: accept everything, no caps, platform-default blob
+    // ingestion. Composer.Attachments overwrites this with the consumer's
+    // policy and any custom convert/destroy.
+    const attachmentConfigRef = {
+        current: {
+            accept: "",
+            maxFiles: Number.POSITIVE_INFINITY,
+            maxFileSize: Number.POSITIVE_INFINITY,
+            convert: toAttachmentItem,
+            destroy: revokeAttachmentUrl,
+        },
+    };
+    const submitAnswersRef = {
+        current: null,
+    };
+    const commandSelectRef = { current: null };
+    // Canonical machine states; the snapshot mirrors them on every update.
+    let attachmentState = INITIAL_ATTACHMENT_STATE;
+    let askUserMachine = INITIAL_ASK_USER_STATE;
+    let snapshot;
+    // --- Setters
+    const setHasContent = (value) => {
+        if (snapshot.textarea.hasContent === value)
+            return;
+        snapshot = { ...snapshot, textarea: { ...snapshot.textarea, hasContent: value } };
+        notify();
+    };
+    const setIsSubmitting = (value) => {
+        if (snapshot.isSubmitting === value)
+            return;
+        snapshot = { ...snapshot, isSubmitting: value };
+        notify();
+    };
+    const setCommands = (next) => {
+        const current = snapshot.commands;
+        if (current.active === next.active &&
+            current.trigger === next.trigger &&
+            current.query === next.query) {
+            return;
+        }
+        // Re-point the highlight at the first row whenever the active token or its
+        // query changes, so filtering always lands on the top match.
+        const resetHighlight = current.trigger !== next.trigger || current.query !== next.query;
+        snapshot = {
+            ...snapshot,
+            commands: {
+                ...next,
+                // Sticky: opening sets present; closing leaves it set until the panel's
+                // exit animation finishes and finalizePanelClose() clears it.
+                present: next.active || current.present,
+                highlightIndex: resetHighlight ? 0 : current.highlightIndex,
+                // A closed popup has no active descendant; while open, the mounted
+                // Command re-derives it as the highlight resolves.
+                activeOptionId: next.active ? current.activeOptionId : null,
+            },
+        };
+        notify();
+    };
+    // The editor's aria-activedescendant target — written by the mounted
+    // Command, which is where highlight index resolves against the item list.
+    const setActiveOptionId = (id) => {
+        if (snapshot.commands.activeOptionId === id)
+            return;
+        snapshot = { ...snapshot, commands: { ...snapshot.commands, activeOptionId: id } };
+        notify();
+    };
+    // Move the highlight by ±1 (raw, unbounded). The active CommandList wraps it
+    // by its item count when reading, so the store needs no item knowledge.
+    const moveHighlight = (direction) => {
+        const { commands } = snapshot;
+        snapshot = {
+            ...snapshot,
+            commands: { ...commands, highlightIndex: commands.highlightIndex + direction },
+        };
+        notify();
+    };
+    // Set the highlight to an absolute index (hover).
+    const setHighlight = (index) => {
+        if (snapshot.commands.highlightIndex === index)
+            return;
+        snapshot = { ...snapshot, commands: { ...snapshot.commands, highlightIndex: index } };
+        notify();
+    };
+    // --- Attachments
+    const dispatchAttachments = (action) => {
+        const next = attachmentReducer(attachmentState, action, attachmentConfigRef.current);
+        if (next === attachmentState)
+            return;
+        attachmentState = next;
+        snapshot = {
+            ...snapshot,
+            attachments: { ...snapshot.attachments, items: next.items, error: next.error },
+        };
+        notify();
+    };
+    const setDragging = (active) => {
+        if (snapshot.attachments.isDragging === active)
+            return;
+        snapshot = { ...snapshot, attachments: { ...snapshot.attachments, isDragging: active } };
+        notify();
+    };
+    // --- Ask-user
+    // The execute half of the ask-user flow: replay a transition's effects
+    // against the editor controller, the options handle, and the submit
+    // callback. Input-content state is the editor engine's own job — engines
+    // report programmatic setText/clear through their update path.
+    const executeAskUserEffects = (effects) => {
+        for (const effect of effects) {
+            switch (effect.type) {
+                case "clear-input":
+                    controller.clear();
+                    break;
+                case "set-input-text":
+                    controller.setText(effect.text);
+                    break;
+                case "focus-input":
+                    controller.focus();
+                    break;
+                case "focus-options":
+                    // Step advance / navigation: focus lands on the new step's
+                    // highlighted option (roving tabindex), never on <body>. Deferred a
+                    // microtask so the incoming step's options have registered
+                    // (reset-highlight runs first; auto-highlight re-seats on mount).
+                    queueMicrotask(() => optionsRef.current?.focusHighlighted());
+                    break;
+                case "reset-highlight":
+                    optionsRef.current?.resetHighlight();
+                    break;
+                case "submit-answers":
+                    submitAnswersRef.current?.(effect.answers);
+                    break;
+            }
+        }
+    };
+    const dispatchAskUser = (action) => {
+        const questions = snapshot.askUser.questions;
+        if (!questions || questions.length === 0)
+            return;
+        const { next, effects } = transitionAskUser(askUserMachine, questions, action);
+        if (next !== askUserMachine) {
+            askUserMachine = next;
+            snapshot = {
+                ...snapshot,
+                askUser: {
+                    ...snapshot.askUser,
+                    step: next.step,
+                    answers: next.answers,
+                    isLastStep: isLastStep(next, questions),
+                },
+            };
+            notify();
+        }
+        executeAskUserEffects(effects);
+    };
+    const setQuestions = (questions) => {
+        if (snapshot.askUser.questions === questions)
+            return;
+        askUserMachine = INITIAL_ASK_USER_STATE;
+        snapshot = {
+            ...snapshot,
+            askUser: {
+                ...snapshot.askUser,
+                active: questions != null,
+                // Sticky, same as commands: cleared by finalizePanelClose() after the exit.
+                present: questions != null || snapshot.askUser.present,
+                questions,
+                step: askUserMachine.step,
+                answers: askUserMachine.answers,
+                isLastStep: questions ? isLastStep(askUserMachine, questions) : false,
+                isSingle: questions ? questions.length === 1 : false,
+            },
+        };
+        notify();
+    };
+    // Ask-user mode: while questions are active the options own the keyboard.
+    // Entering moves DOM focus onto the highlighted option (roving tabindex),
+    // and the keydown listener sits at the document, scoped by containment
+    // (isEventForComposer) — so keys keep flowing after a chrome click drops
+    // focus to <body>, while a second composer's editor/options never hear them.
+    const activateAskUser = () => {
+        const handleKeyDown = createAskUserKeydownHandler({
+            controller,
+            optionsRef,
+            editorRef,
+            dispatch: dispatchAskUser,
+        });
+        document.addEventListener("keydown", handleKeyDown);
+        // The Options part renders in reaction to setQuestions' notify — one
+        // commit after this call — so the entry focus defers a frame.
+        const frame = requestAnimationFrame(() => {
+            optionsRef.current?.focusHighlighted();
+        });
+        return () => {
+            cancelAnimationFrame(frame);
+            document.removeEventListener("keydown", handleKeyDown);
+        };
+    };
+    // --- Initial snapshot
+    snapshot = {
+        textarea: { hasContent: false },
+        isSubmitting: false,
+        commands: {
+            active: false,
+            present: false,
+            trigger: null,
+            query: "",
+            highlightIndex: 0,
+            activeOptionId: null,
+        },
+        attachments: {
+            items: attachmentState.items,
+            error: attachmentState.error,
+            isDragging: false,
+            add: (files) => dispatchAttachments({ type: "add", files }),
+            remove: (id) => dispatchAttachments({ type: "remove", id }),
+            openFileDialog: () => fileInputRef.current?.click(),
+            fileInputRef,
+            globalDropRef,
+        },
+        askUser: {
+            active: false,
+            present: false,
+            questions: null,
+            step: askUserMachine.step,
+            answers: askUserMachine.answers,
+            isLastStep: false,
+            isSingle: false,
+            toggleOption: (label) => dispatchAskUser({ type: "toggle-option", label }),
+            continueStep: (freeText) => dispatchAskUser({ type: "continue-step", freeText: freeText ?? "" }),
+            dismissStep: () => dispatchAskUser({ type: "dismiss-step" }),
+            clearSelections: () => dispatchAskUser({ type: "clear-selections" }),
+            goBack: () => dispatchAskUser({ type: "step-back", currentText: controller.getText() }),
+            goNext: () => dispatchAskUser({ type: "step-forward", currentText: controller.getText() }),
+            optionsRef,
+        },
+    };
+    // Pristine state for reset() — slice actions and refs are reused, so action
+    // identities stay stable across resets.
+    const initialSnapshot = snapshot;
+    // Clear `present` on any native panel slice whose `active` is now false — called by
+    // the Panel once its close animation finishes, so the last content stays mounted
+    // (and keeps animating) until then. Identity-guarded so it no-ops when nothing changed.
+    const finalizePanelClose = () => {
+        const { commands, askUser } = snapshot;
+        if (commands.present === commands.active && askUser.present === askUser.active)
+            return;
+        snapshot = {
+            ...snapshot,
+            commands: commands.present === commands.active ? commands : { ...commands, present: commands.active },
+            askUser: askUser.present === askUser.active ? askUser : { ...askUser, present: askUser.active },
+        };
+        notify();
+    };
+    // --- Lifecycle
+    // Drop everything mount-scoped when the Composer unmounts (route change):
+    // revoke attachment object URLs, then restore the pristine snapshot.
+    const reset = () => {
+        dispatchAttachments({ type: "reset" });
+        askUserMachine = INITIAL_ASK_USER_STATE;
+        commandSelectRef.current = null;
+        snapshot = initialSnapshot;
+        notify();
+    };
+    return {
+        subscribe: (listener) => {
+            listeners.add(listener);
+            return () => {
+                listeners.delete(listener);
+            };
+        },
+        getSnapshot: () => snapshot,
+        setHasContent,
+        setIsSubmitting,
+        setCommands,
+        setActiveOptionId,
+        listboxId: "",
+        moveHighlight,
+        setHighlight,
+        setQuestions,
+        setDragging,
+        resetAttachments: () => dispatchAttachments({ type: "reset" }),
+        activateAskUser,
+        finalizePanelClose,
+        reset,
+        editorRef,
+        controller,
+        registerEditor,
+        containerRef,
+        attachmentConfigRef,
+        submitAnswersRef,
+        commandSelectRef,
+    };
+};
+// ---------------------------------------------------------------------------
+// Instance resolution — the nearest <Composer>, explicitly. No global
+// fallback: outside a composer tree, state comes from an explicit
+// Composer.createStore() handle via useComposerStore.
+// ---------------------------------------------------------------------------
+export const ComposerStoreContext = createContext(null);
+// Internal: parts resolve the store their Composer.Root provided.
+export const useComposerContextStore = () => {
+    const store = use(ComposerStoreContext);
+    if (!store) {
+        throw new Error("Composer components must be used within <Composer>");
+    }
+    return store;
+};
+// Subscribe to an explicit Composer.createStore() instance — the
+// outside-the-tree twin of useComposer (toolbars, status bars, shortcut
+// handlers). Wrap it once per instance to drop the store argument at call
+// sites:
+//   const useChatComposer = <T,>(selector: (c: ComposerState) => T) =>
+//     useComposerStore(chatComposerStore, selector);
+export const useComposerStore = (store, selector) => {
+    const getValue = () => {
+        const state = store.getSnapshot();
+        // Safe: without a selector, Selected defaults to ComposerState.
+        return selector ? selector(state) : state;
+    };
+    return useSyncExternalStore(store.subscribe, getValue, getValue);
+};
+// Subscribe to composer state from inside the tree. With a selector, the
+// component re-renders only when the selected value changes identity (slices
+// are identity-stable):
+//   const askUser = useComposer((composer) => composer.askUser);
+// Without one, it returns the full snapshot and re-renders on any change.
+export const useComposer = (selector) => useComposerStore(useComposerContextStore(), selector);

package/dist/composer/textarea.d.ts

@@ -0,0 +1,39 @@
+import type { HTMLAttributes, ReactNode } from "react";
+import type { ChipData } from "../chip-markdown.js";
+import type { PrimitiveProps } from "../internal/primitive-props.js";
+import type { ComposerSubmitOn } from "./keyboard.js";
+export type ComposerTextareaState = {
+    /** Present as data-disabled while the editor is non-editable. */
+    disabled: boolean;
+    /** Present as data-filled while the editor has content. */
+    filled: boolean;
+};
+export type ComposerTextareaProps = Omit<PrimitiveProps<"div", ComposerTextareaState>, "children"> & {
+    value?: string;
+    onValueChange?: (text: string) => void;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    /** Native-textarea-style placeholder string. For rich placeholder content, pass children instead (children win when both are set). */
+    placeholder?: string;
+    /** Which Enter chord sends the message; the other inserts a soft break. Consider pairing "shift-enter" with enterKeyHint="enter". */
+    submitOn?: ComposerSubmitOn;
+    /** Logical-length cap: one per character, one per chip. IME input is capped at composition commit. */
+    maxLength?: number;
+    /** Native form validation via the hidden input — blocks empty submits. */
+    required?: boolean;
+    /** Mirrors the serialized text (chips as chip-markdown) into FormData. */
+    name?: string;
+    spellCheck?: boolean;
+    autoCapitalize?: string;
+    enterKeyHint?: HTMLAttributes<HTMLElement>["enterKeyHint"];
+    inputMode?: HTMLAttributes<HTMLElement>["inputMode"];
+    dir?: string;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    "aria-describedby"?: string;
+    /** Custom renderer for committed chips in the editor. Defaults to a label-only Chip. */
+    renderChip?: (chip: ChipData) => ReactNode;
+    /** Placeholder overlay content, shown while the editor is empty. */
+    children?: ReactNode;
+};
+export declare const ComposerTextarea: ({ value, onValueChange, className, render, style, disabled, autoFocus, placeholder, submitOn, maxLength, required, name, spellCheck, autoCapitalize, enterKeyHint, inputMode, dir, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, onFocus, onBlur, onKeyDown, onKeyUp, onPaste, onCopy, onCut, renderChip, children, ...elementProps }: ComposerTextareaProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/dist/composer/textarea.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRenderElement } from "../internal/render/useRenderElement.js";
+import { useComposer, useComposerContextStore } from "./store.js";
+import { useComposerEditor } from "./use-composer-editor.js";
+// Focusable-but-invisible (not display:none — Chrome refuses to submit forms
+// whose invalid control can't be focused for the validation bubble).
+const visuallyHiddenStyle = {
+    position: "absolute",
+    width: 1,
+    height: 1,
+    margin: -1,
+    padding: 0,
+    overflow: "hidden",
+    clipPath: "inset(50%)",
+    border: 0,
+};
+export const ComposerTextarea = ({ value, onValueChange, className, render, style, disabled = false, autoFocus = false, placeholder, submitOn, maxLength, required = false, name, spellCheck = false, autoCapitalize, enterKeyHint, inputMode, dir, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, 
+// Interactive callbacks route to the editable element (not the wrapper),
+// native-textarea style: they run before the engine, and preventDefault in
+// onKeyDown/onPaste/onCopy/onCut overrides the engine's handling.
+onFocus, onBlur, onKeyDown, onKeyUp, onPaste, onCopy, onCut, renderChip, children, ...elementProps }) => {
+    const store = useComposerContextStore();
+    // Combobox wiring: expanded state and the highlighted option's id flow from
+    // the store mirrors the command machinery already maintains.
+    const commandsActive = useComposer((composer) => composer.commands.active);
+    const activeOptionId = useComposer((composer) => composer.commands.activeOptionId);
+    const { attachRoot, editableProps, chipPortals, hasContent, isComposing, serializedText } = useComposerEditor({
+        disabled,
+        autoFocus,
+        submitOn,
+        maxLength,
+        value,
+        onValueChange,
+        renderChip,
+        onFocus,
+        onBlur,
+        onKeyDown,
+        onKeyUp,
+        onPaste,
+        onCopy,
+        onCut,
+    });
+    const editorContent = (
+    // Relative wrapper so the placeholder overlay sizes to the editable, not
+    // the outer slot (which may carry padding/scroll from the styled layer).
+    _jsxs("div", { style: { position: "relative" }, children: [_jsx("div", { ref: attachRoot, 
+                // contenteditable="true" is load-bearing: the store's ask-user event
+                // scoping and the container's click-passthrough both key off it.
+                contentEditable: !disabled, suppressContentEditableWarning: true, role: "textbox", 
+                // contenteditable is natively focusable; the explicit tabIndex keeps a
+                // disabled editor out of the tab order like a native disabled textarea.
+                tabIndex: disabled ? -1 : 0, "aria-multiline": "true", "aria-placeholder": placeholder, "aria-disabled": disabled || undefined, "aria-required": required || undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-autocomplete": "list", "aria-haspopup": "listbox", "aria-controls": commandsActive ? store.listboxId : undefined, "aria-activedescendant": activeOptionId ?? undefined, "data-composer-editor": "", spellCheck: spellCheck, autoCapitalize: autoCapitalize, enterKeyHint: enterKeyHint, inputMode: inputMode, dir: dir, style: { whiteSpace: "break-spaces", overflowWrap: "break-word" }, ...editableProps }), !hasContent && !isComposing && (children ?? placeholder) && (_jsx("div", { "data-composer-placeholder": "", style: { position: "absolute", inset: 0, pointerEvents: "none" }, "aria-hidden": "true", children: children ?? placeholder }))] }));
+    return useRenderElement("div", { className, render, style }, {
+        state: { disabled, filled: hasContent },
+        props: [
+            {
+                "data-composer-textarea": "",
+                children: (_jsxs(_Fragment, { children: [editorContent, chipPortals, name != null && (_jsx("input", { type: "text", readOnly: true, tabIndex: -1, "aria-hidden": "true", name: name, required: required, value: serializedText, onFocus: () => store.controller.focus(), style: visuallyHiddenStyle }))] })),
+            },
+            elementProps,
+        ],
+    });
+};

package/dist/composer/trigger-tracker.d.ts

@@ -0,0 +1,12 @@
+import { type ActiveTokenState, type RegisteredPrefix } from "./prefix-detection.js";
+import { type TextChange } from "./segments.js";
+export type TrackerUpdate = {
+    registered: RegisteredPrefix[];
+    /** toScanText(doc) — chips as " ". */
+    scanText: string;
+    caret: number;
+    /** The doc edit, or null for a selection-only update. */
+    change: TextChange | null;
+};
+export declare const closeActiveToken: (previous: ActiveTokenState) => ActiveTokenState;
+export declare const trackActiveToken: (previous: ActiveTokenState, update: TrackerUpdate) => ActiveTokenState;

package/dist/composer/trigger-tracker.js

@@ -0,0 +1,90 @@
+// Trigger tracker — sticky active-token state over the flat position model.
+// Pure: consumes the scan text (chips read as " ", so a token can never span
+// a chip and positions stay 1:1) plus an optional TextChange, and produces the
+// ActiveTokenState shape the store mirrors and the command list consumes.
+//
+// Where detectActivePrefix is a stateless scan of the caret's surroundings,
+// this layer carries state across edits: it maps the tracked range forward
+// through each change and remembers explicit dismissals.
+import { CLOSED_COMMAND_STATE, detectActivePrefix, } from "./prefix-detection.js";
+import { lineBoundsAt, mapPosition, mapPositionResult } from "./segments.js";
+// Escape / Dismiss / blur-close: close and remember the token's start so
+// re-entering it won't reopen the popup (only when something was open).
+export const closeActiveToken = (previous) => ({
+    ...CLOSED_COMMAND_STATE,
+    dismissedAt: previous.isOpen ? previous.triggerStartPosition : null,
+});
+export const trackActiveToken = (previous, update) => {
+    const { registered, scanText, caret, change } = update;
+    if (registered.length === 0)
+        return CLOSED_COMMAND_STATE;
+    // Track the dismissed marker across edits; drop it once its prefix is gone
+    // so retyping the trigger starts a fresh attempt.
+    let dismissedAt = previous.dismissedAt;
+    if (dismissedAt !== null && change !== null) {
+        const mapped = mapPositionResult(dismissedAt, change, -1);
+        dismissedAt = mapped.deleted ? null : mapped.position;
+        if (dismissedAt !== null) {
+            const markerPosition = dismissedAt;
+            const stillPrefixed = registered.some((entry) => markerPosition + entry.prefix.length <= scanText.length &&
+                scanText.slice(markerPosition, markerPosition + entry.prefix.length) === entry.prefix);
+            if (!stillPrefixed)
+                dismissedAt = null;
+        }
+    }
+    // Already-open token: track its range stickily through the change rather
+    // than re-scanning (a scan stops at whitespace and would drop typed
+    // spaces). The end grows on insert (+1 bias) and shrinks on delete; the
+    // query is read from the fixed range, so the filter holds steady — and
+    // accepts spaces — as the caret moves inside the token.
+    if (previous.isOpen && previous.trigger !== null) {
+        const trigger = previous.trigger;
+        let start = previous.triggerStartPosition;
+        let end = previous.triggerEndPosition;
+        if (change !== null) {
+            start = mapPosition(start, change, -1);
+            end = mapPosition(end, change, 1);
+        }
+        const prefixIntact = start + trigger.length <= scanText.length &&
+            scanText.slice(start, start + trigger.length) === trigger;
+        const tokenText = scanText.slice(start, end);
+        // Stay open while the prefix survives and the caret is still inside — but
+        // a token can never span a line break: the sticky end would otherwise
+        // absorb an inserted "\n" (soft break, pasted newline) and drag the badge
+        // across lines.
+        if (prefixIntact &&
+            end >= start + trigger.length &&
+            caret >= start &&
+            caret <= end &&
+            !tokenText.includes("\n")) {
+            return {
+                isOpen: true,
+                trigger,
+                query: tokenText.slice(trigger.length),
+                triggerStartPosition: start,
+                triggerEndPosition: end,
+                dismissedAt,
+            };
+        }
+        // Prefix deleted or caret left the token → fall through to a fresh scan.
+    }
+    const { lineStart, lineEnd } = lineBoundsAt(scanText, caret);
+    const detected = detectActivePrefix({
+        registered,
+        blockStart: lineStart,
+        blockEnd: lineEnd,
+        cursorPosition: caret,
+        textBeforeCursor: scanText.slice(lineStart, caret),
+        textAfterCursor: scanText.slice(caret, lineEnd),
+        fullDocText: scanText,
+    });
+    if (detected.isOpen) {
+        // Same token the user dismissed → stay closed. A different token → open
+        // and forget the prior dismissal.
+        if (dismissedAt !== null && detected.triggerStartPosition === dismissedAt) {
+            return { ...CLOSED_COMMAND_STATE, dismissedAt };
+        }
+        return { ...detected, dismissedAt: null };
+    }
+    return { ...CLOSED_COMMAND_STATE, dismissedAt };
+};