Message !!! DEPRECATED !!!

Use component ModalDialog and method openModal().

CSS dependencies

@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");

Implementation

// _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({ ... });
Default
Open in new tab