vft 0.0.375 → 0.0.376

package/es/components/list-cell/list-cell.vue2.js

@@ -1,20 +1,18 @@
-import { defineComponent, ref, computed, createElementBlock, openBlock, normalizeClass, normalizeStyle, unref, Fragment, renderList, createElementVNode, createVNode, mergeProps, toDisplayString, createBlock, createCommentVNode } from "vue";
-import { VftIcon } from "../icon/index.js";
+import { defineComponent as h, ref as y, computed as x, createElementBlock as m, openBlock as r, normalizeClass as c, normalizeStyle as V, unref as e, Fragment as N, renderList as z, createElementVNode as f, createVNode as B, mergeProps as d, toDisplayString as D, createBlock as p, createCommentVNode as T } from "vue";
+import { VftIcon as g } from "../icon/index.js";
 import "@vueuse/core";
-import { VNode, singleAttrToObj } from "@vft/utils";
-import { addUnit } from "../../utils/helper.js";
-import { generateCssVars } from "../../utils/ns-cover.js";
+import { VNode as b, singleAttrToObj as E } from "@vft/utils";
+import { addUnit as v } from "../../utils/helper.js";
+import { generateCssVars as H } from "../../utils/ns-cover.js";
 import "lodash-es";
-import { useNamespace } from "../../hooks/use-namespace/index.js";
+import { useNamespace as S } from "../../hooks/use-namespace/index.js";
 import "../../hooks/use-model-toggle/index.js";
 import "@popperjs/core";
 import "../../hooks/use-z-index/index.js";
-const _hoisted_1 = ["onClick"];
-const __default__ = defineComponent({
+const j = ["onClick"], A = h({
   name: "vft-list-cell"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
+}), Q = /* @__PURE__ */ h({
+  ...A,
   props: {
     list: { default: () => [] },
     cellHeight: { default: 50 },
@@ -22,65 +20,53 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     activeIndex: {}
   },
   emits: ["item-click"],
-  setup(__props, { emit: __emit }) {
-    const ns = useNamespace("list-cell");
-    const emit = __emit;
-    const _activeIndex = ref(__props.activeIndex);
-    const style = computed(() => {
-      return generateCssVars(
-        {
-          height: addUnit(__props.cellHeight),
-          "left-text-distance": addUnit(__props.leftTextDistance)
-        },
-        "list-cell"
-      );
-    });
-    function onItemClick(item, index) {
-      _activeIndex.value = index;
-      emit("item-click", item, index);
+  setup(i, { emit: k }) {
+    const n = S("list-cell"), C = k, u = y(i.activeIndex), I = x(() => H(
+      {
+        height: v(i.cellHeight),
+        "left-text-distance": v(i.leftTextDistance)
+      },
+      "list-cell"
+    ));
+    function _(o, l) {
+      u.value = l, C("item-click", o, l);
     }
-    const iconConfig = (iconCfg, extraIconCfg = {}) => {
-      return singleAttrToObj(iconCfg, "icon", {
-        size: 16,
-        ...extraIconCfg
-      });
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        style: normalizeStyle(style.value),
-        class: normalizeClass(unref(ns).b())
+    const s = (o, l = {}) => E(o, "icon", {
+      size: 16,
+      ...l
+    });
+    return (o, l) => (r(), m("div", {
+      style: V(I.value),
+      class: c(e(n).b())
+    }, [
+      (r(!0), m(N, null, z(o.list, (t, a) => (r(), m("div", {
+        onClick: (F) => _(t, a),
+        key: a,
+        class: c([e(n).e("item"), e(n).is("active", u.value === a)])
       }, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.list, (item, index) => {
-          return openBlock(), createElementBlock("div", {
-            onClick: ($event) => onItemClick(item, index),
-            key: index,
-            class: normalizeClass([unref(ns).e("item"), unref(ns).is("active", _activeIndex.value === index)])
-          }, [
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).m("left"))
-            }, [
-              createVNode(unref(VftIcon), mergeProps({ ref_for: true }, iconConfig(item.leftIcon)), null, 16),
-              createElementVNode("span", {
-                class: normalizeClass(unref(ns).e("text"))
-              }, toDisplayString(item.text), 3)
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).m("right"))
-            }, [
-              item?.rightContent ? (openBlock(), createBlock(unref(VNode), {
-                key: 0,
-                content: item.rightContent
-              }, null, 8, ["content"])) : iconConfig(item.rightIcon)?.icon ? (openBlock(), createBlock(unref(VftIcon), mergeProps({
-                key: 1,
-                ref_for: true
-              }, iconConfig(item.rightIcon)), null, 16)) : createCommentVNode("", true)
-            ], 2)
-          ], 10, _hoisted_1);
-        }), 128))
-      ], 6);
-    };
+        f("div", {
+          class: c(e(n).m("left"))
+        }, [
+          B(e(g), d({ ref_for: !0 }, s(t.leftIcon)), null, 16),
+          f("span", {
+            class: c(e(n).e("text"))
+          }, D(t.text), 3)
+        ], 2),
+        f("div", {
+          class: c(e(n).m("right"))
+        }, [
+          t?.rightContent ? (r(), p(e(b), {
+            key: 0,
+            content: t.rightContent
+          }, null, 8, ["content"])) : s(t.rightIcon)?.icon ? (r(), p(e(g), d({
+            key: 1,
+            ref_for: !0
+          }, s(t.rightIcon)), null, 16)) : T("", !0)
+        ], 2)
+      ], 10, j))), 128))
+    ], 6));
   }
 });
 export {
-  _sfc_main as default
+  Q as default
 };

