vft 0.0.46 → 0.0.48

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

@@ -0,0 +1,168 @@
+import type { PropType as __PropType } from 'vue';
+import type { ComponentSize } from '../types';
+import type { Arrayable } from 'vft/es/utils';
+import type { FormRules, FormItemProp, FormValidateCallback, FormValidationResult } from './types';
+export interface FormProps {
+    size?: ComponentSize;
+    disabled?: boolean;
+    model?: object;
+    rules?: FormRules;
+    labelPosition?: 'left' | 'right' | 'top';
+    requireAsteriskPosition?: 'left' | 'right';
+    labelWidth?: Numberish;
+    labelSuffix?: string;
+    inline?: boolean;
+    inlineMessage?: boolean;
+    statusIcon?: boolean;
+    showMessage?: boolean;
+    validateOnRuleChange?: boolean;
+    hideRequiredAsterisk?: boolean;
+    scrollToError?: boolean;
+}
+declare const _sfc_main: import("vue").DefineComponent<{
+    size: {
+        type: __PropType<ComponentSize | undefined>;
+        required: false;
+    };
+    disabled: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    model: {
+        type: __PropType<object | undefined>;
+        required: false;
+    };
+    rules: {
+        type: __PropType<Partial<Record<string, Arrayable<import("./types").FormItemRule>>> | undefined>;
+        required: false;
+    };
+    labelPosition: {
+        type: __PropType<"left" | "right" | "top" | undefined>;
+        required: false;
+    };
+    requireAsteriskPosition: {
+        type: __PropType<"left" | "right" | undefined>;
+        required: false;
+    };
+    labelWidth: {
+        type: __PropType<Numberish | undefined>;
+        required: false;
+    };
+    labelSuffix: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    inline: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    inlineMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    statusIcon: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    showMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    validateOnRuleChange: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    hideRequiredAsterisk: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    scrollToError: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+}, {
+    /**
+     * @description Validate the whole form. Receives a callback or returns `Promise`.
+     */
+    validate: (callback?: FormValidateCallback) => FormValidationResult;
+    /**
+     * @description Validate specified fields.
+     */
+    validateField: (props?: Arrayable<FormItemProp> | undefined, callback?: FormValidateCallback | undefined) => FormValidationResult;
+    /**
+     * @description Reset specified fields and remove validation result.
+     */
+    resetFields: (props?: Arrayable<FormItemProp> | undefined) => void;
+    /**
+     * @description Clear validation message for specified fields.
+     */
+    clearValidate: (props?: Arrayable<FormItemProp> | undefined) => void;
+    /**
+     * @description Scroll to the specified fields.
+     */
+    scrollToField: (prop: FormItemProp) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "validate"[], "validate", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    size: {
+        type: __PropType<ComponentSize | undefined>;
+        required: false;
+    };
+    disabled: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    model: {
+        type: __PropType<object | undefined>;
+        required: false;
+    };
+    rules: {
+        type: __PropType<Partial<Record<string, Arrayable<import("./types").FormItemRule>>> | undefined>;
+        required: false;
+    };
+    labelPosition: {
+        type: __PropType<"left" | "right" | "top" | undefined>;
+        required: false;
+    };
+    requireAsteriskPosition: {
+        type: __PropType<"left" | "right" | undefined>;
+        required: false;
+    };
+    labelWidth: {
+        type: __PropType<Numberish | undefined>;
+        required: false;
+    };
+    labelSuffix: {
+        type: __PropType<string | undefined>;
+        required: false;
+    };
+    inline: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    inlineMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    statusIcon: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    showMessage: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    validateOnRuleChange: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    hideRequiredAsterisk: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+    scrollToError: {
+        type: __PropType<boolean | undefined>;
+        required: false;
+    };
+}>> & {
+    onValidate?: ((...args: any[]) => any) | undefined;
+}, {}>;
+export default _sfc_main;

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

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

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

