vft 0.0.375 → 0.0.376

package/es/components/notification/index.js

@@ -2,15 +2,15 @@ import "@vueuse/core";
 import "@vft/utils";
 import "../config-provider/hooks/use-global-config.js";
 import "vue";
-import { withInstallFunction } from "../../utils/vue/install.js";
+import { withInstallFunction as t } from "../../utils/vue/install.js";
 import "lodash-es";
-import notify from "./notify.js";
-import { notificationEmits, notificationProps, notificationTypes } from "./notification.js";
-const VftNotification = withInstallFunction(notify, "$notify");
+import o from "./notify.js";
+import { notificationEmits as l, notificationProps as y, notificationTypes as u } from "./notification.js";
+const c = t(o, "$notify");
 export {
-  VftNotification,
-  VftNotification as default,
-  notificationEmits,
-  notificationProps,
-  notificationTypes
+  c as VftNotification,
+  c as default,
+  l as notificationEmits,
+  y as notificationProps,
+  u as notificationTypes
 };

package/es/components/notification/notification.js

@@ -2,15 +2,14 @@ import "@vueuse/core";
 import "@vft/utils";
 import "../config-provider/hooks/use-global-config.js";
 import "vue";
-import { buildProps, definePropType } from "../../utils/vue/props/runtime.js";
-const notificationTypes = [
+import { buildProps as e, definePropType as t } from "../../utils/vue/props/runtime.js";
+const o = [
   "primary",
   "success",
   "info",
   "warning",
   "error"
-];
-const notificationProps = buildProps({
+], s = e({
   /**
    * @description custom class name for Notification
    */
@@ -46,7 +45,7 @@ const notificationProps = buildProps({
    * @description description text
    */
   message: {
-    type: definePropType([
+    type: t([
       String,
       Object,
       Function
@@ -64,15 +63,16 @@ const notificationProps = buildProps({
    * @description callback function when notification clicked
    */
   onClick: {
-    type: definePropType(Function),
-    default: () => void 0
+    type: t(Function),
+    default: () => {
+    }
   },
   /**
    * @description callback function when closed
    */
   onClose: {
-    type: definePropType(Function),
-    required: true
+    type: t(Function),
+    required: !0
   },
   /**
    * @description custom position
@@ -87,7 +87,7 @@ const notificationProps = buildProps({
    */
   showClose: {
     type: Boolean,
-    default: true
+    default: !0
   },
   /**
    * @description title
@@ -101,7 +101,7 @@ const notificationProps = buildProps({
    */
   type: {
     type: String,
-    values: [...notificationTypes, ""],
+    values: [...o, ""],
     default: ""
   },
   /**
@@ -115,12 +115,11 @@ const notificationProps = buildProps({
     type: String,
     default: "icon-close"
   }
-});
-const notificationEmits = {
-  destroy: () => true
+}), l = {
+  destroy: () => !0
 };
 export {
-  notificationEmits,
-  notificationProps,
-  notificationTypes
+  l as notificationEmits,
+  s as notificationProps,
+  o as notificationTypes
 };

package/es/components/notification/notification.vue.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./notification.vue2.js";
+import f from "./notification.vue2.js";
 export {
-  _sfc_main as default
+  f as default
 };

package/es/components/notification/notification.vue2.js

@@ -1,147 +1,112 @@
-import { defineComponent, ref, computed, onMounted, createBlock, openBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeStyle, normalizeClass, createCommentVNode, toDisplayString, renderSlot, createElementBlock, vShow, withModifiers } from "vue";
-import { useEventListener, useTimeoutFn } from "@vueuse/core";
-import { EVENT_CODE } from "../../constants/aria.js";
+import { defineComponent as S, ref as W, computed as l, onMounted as Z, createBlock as m, openBlock as r, Transition as A, unref as t, withCtx as F, withDirectives as k, createElementVNode as u, normalizeStyle as h, normalizeClass as s, createCommentVNode as w, toDisplayString as T, renderSlot as G, createElementBlock as M, vShow as E, withModifiers as K } from "vue";
+import { useEventListener as O, useTimeoutFn as U } from "@vueuse/core";
+import { EVENT_CODE as p } from "../../constants/aria.js";
 import "../config-provider/index.js";
-import { VftIcon } from "../icon/index.js";
-import { notificationEmits, notificationProps } from "./notification.js";
-import { useGlobalComponentSettings } from "../config-provider/hooks/use-global-config.js";
-const _hoisted_1 = ["id"];
-const _hoisted_2 = ["textContent"];
-const _hoisted_3 = { key: 0 };
-const _hoisted_4 = ["innerHTML"];
-const __default__ = defineComponent({
+import { VftIcon as L } from "../icon/index.js";
+import { notificationEmits as j, notificationProps as q } from "./notification.js";
+import { useGlobalComponentSettings as J } from "../config-provider/hooks/use-global-config.js";
+const Q = ["id"], R = ["textContent"], X = { key: 0 }, Y = ["innerHTML"], _ = S({
   name: "VftNotification"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: notificationProps,
-  emits: notificationEmits,
-  setup(__props, { expose: __expose }) {
-    const props = __props;
-    const TypeComponentsMap = {
+}), le = /* @__PURE__ */ S({
+  ..._,
+  props: q,
+  emits: j,
+  setup(b, { expose: z }) {
+    const o = b, d = {
       primary: "icon-info-filled",
       success: "icon-success-filled",
       warning: "icon-warning-filled",
       error: "icon-error-filled",
       info: "icon-info-filled"
-    };
-    const { ns, zIndex } = useGlobalComponentSettings("notification");
-    const { nextZIndex, currentZIndex } = zIndex;
-    const visible = ref(false);
-    let timer = void 0;
-    const typeClass = computed(() => {
-      const type = props.type;
-      return type && TypeComponentsMap[props.type] ? ns.m(type) : "";
-    });
-    const iconComponent = computed(() => {
-      if (!props.type) return props.icon;
-      return TypeComponentsMap[props.type] || props.icon;
-    });
-    const horizontalClass = computed(
-      () => props.position.endsWith("right") ? "right" : "left"
-    );
-    const verticalProperty = computed(
-      () => props.position.startsWith("top") ? "top" : "bottom"
-    );
-    const positionStyle = computed(() => {
-      return {
-        [verticalProperty.value]: `${props.offset}px`,
-        zIndex: props.zIndex ?? currentZIndex.value
-      };
-    });
-    function startTimer() {
-      if (props.duration > 0) {
-        ({ stop: timer } = useTimeoutFn(() => {
-          if (visible.value) close();
-        }, props.duration));
-      }
+    }, { ns: n, zIndex: B } = J("notification"), { nextZIndex: I, currentZIndex: V } = B, i = W(!1);
+    let v;
+    const N = l(() => {
+      const e = o.type;
+      return e && d[o.type] ? n.m(e) : "";
+    }), y = l(() => o.type && d[o.type] || o.icon), $ = l(
+      () => o.position.endsWith("right") ? "right" : "left"
+    ), D = l(
+      () => o.position.startsWith("top") ? "top" : "bottom"
+    ), H = l(() => ({
+      [D.value]: `${o.offset}px`,
+      zIndex: o.zIndex ?? V.value
+    }));
+    function f() {
+      o.duration > 0 && ({ stop: v } = U(() => {
+        i.value && a();
+      }, o.duration));
     }
-    function clearTimer() {
-      timer?.();
+    function C() {
+      v?.();
     }
-    function close() {
-      visible.value = false;
+    function a() {
+      i.value = !1;
     }
-    function onKeydown({ code }) {
-      if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {
-        clearTimer();
-      } else if (code === EVENT_CODE.esc) {
-        if (visible.value) {
-          close();
-        }
-      } else {
-        startTimer();
-      }
+    function P({ code: e }) {
+      e === p.delete || e === p.backspace ? C() : e === p.esc ? i.value && a() : f();
     }
-    onMounted(() => {
-      startTimer();
-      nextZIndex();
-      visible.value = true;
-    });
-    useEventListener(document, "keydown", onKeydown);
-    __expose({
-      visible,
+    return Z(() => {
+      f(), I(), i.value = !0;
+    }), O(document, "keydown", P), z({
+      visible: i,
       /** @description close notification */
-      close
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(Transition, {
-        name: unref(ns).b("fade"),
-        onBeforeLeave: _ctx.onClose,
-        onAfterLeave: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("destroy"))
-      }, {
-        default: withCtx(() => [
-          withDirectives(createElementVNode("div", {
-            id: _ctx.id,
-            class: normalizeClass([unref(ns).b(), _ctx.customClass, horizontalClass.value]),
-            style: normalizeStyle(positionStyle.value),
-            role: "alert",
-            onMouseenter: clearTimer,
-            onMouseleave: startTimer,
-            onClick: _cache[0] || (_cache[0] = //@ts-ignore
-            (...args) => _ctx.onClick && _ctx.onClick(...args))
+      close: a
+    }), (e, c) => (r(), m(A, {
+      name: t(n).b("fade"),
+      onBeforeLeave: e.onClose,
+      onAfterLeave: c[1] || (c[1] = (g) => e.$emit("destroy"))
+    }, {
+      default: F(() => [
+        k(u("div", {
+          id: e.id,
+          class: s([t(n).b(), e.customClass, $.value]),
+          style: h(H.value),
+          role: "alert",
+          onMouseenter: C,
+          onMouseleave: f,
+          onClick: c[0] || (c[0] = //@ts-ignore
+          (...g) => e.onClick && e.onClick(...g))
+        }, [
+          y.value ? (r(), m(t(L), {
+            key: 0,
+            icon: y.value,
+            class: s([t(n).e("icon"), N.value])
+          }, null, 8, ["icon", "class"])) : w("", !0),
+          u("div", {
+            class: s(t(n).e("group"))
           }, [
-            iconComponent.value ? (openBlock(), createBlock(unref(VftIcon), {
-              key: 0,
-              icon: iconComponent.value,
-              class: normalizeClass([unref(ns).e("icon"), typeClass.value])
-            }, null, 8, ["icon", "class"])) : createCommentVNode("", true),
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).e("group"))
+            u("h2", {
+              class: s(t(n).e("title")),
+              textContent: T(e.title)
+            }, null, 10, R),
+            k(u("div", {
+              class: s(t(n).e("content")),
+              style: h(e.title ? void 0 : { margin: 0 })
             }, [
-              createElementVNode("h2", {
-                class: normalizeClass(unref(ns).e("title")),
-                textContent: toDisplayString(_ctx.title)
-              }, null, 10, _hoisted_2),
-              withDirectives(createElementVNode("div", {
-                class: normalizeClass(unref(ns).e("content")),
-                style: normalizeStyle(!!_ctx.title ? void 0 : { margin: 0 })
-              }, [
-                renderSlot(_ctx.$slots, "default", {}, () => [
-                  !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", _hoisted_3, toDisplayString(_ctx.message), 1)) : (openBlock(), createElementBlock("p", {
-                    key: 1,
-                    innerHTML: _ctx.message
-                  }, null, 8, _hoisted_4))
-                ])
-              ], 6), [
-                [vShow, _ctx.message]
-              ]),
-              _ctx.showClose ? (openBlock(), createBlock(unref(VftIcon), {
-                key: 0,
-                icon: "icon-close",
-                class: normalizeClass(unref(ns).e("closeBtn")),
-                onClick: withModifiers(close, ["stop"])
-              }, null, 8, ["class"])) : createCommentVNode("", true)
-            ], 2)
-          ], 46, _hoisted_1), [
-            [vShow, visible.value]
-          ])
-        ]),
-        _: 3
-      }, 8, ["name", "onBeforeLeave"]);
-    };
+              G(e.$slots, "default", {}, () => [
+                e.dangerouslyUseHTMLString ? (r(), M("p", {
+                  key: 1,
+                  innerHTML: e.message
+                }, null, 8, Y)) : (r(), M("p", X, T(e.message), 1))
+              ])
+            ], 6), [
+              [E, e.message]
+            ]),
+            e.showClose ? (r(), m(t(L), {
+              key: 0,
+              icon: "icon-close",
+              class: s(t(n).e("closeBtn")),
+              onClick: K(a, ["stop"])
+            }, null, 8, ["class"])) : w("", !0)
+          ], 2)
+        ], 46, Q), [
+          [E, i.value]
+        ])
+      ]),
+      _: 3
+    }, 8, ["name", "onBeforeLeave"]));
   }
 });
 export {
-  _sfc_main as default
+  le as default
 };

package/es/components/notification/notify.js

@@ -1,124 +1,94 @@
-import { isVNode, createVNode, render } from "vue";
-import { isClient, isString, isElement, isFunction, isUndefined } from "@vft/utils";
+import { isVNode as u, createVNode as T, render as v } from "vue";
+import { isClient as x, isString as g, isElement as h, isFunction as y, isUndefined as C } from "@vft/utils";
 import "@vueuse/core";
-import { debugWarn } from "../../utils/error.js";
+import { debugWarn as N } from "../../utils/error.js";
 import "../config-provider/hooks/use-global-config.js";
 import "lodash-es";
-import _sfc_main from "./notification.vue2.js";
-import { notificationTypes } from "./notification.js";
-const notifications = {
+import O from "./notification.vue2.js";
+import { notificationTypes as _ } from "./notification.js";
+const l = {
   "top-left": [],
   "top-right": [],
   "bottom-left": [],
   "bottom-right": []
-};
-const GAP_SIZE = 16;
-let seed = 1;
-const notify = function(options = {}, context) {
-  if (!isClient) return { close: () => void 0 };
-  if (isString(options) || isVNode(options)) {
-    options = { message: options };
-  }
-  const position = options.position || "top-right";
-  let verticalOffset = options.offset || 0;
-  notifications[position].forEach(({ vm: vm2 }) => {
-    verticalOffset += (vm2.el?.offsetHeight || 0) + GAP_SIZE;
-  });
-  verticalOffset += GAP_SIZE;
-  const id = `notification_${seed++}`;
-  const userOnClose = options.onClose;
-  const props = {
-    ...options,
-    offset: verticalOffset,
-    id,
+}, p = 16;
+let H = 1;
+const m = function(e = {}, t) {
+  if (!x) return { close: () => {
+  } };
+  (g(e) || u(e)) && (e = { message: e });
+  const n = e.position || "top-right";
+  let s = e.offset || 0;
+  l[n].forEach(({ vm: d }) => {
+    s += (d.el?.offsetHeight || 0) + p;
+  }), s += p;
+  const i = `notification_${H++}`, a = e.onClose, f = {
+    ...e,
+    offset: s,
+    id: i,
     onClose: () => {
-      close(id, position, userOnClose);
+      A(i, n, a);
     }
   };
-  let appendTo = document.body;
-  if (isElement(options.appendTo)) {
-    appendTo = options.appendTo;
-  } else if (isString(options.appendTo)) {
-    appendTo = document.querySelector(options.appendTo);
-  }
-  if (!isElement(appendTo)) {
-    debugWarn(
-      "ElNotification",
-      "the appendTo option is not an HTMLElement. Falling back to document.body."
-    );
-    appendTo = document.body;
-  }
-  const container = document.createElement("div");
-  const vm = createVNode(
-    _sfc_main,
-    props,
-    isFunction(props.message) ? props.message : isVNode(props.message) ? () => props.message : null
+  let r = document.body;
+  h(e.appendTo) ? r = e.appendTo : g(e.appendTo) && (r = document.querySelector(e.appendTo)), h(r) || (N(
+    "ElNotification",
+    "the appendTo option is not an HTMLElement. Falling back to document.body."
+  ), r = document.body);
+  const c = document.createElement("div"), o = T(
+    O,
+    f,
+    y(f.message) ? f.message : u(f.message) ? () => f.message : null
   );
-  vm.appContext = isUndefined(context) ? notify._context : context;
-  vm.props.onDestroy = () => {
-    render(null, container);
-  };
-  render(vm, container);
-  notifications[position].push({ vm });
-  appendTo.appendChild(container.firstElementChild);
-  return {
+  return o.appContext = C(t) ? m._context : t, o.props.onDestroy = () => {
+    v(null, c);
+  }, v(o, c), l[n].push({ vm: o }), r.appendChild(c.firstElementChild), {
     // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle
     // for out component, so that all closing steps will not be skipped.
     close: () => {
-      vm.component.exposed.visible.value = false;
+      o.component.exposed.visible.value = !1;
     }
   };
 };
-notificationTypes.forEach((type) => {
-  notify[type] = (options = {}, appContext) => {
-    if (isString(options) || isVNode(options)) {
-      options = {
-        message: options
-      };
-    }
-    return notify({ ...options, type }, appContext);
-  };
+_.forEach((e) => {
+  m[e] = (t = {}, n) => ((g(t) || u(t)) && (t = {
+    message: t
+  }), m({ ...t, type: e }, n));
 });
-function close(id, position, userOnClose) {
-  const orientedNotifications = notifications[position];
-  const idx = orientedNotifications.findIndex(
-    ({ vm: vm2 }) => vm2.component?.props.id === id
+function A(e, t, n) {
+  const s = l[t], i = s.findIndex(
+    ({ vm: o }) => o.component?.props.id === e
   );
-  if (idx === -1) return;
-  const { vm } = orientedNotifications[idx];
-  if (!vm) return;
-  userOnClose?.(vm);
-  const removedHeight = vm.el.offsetHeight;
-  const verticalPos = position.split("-")[0];
-  orientedNotifications.splice(idx, 1);
-  const len = orientedNotifications.length;
-  if (len < 1) return;
-  for (let i = idx; i < len; i++) {
-    const { el, component } = orientedNotifications[i].vm;
-    const pos = Number.parseInt(el.style[verticalPos], 10) - removedHeight - GAP_SIZE;
-    component.props.offset = pos;
-  }
+  if (i === -1) return;
+  const { vm: a } = s[i];
+  if (!a) return;
+  n?.(a);
+  const f = a.el.offsetHeight, r = t.split("-")[0];
+  s.splice(i, 1);
+  const c = s.length;
+  if (!(c < 1))
+    for (let o = i; o < c; o++) {
+      const { el: d, component: b } = s[o].vm, E = Number.parseInt(d.style[r], 10) - f - p;
+      b.props.offset = E;
+    }
 }
-function closeAll() {
-  for (const orientedNotifications of Object.values(notifications)) {
-    orientedNotifications.forEach(({ vm }) => {
-      vm.component.exposed.visible.value = false;
+function I() {
+  for (const e of Object.values(l))
+    e.forEach(({ vm: t }) => {
+      t.component.exposed.visible.value = !1;
     });
-  }
 }
-function updateOffsets(position = "top-right") {
-  let verticalOffset = notifications[position][0]?.vm.props?.offset || 0;
-  for (const { vm } of notifications[position]) {
-    vm.component.props.offset = verticalOffset;
-    verticalOffset += (vm.el?.offsetHeight || 0) + GAP_SIZE;
-  }
+function S(e = "top-right") {
+  let t = l[e][0]?.vm.props?.offset || 0;
+  for (const { vm: n } of l[e])
+    n.component.props.offset = t, t += (n.el?.offsetHeight || 0) + p;
 }
-notify.closeAll = closeAll;
-notify.updateOffsets = updateOffsets;
-notify._context = null;
+m.closeAll = I;
+m.updateOffsets = S;
+m._context = null;
 export {
-  close,
-  closeAll,
-  notify as default,
-  updateOffsets
+  A as close,
+  I as closeAll,
+  m as default,
+  S as updateOffsets
 };

package/es/components/overlay/index.js

@@ -2,11 +2,11 @@ import "@vueuse/core";
 import "@vft/utils";
 import "../config-provider/hooks/use-global-config.js";
 import "vue";
-import { withInstall } from "../../utils/vue/install.js";
+import { withInstall as t } from "../../utils/vue/install.js";
 import "lodash-es";
-import _sfc_main from "./overlay.vue2.js";
-const VftOverlay = withInstall(_sfc_main);
+import o from "./overlay.vue2.js";
+const s = t(o);
 export {
-  VftOverlay,
-  VftOverlay as default
+  s as VftOverlay,
+  s as default
 };

package/es/components/overlay/overlay.vue.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./overlay.vue2.js";
+import f from "./overlay.vue2.js";
 export {
-  _sfc_main as default
+  f as default
 };