package/es/components/loading/directive.js

@@ -1,89 +1,54 @@
-import { isObject, hyphenate, isString } from "@vft/utils";
-import { isRef, ref } from "vue";
-import { Loading } from "./service.js";
-const INSTANCE_KEY = Symbol("VftLoading");
-const createInstance = (el, binding) => {
-  const vm = binding.instance;
-  const getBindingProp = (key) => isObject(binding.value) ? binding.value[key] : void 0;
-  const resolveExpression = (key) => {
-    const data = isString(key) && vm?.[key] || key;
-    if (data) return ref(data);
-    else return data;
+import { isObject as m, hyphenate as p, isString as n } from "@vft/utils";
+import { isRef as x, ref as V } from "vue";
+import { Loading as k } from "./service.js";
+const u = Symbol("VftLoading"), i = (a, o) => {
+  const t = o.instance, e = (l) => m(o.value) ? o.value[l] : void 0, c = (l) => {
+    const r = n(l) && t?.[l] || l;
+    return r && V(r);
+  }, s = (l) => c(
+    e(l) ?? a.getAttribute(`vft-loading-${p(l)}`)
+  ), v = e("fullscreen") ?? o.modifiers.fullscreen, f = {
+    text: s("text"),
+    svg: s("svg"),
+    svgViewBox: s("svgViewBox"),
+    spinner: s("spinner"),
+    visible: s("visible"),
+    background: s("background"),
+    customClass: s("customClass"),
+    rotate: s("rotate"),
+    img: s("img"),
+    icon: s("icon"),
+    fullscreen: v,
+    target: e("target") ?? (v ? void 0 : a),
+    body: e("body") ?? o.modifiers.body,
+    lock: e("lock") ?? o.modifiers.lock
   };
-  const getProp = (name) => resolveExpression(
-    getBindingProp(name) ?? el.getAttribute(`vft-loading-${hyphenate(name)}`)
-  );
-  const fullscreen = getBindingProp("fullscreen") ?? binding.modifiers.fullscreen;
-  const options = {
-    text: getProp("text"),
-    svg: getProp("svg"),
-    svgViewBox: getProp("svgViewBox"),
-    spinner: getProp("spinner"),
-    visible: getProp("visible"),
-    background: getProp("background"),
-    customClass: getProp("customClass"),
-    rotate: getProp("rotate"),
-    img: getProp("img"),
-    icon: getProp("icon"),
-    fullscreen,
-    target: getBindingProp("target") ?? (fullscreen ? void 0 : el),
-    body: getBindingProp("body") ?? binding.modifiers.body,
-    lock: getBindingProp("lock") ?? binding.modifiers.lock
+  a[u] = {
+    options: f,
+    instance: k(f)
   };
-  el[INSTANCE_KEY] = {
-    options,
-    instance: Loading(options)
-  };
-};
-const updateOptions = (newOptions, originalOptions) => {
-  for (const key of Object.keys(originalOptions)) {
-    if (isRef(originalOptions[key]))
-      originalOptions[key].value = newOptions[key];
-  }
-};
-const vLoading = createLoadingDirective();
-function createLoadingDirective(defaultLoadingCfg) {
-  function defaultConfigSetting(binding) {
-    if (defaultLoadingCfg) {
-      binding.value = { ...defaultLoadingCfg, ...binding.value };
-    }
+}, y = (a, o) => {
+  for (const t of Object.keys(o))
+    x(o[t]) && (o[t].value = a[t]);
+}, L = S();
+function S(a) {
+  function o(t) {
+    a && (t.value = { ...a, ...t.value });
   }
   return {
-    mounted(el, binding) {
-      if (binding.value === false) return;
-      defaultConfigSetting(binding);
-      if (binding.value?.visible === false) {
-        binding.value = void 0;
-      }
-      if (binding.value) {
-        createInstance(el, binding);
-      }
+    mounted(t, e) {
+      e.value !== !1 && (o(e), e.value?.visible === !1 && (e.value = void 0), e.value && i(t, e));
     },
-    updated(el, binding) {
-      const instance = el[INSTANCE_KEY];
-      if (binding.oldValue !== binding.value) {
-        if (binding.value && !binding.oldValue || binding.value?.visible) {
-          defaultConfigSetting(binding);
-          createInstance(el, binding);
-        } else if (binding.value && binding.oldValue) {
-          if (binding.value?.visible === false) {
-            instance?.instance.close();
-          }
-          if (isObject(binding.value)) {
-            defaultConfigSetting(binding);
-            updateOptions(binding.value, instance.options);
-          }
-        } else {
-          instance?.instance.close();
-        }
-      }
+    updated(t, e) {
+      const c = t[u];
+      e.oldValue !== e.value && (e.value && !e.oldValue || e.value?.visible ? (o(e), i(t, e)) : e.value && e.oldValue ? (e.value?.visible === !1 && c?.instance.close(), m(e.value) && (o(e), y(e.value, c.options))) : c?.instance.close());
     },
-    unmounted(el) {
-      el[INSTANCE_KEY]?.instance.close();
+    unmounted(t) {
+      t[u]?.instance.close();
     }
   };
 }
 export {
-  createLoadingDirective,
-  vLoading
+  S as createLoadingDirective,
+  L as vLoading
 };

package/es/components/loading/index.js

@@ -1,19 +1,18 @@
-import { vLoading } from "./directive.js";
-import { createLoadingDirective } from "./directive.js";
-import { Loading } from "./service.js";
-const VftLoading = {
-  install(app) {
-    app.directive("loading", vLoading);
-    app.config.globalProperties.$loading = Loading;
+import { vLoading as e } from "./directive.js";
+import { createLoadingDirective as g } from "./directive.js";
+import { Loading as o } from "./service.js";
+const a = {
+  install(i) {
+    i.directive("loading", e), i.config.globalProperties.$loading = o;
   },
-  directive: vLoading,
-  service: Loading
+  directive: e,
+  service: o
 };
 export {
-  VftLoading,
-  vLoading as VftLoadingDirective,
-  Loading as VftLoadingService,
-  createLoadingDirective,
-  VftLoading as default,
-  vLoading
+  a as VftLoading,
+  e as VftLoadingDirective,
+  o as VftLoadingService,
+  g as createLoadingDirective,
+  a as default,
+  e as vLoading
 };

package/es/components/loading/loading.js

@@ -1,95 +1,73 @@
-import { removeClass, singleAttrToObj } from "@vft/utils";
-import { VftIcon } from "../icon/index.js";
+import { removeClass as p, singleAttrToObj as w } from "@vft/utils";
+import { VftIcon as A } from "../icon/index.js";
 import "@vueuse/core";
 import "../config-provider/hooks/use-global-config.js";
-import { ref, reactive, watch, createApp, toRefs, h, Transition, withCtx, withDirectives, createVNode, vShow } from "vue";
+import { ref as T, reactive as V, watch as I, createApp as N, toRefs as $, h as o, Transition as k, withCtx as y, withDirectives as B, createVNode as S, vShow as O } from "vue";
 import "lodash-es";
-import { useNamespace } from "../../hooks/use-namespace/index.js";
+import { useNamespace as j } from "../../hooks/use-namespace/index.js";
 import "../../hooks/use-model-toggle/index.js";
 import "@popperjs/core";
-import { useZIndex } from "../../hooks/use-z-index/index.js";
-function createLoadingComponent(options) {
-  let afterLeaveTimer;
-  const ns = useNamespace("loading");
-  const afterLeaveFlag = ref(false);
-  const data = reactive({
-    ...options,
+import { useZIndex as z } from "../../hooks/use-z-index/index.js";
+function J(r) {
+  let c;
+  const n = j("loading"), a = T(!1), e = V({
+    ...r,
     originalPosition: "",
     originalOverflow: "",
-    visible: false
+    visible: !1
   });
-  function setText(text) {
-    data.text = text;
+  function b(t) {
+    e.text = t;
   }
-  watch(
-    () => data.visible,
-    (val) => {
-      if (!val) {
-        close();
-      }
+  I(
+    () => e.visible,
+    (t) => {
+      t || u();
     }
   );
-  function destroySelf() {
-    const target = data.parent;
-    if (!target.vLoadingAddClassList) {
-      let loadingNumber = target.getAttribute("loading-number");
-      loadingNumber = Number.parseInt(loadingNumber) - 1;
-      if (!loadingNumber) {
-        removeClass(target, ns.bm("parent", "relative"));
-        target.removeAttribute("loading-number");
-      } else {
-        target.setAttribute("loading-number", loadingNumber.toString());
-      }
-      removeClass(target, ns.bm("parent", "hidden"));
+  function x() {
+    const t = e.parent;
+    if (!t.vLoadingAddClassList) {
+      let i = t.getAttribute("loading-number");
+      i = Number.parseInt(i) - 1, i ? t.setAttribute("loading-number", i.toString()) : (p(t, n.bm("parent", "relative")), t.removeAttribute("loading-number")), p(t, n.bm("parent", "hidden"));
     }
-    removeVftLoadingChild();
-    loadingInstance.unmount();
+    m(), f.unmount();
   }
-  function removeVftLoadingChild() {
-    vm.$el?.parentNode?.removeChild(vm.$el);
+  function m() {
+    s.$el?.parentNode?.removeChild(s.$el);
   }
-  function close() {
-    if (options.beforeClose && !options.beforeClose()) return;
-    afterLeaveFlag.value = true;
-    clearTimeout(afterLeaveTimer);
-    afterLeaveTimer = window.setTimeout(handleAfterLeave, 400);
-    data.visible = false;
-    options.closed?.();
+  function u() {
+    r.beforeClose && !r.beforeClose() || (a.value = !0, clearTimeout(c), c = window.setTimeout(l, 400), e.visible = !1, r.closed?.());
   }
-  function handleAfterLeave() {
-    if (!afterLeaveFlag.value) return;
-    const target = data.parent;
-    afterLeaveFlag.value = false;
-    target.vLoadingAddClassList = void 0;
-    destroySelf();
+  function l() {
+    if (!a.value) return;
+    const t = e.parent;
+    a.value = !1, t.vLoadingAddClassList = void 0, x();
   }
-  const VftLoadingComponent = {
+  const f = N({
     name: "VftLoading",
-    setup(_, { expose }) {
+    setup(t, { expose: i }) {
       return () => {
-        const zIndex = useZIndex();
-        expose({
-          ns,
-          zIndex
+        const L = z();
+        i({
+          ns: n,
+          zIndex: L
         });
-        const svg = data.spinner || data.svg;
-        const img = data.img;
-        const icon = data.icon ? singleAttrToObj(data.icon, "icon") : false;
-        const spinner = icon ? h(VftIcon, icon) : img ? h("img", {
+        const d = e.spinner || e.svg, v = e.img, g = e.icon ? w(e.icon, "icon") : !1, C = g ? o(A, g) : v ? o("img", {
           class: [
             "circular circular-img",
-            data.rotate ? "" : "circular-no-rotate"
+            e.rotate ? "" : "circular-no-rotate"
           ],
-          src: img
-        }) : h(
+          src: v
+        }) : o(
           "svg",
           {
             class: "circular",
-            viewBox: data.svgViewBox ? data.svgViewBox : "0 0 50 50",
-            ...svg ? { innerHTML: svg } : {}
+            viewBox: e.svgViewBox ? e.svgViewBox : "0 0 50 50",
+            ...d ? { innerHTML: d } : {}
           },
           [
-            h("circle", {
+            o("circle", {
               class: "path",
               cx: "25",
               cy: "25",
@@ -97,61 +75,58 @@ function createLoadingComponent(options) {
               fill: "none"
             })
           ]
-        );
-        const spinnerText = data.text ? h("p", { class: ns.b("text") }, data.text) : void 0;
-        return h(
-          Transition,
+        ), h = e.text ? o("p", { class: n.b("text") }, e.text) : void 0;
+        return o(
+          k,
           {
-            name: ns.b("fade"),
-            onAfterLeave: handleAfterLeave
+            name: n.b("fade"),
+            onAfterLeave: l
           },
           {
-            default: withCtx(() => [
-              withDirectives(
-                createVNode(
+            default: y(() => [
+              B(
+                S(
                   "div",
                   {
                     style: {
-                      backgroundColor: data.background || ""
+                      backgroundColor: e.background || ""
                     },
                     class: [
-                      ns.b("mask"),
-                      data.customClass,
-                      data.fullscreen ? "is-fullscreen" : ""
+                      n.b("mask"),
+                      e.customClass,
+                      e.fullscreen ? "is-fullscreen" : ""
                     ]
                   },
                   [
-                    h(
+                    o(
                       "div",
                       {
-                        class: ns.b("spinner")
+                        class: n.b("spinner")
                       },
-                      [spinner, spinnerText]
+                      [C, h]
                     )
                   ]
                 ),
-                [[vShow, data.visible]]
+                [[O, e.visible]]
               )
             ])
           }
         );
       };
     }
-  };
-  const loadingInstance = createApp(VftLoadingComponent);
-  const vm = loadingInstance.mount(document.createElement("div"));
+  }), s = f.mount(document.createElement("div"));
   return {
-    ...toRefs(data),
-    setText,
-    removeVftLoadingChild,
-    close,
-    handleAfterLeave,
-    vm,
+    ...$(e),
+    setText: b,
+    removeVftLoadingChild: m,
+    close: u,
+    handleAfterLeave: l,
+    vm: s,
     get $el() {
-      return vm.$el;
+      return s.$el;
     }
   };
 }
 export {
-  createLoadingComponent
+  J as createLoadingComponent
 };