@@ -0,0 +1,151 @@
+import { defineComponent as y, computed as h, watch as O, getCurrentInstance as j, provide as q, reactive as x, openBlock as z, createElementBlock as S, normalizeClass as T, unref as I, renderSlot as M } from "vue";
+import { isFunction as R } from "@vft/utils";
+import { debugWarn as a } from "../../utils/error.js";
+import "../../utils/ns-cover.js";
+import "lodash";
+import { useNamespace as W } from "../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import { useFormSize as $ } from "./hooks/use-form-common-props.js";
+import { formContextKey as A } from "./constants.js";
+import { useFormLabelWidth as K, filterFields as d } from "./utils.js";
+const n = (
+  /* hoist-static*/
+  W("form")
+), L = y({
+  name: n.b()
+}), ee = /* @__PURE__ */ y({
+  ...L,
+  props: {
+    size: null,
+    disabled: { type: Boolean },
+    model: null,
+    rules: null,
+    labelPosition: { default: "right" },
+    requireAsteriskPosition: { default: "left" },
+    labelWidth: { default: "" },
+    labelSuffix: { default: "" },
+    inline: { type: Boolean },
+    inlineMessage: { type: Boolean },
+    statusIcon: { type: Boolean },
+    showMessage: { type: Boolean, default: !0 },
+    validateOnRuleChange: { type: Boolean, default: !0 },
+    hideRequiredAsterisk: { type: Boolean, default: !1 },
+    scrollToError: { type: Boolean }
+  },
+  emits: ["validate"],
+  setup(i, { expose: v, emit: F }) {
+    const l = [], g = $(), B = h(() => [
+      n.b(),
+      // todo: in v2.2.0, we can remove default
+      // in fact, remove it doesn't affect the final style
+      n.m(g.value || "default"),
+      {
+        [n.m(`label-${i.labelPosition}`)]: i.labelPosition,
+        [n.m("inline")]: i.inline
+      }
+    ]), w = (e) => {
+      l.push(e);
+    }, b = (e) => {
+      e.prop && l.splice(l.indexOf(e), 1);
+    }, u = (e = []) => {
+      if (!i.model) {
+        a(n.b(), "model is required for resetFields to work.");
+        return;
+      }
+      d(l, e).forEach((t) => t.resetField());
+    }, c = (e = []) => {
+      d(l, e).forEach((t) => t.clearValidate());
+    }, C = h(() => {
+      const e = !!i.model;
+      return e || a(n.b(), "model is required for validate to work."), e;
+    }), E = (e) => {
+      if (l.length === 0)
+        return [];
+      const t = d(l, e);
+      return t.length ? t : (a(n.b(), "please pass correct props!"), []);
+    }, m = async (e) => f(void 0, e), P = async (e = []) => {
+      if (!C.value)
+        return !1;
+      const t = E(e);
+      if (t.length === 0)
+        return !0;
+      let o = {};
+      for (const r of t)
+        try {
+          await r.validate("");
+        } catch (s) {
+          o = {
+            ...o,
+            ...s
+          };
+        }
+      return Object.keys(o).length === 0 ? !0 : Promise.reject(o);
+    }, f = async (e = [], t) => {
+      const o = !R(t);
+      try {
+        const r = await P(e);
+        return r === !0 && (t == null || t(r)), r;
+      } catch (r) {
+        if (r instanceof Error)
+          throw r;
+        const s = r;
+        return i.scrollToError && p(Object.keys(s)[0]), t == null || t(!1, s), o && Promise.reject(s);
+      }
+    }, p = (e) => {
+      var o;
+      const t = d(l, e)[0];
+      t && ((o = t.$el) == null || o.scrollIntoView());
+    };
+    O(
+      () => i.rules,
+      () => {
+        i.validateOnRuleChange && m().catch((e) => a(e));
+      },
+      { deep: !0 }
+    );
+    const V = j();
+    return q(
+      A,
+      x({
+        ...V.props,
+        emit: F,
+        resetFields: u,
+        clearValidate: c,
+        validateField: f,
+        addField: w,
+        removeField: b,
+        ...K()
+      })
+    ), v({
+      /**
+       * @description Validate the whole form. Receives a callback or returns `Promise`.
+       */
+      validate: m,
+      /**
+       * @description Validate specified fields.
+       */
+      validateField: f,
+      /**
+       * @description Reset specified fields and remove validation result.
+       */
+      resetFields: u,
+      /**
+       * @description Clear validation message for specified fields.
+       */
+      clearValidate: c,
+      /**
+       * @description Scroll to the specified fields.
+       */
+      scrollToField: p
+    }), (e, t) => (z(), S("form", {
+      class: T(I(B))
+    }, [
+      M(e.$slots, "default")
+    ], 2));
+  }
+});
+export {
+  ee as default
+};

package/es/components/form/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './use-form-common-props';
+export * from './use-form-item';

package/es/components/form/hooks/index.js

@@ -0,0 +1,10 @@
+import { useDisabled as o, useFormDisabled as r, useFormSize as s, useSize as u } from "./use-form-common-props.js";
+import { useFormItem as i, useFormItemInputId as F } from "./use-form-item.js";
+export {
+  o as useDisabled,
+  r as useFormDisabled,
+  i as useFormItem,
+  F as useFormItemInputId,
+  s as useFormSize,
+  u as useSize
+};

package/es/components/form/hooks/use-form-common-props.d.ts

