@inkline/inkline/composables/modals/alert.mjs

Inkline is the intuitive UI Components library that gives you a developer-friendly foundation for building high-quality, accessible, and customizable Vue.js 3 Design Systems.

import { IButton } from "@inkline/inkline/components/IButton";
import { translate } from "@inkline/inkline/i18n";
import { uid } from "@grozav/utils";
import { h } from "vue";
import { useModalBuilder } from "@inkline/inkline/composables/modals/builder";
export function useAlert() {
  const builder = useModalBuilder();
  return (options) => new Promise((resolve) => {
    const id = uid("alert");
    builder.show({
      id,
      type: "alert",
      onClose: () => resolve(),
      header: options.title,
      body: options.message,
      footer: options.footer || h(
        IButton,
        {
          onClick: () => {
            builder.hide({ id });
          },
          color: "primary",
          ...options.confirmButtonProps
        },
        () => options.confirmButtonText ?? translate("modals.confirm")
      ),
      ...options
    });
  });
}