ReferenceComponentsForms and controls
EditableTableCell
EditableTableCell component API, behavior, and executable example.
Loading executable example…
API and events
Connect semantic terminal controls to typed form state, validation, descriptions, errors, hints, and submission.
export const EditableTableCell: typeof TextInput;Props, functions, and events
| Member | Type | Required | Description | Related types |
|---|---|---|---|---|
placeholder | string | undefined | No | The placeholder member uses the string | undefined contract. | — |
autoFocus | boolean | undefined | No | The autoFocus member uses the boolean | undefined contract. | — |
variant | string | undefined | No | The variant member uses the string | undefined contract. | — |
size | "sm" | "md" | "lg" | undefined | No | The size member uses the "sm" | "md" | "lg" | undefined contract. | — |
unstyled | boolean | undefined | No | The unstyled member uses the boolean | undefined contract. | — |
className | string | undefined | No | The className member uses the string | undefined contract. | — |
layout | Partial<Omit<LayoutNodeInput, "id" | "children" | "semantics">> | undefined | No | The layout member uses the Partial<Omit<LayoutNodeInput, "id" | "children" | "semantics">> | undefined contract. | — |
id | string | undefined | No | The id member uses the string | undefined contract. | — |
testId | string | undefined | No | The testId member uses the string | undefined contract. | — |
role | SemanticRole | undefined | No | The role member uses the SemanticRole | undefined contract. | SemanticRole |
label | string | undefined | No | The label member uses the string | undefined contract. | — |
description | string | undefined | No | The description member uses the string | undefined contract. | — |
disabled | boolean | undefined | No | The disabled member uses the boolean | undefined contract. | — |
readOnly | boolean | undefined | No | The readOnly member uses the boolean | undefined contract. | — |
selected | boolean | undefined | No | The selected member uses the boolean | undefined contract. | — |
checked | boolean | undefined | No | The checked member uses the boolean | undefined contract. | — |
expanded | boolean | undefined | No | The expanded member uses the boolean | undefined contract. | — |
valueText | string | undefined | No | The valueText member uses the string | undefined contract. | — |
mask | string | undefined | No | The mask member uses the string | undefined contract. | — |
session | EditorSession | undefined | No | The session member uses the EditorSession | undefined contract. | EditorSession |
editorProvider | EditorProvider | undefined | No | The editorProvider member uses the EditorProvider | undefined contract. | EditorProvider |
clipboard | EditorClipboardAdapter | undefined | No | The clipboard member uses the EditorClipboardAdapter | undefined contract. | — |
documentType | string | undefined | No | The documentType member uses the string | undefined contract. | — |
field | AdaptedTanStackField<string> | undefined | No | The field member uses the AdaptedTanStackField<string> | undefined contract. | AdaptedTanStackField |
value | string | undefined | No | The value member uses the string | undefined contract. | — |
defaultValue | string | undefined | No | The defaultValue member uses the string | undefined contract. | — |
onValueChange | ((value: string) => void | Promise<void>) | undefined | No | The onValueChange member uses the ((value: string) => void | Promise<void>) | undefined contract. | — |
onSubmit | ((value: string) => void | Promise<void>) | undefined | No | The onSubmit member uses the ((value: string) => void | Promise<void>) | undefined contract. | — |
onBlur | (() => void | Promise<void>) | undefined | No | The onBlur member uses the (() => void | Promise<void>) | undefined contract. | — |
validators | FieldValidators<string> | undefined | No | The validators member uses the FieldValidators<string> | undefined contract. | FieldValidators |
focusOrder | number | undefined | No | The focusOrder member uses the number | undefined contract. | — |
maxLength | number | undefined | No | The maxLength member uses the number | undefined contract. | — |
onArrowUp | (() => void | Promise<void>) | undefined | No | The onArrowUp member uses the (() => void | Promise<void>) | undefined contract. | — |
onArrowDown | (() => void | Promise<void>) | undefined | No | The onArrowDown member uses the (() => void | Promise<void>) | undefined contract. | — |
registerWithForm | boolean | undefined | No | The registerWithForm member uses the boolean | undefined contract. | — |
Controls expose onValueChange, onSubmit, focus, selection, and validation callbacks.
Callback props run after the documented input is accepted. Callbacks are not cancellable unless their return type or description states otherwise.
Interaction and capabilities
Text controls edit directly; choice controls use arrows and Space or Enter; Form coordinates validation and submission.
The published manifest records keyboard, focus, pointer, theme, terminal, semantic, event, and dependency requirements.
Complete import
import { EditableTableCell } from "@/components/tuil/forms/controls";