@transsionfe/semi-ui-vue 0.0.1

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

@@ -0,0 +1,336 @@
+import { defineComponent as Qe, ref as q, computed as x, watch as Ye, onMounted as Ze, onUnmounted as et, createElementBlock as s, renderSlot as K, unref as t, openBlock as o, normalizeStyle as tt, normalizeClass as h, Fragment as $, createBlock as n, createVNode as he, mergeProps as y, withCtx as Q, createCommentVNode as c, normalizeProps as f, guardReactiveProps as Y, createElementVNode as ke, isVNode as A, resolveDynamicComponent as M, createTextVNode as U, toDisplayString as L } from "vue";
+import Z from "classnames";
+import { isEqual as Ve } from "lodash";
+import { cssClasses as lt } from "@douyinfe/semi-foundation/form/constants";
+import { mergeProps as ot, transformTrigger as at, isValid as rt, generateValidatesFromRules as it } from "@douyinfe/semi-foundation/form/utils";
+import st from "@douyinfe/semi-foundation/utils/isPromise";
+import Ce from "@douyinfe/semi-foundation/utils/warning";
+import { useFormId as nt } from "./context.js";
+import Se from "./ErrorMessage.vue.js";
+import ee from "./Label.vue.js";
+import te from "../grid/Col.vue.js";
+/* empty css                */
+import dt from "./hooks/useFormUpdater.js";
+import ut from "./hooks/useArrayFieldState.js";
+import R from "./hooks/useStateWithGetter.js";
+import pt from "./hooks/useFormState.js";
+const ct = ["data-field", "x-field-id", "x-label-pos"], ft = {
+  key: 0,
+  style: { overflow: "hidden" }
+}, _t = /* @__PURE__ */ Qe({
+  name: "SemiFormFieldWrapper",
+  inheritAttrs: !1,
+  __name: "FieldWrapper",
+  props: {
+    field: {},
+    label: {},
+    labelPosition: {},
+    labelAlign: {},
+    labelWidth: {},
+    noLabel: { type: Boolean },
+    noErrorMessage: { type: Boolean },
+    name: {},
+    fieldClassName: {},
+    fieldStyle: {},
+    initValue: {},
+    validate: { type: Function },
+    rules: {},
+    trigger: {},
+    transform: { type: Function },
+    convert: { type: Function },
+    allowEmptyString: { type: Boolean },
+    stopValidateWithError: { type: Boolean },
+    helpText: {},
+    extraText: {},
+    extraTextPosition: {},
+    defaultValue: {},
+    pure: { type: Boolean },
+    labelCol: {},
+    wrapperCol: {},
+    isInInputGroup: { type: Boolean },
+    validateStatus: {},
+    keepState: { type: Boolean },
+    emptyValue: {},
+    allowEmpty: { type: Boolean },
+    required: { type: Boolean },
+    id: {}
+  },
+  setup(Pe) {
+    const $e = Pe, d = lt.PREFIX, le = nt(), Fe = ot($e), {
+      field: l,
+      label: i,
+      labelPosition: Te,
+      labelWidth: Ee,
+      labelAlign: _e,
+      labelCol: we,
+      wrapperCol: Be,
+      noLabel: j,
+      noErrorMessage: oe,
+      isInInputGroup: Ie,
+      initValue: k,
+      validate: ae,
+      validateStatus: F,
+      trigger: Ne,
+      allowEmptyString: We,
+      allowEmpty: qe,
+      rules: z,
+      required: re,
+      keepState: Ae,
+      transform: ie,
+      name: se,
+      fieldClassName: Me,
+      fieldStyle: Ue,
+      convert: ne,
+      helpText: Le,
+      extraText: r,
+      extraTextPosition: Re,
+      pure: je,
+      id: ze
+    } = Fe;
+    Ce(typeof l > "u", "[Semi Form]: 'field' is required, please check your props of Field Component");
+    const m = dt();
+    m.getFormProps || Ce(!0, "[Semi Form]: Field Component must be used inside the Form, please check your dom declaration");
+    const u = m.getFormProps([
+      "labelPosition",
+      "labelWidth",
+      "labelAlign",
+      "labelCol",
+      "wrapperCol",
+      "disabled",
+      "showValidateIcon",
+      "extraTextPosition",
+      "stopValidateWithError",
+      "trigger"
+    ]), de = Te || u.labelPosition, Ge = Ee || u.labelWidth, ue = _e || u.labelAlign, T = we || u.labelCol, pe = Be || u.wrapperCol, V = Re || u.extraTextPosition || "bottom", C = at(Ne, u.trigger), ce = typeof l < "u" ? m.getValue(l) : void 0;
+    let G = typeof k < "u" ? k : ce;
+    try {
+      const e = ut();
+      e != null && e.shouldUseInitValue && typeof k < "u" && (G = k);
+    } catch {
+    }
+    const [g, fe, me] = R(typeof G < "u" ? G : null), [E, Oe] = R(void 0), [ve, De] = R(!1), [_, w] = R(F), O = q(!1), Xe = x(() => C.includes("mount")), He = qe || We, D = pt(), ye = q(!1), B = q(!1), ge = q(void 0);
+    Ye(
+      () => {
+        var e;
+        return (e = D == null ? void 0 : D.values) == null ? void 0 : e[l];
+      },
+      (e) => {
+        if (l && ye.value && !B.value && e !== void 0) {
+          const a = g.value, p = ge.value;
+          if (Ve(e, a) || Ve(e, p))
+            return;
+          B.value = !0, ge.value = e, fe(e), Promise.resolve().then(() => {
+            B.value = !1;
+          });
+        }
+      },
+      { deep: !0 }
+    );
+    const S = (e, a) => {
+      const p = ie ? ie(e) : e, v = ne ? ne(p) : p;
+      fe(v), typeof l < "u" && !B.value && m.updateStateValue(l, v, a);
+    }, X = (e, a) => {
+      Oe(e), typeof l < "u" && m.updateStateError(l, e, a);
+    }, I = (e, a) => {
+      De(e), typeof l < "u" && m.updateStateTouched(l, e, a);
+    }, b = async (e = g.value) => {
+      var p, v;
+      if (O.value)
+        return;
+      let a;
+      if (z && z.length) {
+        const P = it(l || "", z);
+        try {
+          await P.validate({ [l || ""]: e });
+        } catch (W) {
+          a = ((v = (p = W.errors) == null ? void 0 : p[0]) == null ? void 0 : v.message) || W.message;
+        }
+      }
+      if (ae && !a) {
+        const P = ae(e);
+        if (st(P))
+          try {
+            await P;
+          } catch (W) {
+            a = W;
+          }
+        else P !== !0 && (a = P);
+      }
+      return X(a), I(!0), w(a ? "error" : F || "success"), a;
+    }, Je = {
+      getValue: me,
+      setValue: S,
+      getError: () => E.value,
+      setError: X,
+      getTouched: () => ve.value,
+      setTouched: I,
+      getStatus: () => _.value,
+      setStatus: w,
+      reset: () => {
+        S(typeof k < "u" ? k : ce, { notNotify: !0 }), X(void 0, { notNotify: !0 }), I(!1, { notNotify: !0 }), w(F);
+      },
+      validate: b
+    };
+    Ze(() => {
+      if (O.value = !1, Xe.value && b(g.value), typeof l > "u")
+        return;
+      const e = me();
+      m.register(
+        l,
+        {
+          value: e,
+          error: E.value,
+          touched: ve.value,
+          status: _.value
+        },
+        {
+          field: l,
+          fieldApi: Je,
+          keepState: Ae || !1,
+          allowEmpty: He
+        }
+      ), ye.value = !0;
+    }), et(() => {
+      O.value = !0, typeof l < "u" && m.unRegister(l);
+    });
+    const H = x(() => ({
+      modelValue: g.value,
+      "onUpdate:modelValue": (e) => {
+        S(e), C.includes("change") && b(e);
+      },
+      value: g.value,
+      "onUpdate:value": (e) => {
+        S(e), C.includes("change") && b(e);
+      },
+      checked: g.value,
+      "onUpdate:checked": (e) => {
+        S(e), C.includes("change") && b(e);
+      },
+      onChange: (e) => {
+        S(e), C.includes("change") && b(e);
+      },
+      onBlur: () => {
+        I(!0), C.includes("blur") && b(g.value);
+      },
+      validateStatus: _.value || F,
+      disabled: u.disabled,
+      "aria-required": re,
+      "aria-labelledby": l ? `${l}-label` : void 0,
+      name: se || l,
+      id: ze || (l && le ? `${le}-${l}` : l)
+    })), Ke = x(
+      () => Z(`${d}-field`, Me, {
+        [`${d}-field-error`]: !rt(E.value)
+      })
+    ), be = x(() => Z(T ? `${d}-col-${ue}` : "")), J = x(() => {
+      const e = typeof i == "object" && i !== null ? i.text : i, a = typeof i == "object" && i !== null ? i.extra : void 0, p = typeof i == "object" && i !== null ? i.optional : void 0, v = typeof i == "object" && i !== null ? i.required : void 0;
+      return {
+        text: e || l,
+        align: ue,
+        width: Ge,
+        required: v !== void 0 ? v : re,
+        optional: p,
+        extra: a,
+        name: se || l,
+        id: l ? `${l}-label` : void 0
+      };
+    }), xe = x(() => ({
+      error: E.value,
+      showValidateIcon: u.showValidateIcon,
+      validateStatus: _.value,
+      helpText: Le,
+      isInInputGroup: Ie,
+      errorMessageId: l ? `${l}-error-message` : void 0,
+      helpTextId: l ? `${l}-help-text` : void 0
+    })), N = x(
+      () => Z(`${d}-field-extra`, {
+        [`${d}-field-extra-string`]: typeof r == "string",
+        [`${d}-field-extra-middle`]: V === "middle",
+        [`${d}-field-extra-bottom`]: V === "bottom"
+      })
+    );
+    return (e, a) => t(je) ? K(e.$slots, "default", f(y({ key: 1 }, H.value))) : (o(), s("div", {
+      key: 0,
+      class: h(Ke.value),
+      style: tt(t(Ue)),
+      "data-field": t(l),
+      "x-field-id": t(l),
+      "x-label-pos": t(de)
+    }, [
+      t(T) && t(pe) ? (o(), s($, { key: 0 }, [
+        t(de) === "top" ? (o(), s("div", ft, [
+          he(t(te), y(t(T), { class: be.value }), {
+            default: Q(() => [
+              t(j) ? c("", !0) : (o(), n(ee, f(y({ key: 0 }, J.value)), null, 16))
+            ]),
+            _: 1
+          }, 16, ["class"])
+        ])) : (o(), n(t(te), y({ key: 1 }, t(T), { class: be.value }), {
+          default: Q(() => [
+            t(j) ? c("", !0) : (o(), n(ee, f(y({ key: 0 }, J.value)), null, 16))
+          ]),
+          _: 1
+        }, 16, ["class"])),
+        he(t(te), f(Y(t(pe))), {
+          default: Q(() => [
+            ke("div", {
+              class: h(`${t(d)}-field-main`)
+            }, [
+              t(r) && t(V) === "middle" ? (o(), s("div", {
+                key: 0,
+                class: h(N.value),
+                "x-semi-prop": "extraText"
+              }, [
+                A(t(r)) ? (o(), n(M(t(r)), { key: 0 })) : (o(), s($, { key: 1 }, [
+                  U(L(t(r)), 1)
+                ], 64))
+              ], 2)) : c("", !0),
+              K(e.$slots, "default", f(Y(H.value))),
+              t(oe) ? c("", !0) : (o(), n(Se, f(y({ key: 1 }, xe.value)), null, 16)),
+              t(r) && t(V) === "bottom" ? (o(), s("div", {
+                key: 2,
+                class: h(N.value),
+                "x-semi-prop": "extraText"
+              }, [
+                A(t(r)) ? (o(), n(M(t(r)), { key: 0 })) : (o(), s($, { key: 1 }, [
+                  U(L(t(r)), 1)
+                ], 64))
+              ], 2)) : c("", !0)
+            ], 2)
+          ]),
+          _: 3
+        }, 16)
+      ], 64)) : (o(), s($, { key: 1 }, [
+        t(j) ? c("", !0) : (o(), n(ee, f(y({ key: 0 }, J.value)), null, 16)),
+        ke("div", {
+          class: h(`${t(d)}-field-main`)
+        }, [
+          t(r) && t(V) === "middle" ? (o(), s("div", {
+            key: 0,
+            class: h(N.value),
+            "x-semi-prop": "extraText"
+          }, [
+            A(t(r)) ? (o(), n(M(t(r)), { key: 0 })) : (o(), s($, { key: 1 }, [
+              U(L(t(r)), 1)
+            ], 64))
+          ], 2)) : c("", !0),
+          K(e.$slots, "default", f(Y(H.value))),
+          t(oe) ? c("", !0) : (o(), n(Se, f(y({ key: 1 }, xe.value)), null, 16)),
+          t(r) && t(V) === "bottom" ? (o(), s("div", {
+            key: 2,
+            class: h(N.value),
+            "x-semi-prop": "extraText"
+          }, [
+            A(t(r)) ? (o(), n(M(t(r)), { key: 0 })) : (o(), s($, { key: 1 }, [
+              U(L(t(r)), 1)
+            ], 64))
+          ], 2)) : c("", !0)
+        ], 2)
+      ], 64))
+    ], 14, ct));
+  }
+});
+export {
+  _t as default
+};
+//# sourceMappingURL=FieldWrapper.vue.js.map

