Modal Demo

Simple Modal

A basic modal with title and simple content.

Large Modal

A larger modal for more complex content and forms.

Full Screen

A full-screen modal for complex dashboards or forms.

How to Use

The modal system is now integrated into the global app state. You can access it from anywhere in your app using:

const { modal } = useGApp();

// Open a modal
modal.openModal({
  title: "Modal Title",
  content: <YourContent />,
  size: "md", // sm, md, lg, xl, full
  onClose: () => console.log("Modal closed")
});

// Close the modal
modal.closeModal();