@@ -0,0 +1,6 @@
+import type { ComponentSize } from 'vft/es/constants';
+import type { MaybeRef } from '@vueuse/core';
+export declare const useFormSize: (fallback?: MaybeRef<ComponentSize | undefined>, ignore?: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>>) => import("vue").ComputedRef<"" | "large" | "small" | "default">;
+export declare const useFormDisabled: (fallback?: MaybeRef<boolean | undefined>) => import("vue").ComputedRef<boolean>;
+export declare const useSize: (fallback?: MaybeRef<ComponentSize | undefined>, ignore?: Partial<Record<'prop' | 'form' | 'formItem' | 'global', boolean>>) => import("vue").ComputedRef<"" | "large" | "small" | "default">;
+export declare const useDisabled: (fallback?: MaybeRef<boolean | undefined>) => import("vue").ComputedRef<boolean>;

package/es/components/form/hooks/use-form-common-props.js

@@ -0,0 +1,28 @@
+import { ref as u, inject as r, computed as m, unref as p } from "vue";
+import "../../config-provider/hooks/use-global-config.js";
+import "@popperjs/core";
+import "lodash";
+import "../../../hooks/use-z-index/index.js";
+import "@vueuse/core";
+import "@vft/utils";
+import "../../../utils/ns-cover.js";
+import { useProp as d } from "../../../hooks/use-prop/index.js";
+import { useGlobalSize as a } from "../../../hooks/use-size/index.js";
+import { formContextKey as l, formItemContextKey as f } from "../constants.js";
+const v = (t, o = {}) => {
+  const e = u(void 0), n = o.prop ? e : d("size"), c = o.global ? e : a(), i = o.form ? { size: void 0 } : r(l, void 0), s = o.formItem ? { size: void 0 } : r(f, void 0);
+  return m(
+    () => n.value || p(t) || (s == null ? void 0 : s.size) || (i == null ? void 0 : i.size) || c.value || ""
+  );
+}, z = (t) => {
+  const o = d("disabled"), e = r(l, void 0);
+  return m(
+    () => o.value || p(t) || (e == null ? void 0 : e.disabled) || !1
+  );
+}, P = v, R = z;
+export {
+  R as useDisabled,
+  z as useFormDisabled,
+  v as useFormSize,
+  P as useSize
+};

package/es/components/form/hooks/use-form-item.d.ts

@@ -0,0 +1,18 @@
+import type { ComputedRef, Ref } from 'vue';
+import type { FormItemContext } from '../types';
+export declare const useFormItem: () => {
+    form: import("../types").FormContext | undefined;
+    formItem: FormItemContext | undefined;
+};
+export type IUseFormItemInputCommonProps = {
+    id?: string;
+    label?: string | number | boolean | Record<string, any>;
+};
+export declare const useFormItemInputId: (props: Partial<IUseFormItemInputCommonProps>, { formItemContext, disableIdGeneration, disableIdManagement }: {
+    formItemContext?: FormItemContext | undefined;
+    disableIdGeneration?: ComputedRef<boolean> | Ref<boolean> | undefined;
+    disableIdManagement?: ComputedRef<boolean> | Ref<boolean> | undefined;
+}) => {
+    isLabeledByFormItem: ComputedRef<boolean>;
+    inputId: Ref<string | undefined>;
+};

package/es/components/form/hooks/use-form-item.js

@@ -0,0 +1,48 @@
+import { inject as h, ref as l, computed as y, onMounted as F, watch as f, toRef as K, onUnmounted as U } from "vue";
+import "../../config-provider/hooks/use-global-config.js";
+import "@popperjs/core";
+import "lodash";
+import "../../../hooks/use-z-index/index.js";
+import { useId as j } from "../../../hooks/use-id/index.js";
+import "@vueuse/core";
+import "@vft/utils";
+import "../../../utils/ns-cover.js";
+import { formContextKey as B, formItemContextKey as L } from "../constants.js";
+const O = () => {
+  const v = h(B, void 0), u = h(L, void 0);
+  return {
+    form: v,
+    formItem: u
+  };
+}, P = (v, {
+  formItemContext: u,
+  disableIdGeneration: o,
+  disableIdManagement: i
+}) => {
+  o || (o = l(!1)), i || (i = l(!1));
+  const p = l();
+  let d;
+  const w = y(() => {
+    var r;
+    return !!(!v.label && u && u.inputIds && ((r = u.inputIds) == null ? void 0 : r.length) <= 1);
+  });
+  return F(() => {
+    d = f(
+      [K(v, "id"), o],
+      ([r, s]) => {
+        const c = r ?? (s ? void 0 : j().value);
+        c !== p.value && (u != null && u.removeInputId && (p.value && u.removeInputId(p.value), !(i != null && i.value) && !s && c && u.addInputId(c)), p.value = c);
+      },
+      { immediate: !0 }
+    );
+  }), U(() => {
+    d && d(), u != null && u.removeInputId && p.value && u.removeInputId(p.value);
+  }), {
+    isLabeledByFormItem: w,
+    inputId: p
+  };
+};
+export {
+  O as useFormItem,
+  P as useFormItemInputId
+};