ep-craft 0.1.27 → 0.1.28

package/dist/components/form/EpForm.vue.d.ts

@@ -0,0 +1,61 @@
+import type { Arrayable } from '@element-plus/utils';
+import type { FormProps } from './src/form';
+import type { FormItemContext, FormValidateCallback, FormValidationResult } from './src/types';
+import type { FormItemProp } from './src/form-item';
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<FormProps, {
+    /**
+     * @description Validate the whole form. Receives a callback or returns `Promise`.
+     */
+    validate: (callback?: FormValidateCallback) => FormValidationResult;
+    /**
+     * @description Validate specified fields.
+     */
+    validateField: (props?: Arrayable<FormItemProp>, callback?: FormValidateCallback) => FormValidationResult;
+    /**
+     * @description Reset specified fields and remove validation result.
+     */
+    resetFields: (props?: Arrayable<FormItemProp>) => void;
+    /**
+     * @description Clear validation message for specified fields.
+     */
+    clearValidate: (props?: Arrayable<FormItemProp>) => void;
+    /**
+     * @description Scroll to the specified fields.
+     */
+    scrollToField: (prop: FormItemProp) => void;
+    /**
+     * @description Get a field context.
+     */
+    getField: (prop: FormItemProp) => FormItemContext | undefined;
+    /**
+     * @description All fields context.
+     */
+    fields: import("vue").Reactive<FormItemContext[]>;
+    /**
+     * @description Set initial values for form fields. When `resetFields` is called, fields will reset to these values.
+     */
+    setInitialValues: (initModel: Record<string, any>) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    validate: (prop: FormItemProp, isValid: boolean, message: string) => void;
+}, string, import("vue").PublicProps, Readonly<FormProps> & Readonly<{
+    onValidate?: ((prop: FormItemProp, isValid: boolean, message: string) => any) | undefined;
+}>, {
+    labelWidth: string | number;
+    labelPosition: "left" | "right" | "top";
+    showMessage: boolean;
+    requireAsteriskPosition: "left" | "right";
+    labelSuffix: string;
+    validateOnRuleChange: boolean;
+    scrollIntoViewOptions: ScrollIntoViewOptions | boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/form/EpForm.vue.js

@@ -0,0 +1,199 @@
+import { defineComponent as j, ref as k, reactive as E, computed as B, watch as z, provide as $, toRefs as b, openBlock as W, createElementBlock as D, normalizeClass as K, renderSlot as L } from "vue";
+import { cloneDeep as p, castArray as G } from "lodash-unified";
+import { NOOP as H, isArray as J, isFunction as Q } from "@vue/shared";
+import "@vueuse/core";
+import { debugWarn as u } from "../../utils/error.js";
+import { getProp as y } from "../../utils/objects.js";
+import "@element-plus/icons-vue";
+import { useNamespace as U } from "../../hooks/use-namespace/index.js";
+import "../../hooks/use-size/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import "../../hooks/use-delayed-toggle/index.js";
+import "../../hooks/use-aria/index.js";
+import "../../hooks/use-model-toggle/index.js";
+import "../../hooks/use-empty-values/index.js";
+import { useFormSize as X } from "./src/hooks/use-form-common-props.js";
+import { formContextKey as Y } from "./src/constants.js";
+import { formEmits as Z } from "./src/form.js";
+import { useFormLabelWidth as ee, filterFields as m } from "./src/utils.js";
+const l = "ElForm", Fe = /* @__PURE__ */ j({
+  name: l,
+  __name: "EpForm",
+  props: {
+    model: {},
+    rules: {},
+    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 },
+    scrollToError: { type: Boolean },
+    scrollIntoViewOptions: { type: Boolean, default: !0 },
+    size: {},
+    disabled: { type: Boolean }
+  },
+  emits: Z,
+  setup(I, { expose: O, emit: C }) {
+    const s = I, P = C, d = k(), i = E([]), n = /* @__PURE__ */ new Map(), q = X(), a = U("form"), _ = B(() => {
+      const { labelPosition: e, inline: t } = s;
+      return [
+        a.b(),
+        a.m(q.value || "default"),
+        {
+          [a.m(`label-${e}`)]: e,
+          [a.m("inline")]: t
+        }
+      ];
+    }), c = (e) => m(i, [e])[0], x = (e) => {
+      i.includes(e) || i.push(e), e.propString && (n.has(e.propString) ? e.setInitialValue(n.get(e.propString)) : n.set(e.propString, p(e.fieldValue)));
+    }, R = (e, t) => {
+      if (t) {
+        n.delete(t);
+        return;
+      }
+      const r = i.indexOf(e);
+      r > -1 && (i.splice(r, 1), e.propString && n.set(e.propString, p(e.getInitialValue())));
+    }, v = (e) => {
+      if (!s.model) {
+        u(l, "model is required for setInitialValues to work.");
+        return;
+      }
+      if (!e) {
+        u(
+          l,
+          "initModel is required for setInitialValues to work."
+        );
+        return;
+      }
+      for (const t of n.keys())
+        n.set(t, p(y(e, t).value));
+      i.forEach((t) => {
+        t.prop && t.setInitialValue(y(e, t.prop).value);
+      });
+    }, w = (e = []) => {
+      if (!s.model) {
+        u(l, "model is required for resetFields to work.");
+        return;
+      }
+      m(i, e).forEach((o) => o.resetField());
+      const t = new Set(
+        i.map((o) => o.propString).filter(Boolean)
+      ), r = e.length > 0 ? G(e).map((o) => J(o) ? o.join(".") : o) : [...n.keys()];
+      for (const o of r)
+        !t.has(o) && n.has(o) && (y(s.model, o).value = p(
+          n.get(o)
+        ));
+    }, F = (e = []) => {
+      m(i, e).forEach((t) => t.clearValidate());
+    }, T = B(() => {
+      const e = !!s.model;
+      return e || u(l, "model is required for validate to work."), e;
+    }), A = (e) => {
+      if (i.length === 0) return [];
+      const t = m(i, e);
+      return t.length ? t : (u(l, "please pass correct props!"), []);
+    }, V = async (e) => h(void 0, e), M = async (e = []) => {
+      if (!T.value) return !1;
+      const t = A(e);
+      if (t.length === 0) return !0;
+      let r = {};
+      for (const o of t)
+        try {
+          await o.validate(""), o.validateState === "error" && !o.error && o.resetField();
+        } catch (f) {
+          r = {
+            ...r,
+            ...f
+          };
+        }
+      return Object.keys(r).length === 0 ? !0 : Promise.reject(r);
+    }, h = async (e = [], t) => {
+      let r = !1;
+      const o = !Q(t);
+      try {
+        return r = await M(e), r === !0 && await (t == null ? void 0 : t(r)), r;
+      } catch (f) {
+        if (f instanceof Error) throw f;
+        const S = f;
+        if (s.scrollToError && d.value) {
+          const g = d.value.querySelector(`.${a.b()}-item.is-error`);
+          g == null || g.scrollIntoView(s.scrollIntoViewOptions);
+        }
+        return !r && await (t == null ? void 0 : t(!1, S)), o && Promise.reject(S);
+      }
+    }, N = (e) => {
+      var r;
+      const t = c(e);
+      t && ((r = t.$el) == null || r.scrollIntoView(s.scrollIntoViewOptions));
+    };
+    return z(
+      () => s.rules,
+      () => {
+        s.validateOnRuleChange && V().catch(H);
+      },
+      { deep: !0, flush: "post" }
+    ), $(
+      Y,
+      E({
+        ...b(s),
+        emit: P,
+        resetFields: w,
+        clearValidate: F,
+        validateField: h,
+        getField: c,
+        addField: x,
+        removeField: R,
+        setInitialValues: v,
+        ...ee()
+      })
+    ), O({
+      /**
+       * @description Validate the whole form. Receives a callback or returns `Promise`.
+       */
+      validate: V,
+      /**
+       * @description Validate specified fields.
+       */
+      validateField: h,
+      /**
+       * @description Reset specified fields and remove validation result.
+       */
+      resetFields: w,
+      /**
+       * @description Clear validation message for specified fields.
+       */
+      clearValidate: F,
+      /**
+       * @description Scroll to the specified fields.
+       */
+      scrollToField: N,
+      /**
+       * @description Get a field context.
+       */
+      getField: c,
+      /**
+       * @description All fields context.
+       */
+      fields: i,
+      /**
+       * @description Set initial values for form fields. When `resetFields` is called, fields will reset to these values.
+       */
+      setInitialValues: v
+    }), (e, t) => (W(), D("form", {
+      ref_key: "formRef",
+      ref: d,
+      class: K(_.value)
+    }, [
+      L(e.$slots, "default")
+    ], 2));
+  }
+});
+export {
+  Fe as default
+};

