Use component ModalDialog and method openModal().
@import url("@uxf/ui/alert-bubble/alert-bubble.css");
@import url("@uxf/ui/message/message.css");
@import url("@uxf/ui/dialog/dialog.css");
@import url("@uxf/ui/button/button.css");
// _app.tsx
import { AppProps } from "next/app";
import { getMessageRef, Message } from "@uxf/ui/message";
function App(props: AppProps) {
return (
<UiContextProvider value={...}>
{props.children}
<Message ref={getMessageRef()}/>
</UiContextProvider>
);
}
import { MessageService } from "@uxf/ui/message";
MessageService.openConfirm({ ... });
MessageService.openAlert({ ... });