vft 0.0.46 → 0.0.48

package/es/components/divider/index.js

@@ -2,9 +2,10 @@ import { withInstall as t } from "../../utils/vue/install.js";
 import "vue";
 import "@vft/utils";
 import "../../utils/ns-cover.js";
+import "lodash";
 import i from "./divider.vue2.js";
-const a = t(i);
+const s = t(i);
 export {
-  a as VftDivider,
-  a as default
+  s as VftDivider,
+  s as default
 };

package/es/components/empty/index.js

@@ -2,11 +2,12 @@ import { withInstall as t } from "../../utils/vue/install.js";
 import "vue";
 import "@vft/utils";
 import "../../utils/ns-cover.js";
+import "lodash";
 import m from "./empty.vue2.js";
-import { EmptyEnum as e } from "./constants.js";
-const a = t(m);
+import { EmptyEnum as l } from "./constants.js";
+const n = t(m);
 export {
-  e as EmptyEnum,
-  a as VftEmpty,
-  a as default
+  l as EmptyEnum,
+  n as VftEmpty,
+  n as default
 };

package/es/components/exception/exception.vue2.js

@@ -1,11 +1,13 @@
-import { defineComponent as f, openBlock as n, createBlock as a, unref as e, withCtx as c, createElementBlock as m, createCommentVNode as l } from "vue";
-import { generateCssVars as y } from "@vft/utils";
+import { defineComponent as f, openBlock as i, createBlock as a, unref as e, withCtx as c, createElementBlock as s, createCommentVNode as l } from "vue";
+import "@vft/utils";
+import { generateCssVars as y } from "../../utils/ns-cover.js";
+import "lodash";
 import { useRouter as k } from "vue-router";
 import { useRouterHelper as x } from "@vft/router";
 import { useTabs as C } from "@vft/store";
 import { VftResult as R } from "../result/index.js";
 import d from "./exception.png.js";
