Text fields

native <input> / <textarea> with a <label for> (React Aria also sets aria-labelledby), aria-describedby → the supporting (or error) text and the counter, aria-invalid="true" for errors (the web's form of Compose's error() semantics; the platform announces the invalid state, so Compose's default "Invalid input" string is not injected), aria-required="true" (React Aria's default validation behavior) with the "*" in the label's accessible name (m3.material.io). While invalid the error text replaces the supporting text (Compose's TextFieldWithErrorState) and has the "alert" role (m3.material.io). Read-only fields stay focusable. Focus shows as the 2dp primary indicator / outline and primary label (Compose); trailing icon buttons keep their own focus ring.

FilledTextFieldTokens.kt / OutlinedTextFieldTokens.kt@19991f2c plus the TextField.kt / OutlinedTextField.kt / TextFieldDefaults / OutlinedTextFieldDefaults / internal/TextFieldImpl.kt values Compose renders (components/text-field-defaults.css; SOURCES register #43). Container: min 280 × 56dp (MinWidth × MinHeight; FilledTextFieldTokens has no height), filled ContainerShape (extra small, top corners) with a bottom indicator line 1dp, 2dp while focused and enabled (Unfocused/FocusedIndicatorThickness, drawn over the content, clipped to the shape; the token DB's 3dp focus thickness is not rendered), outlined extra small with a 1dp / 2dp outline drawn inside the bounds. Paddings (contentPaddingWithLabel only for an Inside label): filled with a label 16dp start / end and TextFieldWithLabelVerticalPadding 8dp top / bottom, the input under the 16dp minimized label line; otherwise 16dp all round (TextFieldPadding). Label (DecoratedLabel): lerp(bodyLarge, bodySmall, progress); filled from the vertical centre (top padding + half the minimized line height, 16dp) to the 8dp top padding, at the text start; outlined from 16dp (after the leading icon) to centred on the top outline (−height / 2) at the 16dp start padding, with half the minimized line height (8dp, topPaddingForLabelCutout) of space above the field and a notch of label width × progress + 2 × 4dp (OutlinedTextFieldInnerPadding) from 12dp, none at progress ≤ 0 (outlineCutout). Icons (24dp) in 48dp boxes, the text 16 − 12 = 4dp after them (textFieldHorizontalIconPadding). Prefix / suffix 2dp from the text (PrefixSuffixTextPadding), body large, shown while the label is minimized; placeholder body large, only while the label is minimized or absent. Supporting text body small, 4dp below (SupportingTopPadding), 16dp in, min 16dp line. Label Above (owner decision M8 #25): TextFieldLabelPosition.Above, always minimized, 4dp in and 4dp above the container, with the no-label paddings. Colors (defaultTextFieldColors / defaultOutlinedTextFieldColors; disabled, then error, then focused, then unfocused): focused indicator / outline, label and caret primary; error (aria-invalid="true") indicator, label, supporting text, trailing icon and caret error, text on-surface, leading icon on-surface-variant (Compose uses the Error*, not the ErrorFocus* tokens); disabled translucent copies (on-surface 0.38, outlined outline on-surface 0.12), and the filled disabled container keeps ContainerColor (not the token file's on-surface 4 %). Hover changes nothing (TextFieldColors has no hover; owner decision M8 #3) and there is no state layer (Compose draws none). Selection: primary at 0.4 (rememberTextSelectionColors). Not in Compose, from m3.material.io (owner rule): the character counter ("n/max", read as "Character count, n/max") at the end of the supporting line, 16dp after the supporting text; the required "*" after the label. The expressive tonal / rounded variant (tonalColors(), roundedShape) is out of scope (owner decision M8 #24).