Skip to content
AJS InnovationsUI

Patterns

Compact form

42px fields and two-column layouts for quick-create dialogs.

Interactive local example · fictional data

The Code tab contains this preview’s complete source, including sample data and interaction state. Load the package stylesheet and Switzer font as described in the installation guide. Additional layout utilities require Tailwind CSS in your application.

API reference

PropTypeDefault
CompactInput propsNative input props + ref
classNamestring

Primitives also accept their underlying HTML or Radix props. Full types are included with the package.

Behavior & accessibility

  • Fields are 42px high, measured separately from the 50px member controls.
  • The example uses native form validation and local state. It never submits to a service.

Reference

Admin Quick Create Member dialog