package/lib/es/components/form/FieldWrapper.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldWrapper.vue.js","sources":["../../../../src/components/form/FieldWrapper.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"!pure\"\n        :class=\"fieldCls\"\n        :style=\"fieldStyle\"\n        :data-field=\"field\"\n        :x-field-id=\"field\"\n        :x-label-pos=\"mergeLabelPos\"\n    >\n        <template v-if=\"mergeLabelCol && mergeWrapperCol\">\n            <div v-if=\"mergeLabelPos === 'top'\" style=\"overflow: hidden\">\n                <Col v-bind=\"mergeLabelCol\" :class=\"labelColCls\">\n                    <Label v-if=\"!noLabel\" v-bind=\"labelProps\" />\n                </Col>\n            </div>\n            <Col v-else v-bind=\"mergeLabelCol\" :class=\"labelColCls\">\n                <Label v-if=\"!noLabel\" v-bind=\"labelProps\" />\n            </Col>\n            <Col v-bind=\"mergeWrapperCol\">\n                <div :class=\"`${prefix}-field-main`\">\n                    <div v-if=\"extraText && mergeExtraPos === 'middle'\" :class=\"extraCls\" x-semi-prop=\"extraText\">\n                        <component :is=\"extraText\" v-if=\"isVNode(extraText)\" />\n                        <template v-else>{{ extraText }}</template>\n                    </div>\n                    <slot v-bind=\"fieldBindings\"></slot>\n                    <ErrorMessage v-if=\"!noErrorMessage\" v-bind=\"errorMessageProps\" />\n                    <div v-if=\"extraText && mergeExtraPos === 'bottom'\" :class=\"extraCls\" x-semi-prop=\"extraText\">\n                        <component :is=\"extraText\" v-if=\"isVNode(extraText)\" />\n                        <template v-else>{{ extraText }}</template>\n                    </div>\n                </div>\n            </Col>\n        </template>\n\n        <template v-else>\n            <Label v-if=\"!noLabel\" v-bind=\"labelProps\" />\n            <div :class=\"`${prefix}-field-main`\">\n                <div v-if=\"extraText && mergeExtraPos === 'middle'\" :class=\"extraCls\" x-semi-prop=\"extraText\">\n                    <component :is=\"extraText\" v-if=\"isVNode(extraText)\" />\n                    <template v-else>{{ extraText }}</template>\n                </div>\n                <slot v-bind=\"fieldBindings\"></slot>\n                <ErrorMessage v-if=\"!noErrorMessage\" v-bind=\"errorMessageProps\" />\n                <div v-if=\"extraText && mergeExtraPos === 'bottom'\" :class=\"extraCls\" x-semi-prop=\"extraText\">\n                    <component :is=\"extraText\" v-if=\"isVNode(extraText)\" />\n                    <template v-else>{{ extraText }}</template>\n                </div>\n            </div>\n        </template>\n    </div>\n\n    <slot v-else v-bind=\"fieldBindings\"></slot>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch, isVNode } from 'vue';\nimport classNames from 'classnames';\nimport { isEqual } from 'lodash';\nimport { cssClasses } from '@douyinfe/semi-foundation/form/constants';\nimport {\n    isValid,\n    generateValidatesFromRules,\n    mergeProps,\n    transformTrigger,\n} from '@douyinfe/semi-foundation/form/utils';\nimport isPromise from '@douyinfe/semi-foundation/utils/isPromise';\nimport warning from '@douyinfe/semi-foundation/utils/warning';\nimport { useStateWithGetter, useFormUpdater, useArrayFieldState, useFormState } from './hooks';\nimport { useFormId } from './context';\nimport ErrorMessage from './ErrorMessage.vue';\nimport Label from './Label.vue';\nimport { Col } from '../grid';\nimport type { CallOpts } from '@douyinfe/semi-foundation/form/interface';\nimport type { CommonFieldProps } from './interface';\n\ndefineOptions({ name: 'SemiFormFieldWrapper', inheritAttrs: false });\n\nconst props = defineProps<CommonFieldProps>();\n\nconst prefix = cssClasses.PREFIX;\n\nconst currentFormId = useFormId();\n\nconst merged = mergeProps(props);\nconst {\n    field,\n    label,\n    labelPosition,\n    labelWidth,\n    labelAlign,\n    labelCol,\n    wrapperCol,\n    noLabel,\n    noErrorMessage,\n    isInInputGroup,\n    initValue,\n    validate,\n    validateStatus,\n    trigger,\n    allowEmptyString,\n    allowEmpty,\n    rules,\n    required,\n    keepState,\n    transform,\n    name,\n    fieldClassName,\n    fieldStyle,\n    convert,\n    helpText,\n    extraText,\n    extraTextPosition,\n    pure,\n    id,\n} = merged;\n\nwarning(typeof field === 'undefined', \"[Semi Form]: 'field' is required, please check your props of Field Component\");\n\nconst updater = useFormUpdater();\n\nif (!updater.getFormProps) {\n    warning(true, '[Semi Form]: Field Component must be used inside the Form, please check your dom declaration');\n}\n\nconst formProps = updater.getFormProps([\n    'labelPosition',\n    'labelWidth',\n    'labelAlign',\n    'labelCol',\n    'wrapperCol',\n    'disabled',\n    'showValidateIcon',\n    'extraTextPosition',\n    'stopValidateWithError',\n    'trigger',\n]);\n\nconst mergeLabelPos = labelPosition || formProps.labelPosition;\nconst mergeLabelWidth = labelWidth || formProps.labelWidth;\nconst mergeLabelAlign = labelAlign || formProps.labelAlign;\nconst mergeLabelCol = labelCol || formProps.labelCol;\nconst mergeWrapperCol = wrapperCol || formProps.wrapperCol;\nconst mergeExtraPos = extraTextPosition || formProps.extraTextPosition || 'bottom';\nconst mergeTrigger = transformTrigger(trigger, formProps.trigger);\n\nconst initValueInFormOpts = typeof field !== 'undefined' ? updater.getValue(field) : undefined;\nlet initVal = typeof initValue !== 'undefined' ? initValue : initValueInFormOpts;\n\ntry {\n    const arrayFieldState = useArrayFieldState();\n    if (arrayFieldState?.shouldUseInitValue && typeof initValue !== 'undefined') {\n        initVal = initValue;\n    }\n} catch {}\n\nconst [value, setValue, getVal] = useStateWithGetter(typeof initVal !== 'undefined' ? initVal : null);\nconst [error, setError] = useStateWithGetter<any>(undefined);\nconst [touched, setTouched] = useStateWithGetter(false);\nconst [status, setStatus] = useStateWithGetter<string | undefined>(validateStatus);\n\nconst isUnmounted = ref(false);\nconst validateOnMount = computed(() => mergeTrigger.includes('mount'));\n\nconst allowEmptyValue = allowEmpty || allowEmptyString;\n\nconst formState = useFormState();\nconst isFieldMounted = ref(false);\nconst isUpdatingFromForm = ref(false);\nconst lastSyncedFormValue = ref<any>(undefined);\n\nwatch(\n    () => formState?.values?.[field!],\n    (newFormValue) => {\n        if (field && isFieldMounted.value && !isUpdatingFromForm.value && newFormValue !== undefined) {\n            const currentValue = value.value;\n            const lastSynced = lastSyncedFormValue.value;\n            if (isEqual(newFormValue, currentValue) || isEqual(newFormValue, lastSynced)) {\n                return;\n            }\n            isUpdatingFromForm.value = true;\n            lastSyncedFormValue.value = newFormValue;\n            setValue(newFormValue);\n            Promise.resolve().then(() => {\n                isUpdatingFromForm.value = false;\n            });\n        }\n    },\n    { deep: true }\n);\n\nconst updateValue = (newValue: any, opts?: CallOpts) => {\n    const transformedValue = transform ? transform(newValue) : newValue;\n    const convertedValue = convert ? convert(transformedValue) : transformedValue;\n    setValue(convertedValue);\n    if (typeof field !== 'undefined' && !isUpdatingFromForm.value) {\n        updater.updateStateValue(field, convertedValue, opts);\n    }\n};\n\nconst updateError = (newError: any, opts?: CallOpts) => {\n    setError(newError);\n    if (typeof field !== 'undefined') {\n        updater.updateStateError(field, newError, opts);\n    }\n};\n\nconst updateTouched = (isTouched: boolean, opts?: CallOpts) => {\n    setTouched(isTouched);\n    if (typeof field !== 'undefined') {\n        updater.updateStateTouched(field, isTouched, opts);\n    }\n};\n\nconst fieldValidate = async (val: any = value.value) => {\n    if (isUnmounted.value) {\n        return;\n    }\n\n    let errorMsg: any = undefined;\n\n    if (rules && rules.length) {\n        const validator = generateValidatesFromRules(field || '', rules);\n        try {\n            await validator.validate({ [field || '']: val });\n        } catch (err: any) {\n            errorMsg = err.errors?.[0]?.message || err.message;\n        }\n    }\n\n    if (validate && !errorMsg) {\n        const validateResult = validate(val);\n        if (isPromise(validateResult)) {\n            try {\n                await validateResult;\n            } catch (err: any) {\n                errorMsg = err;\n            }\n        } else if (validateResult !== true) {\n            errorMsg = validateResult;\n        }\n    }\n\n    updateError(errorMsg);\n    updateTouched(true);\n\n    if (errorMsg) {\n        setStatus('error');\n    } else {\n        setStatus(validateStatus || 'success');\n    }\n\n    return errorMsg;\n};\n\nconst fieldApi = {\n    getValue: getVal,\n    setValue: updateValue,\n    getError: () => error.value,\n    setError: updateError,\n    getTouched: () => touched.value,\n    setTouched: updateTouched,\n    getStatus: () => status.value,\n    setStatus,\n    reset: () => {\n        const resetValue = typeof initValue !== 'undefined' ? initValue : initValueInFormOpts;\n        updateValue(resetValue, { notNotify: true });\n        updateError(undefined, { notNotify: true });\n        updateTouched(false, { notNotify: true });\n        setStatus(validateStatus);\n    },\n    validate: fieldValidate,\n};\n\nonMounted(() => {\n    isUnmounted.value = false;\n    if (validateOnMount.value) {\n        fieldValidate(value.value);\n    }\n\n    if (typeof field === 'undefined') {\n        return;\n    }\n\n    const refValue = getVal();\n    updater.register(\n        field,\n        {\n            value: refValue,\n            error: error.value,\n            touched: touched.value,\n            status: status.value as 'error' | 'success' | undefined,\n        },\n        {\n            field,\n            fieldApi,\n            keepState: keepState || false,\n            allowEmpty: allowEmptyValue,\n        }\n    );\n\n    isFieldMounted.value = true;\n});\n\nonUnmounted(() => {\n    isUnmounted.value = true;\n    if (typeof field !== 'undefined') {\n        updater.unRegister(field);\n    }\n});\n\nconst fieldBindings = computed(() => ({\n    modelValue: value.value,\n    'onUpdate:modelValue': (val: any) => {\n        updateValue(val);\n        if (mergeTrigger.includes('change')) {\n            fieldValidate(val);\n        }\n    },\n    value: value.value,\n    'onUpdate:value': (val: any) => {\n        updateValue(val);\n        if (mergeTrigger.includes('change')) {\n            fieldValidate(val);\n        }\n    },\n    checked: value.value,\n    'onUpdate:checked': (val: any) => {\n        updateValue(val);\n        if (mergeTrigger.includes('change')) {\n            fieldValidate(val);\n        }\n    },\n    onChange: (val: any) => {\n        updateValue(val);\n        if (mergeTrigger.includes('change')) {\n            fieldValidate(val);\n        }\n    },\n    onBlur: () => {\n        updateTouched(true);\n        if (mergeTrigger.includes('blur')) {\n            fieldValidate(value.value);\n        }\n    },\n    validateStatus: status.value || validateStatus,\n    disabled: formProps.disabled,\n    'aria-required': required,\n    'aria-labelledby': field ? `${field}-label` : undefined,\n    name: name || field,\n    id: id || (field && currentFormId ? `${currentFormId}-${field}` : field),\n}));\n\nconst fieldCls = computed(() =>\n    classNames(`${prefix}-field`, fieldClassName, {\n        [`${prefix}-field-error`]: !isValid(error.value),\n    })\n);\n\nconst labelColCls = computed(() => classNames(mergeLabelCol ? `${prefix}-col-${mergeLabelAlign}` : ''));\n\nconst labelProps = computed(() => {\n    const labelText = typeof label === 'object' && label !== null ? label.text : label;\n    const labelExtra = typeof label === 'object' && label !== null ? label.extra : undefined;\n    const labelOptional = typeof label === 'object' && label !== null ? label.optional : undefined;\n    const labelRequired = typeof label === 'object' && label !== null ? label.required : undefined;\n\n    return {\n        text: labelText || field,\n        align: mergeLabelAlign,\n        width: mergeLabelWidth,\n        required: labelRequired !== undefined ? labelRequired : required,\n        optional: labelOptional,\n        extra: labelExtra,\n        name: name || field,\n        id: field ? `${field}-label` : undefined,\n    };\n});\n\nconst errorMessageProps = computed(() => ({\n    error: error.value,\n    showValidateIcon: formProps.showValidateIcon,\n    validateStatus: status.value,\n    helpText,\n    isInInputGroup,\n    errorMessageId: field ? `${field}-error-message` : undefined,\n    helpTextId: field ? `${field}-help-text` : undefined,\n}));\n\nconst extraCls = computed(() =>\n    classNames(`${prefix}-field-extra`, {\n        [`${prefix}-field-extra-string`]: typeof extraText === 'string',\n        [`${prefix}-field-extra-middle`]: mergeExtraPos === 'middle',\n        [`${prefix}-field-extra-bottom`]: mergeExtraPos === 'bottom',\n    })\n);\n</script>\n"],"names":["props","__props","prefix","cssClasses","currentFormId","useFormId","merged","mergeProps","field","label","labelPosition","labelWidth","labelAlign","labelCol","wrapperCol","noLabel","noErrorMessage","isInInputGroup","initValue","validate","validateStatus","trigger","allowEmptyString","allowEmpty","rules","required","keepState","transform","name","fieldClassName","fieldStyle","convert","helpText","extraText","extraTextPosition","pure","id","warning","updater","useFormUpdater","formProps","mergeLabelPos","mergeLabelWidth","mergeLabelAlign","mergeLabelCol","mergeWrapperCol","mergeExtraPos","mergeTrigger","transformTrigger","initValueInFormOpts","initVal","arrayFieldState","useArrayFieldState","value","setValue","getVal","useStateWithGetter","error","setError","touched","setTouched","status","setStatus","isUnmounted","ref","validateOnMount","computed","allowEmptyValue","formState","useFormState","isFieldMounted","isUpdatingFromForm","lastSyncedFormValue","watch","_a","newFormValue","currentValue","lastSynced","isEqual","updateValue","newValue","opts","transformedValue","convertedValue","updateError","newError","updateTouched","isTouched","fieldValidate","val","errorMsg","validator","generateValidatesFromRules","err","_b","validateResult","isPromise","fieldApi","onMounted","refValue","onUnmounted","fieldBindings","fieldCls","classNames","isValid","labelColCls","labelProps","labelText","labelExtra","labelOptional","labelRequired","errorMessageProps","extraCls","_unref","_renderSlot","_ctx","_createElementBlock","_Fragment","_openBlock","_hoisted_2","_createVNode","_mergeProps","_createBlock","Label","_createElementVNode","isVNode","_resolveDynamicComponent","ErrorMessage"],"mappings":"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"}

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

