Skip to content

Form Layout

@astryxdesign/core v0.7.1 · FormLayout

Form Layout Props ​

NameTypeDefaultDescription
direction'vertical' | 'horizontal' | 'horizontal-labels''vertical'How the fields are arranged. horizontal uses equal columns. horizontal-labels puts the label on the left and stacks below 480px.
defaultOptionality'optional' | 'required'-Default for fields that do not set isOptional or isRequired. It changes the indicator and aria-required. It does not set the native required attribute. When a field sets both, optional wins.

Slots ​

NameDescription
defaultThe fields. A nested FormLayout keeps its own direction.

Native attributes ​

FormLayout renders a <div>, not a <form>.

The following go to that element:

  • HTML attributes.
  • aria-* attributes.
  • data-* attributes.
  • class.
  • style.

class is merged. The root sets data-direction.