Skip to content

Function: vertical()

Call Signature

ts
function vertical(content: VerticalContent): Element;

Defined in: src/UI/blocks/vertical.tsx:63

Vertical layout component arranging content in a column.

Parameters

ParameterTypeDescription
contentVerticalContentContent to display when first parameter is options object

Returns

Element

Examples

Usage with options and content

vertical(
  {
    gap: 8,
    align: 'center',
    justify: 'space-between',
    padding: 16,
  },
  [
    inputField({
      name: 'email',
      label: 'Email',
      type: 'email',
    }),
    inputField({
      name: 'phone',
      label: 'Phone',
      type: 'tel',
    }),
  ]
);

Basic usage with content

vertical([
  inputField({
    name: 'firstName',
    label: 'First name',
    defaultValue: 'Jane',
  }),
  inputField({
    name: 'lastName',
    label: 'Last name',
    defaultValue: 'Doe',
  }),
]);

Call Signature

ts
function vertical(options: VerticalOptions, content: VerticalContent): Element;

Defined in: src/UI/blocks/vertical.tsx:64

Vertical layout component arranging content in a column.

Parameters

ParameterTypeDescription
optionsVerticalOptions-
contentVerticalContentContent to display when first parameter is options object

Returns

Element

Examples

Usage with options and content

vertical(
  {
    gap: 8,
    align: 'center',
    justify: 'space-between',
    padding: 16,
  },
  [
    inputField({
      name: 'email',
      label: 'Email',
      type: 'email',
    }),
    inputField({
      name: 'phone',
      label: 'Phone',
      type: 'tel',
    }),
  ]
);

Basic usage with content

vertical([
  inputField({
    name: 'firstName',
    label: 'First name',
    defaultValue: 'Jane',
  }),
  inputField({
    name: 'lastName',
    label: 'Last name',
    defaultValue: 'Doe',
  }),
]);

Matterway Assistant SDK Documentation