@@ -0,0 +1,277 @@
+import { defineComponent as M, mergeModels as U, useModel as Z, ref as d, shallowRef as _, computed as c, provide as b, watch as ee, onMounted as te, nextTick as C, onUnmounted as oe, createBlock as S, createElementBlock as re, openBlock as p, unref as x, withCtx as ne, createElementVNode as le, mergeProps as v, withModifiers as N, renderSlot as D, createCommentVNode as K, normalizeProps as A, resolveDynamicComponent as O } from "vue";
+import ae from "classnames";
+import { cssClasses as ie } from "@douyinfe/semi-foundation/form/constants";
+import { getUuidv4 as q } from "@douyinfe/semi-foundation/utils/uuid";
+import { cloneDeep as E, isEqual as W } from "lodash";
+import ue from "@douyinfe/semi-foundation/form/foundation";
+import { useFoundation as se } from "../../_utils/useFoundation.js";
+import { useBaseComponent as fe } from "../_utils/useBaseComponent.js";
+import { FormStateContextKey as me, FormApiContextKey as de, FormUpdaterContextKey as ce, FormIdContextKey as pe, ArrayFieldContextKey as ve } from "./context.js";
+import ge from "../grid/Row.vue.js";
+/* empty css                */
+const ye = ["id", "x-form-id"], he = ["id", "x-form-id"], we = /* @__PURE__ */ M({
+  name: "SemiForm",
+  inheritAttrs: !1,
+  __name: "Form",
+  props: /* @__PURE__ */ U({
+    "aria-label": {},
+    onSubmit: { type: Function, default: () => {
+    } },
+    onSubmitFail: { type: Function, default: () => {
+    } },
+    onReset: { type: Function, default: () => {
+    } },
+    onValueChange: { type: Function, default: () => {
+    } },
+    onErrorChange: { type: Function, default: () => {
+    } },
+    onChange: { type: Function, default: () => {
+    } },
+    allowEmpty: { type: Boolean, default: !1 },
+    validateFields: {},
+    id: {},
+    getFormApi: {},
+    style: {},
+    className: {},
+    extraTextPosition: {},
+    layout: { default: "vertical" },
+    labelPosition: { default: "top" },
+    labelWidth: {},
+    labelAlign: {},
+    labelCol: {},
+    wrapperCol: {},
+    render: {},
+    component: {},
+    children: {},
+    autoScrollToError: { type: Boolean, default: !1 },
+    disabled: { type: Boolean },
+    showValidateIcon: { type: Boolean, default: !0 },
+    stopValidateWithError: { type: Boolean },
+    stopPropagation: {},
+    trigger: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ U(["submit", "reset", "value-change", "error-change", "change"], ["update:modelValue"]),
+  setup(r, { expose: j, emit: z }) {
+    const l = Z(r, "modelValue"), o = r, g = z, f = ie.PREFIX, y = d(null), i = d(o.id || q()), R = d({
+      formId: ""
+    }), { adapter: X } = fe(o, R), G = {
+      ...X,
+      cloneDeep: E,
+      notifySubmit: (e, t) => {
+        o.onSubmit(e, t), g("submit", e, t);
+      },
+      notifySubmitFail: (e, t, n) => {
+        o.onSubmitFail(e, t, n);
+      },
+      forceUpdate: (e) => {
+        e && V.push(e), u && clearTimeout(u), u = setTimeout(() => {
+          const t = a.getFormState(!1);
+          H.value++, h.value && (h.value = t);
+          const n = [...V];
+          V.length = 0, C(() => {
+            n.forEach((Y) => Y());
+          }), u = null;
+        }, 0);
+      },
+      notifyChange: (e) => {
+        o.onChange(e), g("change", e);
+      },
+      notifyValueChange: (e, t) => {
+        o.onValueChange(e, t), g("value-change", e, t), s.value || C(() => {
+          !s.value && !W(e, l.value) && (l.value = E(e));
+        });
+      },
+      notifyErrorChange: (e, t) => {
+        o.onErrorChange(e, t), g("error-change", e, t);
+      },
+      notifyReset: () => {
+        o.onReset(), g("reset");
+      },
+      initFormId: () => {
+        i.value || (i.value = o.id || q()), R.value.formId = i.value;
+      },
+      getInitValues: () => l.value !== void 0 ? l.value : o.initValues || {},
+      getFormProps: (e) => {
+        if (typeof e > "u")
+          return o;
+        if (typeof e == "string")
+          return o[e];
+        {
+          const t = {};
+          return e.forEach((n) => {
+            t[n] = o[n];
+          }), t;
+        }
+      },
+      getAllErrorDOM: () => {
+        const e = y.value;
+        return e ? e.querySelectorAll(`.${f}-field-error-message`) : [];
+      },
+      getFieldDOM: (e) => {
+        const t = y.value;
+        return t ? t.querySelector(`[data-field="${e}"]`) : null;
+      },
+      getFieldErrorDOM: (e) => {
+        const t = y.value;
+        if (!t) return null;
+        const n = `.${f}-field[x-field-id="${e}"] .${f}-field-error-message`;
+        return t.querySelector(n);
+      }
+    }, { foundation: a } = se(ue, G), m = d(null), h = _(null), H = d(0);
+    let u = null;
+    const V = [], k = h, J = c(() => a.getModifyFormStateApi()), s = d(!1);
+    b(me, k), b(de, m), b(ce, J), b(pe, i);
+    const L = c(() => ({
+      shouldUseInitValue: !0
+    }));
+    b(ve, L);
+    let P = !1;
+    ee(
+      () => l.value,
+      (e) => {
+        if (!s.value && P && e !== void 0) {
+          const t = a.getFormState(!1).values;
+          W(t, e) || (s.value = !0, a.setValues(e, { isOverride: !0 }), C(() => {
+            s.value = !1;
+          }));
+        }
+      },
+      { deep: !0 }
+    ), te(() => {
+      P = !0, a.init(), m.value = a.getFormApi(), h.value = a.getFormState(!1), o.getFormApi && o.getFormApi(m.value), C(() => {
+        const e = a.getFormState(!1).values;
+        Object.keys(e).length > 0 && (l.value === void 0 || typeof l.value == "object" && l.value !== null && Object.keys(l.value).length === 0) && (s.value = !0, l.value = E(e), C(() => {
+          s.value = !1;
+        }));
+      });
+    }), oe(() => {
+      u && (clearTimeout(u), u = null), V.length = 0;
+    }), j({
+      get formApi() {
+        return m.value;
+      },
+      get formState() {
+        return h.value;
+      }
+    });
+    const w = c(
+      () => ae(f, o.className, {
+        [`${f}-vertical`]: o.layout === "vertical",
+        [`${f}-horizontal`]: o.layout === "horizontal"
+      })
+    ), Q = c(() => o.wrapperCol && o.labelCol), I = c(() => {
+      const e = [
+        "children",
+        "getFormApi",
+        "onChange",
+        "onSubmit",
+        "onSubmitFail",
+        "onErrorChange",
+        "onValueChange",
+        "component",
+        "render",
+        "validateFields",
+        "layout",
+        "style",
+        "className",
+        "labelPosition",
+        "labelWidth",
+        "labelAlign",
+        "labelCol",
+        "wrapperCol",
+        "allowEmpty",
+        "autoScrollToError",
+        "showValidateIcon",
+        "stopValidateWithError",
+        "extraTextPosition",
+        "id",
+        "trigger",
+        "disabled",
+        "modelValue",
+        "initValues"
+      ], t = {};
+      for (const n in o)
+        e.includes(n) || (t[n] = o[n]);
+      return t;
+    }), F = c(() => {
+      const e = k.value;
+      return e ? {
+        formState: {
+          ...e,
+          values: e.values || {},
+          errors: e.errors || {}
+        },
+        formApi: m.value,
+        values: e.values || {}
+      } : {
+        formState: { values: {}, errors: {} },
+        formApi: m.value,
+        values: {}
+      };
+    }), T = (e) => {
+      var t;
+      (t = o.stopPropagation) != null && t.submit && e.stopPropagation(), a.submit(e);
+    }, $ = (e) => {
+      var t;
+      e.preventDefault(), (t = o.stopPropagation) != null && t.reset && e.stopPropagation(), a.reset();
+    }, B = M({
+      name: "RenderVNode",
+      props: {
+        renderFn: {
+          type: Function,
+          required: !0
+        }
+      },
+      setup(e) {
+        return () => {
+          const t = e.renderFn(F.value);
+          return t == null ? null : typeof t == "string" || typeof t == "number" ? String(t) : t;
+        };
+      }
+    });
+    return (e, t) => Q.value ? (p(), S(x(ge), { key: 0 }, {
+      default: ne(() => [
+        le("form", v({
+          id: i.value,
+          ref_key: "formRef",
+          ref: y,
+          class: w.value,
+          style: o.style,
+          "x-form-id": i.value
+        }, I.value, {
+          onSubmit: N(T, ["prevent"]),
+          onReset: $
+        }), [
+          !r.render && !r.component ? D(e.$slots, "default", A(v({ key: 0 }, F.value))) : r.component ? (p(), S(O(r.component), A(v({ key: 1 }, F.value)), null, 16)) : r.render ? (p(), S(x(B), {
+            key: 2,
+            "render-fn": r.render
+          }, null, 8, ["render-fn"])) : K("", !0)
+        ], 16, ye)
+      ]),
+      _: 3
+    })) : (p(), re("form", v({
+      key: 1,
+      id: i.value,
+      ref_key: "formRef",
+      ref: y,
+      class: w.value,
+      style: o.style,
+      "x-form-id": i.value
+    }, I.value, {
+      onSubmit: N(T, ["prevent"]),
+      onReset: $
+    }), [
+      !r.render && !r.component ? D(e.$slots, "default", A(v({ key: 0 }, F.value))) : r.component ? (p(), S(O(r.component), A(v({ key: 1 }, F.value)), null, 16)) : r.render ? (p(), S(x(B), {
+        key: 2,
+        "render-fn": r.render
+      }, null, 8, ["render-fn"])) : K("", !0)
+    ], 16, he));
+  }
+});
+export {
+  we as default
+};
+//# sourceMappingURL=Form.vue.js.map