package/dist/components/form/EpForm2.vue.js

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

package/dist/components/form/index.d.ts

@@ -1,7 +1,17 @@
 import type { Plugin } from 'vue';
-import { ElForm } from 'element-plus';
-export declare const EpForm: typeof ElForm & Plugin;
+import _EpForm from './EpForm.vue';
+import _EpFormItem from '../form-item/EpFormItem.vue';
+export declare const EpForm: typeof _EpForm & Plugin & {
+    FormItem: typeof _EpFormItem;
+};
 export default EpForm;
 export * from './src/constants';
 export * from './src/hooks/use-form-common-props';
 export * from './src/hooks/use-form-item';
+export { formEmits, formMetaProps, formProps } from './src/form';
+export { formItemProps, formItemValidateStates } from './src/form-item';
+export type { FormEmits, FormMetaProps, FormMetaPropsPublic, FormProps, FormPropsPublic, } from './src/form';
+export type { FormItemProp, FormItemProps, FormItemPropsPublic, FormItemValidateState, } from './src/form-item';
+export type { FormContext, FormItemContext, FormItemRule, FormLabelWidthContext, FormRules, FormValidateCallback, FormValidateFailure, FormValidationResult, } from './src/types';
+export type { FormInstance } from './instance';
+export type { FormItemInstance } from '../form-item/instance';

