ivue-material-plus/dist/unplugin-vue-components/es/components/ivue-notice/notice.mjs

A high quality UI components Library with Vue.js

import { createVNode, render } from 'vue';
import { transferIncrease, transferIndex } from '../../utils/transfer-queue.mjs';
import Notice from './index2.mjs';

const prefixKey = "ivue_notice_key_";
let name = 1;
const notifications = {
  "top-left": [],
  "top-right": [],
  "bottom-left": [],
  "bottom-right": []
};
const GAP_SIZE = 16;
let offset;
let defaultDuration;
const notificationsId = {};
function notice(type, options = {}) {
  const customizeId = options.id;
  const id = customizeId || `${prefixKey}${name}`;
  if (notificationsId[customizeId]) {
    return;
  }
  options.title = options.title || "";
  options.desc = options.desc || "";
  options.onClose = options.onClose || function() {
  };
  options.duration = defaultDuration || options.duration;
  if (!customizeId) {
    name++;
  }
  let verticalOffset = offset || options.offset || 0;
  const position = options.position || "top-right";
  notifications[position].forEach(({ vm: vm2 }) => {
    verticalOffset += (vm2.el.offsetHeight || 0) + GAP_SIZE;
  });
  verticalOffset += GAP_SIZE;
  const handleGetIndex = () => {
    transferIncrease();
    return transferIndex;
  };
  const tIndex = handleGetIndex();
  const userOnClose = options.onClose;
  options = {
    ...options,
    type,
    onClose: () => {
      close(id, position, userOnClose);
    },
    offset: verticalOffset,
    id,
    zIndex: 1010 + tIndex
  };
  const vm = createVNode(Notice, options);
  const container = document.createElement("div");
  if (customizeId) {
    notificationsId[customizeId] = true;
  }
  vm.props.onDestroy = () => {
    render(null, container);
  };
  notifications[position].push({ vm });
  render(vm, container);
  document.body.appendChild(container.firstElementChild);
  return {
    close
  };
}
const close = (id, position = "top-right", userOnClose) => {
  const orientedNotifications = notifications[position];
  const idx = orientedNotifications.findIndex(({ vm: vm2 }) => {
    if (!vm2) {
      return;
    }
    return vm2.component.props.id === id;
  });
  if (idx === -1) {
    return;
  }
  const { vm } = orientedNotifications[idx];
  if (!vm) {
    return;
  }
  userOnClose == null ? void 0 : userOnClose(vm);
  const removedHeight = vm.el.offsetHeight;
  const verticalPos = position.split("-")[0];
  if (notificationsId[id]) {
    orientedNotifications[idx].vm.component.proxy.data.visible = false;
    delete notificationsId[id];
  }
  notifications[position].splice(idx, 1);
  const len = notifications[position].length;
  if (len < 1) {
    return;
  }
  for (let i = idx; i < len; i++) {
    const { el, component } = orientedNotifications[i].vm;
    const pos = parseInt(el.style[verticalPos], 10) - removedHeight - GAP_SIZE;
    component.props.offset = pos;
  }
};
const closeAll = () => {
  for (const key in notifications) {
    const orientedNotifications = notifications[key];
    orientedNotifications.forEach(({ vm }) => {
      vm.component.proxy.data.visible = false;
    });
  }
};
const notification = {
  open(options) {
    return notice("normal", options);
  },
  info(options) {
    return notice("info", options);
  },
  warning(options) {
    return notice("warning", options);
  },
  success(options) {
    return notice("success", options);
  },
  error(options) {
    return notice("error", options);
  },
  config(options) {
    if (options.offset) {
      offset = options.offset;
    }
    if (options.duration > 0) {
      defaultDuration = options.duration;
    }
  },
  close,
  closeAll
};

export { notification as default };
//# sourceMappingURL=notice.mjs.map