@nutui/nutui 3.1.22-beta.0 → 3.1.22-beta.3

package/dist/packages/_es/Toast.js

@@ -5,331 +5,92 @@ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
+var __spreadValues = (a2, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp.call(b2, prop))
+      __defNormalProp(a2, prop, b2[prop]);
   if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp(a2, prop, b2[prop]);
     }
-  return a;
+  return a2;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __spreadProps = (a2, b2) => __defProps(a2, __getOwnPropDescs(b2));
 /*!
-* @nutui/nutui v3.1.22-beta.0 Tue May 31 2022 21:47:10 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.3 Wed Jun 15 2022 20:12:30 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { reactive, onMounted, watch, computed, resolveComponent, openBlock, createBlock, Transition, withCtx, withDirectives, createElementVNode, normalizeClass, normalizeStyle, createElementBlock, createVNode, createCommentVNode, toDisplayString, vShow, render } from "vue";
-import { c as createComponent } from "./component.js";
-import _sfc_main$1 from "./Icon.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { reactive as t, onMounted as e, watch as o, computed as n, resolveComponent as i, openBlock as l, createBlock as s, Transition as a, withCtx as c, withDirectives as r, createElementVNode as u, normalizeClass as d, normalizeStyle as m, createElementBlock as p, createVNode as f, createCommentVNode as g, toDisplayString as y, vShow as v, render as C } from "vue";
+import { c as b } from "./component.js";
+import x from "./Icon.js";
+import { _ as S } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
 import "./pxCheck.js";
-const { create } = createComponent("toast");
-const _sfc_main = create({
-  components: {
-    [_sfc_main$1.name]: _sfc_main$1
-  },
-  props: {
-    id: String,
-    msg: String,
-    duration: {
-      type: Number,
-      default: 2e3
-    },
-    center: {
-      type: Boolean,
-      default: true
-    },
-    type: String,
-    customClass: String,
-    bottom: {
-      type: String,
-      default: "30px"
-    },
-    size: {
-      type: [String, Number],
-      default: "base"
-    },
-    iconSize: {
-      type: String,
-      default: "20"
-    },
-    icon: String,
-    textAlignCenter: {
-      type: Boolean,
-      default: true
-    },
-    loadingRotate: {
-      type: Boolean,
-      default: true
-    },
-    bgColor: {
-      type: String,
-      default: ""
-    },
-    onClose: Function,
-    unmount: Function,
-    cover: {
-      type: Boolean,
-      default: false
-    },
-    coverColor: {
-      type: String,
-      default: ""
-    },
-    title: {
-      type: String,
-      default: ""
-    },
-    closeOnClickOverlay: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["close"],
-  setup(props, { emit }) {
-    let timer;
-    const state = reactive({
-      mounted: false
-    });
-    onMounted(() => {
-      state.mounted = true;
-    });
-    const clearTimer = () => {
-      if (timer) {
-        clearTimeout(timer);
-        timer = null;
-      }
-    };
-    const hide = () => {
-      state.mounted = false;
-    };
-    const show = () => {
-      clearTimer();
-      if (props.duration) {
-        timer = setTimeout(() => {
-          hide();
-        }, props.duration);
-      }
-    };
-    const clickCover = () => {
-      if (props.closeOnClickOverlay) {
-        hide();
-        emit("close");
-      }
-    };
-    if (props.duration) {
-      show();
-    }
-    watch(() => props.duration, (val) => {
-      if (val) {
-        show();
-      }
-    });
-    const hasIcon = computed(() => {
-      if (props.type !== "text") {
-        return true;
-      } else {
-        return !!props.icon;
-      }
-    });
-    const toastBodyClass = computed(() => {
-      return [
-        "nut-toast",
-        { "nut-toast-center": props.center },
-        { "nut-toast-has-icon": hasIcon.value },
-        { "nut-toast-cover": props.cover },
-        { "nut-toast-loading": props.type === "loading" },
-        props.customClass,
-        "nut-toast-" + props.size
-      ];
-    });
-    const onAfterLeave = () => {
-      clearTimer();
-      props.unmount(props.id);
-      props.onClose && props.onClose();
-    };
-    return {
-      state,
-      hide,
-      clickCover,
-      hasIcon,
-      toastBodyClass,
-      onAfterLeave
-    };
-  }
-});
-const _hoisted_1 = {
-  key: 0,
-  class: "nut-toast-icon-wrapper"
-};
-const _hoisted_2 = {
-  key: 1,
-  class: "nut-toast-title"
-};
-const _hoisted_3 = ["innerHTML"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
-  return openBlock(), createBlock(Transition, {
-    name: "toast-fade",
-    onAfterLeave: _ctx.onAfterLeave
-  }, {
-    default: withCtx(() => [
-      withDirectives(createElementVNode("view", {
-        class: normalizeClass(_ctx.toastBodyClass),
-        style: normalizeStyle({
-          bottom: _ctx.center ? "auto" : _ctx.bottom,
-          "background-color": _ctx.coverColor
-        }),
-        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.clickCover && _ctx.clickCover(...args))
-      }, [
-        createElementVNode("view", {
-          class: "nut-toast-inner",
-          style: normalizeStyle({
-            "text-align": _ctx.textAlignCenter ? "center" : "left",
-            "background-color": _ctx.bgColor
-          })
-        }, [
-          _ctx.hasIcon ? (openBlock(), createElementBlock("view", _hoisted_1, [
-            createVNode(_component_nut_icon, {
-              size: _ctx.iconSize,
-              color: "#ffffff",
-              name: _ctx.icon
-            }, null, 8, ["size", "name"])
-          ])) : createCommentVNode("", true),
-          _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
-          createElementVNode("view", {
-            class: "nut-toast-text",
-            innerHTML: _ctx.msg
-          }, null, 8, _hoisted_3)
-        ], 4)
-      ], 6), [
-        [vShow, _ctx.state.mounted]
-      ])
-    ]),
-    _: 1
-  }, 8, ["onAfterLeave"]);
-}
-var Toast = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-const defaultOptions = {
-  msg: "",
-  id: "",
-  duration: 2e3,
-  center: true,
-  type: "text",
-  title: "",
-  customClass: "",
-  bottom: "30px",
-  size: "base",
-  iconSize: "20",
-  icon: null,
-  textAlignCenter: true,
-  loadingRotate: true,
-  bgColor: "",
-  onClose: null,
-  unmount: null,
-  cover: false,
-  coverColor: "",
-  closeOnClickOverlay: false
-};
-let idsMap = [];
-let optsMap = [];
-const clearToast = (id) => {
-  if (id) {
-    const container = document.getElementById(id);
-    optsMap = optsMap.filter((item) => item.id !== id);
-    idsMap = idsMap.filter((item) => item !== id);
-    if (container) {
-      document.body.removeChild(container);
-    }
-  } else {
-    idsMap.forEach((item) => {
-      const container = document.getElementById(item);
-      if (container) {
-        document.body.removeChild(container);
-      }
-    });
-    optsMap = [];
-    idsMap = [];
-  }
-};
-const updateToast = (opts) => {
-  const container = document.getElementById(opts.id);
-  if (container) {
-    const currentOpt = optsMap.find((item) => item.id === opts.id);
-    if (currentOpt) {
-      opts = __spreadValues(__spreadValues(__spreadValues({}, defaultOptions), currentOpt), opts);
-    } else {
-      opts = __spreadValues(__spreadValues({}, defaultOptions), opts);
-    }
-    const instance = createVNode(Toast, opts);
-    render(instance, container);
-    return instance.component.ctx;
-  }
-};
-const mountToast = (opts) => {
-  opts.unmount = clearToast;
-  let _id;
-  if (opts.id) {
-    _id = opts.id;
-    if (idsMap.find((item) => item === opts.id)) {
-      return updateToast(opts);
-    }
-  } else {
-    _id = new Date().getTime() + "";
-  }
-  opts = __spreadValues(__spreadValues({}, defaultOptions), opts);
-  opts.id = _id;
-  idsMap.push(opts.id);
-  optsMap.push(opts);
-  const container = document.createElement("div");
-  container.id = opts.id;
-  const instance = createVNode(Toast, opts);
-  render(instance, container);
-  document.body.appendChild(container);
-  return instance.component.ctx;
-};
-const errorMsg = (msg) => {
-  if (!msg) {
-    console.warn("[NutUI Toast]: msg\u4E0D\u80FD\u4E3A\u7A7A");
-    return;
-  }
-};
-const ToastFunction = {
-  text(msg, opts = {}) {
-    errorMsg(msg);
-    return mountToast(__spreadProps(__spreadValues({}, opts), { type: "text", msg }));
-  },
-  success(msg, opts = {}) {
-    errorMsg(msg);
-    return mountToast(__spreadProps(__spreadValues({ icon: "success" }, opts), { msg, type: "success" }));
-  },
-  fail(msg, opts = {}) {
-    errorMsg(msg);
-    return mountToast(__spreadProps(__spreadValues({ icon: "failure" }, opts), { msg, type: "fail" }));
-  },
-  warn(msg, opts = {}) {
-    errorMsg(msg);
-    return mountToast(__spreadProps(__spreadValues({ icon: "tips" }, opts), { msg, type: "warn" }));
-  },
-  loading(msg, opts = {}) {
-    return mountToast(__spreadProps(__spreadValues({
-      icon: "loading"
-    }, opts), {
-      msg,
-      type: "loading"
-    }));
-  },
-  hide(id) {
-    clearToast(id);
-  },
-  install(app) {
-    app.use(Toast);
-    app.config.globalProperties.$toast = ToastFunction;
-  }
-};
-export { Toast, ToastFunction, ToastFunction as default };
+const { create: h } = b("toast"), k = h({ components: { [x.name]: x }, props: { id: String, msg: String, duration: { type: Number, default: 2e3 }, center: { type: Boolean, default: true }, type: String, customClass: String, bottom: { type: String, default: "30px" }, size: { type: [String, Number], default: "base" }, iconSize: { type: String, default: "20" }, icon: String, textAlignCenter: { type: Boolean, default: true }, loadingRotate: { type: Boolean, default: true }, bgColor: { type: String, default: "" }, onClose: Function, unmount: Function, cover: { type: Boolean, default: false }, coverColor: { type: String, default: "" }, title: { type: String, default: "" }, closeOnClickOverlay: { type: Boolean, default: false } }, emits: ["close"], setup(i2, { emit: l2 }) {
+  let s2;
+  const a2 = t({ mounted: false });
+  e(() => {
+    a2.mounted = true;
+  });
+  const c2 = () => {
+    s2 && (clearTimeout(s2), s2 = null);
+  }, r2 = () => {
+    a2.mounted = false;
+  }, u2 = () => {
+    c2(), i2.duration && (s2 = setTimeout(() => {
+      r2();
+    }, i2.duration));
+  };
+  i2.duration && u2(), o(() => i2.duration, (t2) => {
+    t2 && u2();
+  });
+  const d2 = n(() => i2.type !== "text" || !!i2.icon), m2 = n(() => ["nut-toast", { "nut-toast-center": i2.center }, { "nut-toast-has-icon": d2.value }, { "nut-toast-cover": i2.cover }, { "nut-toast-loading": i2.type === "loading" }, i2.customClass, "nut-toast-" + i2.size]);
+  return { state: a2, hide: r2, clickCover: () => {
+    i2.closeOnClickOverlay && (r2(), l2("close"));
+  }, hasIcon: d2, toastBodyClass: m2, onAfterLeave: () => {
+    c2(), i2.unmount(i2.id), i2.onClose && i2.onClose();
+  } };
+} }), B = { key: 0, class: "nut-toast-icon-wrapper" }, w = { key: 1, class: "nut-toast-title" }, z = ["innerHTML"];
+var A = S(k, [["render", function(t2, e2, o2, n2, C2, b2) {
+  const x2 = i("nut-icon");
+  return l(), s(a, { name: "toast-fade", onAfterLeave: t2.onAfterLeave }, { default: c(() => [r(u("view", { class: d(t2.toastBodyClass), style: m({ bottom: t2.center ? "auto" : t2.bottom, "background-color": t2.coverColor }), onClick: e2[0] || (e2[0] = (...e3) => t2.clickCover && t2.clickCover(...e3)) }, [u("view", { class: "nut-toast-inner", style: m({ "text-align": t2.textAlignCenter ? "center" : "left", "background-color": t2.bgColor }) }, [t2.hasIcon ? (l(), p("view", B, [f(x2, { size: t2.iconSize, color: "#ffffff", name: t2.icon }, null, 8, ["size", "name"])])) : g("", true), t2.title ? (l(), p("div", w, y(t2.title), 1)) : g("", true), u("view", { class: "nut-toast-text", innerHTML: t2.msg }, null, 8, z)], 4)], 6), [[v, t2.state.mounted]])]), _: 1 }, 8, ["onAfterLeave"]);
+}]]);
+const I = { msg: "", id: "", duration: 2e3, center: true, type: "text", title: "", customClass: "", bottom: "30px", size: "base", iconSize: "20", icon: null, textAlignCenter: true, loadingRotate: true, bgColor: "", onClose: null, unmount: null, cover: false, coverColor: "", closeOnClickOverlay: false };
+let L = [], O = [];
+const E = (t2) => {
+  if (t2) {
+    const e2 = document.getElementById(t2);
+    O = O.filter((e3) => e3.id !== t2), L = L.filter((e3) => e3 !== t2), e2 && document.body.removeChild(e2);
+  } else
+    L.forEach((t3) => {
+      const e2 = document.getElementById(t3);
+      e2 && document.body.removeChild(e2);
+    }), O = [], L = [];
+}, T = (t2) => {
+  let e2;
+  if (t2.unmount = E, t2.id) {
+    if (e2 = t2.id, L.find((e3) => e3 === t2.id))
+      return ((t3) => {
+        const e3 = document.getElementById(t3.id);
+        if (e3) {
+          const o3 = O.find((e4) => e4.id === t3.id);
+          t3 = o3 ? __spreadValues(__spreadValues(__spreadValues({}, I), o3), t3) : __spreadValues(__spreadValues({}, I), t3);
+          const n3 = f(A, t3);
+          return C(n3, e3), n3.component.ctx;
+        }
+      })(t2);
+  } else
+    e2 = new Date().getTime() + "";
+  (t2 = __spreadValues(__spreadValues({}, I), t2)).id = e2, L.push(t2.id), O.push(t2);
+  const o2 = document.createElement("div");
+  o2.id = t2.id;
+  const n2 = f(A, t2);
+  return C(n2, o2), document.body.appendChild(o2), n2.component.ctx;
+}, j = { text: (t2, e2 = {}) => T(__spreadProps(__spreadValues({}, e2), { type: "text", msg: t2 })), success: (t2, e2 = {}) => T(__spreadProps(__spreadValues({ icon: "success" }, e2), { msg: t2, type: "success" })), fail: (t2, e2 = {}) => T(__spreadProps(__spreadValues({ icon: "failure" }, e2), { msg: t2, type: "fail" })), warn: (t2, e2 = {}) => T(__spreadProps(__spreadValues({ icon: "tips" }, e2), { msg: t2, type: "warn" })), loading: (t2, e2 = {}) => T(__spreadProps(__spreadValues({ icon: "loading" }, e2), { msg: t2, type: "loading" })), hide(t2) {
+  E(t2);
+}, install(t2) {
+  t2.use(A), t2.config.globalProperties.$toast = j;
+} };
+export { A as Toast, j as ToastFunction, j as default };