Function: modal()

Call Signature

function modal(content: ModalContent): ContainerElement;

Defined in: src/UI/blocks/modal.tsx:57

Modal component serving as the main container for UI elements. Typically used as root container with showUI.

Parameters

Parameter	Type	Description
content	ModalContent	Content to display when first parameter is options object

Returns

ContainerElement

Examples

Basic usage with headerBar and group

modal([
  headerBar({
    title: 'Welcome to the Matterway SDK',
    description: 'This is a sample welcome message.',
  }),
  group([
    inputField({
      name: 'firstName',
      label: 'First name',
      defaultValue: 'Jane',
    }),
  ]),
]);

With options object using overlay

modal(
  {overlay: true},
  [
    headerBar({
      title: 'Welcome to the Matterway SDK',
      description: 'This is a sample welcome message.',
    }),
    group([
      inputField({
        name: 'email',
        label: 'Email',
        type: 'email',
      }),
    ]),
  ]
);

Call Signature

function modal(options: ModalOptions, content: ModalContent): ContainerElement;

Defined in: src/UI/blocks/modal.tsx:58

Modal component serving as the main container for UI elements. Typically used as root container with showUI.

Parameters

Parameter	Type	Description
options	ModalOptions	-
content	ModalContent	Content to display when first parameter is options object

Returns

ContainerElement

Examples

Basic usage with headerBar and group

modal([
  headerBar({
    title: 'Welcome to the Matterway SDK',
    description: 'This is a sample welcome message.',
  }),
  group([
    inputField({
      name: 'firstName',
      label: 'First name',
      defaultValue: 'Jane',
    }),
  ]),
]);

With options object using overlay

modal(
  {overlay: true},
  [
    headerBar({
      title: 'Welcome to the Matterway SDK',
      description: 'This is a sample welcome message.',
    }),
    group([
      inputField({
        name: 'email',
        label: 'Email',
        type: 'email',
      }),
    ]),
  ]
);