vuejs-confirm-dialog/dist/vuejs-confirm-dialog.es.js

Convert your dialogs to async functions and use them all over your project!

import { reactive, markRaw, computed, ref, watch, defineComponent, h } from "vue";
const DialogsStore = reactive([]);
const useDialogWrapper = function() {
  const addDialog = function(dialogData) {
    DialogsStore.push(markRaw(dialogData));
  };
  const removeDialog = function(id) {
    const index = DialogsStore.findIndex((dialog) => dialog.id == id);
    DialogsStore.splice(index, 1);
  };
  const removeAll = function() {
    DialogsStore.splice(0);
  };
  return {
    DialogsStore,
    addDialog,
    removeDialog,
    removeAll
  };
};
function createEventHook() {
  const fns = [];
  const off = (fn) => {
    const index = fns.indexOf(fn);
    if (index !== -1)
      fns.splice(index, 1);
  };
  const on = (fn) => {
    fns.push(fn);
    return {
      off: () => off(fn)
    };
  };
  const trigger = (param) => {
    fns.forEach((fn) => fn(param));
  };
  return {
    on,
    off,
    trigger
  };
}
const isClient = typeof window !== "undefined";
const noop = () => {
};
isClient ? window : void 0;
isClient ? window.document : void 0;
isClient ? window.navigator : void 0;
isClient ? window.location : void 0;
const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
const globalKey = "__vueuse_ssr_handlers__";
_global[globalKey] = _global[globalKey] || {};
_global[globalKey];
function useConfirmDialog(revealed = ref(false)) {
  const confirmHook = createEventHook();
  const cancelHook = createEventHook();
  const revealHook = createEventHook();
  let _resolve = noop;
  const reveal = (data) => {
    revealHook.trigger(data);
    revealed.value = true;
    return new Promise((resolve) => {
      _resolve = resolve;
    });
  };
  const confirm = (data) => {
    revealed.value = false;
    confirmHook.trigger(data);
    _resolve({ data, isCanceled: false });
  };
  const cancel = (data) => {
    revealed.value = false;
    cancelHook.trigger(data);
    _resolve({ data, isCanceled: true });
  };
  return {
    isRevealed: computed(() => revealed.value),
    reveal,
    confirm,
    cancel,
    onReveal: revealHook.on,
    onConfirm: confirmHook.on,
    onCancel: cancelHook.on
  };
}
var _a, _b;
isClient && (window == null ? void 0 : window.navigator) && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.platform) && /iP(ad|hone|od)/.test((_b = window == null ? void 0 : window.navigator) == null ? void 0 : _b.platform);
var __defProp$3 = Object.defineProperty;
var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues$3 = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp$3.call(b, prop))
      __defNormalProp$3(a, prop, b[prop]);
  if (__getOwnPropSymbols$3)
    for (var prop of __getOwnPropSymbols$3(b)) {
      if (__propIsEnum$3.call(b, prop))
        __defNormalProp$3(a, prop, b[prop]);
    }
  return a;
};
const initialRect = {
  top: 0,
  left: 0,
  bottom: 0,
  right: 0,
  height: 0,
  width: 0
};
__spreadValues$3({
  text: ""
}, initialRect);
let lastDialogId = 0;
function getDialogId() {
  return ++lastDialogId;
}
function createConfirmDialog(dialog, initialAttrs = {}, options = { chore: false, keepInitial: false }) {
  const setAttrs = (attrs) => {
    if (!attrs) {
      propsRef.value = {};
      return;
    }
    for (const prop in attrs) {
      propsRef.value[prop] = attrs[prop];
    }
  };
  const propsRef = ref({});
  setAttrs(initialAttrs);
  const revealed = ref(false);
  const close = () => {
    revealed.value = false;
    removeDialog(DIALOG_ID);
  };
  const { addDialog, removeDialog, removeAll, DialogsStore: DialogsStore2 } = useDialogWrapper();
  const {
    reveal,
    isRevealed,
    onConfirm,
    onReveal,
    onCancel,
    confirm,
    cancel
  } = useConfirmDialog();
  const DIALOG_ID = getDialogId();
  onReveal((props) => {
    revealed.value = true;
    if (props)
      setAttrs(props);
    addDialog({
      id: DIALOG_ID,
      dialog,
      isRevealed,
      confirm,
      cancel,
      props: propsRef.value,
      close,
      revealed
    });
  });
  watch(
    isRevealed,
    (value) => {
      if (!value) {
        if (options.chore) {
          setAttrs(options.keepInitial ? initialAttrs : null);
        }
        removeDialog(DIALOG_ID);
      }
    }
  );
  const closeAll = () => {
    DialogsStore2.forEach((dialog2) => {
      dialog2.revealed.value = false;
    });
    removeAll();
  };
  return {
    close,
    closeAll,
    reveal,
    isRevealed: computed(() => isRevealed.value && revealed.value),
    onConfirm,
    onCancel
  };
}
var DialogsWrapper = defineComponent({
  name: "DialogsWrapper",
  setup() {
    const { DialogsStore: DialogsStore2 } = useDialogWrapper();
    return () => DialogsStore2.map((dialogData) => {
      return h(dialogData.dialog, {
        is: dialogData.dialog,
        onConfirm: dialogData.confirm,
        onCancel: dialogData.cancel,
        key: dialogData.id,
        ...dialogData.props
      });
    });
  }
});
function install(app) {
  app.component("DialogsWrapper", DialogsWrapper);
}
export { DialogsWrapper, createConfirmDialog, install };