A text field is an input field that merchants can type into.
optional = ?
||A unique identifier for the field. When no
||An identifier for the field that is unique within the nearest containing
||Content to use as the field label. This value is also used as the placeholder when the field is empty.|
||Current value for the field. If omitted, the field will be empty. You should update this value in response to the
||The content type a buyer will enter into the field. This type is used to provide semantic value to the field and, where possible, will provide the buyer with a better editing experience for the content type.
Note that the type property does not change the way the text field’s value will be provided in
||Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the
||An error label to present with the field.|
||Whether the field supports multiple lines of input.|
||A hint as to the intended content of the field.
When set to
When set to
Alternatively, you can provide an
||Additional hint text to display for the field. The tooltip is activated by an icon pinned to the end of the field.|
||Callback when input is focused.|
||Callback when focus is removed.|
||Callback when the buyer has finished editing a field. Unlike
This state management model is important given how UI Extensions are rendered. UI extension components run on a separate thread from the UI, so they can’t respond to input synchronously. A pattern popularized by controlled React components is to have the component be the source of truth for the input
It can still sometimes be useful to be notified when the user makes any input in the field. If you need this capability, you can use the
This callback is called with the current value of the field. If the value of a field is the same as the current
||Callback when the user makes any changes in the field. As noted in the documentation for
This callback is called with the current value of the field.
||A label to indicate what information the tooltip will provide. Currently, this label is only used for assistive technologies.|
||The content to display within the tooltip.|
AutocompleteAnchor link to section titled "Autocomplete"
A descriptor for selecting the data a field would like to receive during autocomplete. This attribute is modeled off of a limited set of the autocomplete values supported in browsers.
||The contact information “group” the autocomplete data should be sourced from.|
||The type of data that should be inserted into a field supporting autocomplete.|