142 lines
3.3 KiB
JavaScript
142 lines
3.3 KiB
JavaScript
import { ref, watch, getCurrentInstance, mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
|
|
import { extend, isObject, inBrowser } from "../utils/index.mjs";
|
|
import { mountComponent, usePopupState } from "../utils/mount-component.mjs";
|
|
import VanToast from "./Toast.mjs";
|
|
const defaultOptions = {
|
|
icon: "",
|
|
type: "text",
|
|
message: "",
|
|
className: "",
|
|
overlay: false,
|
|
onClose: void 0,
|
|
onOpened: void 0,
|
|
duration: 2e3,
|
|
teleport: "body",
|
|
iconSize: void 0,
|
|
iconPrefix: void 0,
|
|
position: "middle",
|
|
transition: "van-fade",
|
|
forbidClick: false,
|
|
loadingType: void 0,
|
|
overlayClass: "",
|
|
overlayStyle: void 0,
|
|
closeOnClick: false,
|
|
closeOnClickOverlay: false
|
|
};
|
|
let queue = [];
|
|
let allowMultiple = false;
|
|
let currentOptions = extend({}, defaultOptions);
|
|
const defaultOptionsMap = /* @__PURE__ */ new Map();
|
|
function parseOptions(message) {
|
|
if (isObject(message)) {
|
|
return message;
|
|
}
|
|
return {
|
|
message
|
|
};
|
|
}
|
|
function createInstance() {
|
|
const {
|
|
instance,
|
|
unmount
|
|
} = mountComponent({
|
|
setup() {
|
|
const message = ref("");
|
|
const {
|
|
open,
|
|
state,
|
|
close,
|
|
toggle
|
|
} = usePopupState();
|
|
const onClosed = () => {
|
|
if (allowMultiple) {
|
|
queue = queue.filter((item) => item !== instance);
|
|
unmount();
|
|
}
|
|
};
|
|
const render = () => {
|
|
const attrs = {
|
|
onClosed,
|
|
"onUpdate:show": toggle
|
|
};
|
|
return _createVNode(VanToast, _mergeProps(state, attrs), null);
|
|
};
|
|
watch(message, (val) => {
|
|
state.message = val;
|
|
});
|
|
getCurrentInstance().render = render;
|
|
return {
|
|
open,
|
|
close,
|
|
message
|
|
};
|
|
}
|
|
});
|
|
return instance;
|
|
}
|
|
function getInstance() {
|
|
if (!queue.length || allowMultiple) {
|
|
const instance = createInstance();
|
|
queue.push(instance);
|
|
}
|
|
return queue[queue.length - 1];
|
|
}
|
|
function showToast(options = {}) {
|
|
if (!inBrowser) {
|
|
return {};
|
|
}
|
|
const toast = getInstance();
|
|
const parsedOptions = parseOptions(options);
|
|
toast.open(extend({}, currentOptions, defaultOptionsMap.get(parsedOptions.type || currentOptions.type), parsedOptions));
|
|
return toast;
|
|
}
|
|
const createMethod = (type) => (options) => showToast(extend({
|
|
type
|
|
}, parseOptions(options)));
|
|
const showLoadingToast = createMethod("loading");
|
|
const showSuccessToast = createMethod("success");
|
|
const showFailToast = createMethod("fail");
|
|
const closeToast = (all) => {
|
|
var _a;
|
|
if (queue.length) {
|
|
if (all) {
|
|
queue.forEach((toast) => {
|
|
toast.close();
|
|
});
|
|
queue = [];
|
|
} else if (!allowMultiple) {
|
|
queue[0].close();
|
|
} else {
|
|
(_a = queue.shift()) == null ? void 0 : _a.close();
|
|
}
|
|
}
|
|
};
|
|
function setToastDefaultOptions(type, options) {
|
|
if (typeof type === "string") {
|
|
defaultOptionsMap.set(type, options);
|
|
} else {
|
|
extend(currentOptions, type);
|
|
}
|
|
}
|
|
const resetToastDefaultOptions = (type) => {
|
|
if (typeof type === "string") {
|
|
defaultOptionsMap.delete(type);
|
|
} else {
|
|
currentOptions = extend({}, defaultOptions);
|
|
defaultOptionsMap.clear();
|
|
}
|
|
};
|
|
const allowMultipleToast = (value = true) => {
|
|
allowMultiple = value;
|
|
};
|
|
export {
|
|
allowMultipleToast,
|
|
closeToast,
|
|
resetToastDefaultOptions,
|
|
setToastDefaultOptions,
|
|
showFailToast,
|
|
showLoadingToast,
|
|
showSuccessToast,
|
|
showToast
|
|
};
|