package/dist/components/form/index.js

@@ -1,12 +1,18 @@
-import { ElForm as o } from "element-plus";
 import { withInstall as m } from "../../utils/with-install.js";
+import o from "./EpForm.vue.js";
+import r from "../form-item/EpFormItem.vue.js";
 import "vue";
 import "../../hooks/use-size/index.js";
 import "@vueuse/core";
 import "@vue/shared";
 import "lodash-unified";
 import "@element-plus/icons-vue";
-const r = Object.assign({}, o, { name: "EpForm" }), a = m(r, "ep-form");
+import { formEmits as I, formMetaProps as E } from "./src/form.js";
+import { formItemValidateStates as b } from "./src/form-item.js";
+const _ = Object.assign(m(o, "ep-form"), { FormItem: r });
 export {
-  a as EpForm
+  _ as EpForm,
+  I as formEmits,
+  b as formItemValidateStates,
+  E as formMetaProps
 };

package/dist/components/form/instance.d.ts

@@ -0,0 +1,2 @@
+import type _EpForm from './EpForm.vue';
+export type FormInstance = InstanceType<typeof _EpForm>;

package/dist/components/form/src/form-item.d.ts

@@ -0,0 +1,103 @@
+import type { ExtractPublicPropTypes } from 'vue';
+import type { ComponentSize } from '@element-plus/constants';
+import type { Arrayable } from '@element-plus/utils';
+import type { FormItemRule } from './types';
+export declare const formItemValidateStates: readonly ["", "error", "validating", "success"];
+export type FormItemValidateState = (typeof formItemValidateStates)[number];
+export type FormItemProp = Arrayable<string>;
+export interface FormItemProps {
+    /**
+     * @description Label text.
+     */
+    label?: string;
+    /**
+     * @description Width of label, e.g. `'50px'`. `'auto'` is supported.
+     */
+    labelWidth?: string | number;
+    /**
+     * @description Position of label. If set to `'left'` or `'right'`, `label-width` prop is also required. The default is extend from `form label-position`.
+     */
+    labelPosition?: 'left' | 'right' | 'top' | '';
+    /**
+     * @description  A key of `model`. It could be an array of property paths (e.g `['a', 'b', '0']`). In the use of `validate` and `resetFields` method, the attribute is required.
+     */
+    prop?: FormItemProp;
+    /**
+     * @description Whether the field is required or not, will be determined by validation rules if omitted.
+     */
+    required?: boolean;
+    /**
+     * @description Validation rules of form, see the [following table](#formitemrule), more advanced usage at [async-validator](https://github.com/yiminghe/async-validator).
+     */
+    rules?: Arrayable<FormItemRule>;
+    /**
+     * @description Field error message, set its value and the field will validate error and show this message immediately.
+     */
+    error?: string;
+    /**
+     * @description Validation state of formItem.
+     */
+    validateStatus?: FormItemValidateState;
+    /**
+     * @description Same as for in native label.
+     */
+    for?: string;
+    /**
+     * @description Inline style validate message.
+     */
+    inlineMessage?: boolean;
+    /**
+     * @description Whether to show the error message.
+     */
+    showMessage?: boolean;
+    /**
+     * @description Control the size of components in this form-item.
+     */
+    size?: ComponentSize;
+}
+/**
+ * @deprecated Removed after 3.0.0, Use `FormItemProps` instead.
+ */
+export declare const formItemProps: {
+    readonly label: StringConstructor;
+    readonly labelWidth: {
+        readonly type: import("vue").PropType<import("@element-plus/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly labelPosition: import("@element-plus/utils").EpPropFinalized<StringConstructor, "" | "left" | "right" | "top", unknown, "", boolean>;
+    readonly prop: {
+        readonly type: import("vue").PropType<import("@element-plus/utils").EpPropMergeType<(new (...args: any[]) => string | string[]) | (() => FormItemProp) | (((new (...args: any[]) => string | string[]) | (() => FormItemProp)) | null)[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly required: import("@element-plus/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+    readonly rules: {
+        readonly type: import("vue").PropType<import("@element-plus/utils").EpPropMergeType<(new (...args: any[]) => FormItemRule | FormItemRule[]) | (() => Arrayable<FormItemRule>) | (((new (...args: any[]) => FormItemRule | FormItemRule[]) | (() => Arrayable<FormItemRule>)) | null)[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly error: StringConstructor;
+    readonly validateStatus: {
+        readonly type: import("vue").PropType<import("@element-plus/utils").EpPropMergeType<StringConstructor, "" | "error" | "success" | "validating", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly for: StringConstructor;
+    readonly inlineMessage: import("@element-plus/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+    readonly showMessage: import("@element-plus/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly size: {
+        readonly type: import("vue").PropType<import("@element-plus/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+};
+/**
+ * @deprecated Removed after 3.0.0, Use `FormItemProps` instead.
+ */
+export type FormItemPropsPublic = ExtractPublicPropTypes<typeof formItemProps>;

package/dist/components/form/src/form-item.js

@@ -0,0 +1,91 @@
+import { componentSizes as t } from "../../../constants/size.js";
+import "@vue/shared";
+import "lodash-unified";
+import "@vueuse/core";
+import "@element-plus/icons-vue";
+import { buildProps as r, definePropType as e } from "../../../utils/vue/props/runtime.js";
+import "vue";
+const i = [
+  "",
+  "error",
+  "validating",
+  "success"
+];
+r({
+  /**
+   * @description Label text.
+   */
+  label: String,
+  /**
+   * @description Width of label, e.g. `'50px'`. `'auto'` is supported.
+   */
+  labelWidth: {
+    type: [String, Number]
+  },
+  /**
+   * @description Position of label. If set to `'left'` or `'right'`, `label-width` prop is also required. The default is extend from `form label-position`.
+   */
+  labelPosition: {
+    type: String,
+    values: ["left", "right", "top", ""],
+    default: ""
+  },
+  /**
+   * @description  A key of `model`. It could be an array of property paths (e.g `['a', 'b', '0']`). In the use of `validate` and `resetFields` method, the attribute is required.
+   */
+  prop: {
+    type: e([String, Array])
+  },
+  /**
+   * @description Whether the field is required or not, will be determined by validation rules if omitted.
+   */
+  required: {
+    type: Boolean,
+    default: void 0
+  },
+  /**
+   * @description Validation rules of form, see the [following table](#formitemrule), more advanced usage at [async-validator](https://github.com/yiminghe/async-validator).
+   */
+  rules: {
+    type: e([Object, Array])
+  },
+  /**
+   * @description Field error message, set its value and the field will validate error and show this message immediately.
+   */
+  error: String,
+  /**
+   * @description Validation state of formItem.
+   */
+  validateStatus: {
+    type: String,
+    values: i
+  },
+  /**
+   * @description Same as for in native label.
+   */
+  for: String,
+  /**
+   * @description Inline style validate message.
+   */
+  inlineMessage: {
+    type: Boolean,
+    default: void 0
+  },
+  /**
+   * @description Whether to show the error message.
+   */
+  showMessage: {
+    type: Boolean,
+    default: !0
+  },
+  /**
+   * @description Control the size of components in this form-item.
+   */
+  size: {
+    type: String,
+    values: t
+  }
+});
+export {
+  i as formItemValidateStates
+};

package/dist/components/form/src/form-label-wrap.d.ts

@@ -0,0 +1,11 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+}>, () => import("vue/jsx-runtime").JSX.Element | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+}>> & Readonly<{}>, {
+    isAutoWidth: boolean;
+    updateAll: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/form/src/form-label-wrap.js

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