Skip to content

Demos

Required

Code Editor
<Form.Handler>
  <Flex.Stack>
    <Field.String label="Not required" />

    <Field.Provider required>
      <Field.String label="Required A" />
      <Field.Number label="Required B" />
    </Field.Provider>

    <Form.ButtonRow>
      <Form.SubmitButton />
    </Form.ButtonRow>
  </Flex.Stack>
</Form.Handler>

Disabled

Code Editor
<Form.Handler>
  <Flex.Stack>
    <Field.String label="Not disabled" />

    <Field.Provider disabled>
      <Flex.Stack>
        <Field.String label="Disabled" />
        <Form.ButtonRow>
          <Form.SubmitButton />
        </Form.ButtonRow>
      </Flex.Stack>
    </Field.Provider>
  </Flex.Stack>
</Form.Handler>

Inverted

Code Editor
<Form.Handler disabled>
  <Flex.Stack>
    <Field.String label="Disabled" />

    <Field.Provider disabled={false}>
      <Flex.Stack>
        <Field.String label="Not disabled" />
        <Form.ButtonRow>
          <Form.SubmitButton />
        </Form.ButtonRow>
      </Flex.Stack>
    </Field.Provider>
  </Flex.Stack>
</Form.Handler>