@aplus-frontend/ui/es/src/ap-form/item/index.vue.mjs

import { defineComponent as L, useSlots as _, ref as j, shallowRef as E, onMounted as M, computed as O, unref as r, cloneVNode as $, createBlock as y, openBlock as b, mergeProps as q, createSlots as K, withCtx as i, resolveDynamicComponent as Q, renderList as U, createElementVNode as Y, normalizeClass as G, createVNode as f, normalizeStyle as H, renderSlot as J, normalizeProps as W, guardReactiveProps as X } from "vue";
import { Form as Z, Tooltip as ee, TypographyText as oe } from "@aplus-frontend/antdv";
import { useToken as te } from "@aplus-frontend/antdv/es/theme/internal";
import { isFunction as v, cloneDeep as re, isArray as le, omit as F } from "lodash-unified";
import { apFormItemColPropKeys as ae } from "../constant.mjs";
import { QuestionCircleOutlined as ne } from "@ant-design/icons-vue";
import "../../config-provider/index.mjs";
import { useInjectForm as ie } from "../context.mjs";
import { getValidVNodeList as se } from "../../utils/slot.mjs";
import ue from "../style/item.mjs";
import { isPromise as de } from "../../utils/is.mjs";
import { useNamespace as fe } from "../../config-provider/hooks/use-namespace.mjs";
const ke = /* @__PURE__ */ L({
  name: "ApFormItem",
  __name: "index",
  props: {
    htmlFor: {},
    prefixCls: {},
    label: {},
    help: {},
    extra: {},
    labelCol: {},
    wrapperCol: {},
    hasFeedback: { type: Boolean, default: !1 },
    colon: { type: Boolean, default: void 0 },
    labelAlign: {},
    prop: {},
    name: {},
    rules: {},
    autoLink: { type: Boolean, default: !0 },
    required: { type: Boolean, default: void 0 },
    validateFirst: { type: Boolean, default: void 0 },
    validateStatus: {},
    validateTrigger: {},
    messageVariables: {},
    hidden: { type: Boolean },
    noStyle: { type: Boolean },
    tooltip: {},
    span: {},
    order: {},
    offset: {},
    push: {},
    pull: {},
    xs: {},
    sm: {},
    md: {},
    lg: {},
    xl: {},
    xxl: {},
    flex: {},
    bordered: { type: Boolean, default: !1 },
    valuePropName: { default: "value" },
    initialValue: {},
    _signal: {},
    transform: {},
    description: {},
    customFilled: {},
    disabled: { type: Boolean }
  },
  setup(V, { expose: h }) {
    const o = V, m = _(), { model: p, updateModel: g, internalInstance: B } = ie(), { m: u, b: C } = fe("ap-form-item"), k = ue("ap-form-item"), d = j(!1), n = E(), [, P] = te();
    M(async () => {
      let e = v(o.initialValue) ? o.initialValue() : o.initialValue;
      de(e) && (e = await e), B?.registerField({
        name: o.name,
        initialValue: re(e),
        transform: o.transform
      });
    });
    const c = O(() => o.name ? le(o.name) ? o.name.reduce((e, t) => e?.[t], r(p)) : p?.value[o.name] : null);
    function x(e, t) {
      const l = Object.keys(t), a = { ...t };
      return l.forEach((s) => {
        s in e || delete a[s];
      }), a;
    }
    function N() {
      const e = m.default?.() || [];
      if (!o.name)
        return e[0];
      const t = se(e)[0];
      if (!t)
        return null;
      const l = t?.type?.props ?? {}, a = {
        variant: o.bordered ? "borderless" : t?.props?.variant,
        bordered: o.bordered ? !1 : t?.props?.bordered,
        onFocus: S,
        onBlur: T
      };
      return $(t, {
        ...x(l, a),
        [o.valuePropName]: r(c),
        [`onUpdate:${o.valuePropName}`]: I
      });
    }
    function I(e) {
      g?.(o.name, e);
    }
    function S() {
      d.value = !0;
    }
    function T() {
      d.value = !1;
    }
    function w() {
      n.value?.onFieldBlur();
    }
    function R() {
      n.value?.onFieldChange();
    }
    function z() {
      n.value?.clearValidate();
    }
    function A() {
      n.value?.resetField();
    }
    function D(e = !1) {
      const t = r(c);
      if (!e || !o.transform)
        return t;
      const l = v(o.transform) ? o.transform : o.transform.transformer;
      return o.transform ? l(t) : t;
    }
    return h({
      onFieldBlur: w,
      onFieldChange: R,
      clearValidate: z,
      resetField: A,
      getFieldValue: D
    }), (e, t) => (b(), y(r(Z).Item, q(
      {
        ref_key: "formItemRef",
        ref: n
      },
      r(F)(o, [...r(ae), "tooltip", "label", "description"]),
      {
        class: {
          [r(u)("bordered")]: e.bordered,
          [r(u)("focused")]: e.bordered && d.value,
          [r(u)("disabled")]: e.bordered && e.disabled,
          [r(C)()]: !0,
          [r(k)]: !0
        },
        colon: e.bordered ? !1 : o.colon
      }
    ), K({
      default: i(() => [
        (b(), y(Q(N())))
      ]),
      _: 2
    }, [
      o.tooltip ? {
        name: "tooltip",
        fn: i(({ class: l }) => [
          Y("span", {
            class: G(l)
          }, [
            f(r(ee), {
              title: o.tooltip
            }, {
              default: i(() => [
                f(r(ne), {
                  style: H({
                    color: r(P).colorTextTertiary,
                    fontSize: "14px",
                    transform: "translateY(1px)"
                  })
                }, null, 8, ["style"])
              ]),
              _: 1
            }, 8, ["title"])
          ], 2)
        ]),
        key: "0"
      } : void 0,
      e.label ? {
        name: "label",
        fn: i(() => [
          f(r(oe), {
            content: e.label,
            ellipsis: { tooltip: e.label },
            style: { "min-width": "0px", flex: "1" }
          }, null, 8, ["content", "ellipsis"])
        ]),
        key: "1"
      } : void 0,
      U(r(F)(m, "default"), (l, a) => ({
        name: a,
        fn: i((s) => [
          J(e.$slots, a, W(X(s || {})))
        ])
      }))
    ]), 1040, ["class", "colon"]));
  }
});
export {
  ke as default
};