-const E = /* @__PURE__ */ f({
+const N = /* @__PURE__ */ f({
   __name: "exception",
   props: {
     title: { default: "页面打不开？刷新下试试" },
@@ -13,28 +15,28 @@ const E = /* @__PURE__ */ f({
     showHome: { type: Boolean }
   },
   setup(o) {
-    const u = k(), { goRoot: i } = x(u), { refreshPage: s } = C(), p = {
+    const p = k(), { goRoot: n } = x(p), { refreshPage: m } = C(), u = {
       ...y({
         "title-font-size": "16px"
       }, "result")
     };
-    return (h, t) => (n(), a(e(R), {
+    return (h, t) => (i(), a(e(R), {
       title: o.title,
       icon: { icon: e(d), size: 350 },
-      style: p
+      style: u
     }, {
       extra: c(() => [
-        o.showHome ? (n(), m("button", {
+        o.showHome ? (i(), s("button", {
           key: 0,
           type: "primary",
           onClick: t[0] || (t[0] = //@ts-ignore
-          (...r) => e(i) && e(i)(...r))
+          (...r) => e(n) && e(n)(...r))
         }, "返回主页")) : l("", !0),
-        o.showRefresh ? (n(), m("button", {
+        o.showRefresh ? (i(), s("button", {
           key: 1,
           type: "primary",
           onClick: t[1] || (t[1] = //@ts-ignore
-          (...r) => e(s) && e(s)(...r))
+          (...r) => e(m) && e(m)(...r))
         }, "刷新页面")) : l("", !0)
       ]),
       _: 1
@@ -42,5 +44,5 @@ const E = /* @__PURE__ */ f({
   }
 });
 export {
-  E as default
+  N as default
 };

package/es/components/exception/index.js

@@ -2,9 +2,10 @@ import { withInstall as t } from "../../utils/vue/install.js";
 import "vue";
 import "@vft/utils";
 import "../../utils/ns-cover.js";
+import "lodash";
 import o from "./exception.vue2.js";
-const a = t(o);
+const n = t(o);
 export {
-  a as VftException,
-  a as default
+  n as VftException,
+  n as default
 };

package/es/components/footer-layout/index.js

@@ -2,9 +2,10 @@ import { withInstall as t } from "../../utils/vue/install.js";
 import "vue";
 import "@vft/utils";
 import "../../utils/ns-cover.js";
+import "lodash";
 import o from "./footer-layout.vue2.js";
-const f = t(o);
+const s = t(o);
 export {
-  f as VftFooterLayout,
-  f as default
+  s as VftFooterLayout,
+  s as default
 };

package/es/components/form/constants.d.ts

@@ -0,0 +1,4 @@
+import type { InjectionKey } from 'vue';
+import type { FormContext, FormItemContext } from './types';
+export declare const formContextKey: InjectionKey<FormContext>;
+export declare const formItemContextKey: InjectionKey<FormItemContext>;

package/es/components/form/constants.js

@@ -0,0 +1,5 @@
+const o = Symbol("formContextKey"), t = Symbol("formItemContextKey");
+export {
+  o as formContextKey,
+  t as formItemContextKey
+};

package/es/components/form/form-item.vue.d.ts

@@ -0,0 +1,133 @@
+import type { PropType as __PropType } from 'vue';
+import { ComponentSize } from '../types';
+import type { FormItemProp, FormItemRule } from './types';
+export interface FormItemProps {
+    label?: string;
+    labelWidth?: Numberish;
+    prop?: FormItemProp;
+    required?: boolean;
+    rules?: FormItemRule;
+    error?: string;
+    for?: string;
+    validateStatus?: string;
+    inlineMessage?: string | boolean;
+    showMessage?: boolean;
+    size?: ComponentSize;
+}
+declare const _sfc_main: import("vue").DefineComponent<{
+    label: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    labelWidth: {
+        type: __PropType<Numberish | undefined>;
+        required: false;
+    };
+    prop: {
+        type: __PropType<FormItemProp | undefined>;
+        required: false;
+    };
+    required: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    rules: {
+        type: __PropType<FormItemRule | undefined>;
+        required: false;
+    };
+    error: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    for: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    validateStatus: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    inlineMessage: {
+        type: __PropType<string | boolean | undefined>;
+        required: false;
+    };
+    showMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    size: {
+        type: __PropType<ComponentSize | undefined>;
+        required: false;
+    };
+}, {
+    /**
+     * @description Form item size.
+     */
+    size: import("vue").ComputedRef<"" | "large" | "small" | "default">;
+    /**
+     * @description Validation message.
+     */
+    validateMessage: import("vue").Ref<string>;
+    /**
+     * @description Validation state.
+     */
+    validateState: import("vue").Ref<"" | "error" | "validating" | "success">;
+    /**
+     * @description Validate form item.
+     */
+    validate: (trigger: string, callback?: import("./types").FormValidateCallback | undefined) => import("./types").FormValidationResult;
+    /**
+     * @description Remove validation status of the field.
+     */
+    clearValidate: () => void;
+    /**
+     * @description Reset current field and remove validation result.
+     */
+    resetField: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    label: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    labelWidth: {
+        type: __PropType<Numberish | undefined>;
+        required: false;
+    };
+    prop: {
+        type: __PropType<FormItemProp | undefined>;
+        required: false;
+    };
+    required: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    rules: {
+        type: __PropType<FormItemRule | undefined>;
+        required: false;
+    };
+    error: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    for: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    validateStatus: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    inlineMessage: {
+        type: __PropType<string | boolean | undefined>;
+        required: false;
+    };
+    showMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    size: {
+        type: __PropType<ComponentSize | undefined>;
+        required: false;
+    };
+}>>, {}>;
+export default _sfc_main;

package/es/components/form/form-item.vue.js

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

package/es/components/form/form-item.vue2.js

@@ -0,0 +1,244 @@
+import { defineComponent as Y, useSlots as me, inject as D, ref as h, computed as o, watch as E, reactive as he, toRefs as ge, provide as ye, onMounted as be, onBeforeUnmount as Se, openBlock as L, createElementBlock as _e, normalizeClass as g, unref as i, createVNode as T, withCtx as F, createBlock as Ie, resolveDynamicComponent as Ve, normalizeStyle as G, renderSlot as M, createTextVNode as qe, toDisplayString as K, createCommentVNode as U, createElementVNode as O, TransitionGroup as we, nextTick as Fe } from "vue";
+import Me from "async-validator";
+import { castArray as H, clone as J } from "lodash";
+import { refDebounced as Re } from "@vueuse/core";
+import { addUnit as Q, isBoolean as We, isString as ze, isFunction as Be } from "@vft/utils";
+import "../../utils/ns-cover.js";
+import { getProp as R } from "../../utils/objects.js";
+import { useNamespace as $e } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import { useId as Ne } from "../../hooks/use-id/index.js";
+import { useFormSize as Ae } from "./hooks/use-form-common-props.js";
+import { formContextKey as Pe, formItemContextKey as X } from "./constants.js";
+import je from "./form-label-wrap.js";
+const De = ["role", "aria-labelledby"], n = (
+  /* hoist-static*/
+  $e("form-item")
+), Ee = Y({
+  name: n.b()
+}), xe = /* @__PURE__ */ Y({
+  ...Ee,
+  props: {
+    label: null,
+    labelWidth: null,
+    prop: null,
+    required: { type: Boolean },
+    rules: null,
+    error: null,
+    for: null,
+    validateStatus: null,
+    inlineMessage: { type: [String, Boolean] },
+    showMessage: { type: Boolean },
+    size: null
+  },
+  setup(Z, { expose: k }) {
+    const t = Z, W = me(), e = D(Pe, void 0), C = D(X, void 0), y = Ae(void 0, { formItem: !1 }), b = Ne().value, d = h([]), p = h(""), x = Re(p, 100), c = h(""), z = h();
+    let B, m = !1;
+    const $ = o(() => {
+      if ((e == null ? void 0 : e.labelPosition) === "top")
+        return {};
+      const r = Q(t.labelWidth || (e == null ? void 0 : e.labelWidth) || "");
+      return r ? { width: r } : {};
+    }), ee = o(() => {
+      if ((e == null ? void 0 : e.labelPosition) === "top" || e != null && e.inline)
+        return {};
+      if (!t.label && !t.labelWidth && le)
+        return {};
+      const r = Q(t.labelWidth || (e == null ? void 0 : e.labelWidth) || "");
+      return !t.label && !W.label ? { marginLeft: r } : {};
+    }), re = o(() => [
+      n.b(),
+      n.m(y.value),
+      n.is("error", p.value === "error"),
+      n.is("validating", p.value === "validating"),
+      n.is("success", p.value === "success"),
+      n.is("required", ne.value || t.required),
+      n.is("no-asterisk", e == null ? void 0 : e.hideRequiredAsterisk),
+      (e == null ? void 0 : e.requireAsteriskPosition) === "right" ? "asterisk-right" : "asterisk-left",
+      { [n.m("feedback")]: e == null ? void 0 : e.statusIcon }
+    ]), se = o(
+      () => We(t.inlineMessage) ? t.inlineMessage : (e == null ? void 0 : e.inlineMessage) || !1
+    ), te = o(() => [
+      n.e("error"),
+      { [n.em("error", "inline")]: se.value }
+    ]), ie = o(() => t.prop ? ze(t.prop) ? t.prop : t.prop.join(".") : ""), S = o(() => !!(t.label || W.label)), _ = o(() => t.for || d.value.length === 1 ? d.value[0] : void 0), I = o(() => !_.value && S.value), le = !!C, N = o(() => {
+      const r = e == null ? void 0 : e.model;
+      if (!(!r || !t.prop))
+        return R(r, t.prop).value;
+    }), V = o(() => {
+      const { required: r } = t, s = [];
+      t.rules && s.push(...H(t.rules));
+      const l = e == null ? void 0 : e.rules;
+      if (l && t.prop) {
+        const a = R(
+          l,
+          t.prop
+        ).value;
+        a && s.push(...H(a));
+      }
+      if (r !== void 0) {
+        const a = s.map((u, f) => [u, f]).filter(([u]) => Object.keys(u).includes("required"));
+        if (a.length > 0)
+          for (const [u, f] of a)
+            u.required !== r && (s[f] = { ...u, required: r });
+        else
+          s.push({ required: r });
+      }
+      return s;
+    }), ae = o(() => V.value.length > 0), oe = (r) => V.value.filter((l) => !l.trigger || !r ? !0 : Array.isArray(l.trigger) ? l.trigger.includes(r) : l.trigger === r).map(({ trigger: l, ...a }) => a), ne = o(
+      () => V.value.some((r) => r.required)
+    ), ue = o(
+      () => x.value === "error" && t.showMessage && ((e == null ? void 0 : e.showMessage) ?? !0)
+    ), A = o(
+      () => `${t.label || ""}${(e == null ? void 0 : e.labelSuffix) || ""}`
+    ), v = (r) => {
+      p.value = r;
+    }, de = (r) => {
+      var a;
+      const { errors: s, fields: l } = r;
+      (!s || !l) && console.error(r), v("error"), c.value = s ? ((a = s == null ? void 0 : s[0]) == null ? void 0 : a.message) ?? `${t.prop} is required` : "", e == null || e.emit("validate", t.prop, !1, c.value);
+    }, pe = () => {
+      v("success"), e == null || e.emit("validate", t.prop, !0, "");
+    }, ce = async (r) => {
+      const s = ie.value;
+      return new Me({
+        [s]: r
+      }).validate({ [s]: N.value }, { firstFields: !0 }).then(() => (pe(), !0)).catch((a) => (de(a), Promise.reject(a)));
+    }, P = async (r, s) => {
+      if (m || !t.prop)
+        return !1;
+      const l = Be(s);
+      if (!ae.value)
+        return s == null || s(!1), !1;
+      const a = oe(r);
+      return a.length === 0 ? (s == null || s(!0), !0) : (v("validating"), ce(a).then(() => (s == null || s(!0), !0)).catch((u) => {
+        const { fields: f } = u;
+        return s == null || s(!1, f), l ? !1 : Promise.reject(f);
+      }));
+    }, q = () => {
+      v(""), c.value = "", m = !1;
+    }, j = async () => {
+      const r = e == null ? void 0 : e.model;
+      if (!r || !t.prop)
+        return;
+      const s = R(r, t.prop);
+      m = !0, s.value = J(B), await Fe(), q(), m = !1;
+    }, ve = (r) => {
+      d.value.includes(r) || d.value.push(r);
+    }, fe = (r) => {
+      d.value = d.value.filter((s) => s !== r);
+    };
+    E(
+      () => t.error,
+      (r) => {
+        c.value = r || "", v(r ? "error" : "");
+      },
+      { immediate: !0 }
+    ), E(
+      () => t.validateStatus,
+      (r) => v(r || "")
+    );
+    const w = he({
+      ...ge(t),
+      $el: z,
+      size: y,
+      validateState: p,
+      labelId: b,
+      inputIds: d,
+      isGroup: I,
+      hasLabel: S,
+      addInputId: ve,
+      removeInputId: fe,
+      resetField: j,
+      clearValidate: q,
+      validate: P
+    });
+    return ye(X, w), be(() => {
+      t.prop && (e == null || e.addField(w), B = J(N.value));
+    }), Se(() => {
+      e == null || e.removeField(w);
+    }), k({
+      /**
+       * @description Form item size.
+       */
+      size: y,
+      /**
+       * @description Validation message.
+       */
+      validateMessage: c,
+      /**
+       * @description Validation state.
+       */
+      validateState: p,
+      /**
+       * @description Validate form item.
+       */
+      validate: P,
+      /**
+       * @description Remove validation status of the field.
+       */
+      clearValidate: q,
+      /**
+       * @description Reset current field and remove validation result.
+       */
+      resetField: j
+    }), (r, s) => {
+      var l;
+      return L(), _e("div", {
+        ref_key: "formItemRef",
+        ref: z,
+        class: g(i(re)),
+        role: i(I) ? "group" : void 0,
+        "aria-labelledby": i(I) ? i(b) : void 0
+      }, [
+        T(i(je), {
+          "is-auto-width": i($).width === "auto",
+          "update-all": ((l = i(e)) == null ? void 0 : l.labelWidth) === "auto"
+        }, {
+          default: F(() => [
+            i(S) ? (L(), Ie(Ve(i(_) ? "label" : "div"), {
+              key: 0,
+              id: i(b),
+              for: i(_),
+              class: g(i(n).e("label")),
+              style: G(i($))
+            }, {
+              default: F(() => [
+                M(r.$slots, "label", { label: i(A) }, () => [
+                  qe(K(i(A)), 1)
+                ])
+              ]),
+              _: 3
+            }, 8, ["id", "for", "class", "style"])) : U("", !0)
+          ]),
+          _: 3
+        }, 8, ["is-auto-width", "update-all"]),
+        O("div", {
+          class: g(i(n).e("content")),
+          style: G(i(ee))
+        }, [
+          M(r.$slots, "default"),
+          T(we, {
+            name: `${i(n).namespace.value}-zoom-in-top`
+          }, {
+            default: F(() => [
+              i(ue) ? M(r.$slots, "error", {
+                key: 0,
+                error: c.value
+              }, () => [
+                O("div", {
+                  class: g(i(te))
+                }, K(c.value), 3)
+              ]) : U("", !0)
+            ]),
+            _: 3
+          }, 8, ["name"])
+        ], 6)
+      ], 10, De);
+    };
+  }
+});
+export {
+  xe as default
+};

package/es/components/form/form-label-wrap.d.ts

@@ -0,0 +1,11 @@
+declare const _default: import("vue").DefineComponent<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+}, () => JSX.Element | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+}>>, {
+    isAutoWidth: boolean;
+    updateAll: boolean;
+}>;
+export default _default;

package/es/components/form/form-label-wrap.js

@@ -0,0 +1,70 @@
+import { defineComponent as N, inject as h, ref as s, onMounted as A, onBeforeUnmount as E, onUpdated as y, watch as M, computed as F, createVNode as b, Fragment as B, nextTick as O } from "vue";
+import { useResizeObserver as P } from "@vueuse/core";
+import "@vft/utils";
+import { throwError as C } from "../../utils/error.js";
+import "../../utils/ns-cover.js";
+import "lodash";
+import { useNamespace as K } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import { formContextKey as R, formItemContextKey as T } from "./constants.js";
+const W = "VftLabelWrap", x = /* @__PURE__ */ N({
+  name: W,
+  props: {
+    isAutoWidth: Boolean,
+    updateAll: Boolean
+  },
+  setup(l, {
+    slots: i
+  }) {
+    const t = h(R, void 0), n = h(T);
+    n || C(W, "usage: <vft-form-item><label-wrap /></vft-form-item>");
+    const v = K("form"), r = s(), o = s(0), L = () => {
+      var e;
+      if ((e = r.value) != null && e.firstElementChild) {
+        const a = window.getComputedStyle(r.value.firstElementChild).width;
+        return Math.ceil(Number.parseFloat(a));
+      } else
+        return 0;
+    }, m = (e = "update") => {
+      O(() => {
+        i.default && l.isAutoWidth && (e === "update" ? o.value = L() : e === "remove" && (t == null || t.deregisterLabelWidth(o.value)));
+      });
+    }, u = () => m("update");
+    return A(() => {
+      u();
+    }), E(() => {
+      m("remove");
+    }), y(() => u()), M(o, (e, a) => {
+      l.updateAll && (t == null || t.registerLabelWidth(e, a));
+    }), P(F(() => {
+      var e;
+      return ((e = r.value) == null ? void 0 : e.firstElementChild) ?? null;
+    }), u), () => {
+      var a, f;
+      if (!i)
+        return null;
+      const {
+        isAutoWidth: e
+      } = l;
+      if (e) {
+        const d = t == null ? void 0 : t.autoLabelWidth, g = n == null ? void 0 : n.hasLabel, p = {};
+        if (g && d && d !== "auto") {
+          const c = Math.max(0, Number.parseInt(d, 10) - o.value), w = t.labelPosition === "left" ? "marginRight" : "marginLeft";
+          c && (p[w] = `${c}px`);
+        }
+        return b("div", {
+          ref: r,
+          class: [v.be("item", "label-wrap")],
+          style: p
+        }, [(a = i.default) == null ? void 0 : a.call(i)]);
+      } else
+        return b(B, {
+          ref: r
+        }, [(f = i.default) == null ? void 0 : f.call(i)]);
+    };
+  }
+});
+export {
+  x as default
+};