As of January 3rd, 2023 the ACCESS NYC Pattern library package is deprecated in favor of the NYC Opportunity Standard which contains updated user interface elements and usability guidance.
Inputs
Source:
src/elements/inputs/inputs
The Input Element follows the styling and usage guidelines of the U.S. Web Design System’s Form Control.
<div> <input type="text" /> </div>
<div class="error"> <input aria-invalid="true" type="text" /> </div>
<div class="screen-tablet:input-w-400px"> <input type="text" /> </div>
<div> <input id="person-0-age" max="200" maxlength="3" min="0" required="true" step="1" type="number" /> </div>
<div class="input-currency-usd"> <input type="text" /> </div>
<div class="error input-currency-usd"> <input aria-invalid="true" type="text" /> </div>
<div class="input-phone-us"> <input type="text" /> </div>
<div class="error input-phone-us"> <input aria-invalid="true" type="text" /> </div>
<div class="input-search">
<input id="search-field" name="s" placeholder="Search" type="text" value="" />
<button class="btn-link input-search__submit" type="submit">
<svg class="icon icon-ui-search">
<use xlink:href="#icon-ui-search"></use>
</svg>
</button>
</div>