Skip to content

Field

The Field component is the main building block for most of Stash's form components, including Input, Select, and Textarea. It includes several props (ex: label, hint-text), styles, and functionlity to ensure all of our form components are consistent.

WARNING

Designers are not the intended audience for the Field component. Field is used by engineers to build higher-order form components like Input and Select.

To see example usage, check out the source code for existing Stash components that use Field, such as Input, RadioGroup, and FilterSelect.

Fieldset

The default top-level HTML element rendered by <Field> is a <div>; using the fieldset prop will change this element to fieldset, which is useful for fields that contain multiple controls.

Sign me up?
template
<Field fieldset label="Sign me up?">
  <Radio id="yes" v-model="fieldset" name="fieldset" label="Yes" value="yes" />
  <Radio id="no" v-model="fieldset" name="fieldset" label="No" value="no" />
</Field>

API

See the documentation below for a complete reference to all the props and classes available to the components mentioned here.