Function: SearchFieldControl()

SearchFieldControl(props): Element

Defined in: composites/SearchField/SearchField.tsx:158

The control slot — the search box.

A split control, the shape the anatomy already defines for a field whose value shares its box with adornments (ComboBox, NumberField): the frame paints and hosts the glyph and the clear button, the <input> is borderless and carries the value. It replaces a hand-rolled copy of the field chrome — this file used to declare its own border, radius, motion, cascade and focus ring, which is exactly the per-component drift the anatomy exists to prevent.

data-part="control" stays on the <input> and the wrapper becomes frame. Both were named control before (F-026), so querySelector returned the wrapper — which reported padding: 0 and border-radius: 0, because the chrome was on the input — and a measurement read it as a defect until the DOM was inspected by hand.

The adornments are laid out in flow rather than absolutely positioned. The old version reserved room for both with a calc(icon.md + inset.control.md * 2) inline padding on the input — 48px each side, measured — and then floated the glyph and button over it. That double-declares the same space: the frame is a flex row, so the glyph and the trigger occupy it by being in it, and the value gets what is left. It also meant the trailing 48px stayed reserved while the clear button was hidden.

Parameters

Parameter	Type
props	SearchFieldControlProps

Returns

Element