Dialog

The Dialog component is a window overlaid on either the primary window or another dialog window, It can be opened anywhere by calling context.dialog.open() with an object containing the necessary parameters.

Renamed from Modal in Gravity 12.

Preview

Usage

import { useContext } from 'react';
import { ViewContext, Button } from 'components/lib';

function MyComponent({ ...props }) {

  const viewContext = useContext(ViewContext);

  function openDialog(){
    viewContext.dialog.open({
      title: 'Add User',
      form: MyForm,
      buttonText: 'Send Invite',
      url: '/api/user/invite',
      method: 'POST'
    });
  }

  return (
    <div>
      <Button action={ openDialog } />
    <div/>
  );
}

Params

Notes

  • The Dialog component uses DialogPrimitive components from @radix-ui/react-dialog.

  • The onClose prop is a callback function that gets executed when the dialog is closed.

  • The open prop can be used to control the open state of the dialog.

  • The title and description props provide the title and description for the dialog.

  • For more details, refer to the Shadcn Dialog documentation.

Last updated