/** * Input primitive for text input handling. * Uses a monadic onKeypress pattern for full control over key handling. * * Inputs auto-register with the global focus manager. * Only one input can be focused at a time across the app. */ import { type Focusable, KEYS } from "./focus.js"; export { KEYS }; /** * The state of an input field. */ export interface InputState { value: string; cursorPos: number; } /** * Keypress handler signature. * Return new state to consume the key, or null to let it bubble up. */ export type KeypressHandler = (key: string, state: InputState) => InputState | null; export interface InputOptions { /** Initial value */ initialValue?: string; /** Maximum character length */ maxLength?: number; /** Mask character for passwords (e.g., "*") */ mask?: string; /** Placeholder text shown when input is empty */ placeholder?: string; /** * Custom keypress handler. * Return new InputState to consume the key, or null to let it bubble. * Use defaultInputHandler for standard text editing behavior. */ onKeypress?: KeypressHandler; } export interface Input extends Focusable { value: () => string; cursorPos: () => number; focused: () => boolean; handleKey: (key: string) => boolean; focus: () => void; blur: () => void; setValue: (value: string) => void; setCursorPos: (pos: number) => void; clear: () => void; dispose: () => void; displayValue: () => string; showingPlaceholder: () => boolean; getState: () => InputState; } /** * Handler for printable characters (insert text at cursor). */ declare function handlePrintable(key: string, state: InputState): InputState | null; /** * Handler for navigation keys (arrows, home/end, word navigation). */ declare function handleNavigation(key: string, state: InputState): InputState | null; /** * Handler for deletion keys (backspace, delete, word delete). */ declare function handleDeletion(key: string, state: InputState): InputState | null; /** * Handler for newline insertion (Enter creates newline). * Use this for multiline editors. Not included in defaultInputHandler. */ declare function handleNewline(key: string, state: InputState): InputState | null; /** * Handler for shift+enter newline only (for inputs where Enter submits). * This is what defaultInputHandler uses. */ declare function handleShiftEnterNewline(key: string, state: InputState): InputState | null; /** * Composable input handlers. * Use these with composeHandlers() to build custom input behavior. * * @example * ```ts * // Multiline editor with Enter creating newlines * const editor = createInput({ * onKeypress: composeHandlers( * inputHandlers.navigation, * inputHandlers.deletion, * inputHandlers.newline, // Enter creates newline! * inputHandlers.printable, * ), * }); * ``` */ export declare const inputHandlers: { /** Insert printable characters at cursor */ printable: typeof handlePrintable; /** Arrow keys, home/end, word navigation (Alt+arrows), multiline (Up/Down) */ navigation: typeof handleNavigation; /** Backspace, Delete, Ctrl+W (word), Ctrl+U (to start of line) */ deletion: typeof handleDeletion; /** Enter creates newline (for multiline editors) */ newline: typeof handleNewline; /** Shift+Enter creates newline (for inputs where Enter submits) */ shiftEnterNewline: typeof handleShiftEnterNewline; }; /** * Compose multiple input handlers into one. * Handlers are tried in order until one returns non-null. * * @example * ```ts * const myHandler = composeHandlers( * inputHandlers.navigation, * inputHandlers.deletion, * inputHandlers.newline, * inputHandlers.printable, * ); * ``` */ export declare function composeHandlers(...handlers: KeypressHandler[]): KeypressHandler; /** * Default input handler implementing standard text editing behavior. * Can be used standalone or composed with custom handlers. * * Supports: * - Basic navigation: Left, Right, Home, End * - Word navigation: Alt+Left, Alt+Right * - Multiline navigation: Up, Down (when text contains newlines) * - Deletion: Backspace, Delete, Ctrl+W (word), Ctrl+U (to start of line) * - Newline: Shift+Enter inserts newline (Enter is typically for submit) * * @example * ```ts * const input = createInput({ * onKeypress: (key, state) => * myCustomHandler(key, state) ?? defaultInputHandler(key, state), * }); * ``` */ export declare const defaultInputHandler: KeypressHandler; /** * Create an input primitive with reactive state. * * @example * ```tsx * // Basic usage with defaults * const input = createInput(); * * // Custom handler * const input = createInput({ * onKeypress: (key, state) => { * if (key === KEYS.ENTER) { submit(state.value); return { value: "", cursorPos: 0 }; } * if (key === KEYS.ESCAPE) return null; // bubble * if (/^[0-9]$/.test(key) && state.value === "") return null; // let numbers be shortcuts * return defaultInputHandler(key, state); * }, * }); * * // Multiline editor with Enter creating newlines * const editor = createInput({ * onKeypress: composeHandlers( * inputHandlers.navigation, * inputHandlers.deletion, * inputHandlers.newline, * inputHandlers.printable, * ), * }); * ``` */ export declare function createInput(options?: InputOptions): Input; //# sourceMappingURL=input.d.ts.map