@para-ui/core 5.0.2 → 5.0.3-beta.10

package/es/FieldForm/FieldFormItem/index.js

@@ -1,16 +1,16 @@
-import { j as g } from "../../_virtual/jsx-runtime.js";
-import { useContext as h, useRef as ae, useMemo as U, isValidElement as W, Children as $, cloneElement as P } from "react";
-import { FieldContext as de, ListContext as le, Field as me } from "rc-field-form";
-import fe from "rc-util/lib/hooks/useState";
-import { supportRef as ue } from "rc-util/lib/ref";
-import ge from "./MemoInput.js";
-import { FormContext as ce, NoStyleItemContext as pe } from "../context.js";
-import he from "../hooks/useChildren.js";
-import ye from "../hooks/useFormItemStatus.js";
-import be from "../hooks/useFrameState.js";
-import Ce from "../hooks/useItemRef.js";
-import { getStatus as Se, toArray as j, getFieldId as Ie, isReactComponent as B } from "../util.js";
-import we from "./ItemHolder.js";
+import { j as u } from "../../_virtual/jsx-runtime.js";
+import { useContext as y, useMemo as T, useRef as le, isValidElement as W, Children as $, cloneElement as j } from "react";
+import { FieldContext as ce, ListContext as fe, Field as ge } from "rc-field-form";
+import ue from "rc-util/lib/hooks/useState";
+import { supportRef as pe } from "rc-util/lib/ref";
+import he from "./MemoInput.js";
+import { FormContext as ye, NoStyleItemContext as be } from "../context.js";
+import Ce from "../hooks/useChildren.js";
+import Ie from "../hooks/useFormItemStatus.js";
+import Se from "../hooks/useFrameState.js";
+import Pe from "../hooks/useItemRef.js";
+import { isCompactControlChild as ve, getStatus as we, toArray as N, joinNamePath as Ee, getFieldId as Fe, isReactComponent as B } from "../util.js";
+import Te from "./ItemHolder.js";
 function G() {
   return {
     errors: [],
@@ -21,147 +21,158 @@ function G() {
     validated: !1
   };
 }
-const ve = "__SPLIT__";
-function Fe(y) {
+const je = "__SPLIT__", Ne = { namePath: [], path: "" };
+function xe(b) {
   const {
-    noStyle: E,
+    noStyle: x,
     shouldUpdate: J,
-    dependencies: x,
-    messageVariables: R,
-    trigger: N = "onChange",
-    validateTrigger: T,
-    children: M,
-    required: b,
-    hidden: Q,
-    rules: X,
+    dependencies: R,
+    messageVariables: _,
+    trigger: q = "onChange",
+    validateTrigger: z,
+    children: Q,
+    required: C,
+    hidden: X,
+    rules: Z,
     name: l,
-    label: q,
-    disabled: C,
+    label: A,
+    disabled: I,
     helperText: S,
-    hasFeedback: z,
-    validateStatus: L,
-    size: I
-  } = y, { name: Y, disabled: w, size: v } = h(ce), n = he(M), V = typeof n == "function", _ = h(pe), { validateTrigger: Z } = h(de), A = T !== void 0 ? T : Z, F = l != null, ee = h(le), K = ae(), [O, re] = be({}), [a, te] = fe(() => G()), ne = (r) => {
-    const i = ee?.getKey(r.name);
-    if (te(r.destroy ? G() : r, !0), E && S !== !1 && _) {
-      let t = r.name;
-      if (r.destroy)
-        t = K.current || t;
-      else if (i !== void 0) {
-        const [s, e] = i;
-        t = [s, ...e], K.current = t;
+    hasFeedback: L,
+    validateStatus: V,
+    size: P,
+    spacing: v
+  } = b, { name: ee, disabled: w, size: E } = y(ye), t = Ce(Q), re = T(
+    () => v === void 0 && ve(t) ? "compact" : void 0,
+    [v, t]
+  ), K = typeof t == "function", M = y(be), { validateTrigger: te } = y(ce), O = z !== void 0 ? z : te, F = l != null, ne = y(fe), k = le(), [D, ie] = Se({}), [a, oe] = ue(() => G()), se = (e) => {
+    const o = ne?.getKey(e.name);
+    if (oe(e.destroy ? G() : e, !0), x && S !== !1 && M) {
+      let n = e.name;
+      if (e.destroy)
+        n = k.current || n;
+      else if (o !== void 0) {
+        const [s, r] = o;
+        n = [s, ...r], k.current = n;
       }
-      _(r, t);
+      M(e, n);
     }
-  }, ie = (r, i) => {
-    re((t) => {
+  }, ae = (e, o) => {
+    ie((n) => {
       const s = {
-        ...t
-      }, f = [...r.name.slice(0, -1), ...i].join(ve);
-      return r.destroy ? delete s[f] : s[f] = r, s;
+        ...n
+      }, i = [...e.name.slice(0, -1), ...o].join(je);
+      return e.destroy ? delete s[i] : s[i] = e, s;
     });
-  }, [c, k] = U(() => {
-    const r = [...a.errors], i = [...a.warnings];
-    return Object.values(O).forEach((t) => {
-      r.push(...t.errors || []), i.push(...t.warnings || []);
-    }), [r, i];
-  }, [O, a.errors, a.warnings]), m = U(
-    () => Se(a.errors, a.warnings, a, "", !!z, L),
-    [a, z, L]
-  ), D = (r, i, t, s) => E && !Q ? /* @__PURE__ */ g.jsx(g.Fragment, { children: $.map(r, (e) => B(e) ? P(e, {
+  }, [p, Y] = T(() => {
+    const e = [...a.errors], o = [...a.warnings];
+    return Object.values(D).forEach((n) => {
+      e.push(...n.errors || []), o.push(...n.warnings || []);
+    }), [e, o];
+  }, [D, a.errors, a.warnings]), c = T(
+    () => we(a.errors, a.warnings, a, "", !!L, V),
+    [a, L, V]
+  ), H = (e, o, n, s, r = Ne) => x && !X ? /* @__PURE__ */ u.jsx(u.Fragment, { children: $.map(e, (i) => B(i) ? j(i, {
     ...s,
     name: l,
-    disabled: C ?? w,
-    error: m === "error" || m === "warning",
-    size: I ?? v,
-    ...e.props
-  }) : e) }) : /* @__PURE__ */ g.jsx(
-    we,
+    disabled: I ?? w,
+    error: c === "error" || c === "warning",
+    size: P ?? E,
+    ...i.props
+  }) : i) }) : /* @__PURE__ */ u.jsx(
+    Te,
     {
-      ...y,
-      fieldId: i,
-      required: b ?? t,
-      errors: c,
-      warnings: k,
-      status: m,
+      ...b,
+      fieldId: o,
+      required: C ?? n,
+      errors: p,
+      warnings: Y,
+      status: c,
       meta: a,
-      onSubItemMetaChange: ie,
-      children: $.map(r, (e) => B(e) ? P(e, {
+      identityMeta: r,
+      onSubItemMetaChange: ae,
+      spacing: v ?? re,
+      children: $.map(e, (i) => B(i) ? j(i, {
         ...s,
         name: l,
-        disabled: C ?? w,
-        error: m === "error" || m === "warning",
-        size: I ?? v,
-        ...e.props
-      }) : e)
+        disabled: I ?? w,
+        error: c === "error" || c === "warning",
+        size: P ?? E,
+        ...i.props
+      }) : i)
     }
   );
-  if (!F && !V && !x)
-    return D(n);
-  let u = {};
-  typeof q == "string" ? u.label = q : l && (u.label = String(l)), R && (u = { ...u, ...R });
-  const se = Ce(), oe = ({ control: r, fieldId: i, isRequired: t, mergedName: s }) => {
-    if (!W(n)) return null;
-    const e = {
-      ...n.props,
-      ...r,
-      disabled: C ?? w,
-      error: m === "error" || m === "warning",
-      size: n.props?.size ?? I ?? v
+  if (!F && !K && !R)
+    return H(t);
+  let g = {};
+  typeof A == "string" ? g.label = A : l && (g.label = String(l)), _ && (g = { ...g, ..._ });
+  const de = Pe(), me = ({
+    control: e,
+    fieldId: o,
+    isRequired: n,
+    mergedName: s
+  }) => {
+    if (!W(t)) return null;
+    const r = {
+      ...t.props,
+      ...e,
+      disabled: I ?? w,
+      error: c === "error" || c === "warning",
+      size: t.props?.size ?? P ?? E
     };
-    if (e.fieldId || (e["data-field-id"] = i), S || c.length > 0 || k.length > 0) {
-      const o = [];
-      (S || c.length > 0) && o.push(`${i}_help`), e["aria-describedby"] = o.join(" ");
+    if (r.fieldId || (r["data-field-id"] = o), S || p.length > 0 || Y.length > 0) {
+      const d = [];
+      (S || p.length > 0) && d.push(`${o}_help`), r["aria-describedby"] = d.join(" ");
     }
-    c.length > 0 && (e["aria-invalid"] = "true"), t && (e["aria-required"] = "true"), ue(n) && (e.ref = se(s, n)), (/* @__PURE__ */ new Set([...j(N), ...j(A)])).forEach((o) => {
-      e[o] = (...d) => {
-        r[o]?.(...d), n.props[o]?.(...d);
+    p.length > 0 && (r["aria-invalid"] = "true"), n && (r["aria-required"] = "true"), pe(t) && (r.ref = de(s, t)), (/* @__PURE__ */ new Set([...N(q), ...N(O)])).forEach((d) => {
+      r[d] = (...m) => {
+        e[d]?.(...m), t.props[d]?.(...m);
       };
     });
-    const p = [
-      e["aria-required"],
-      e["aria-invalid"],
-      e["aria-describedby"]
+    const h = [
+      r["aria-required"],
+      r["aria-invalid"],
+      r["aria-describedby"]
     ];
-    return /* @__PURE__ */ g.jsx(
-      ge,
+    return /* @__PURE__ */ u.jsx(
+      he,
       {
-        control: r,
-        update: n,
-        childProps: p,
-        children: P(n, e)
+        control: e,
+        update: t,
+        childProps: h,
+        children: j(t, r)
       }
     );
   };
-  return /* @__PURE__ */ g.jsx(
-    me,
+  return /* @__PURE__ */ u.jsx(
+    ge,
     {
-      ...y,
-      messageVariables: u,
-      trigger: N,
-      validateTrigger: A,
-      onMetaChange: ne,
-      children: (r, i, t) => {
-        const s = j(l).length && i ? i.name : [], e = Ie(s, Y), f = b !== void 0 ? b : !!X?.some((d) => {
-          if (d && typeof d == "object" && d.required && !d.warningOnly)
+      ...b,
+      messageVariables: g,
+      trigger: q,
+      validateTrigger: O,
+      onMetaChange: se,
+      children: (e, o, n) => {
+        const s = N(l).length && o ? o.name : [], r = { namePath: s, path: Ee(s) }, i = Fe(s, ee), h = C !== void 0 ? C : !!Z?.some((f) => {
+          if (f && typeof f == "object" && f.required && !f.warningOnly)
             return !0;
-          if (typeof d == "function") {
-            const H = d(t);
-            return H?.required && !H?.warningOnly;
+          if (typeof f == "function") {
+            const U = f(n);
+            return U?.required && !U?.warningOnly;
           }
           return !1;
-        }), p = {
-          ...r
+        }), d = {
+          ...e
         };
-        let o = null;
-        return Array.isArray(n) && F ? o = n : W(n) ? o = oe({ control: p, fieldId: e, isRequired: f, mergedName: s }) : V && (J || x) && !F ? o = n(t) : o = n, D(o, e, f, p);
+        let m = null;
+        return Array.isArray(t) && F ? m = t : W(t) ? m = me({ control: d, fieldId: i, isRequired: h, mergedName: s }) : K && (J || R) && !F ? m = t(n) : m = t, H(m, i, h, d, r);
       }
     }
   );
 }
-const Pe = Fe;
-Pe.useStatus = ye;
+const Re = xe;
+Re.useStatus = Ie;
 export {
-  Pe as default
+  Re as default
 };
 //# sourceMappingURL=index.js.map

package/es/FieldForm/Form.d.ts

@@ -2,7 +2,7 @@ import { PropsWithChildren, RefAttributes, ReactElement, FC, ReactNode } from 'r
 import { useWatch } from 'rc-field-form';
 import { FormProps as RcFormProps } from 'rc-field-form/lib/Form';
 import { FormRef } from 'rc-field-form/lib/interface';
-import { FormLabelAlign } from './interface';
+import { FormLabelAlign, ItemDecorator } from './interface';
 import { FormInstance, default as useForm } from './hooks/useForm';
 import { FeedbackIcons } from './FieldFormItem';
 export type RequiredMark = boolean | 'optional' | ((labelNode: ReactNode, info: {
@@ -22,6 +22,8 @@ export interface FormProps<Values = unknown> extends Omit<RcFormProps<Values>, '
     disabled?: boolean;
     requiredMark?: RequiredMark;
     size?: 'small' | 'medium' | 'large';
+    spacing?: 'normal' | 'compact';
+    itemDecorator?: ItemDecorator;
 }
 declare const FieldForm: (<Values = unknown>(props: PropsWithChildren<FormProps<Values>> & RefAttributes<FormRef<Values>>) => ReactElement) & Pick<FC, "displayName">;
 export { useForm, useWatch, type FormInstance };

package/es/FieldForm/Form.js

@@ -1,92 +1,96 @@
 import { j as i } from "../_virtual/jsx-runtime.js";
-import { forwardRef as P, useState as S, useContext as T, useMemo as F, useRef as q, useImperativeHandle as w, useEffect as z } from "react";
-import V from "../_virtual/index.js";
-import G from "rc-field-form";
-import { useWatch as ie } from "rc-field-form";
-import { $prefixCls as H } from "../GlobalContext/constant.js";
-import k from "./hooks/useForm.js";
-import { FormProvider as B, FormContext as D } from "./context.js";
-import { defaultValidateMessages as J } from "./lang/index.js";
-import K from "../GlobalContext/index.js";
-const n = `${H}-field-form`, O = (b, W) => {
+import { forwardRef as T, useState as q, useContext as w, useMemo as W, useRef as z, useImperativeHandle as V, useEffect as D } from "react";
+import G from "../_virtual/index.js";
+import H from "rc-field-form";
+import { useWatch as me } from "rc-field-form";
+import { $prefixCls as k } from "../GlobalContext/constant.js";
+import B from "./hooks/useForm.js";
+import { FormProvider as J, FormContext as K } from "./context.js";
+import { defaultValidateMessages as O } from "./lang/index.js";
+import Q from "../GlobalContext/index.js";
+const n = `${k}-field-form`, U = (v, E) => {
   const {
-    className: v,
+    className: R,
     disabled: m,
-    form: E,
+    form: g,
     colon: c,
     labelAlign: f,
     labelWidth: r,
-    labelWrap: R,
+    labelWrap: M,
     layout: d = "vertical",
-    onFinishFailed: M,
+    onFinishFailed: C,
     name: t,
-    style: g,
+    style: L,
     size: u,
-    ...C
-  } = b, [l, L] = S(0), { language: p } = T(K), j = F(
-    () => J[p || "zh"],
-    [p]
-  ), [o] = k(E), { __INTERNAL__: x } = o;
-  x.name = t;
-  const a = q(null);
-  w(W, () => ({
+    spacing: p = "normal",
+    itemDecorator: x,
+    ...j
+  } = v, [l, y] = q(0), { language: h } = w(Q), I = W(
+    () => O[h || "zh"],
+    [h]
+  ), [o] = B(g), { __INTERNAL__: F } = o;
+  F.name = t;
+  const a = z(null);
+  V(E, () => ({
     ...o,
     nativeElement: a.current?.nativeElement
   }));
-  const y = (e) => {
-    M?.(e);
-  }, I = (e) => {
+  const N = (e) => {
+    C?.(e);
+  }, _ = (e) => {
     if (!e) return;
-    const _ = e.querySelectorAll(`.${n}-item`);
+    const A = e.querySelectorAll(`.${n}-item`);
     let s = 0;
-    _?.forEach(($) => {
-      const h = $.querySelector("label");
-      if (h) {
-        const A = h.offsetWidth;
-        s = Math.max(s, A);
+    A?.forEach((P) => {
+      const b = P.querySelector("label");
+      if (b) {
+        const S = b.offsetWidth;
+        s = Math.max(s, S);
       }
-    }), L(s);
+    }), y(s);
   };
-  z(() => {
+  D(() => {
     const e = setTimeout(() => {
-      I(a.current?.nativeElement);
+      _(a.current?.nativeElement);
     }, 0);
     return () => clearTimeout(e);
   }, []);
-  const N = F(
+  const $ = W(
     () => ({
       name: t,
       labelAlign: f,
-      labelWrap: r ? R : !1,
+      labelWrap: r ? M : !1,
       labelWidth: r || l,
       labelMaxWidth: l,
       layout: d,
       colon: c,
-      itemRef: x.itemRef,
+      itemRef: F.itemRef,
       form: o,
       prefixCls: n,
       disabled: m,
-      size: u
+      size: u,
+      spacing: p,
+      itemDecorator: x
     }),
-    [t, f, d, c, o, m, l, r, u]
+    [t, f, d, c, o, m, l, r, u, p, x]
   );
-  return /* @__PURE__ */ i.jsx(B, { validateMessages: j, children: /* @__PURE__ */ i.jsx(D.Provider, { value: N, children: /* @__PURE__ */ i.jsx(
-    G,
+  return /* @__PURE__ */ i.jsx(J, { validateMessages: I, children: /* @__PURE__ */ i.jsx(K.Provider, { value: $, children: /* @__PURE__ */ i.jsx(
+    H,
     {
       id: t,
-      ...C,
+      ...j,
       name: t,
-      onFinishFailed: y,
+      onFinishFailed: N,
       form: o,
       ref: a,
-      className: V(v, n),
-      style: { ...g }
+      className: G(R, n),
+      style: { ...L }
     }
   ) }) });
-}, le = P(O);
+}, se = T(U);
 export {
-  le as default,
-  k as useForm,
-  ie as useWatch
+  se as default,
+  B as useForm,
+  me as useWatch
 };
 //# sourceMappingURL=Form.js.map

package/es/FieldForm/compactControlMarker.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @description Switch/Checkbox 类矮控件的 compact 间距自动识别标记约定。
+ *
+ * `FieldForm.Item` 在未显式指定 `spacing` 时，会检查唯一直接子节点是否为矮控件，
+ * 自动落 compact 档（见 `util.ts` 的 `isCompactControlChild`）。原生 `Switch`/`Checkbox`
+ * 靠类型引用直接比对即可命中；但消费方常见做法是自己再包一层组件（如加 label 布局），
+ * 包完之后子节点的类型引用就不再等于 `@para-ui/core` 原生组件，直接比对会失效。
+ *
+ * 为此原生 `Switch`/`Checkbox` 会在自身函数上挂这个标记，消费方若对它们做二次封装，
+ * 只需把标记原样透传到自己的包装组件上（`WrapperComponent[PARA_UI_COMPACT_CONTROL_MARKER] = true`），
+ * 包装组件即可继续被识别为矮控件——不需要 `@para-ui/core` 反过来认识具体消费方的包装组件。
+ *
+ * 独立成文件是为了避免循环依赖：这个标记同时被 `Switch`/`Checkbox`（声明"我是矮控件"）
+ * 和 `FieldForm/util.ts`（读取标记做判断，同时也直接引用 Switch/Checkbox 做引用相等比对）
+ * 引用，若把标记定义放进 `FieldForm/util.ts` 会形成 `Switch → FieldForm/util.ts → Switch`
+ * 的循环引用。
+ */
+export declare const PARA_UI_COMPACT_CONTROL_MARKER = "__paraUiCompactControl__";

package/es/FieldForm/compactControlMarker.js

@@ -0,0 +1,5 @@
+const _ = "__paraUiCompactControl__";
+export {
+  _ as PARA_UI_COMPACT_CONTROL_MARKER
+};
+//# sourceMappingURL=compactControlMarker.js.map

package/es/FieldForm/component.json

@@ -61,6 +61,20 @@
         "children": {
             "type": "ReactNode",
             "description": "FieldForm 接收任意 ReactNode(包括 FieldForm.Item / Button type=submit / 自定义包装);**但每个 Item 的 child 必须是支持 value/onChange/error/disabled 的自定义组件**(TextField / Select / Checkbox / Switch / DatePicker / InputNumber 等);**不可用原生 input/textarea/select/button — 会触发 React non-boolean-attribute warning**(因 cloneElement 注入 error={false} 给原生 DOM 元素时,React 视 error 为 DOM attr → 报错);见 childrenContract.FormItem"
+        },
+        "itemDecorator": {
+            "type": "ItemDecorator",
+            "objectShape": {
+                "getItemClassName": {
+                    "type": "(meta: ItemDecoratorMeta) => string | undefined | false",
+                    "description": "按字段 namePath/path 返回要合并到该 FieldForm.Item 根节点的 className;返回 undefined/''/false 时不追加，不影响其他状态 class(is-error/is-success 等)"
+                },
+                "renderItemExtra": {
+                    "type": "(meta: ItemDecoratorMeta) => ReactNode",
+                    "description": "按字段 namePath/path 在该 FieldForm.Item 根节点内追加渲染内容(如 diff 命中原因说明);渲染在根节点内、内部间距容器之外，不影响 has-spacing/has-helper-text 的 20px 间距机制"
+                }
+            },
+            "description": "Form 级一次注册、所有子孙 FieldForm.Item 自动生效的字段装饰扩展点;meta.namePath 来自 rc-field-form 的 renderMeta.name(真实的、经过 List 等上下文处理后的最终路径)，meta.path 是预拼接字符串(数组下标用方括号,如 'ubr.list[0].x');未传 name 的 Item 固定拿到 { namePath: [], path: '' };典型用法:`<FieldForm itemDecorator={{ getItemClassName: (meta) => isHit(meta.path) ? 'is-hit' : undefined, renderItemExtra: (meta) => isHit(meta.path) ? <span>命中原因</span> : null }}>`"
         }
     },
     "childrenContract": {
@@ -137,7 +151,9 @@
         "把'仅使用 FieldForm 本身'解读为'整个文件不能 import TextField/Button'(见 interpretivePriority.resolution)",
         "字段过多不分组",
         "忽略异步校验",
-        "在 mount 后修改 initialValues prop(应用 form.setFieldsValue;initialValues 仅 mount 时灌入)"
+        "在 mount 后修改 initialValues prop(应用 form.setFieldsValue;initialValues 仅 mount 时灌入)",
+        "在 itemDecorator.getItemClassName/renderItemExtra 回调体内调用 useContext/useXxx 等 Hook(回调运行在 ItemHolder 渲染过程中，不在业务组件自身的渲染调用栈里，会违反 Hooks 规则;应在业务组件顶层用 Hook 取数后，用 useMemo 包成闭包再传入 itemDecorator)",
+        "期望 itemDecorator 对 noStyle 的 FieldForm.Item 生效(noStyle 不渲染独立 wrapper 节点，没有可挂载 className/额外内容的位置)"
     ],
     "events": {
         "onFinish": {
@@ -187,6 +203,11 @@
             "issue": "rules 中的 validator 函数签名必须返回 Promise(rc-field-form 约定),不是同步返回",
             "wrong": "rules={[{ validator: (_, val) => val > 0 ? true : false }]}  // 同步返回 boolean 不被识别",
             "right": "rules={[{ validator: (_, val) => val > 0 ? Promise.resolve() : Promise.reject('必须大于 0') }]}"
+        },
+        {
+            "issue": "itemDecorator 的 getItemClassName/renderItemExtra 回调不能在函数体内调用 React Hook",
+            "wrong": "itemDecorator={{ getItemClassName: (meta) => { const hit = useFieldHighlight(meta.path); return hit ? 'is-hit' : undefined; } }}  // 在回调体内调用 Hook，违反 Hooks 规则",
+            "right": "const highlightMap = useFieldHighlightMap();\nconst itemDecorator = useMemo(() => ({ getItemClassName: (meta) => (highlightMap[meta.path] ? 'is-hit' : undefined) }), [highlightMap]);\n<FieldForm itemDecorator={itemDecorator}>"
         }
     ],
     "mapping": {

package/es/FieldForm/context.d.ts

@@ -1,7 +1,7 @@
 import { default as React, FC, ReactElement, Key, ReactNode } from 'react';
 import { FormProviderProps as RcFormProviderProps } from 'rc-field-form/lib/FormContext';
 import { Meta } from 'rc-field-form/lib/interface';
-import { FormLabelAlign } from './interface';
+import { FormLabelAlign, ItemDecorator } from './interface';
 import { FormInstance, FormLayout } from './Form';
 import { ValidateStatus } from './FieldFormItem';
 export declare const FormProvider: FC<RcFormProviderProps>;
@@ -18,6 +18,8 @@ export interface FormContextProps {
     prefixCls?: string;
     disabled?: boolean;
     size?: 'small' | 'medium' | 'large';
+    spacing: 'normal' | 'compact';
+    itemDecorator?: ItemDecorator;
 }
 export declare const FormContext: React.Context<FormContextProps>;
 /** rc-field-form 在销毁字段时会传入带 destroy 标记的 meta(官方 Meta 类型未声明此字段) */

package/es/FieldForm/context.js

@@ -5,16 +5,17 @@ import i from "rc-util/lib/omit";
 const x = (t) => {
   const r = i(t, ["prefixCls"]);
   return /* @__PURE__ */ e.jsx(m, { ...r });
-}, c = o({
+}, a = o({
   labelAlign: "left",
   layout: "vertical",
+  spacing: "normal",
   itemRef: () => () => {
   }
-}), f = o(null), a = o({});
+}), c = o(null), f = o({});
 export {
-  c as FormContext,
-  a as FormItemInputContext,
+  a as FormContext,
+  f as FormItemInputContext,
   x as FormProvider,
-  f as NoStyleItemContext
+  c as NoStyleItemContext
 };
 //# sourceMappingURL=context.js.map

package/es/FieldForm/index.css

@@ -1 +1 @@
-@charset "UTF-8";.paraui-v4-field-form-item{vertical-align:top}.paraui-v4-field-form-item.is-horizontal{display:flex}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label{margin-right:8px;padding:0;flex-shrink:0;text-align:end}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label.is-left{text-align:start}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label.is-multiline .paraui-v4-field-form-label-comp{display:inline-block}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label-comp{width:100%;display:inline-flex;align-items:center;margin:0;max-width:100%;min-height:32px}.paraui-v4-field-form-content{flex:1}.paraui-v4-field-form-content.has-spacing{margin-bottom:20px}.paraui-v4-field-form-content.has-spacing.has-helper-text{margin-bottom:0}.paraui-v4-field-form-control-input{display:flex;align-items:center;min-height:32px}.paraui-v4-field-form-control-input-content{width:100%}.paraui-v4-field-form-control-input-content .paraui-v4-radio-group>.radio-group-content .radio-item-box{margin-bottom:0}.paraui-v4-field-form-control-input-content .text-field-error-text{display:none}.paraui-v4-field-form-helper-text{line-height:20px;word-break:break-all}.paraui-v4-field-form-helper-text .is-warning>.paraui-v4-helper-text.paraui-v4-helper-text-error{color:#ff9326}
+@charset "UTF-8";.paraui-v4-field-form-item{vertical-align:top}.paraui-v4-field-form-item.is-horizontal{display:flex}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label{flex-shrink:0;padding:0;margin-right:8px;text-align:end}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label.is-left{text-align:start}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label.is-multiline .paraui-v4-field-form-label-comp{display:inline-block}.paraui-v4-field-form-item.is-horizontal .paraui-v4-field-form-label-comp{display:inline-flex;align-items:center;width:100%;max-width:100%;min-height:32px;margin:0}.paraui-v4-field-form-item.is-spacing-compact .paraui-v4-field-form-content.has-spacing{margin-bottom:16px}.paraui-v4-field-form-item.is-spacing-compact .paraui-v4-field-form-content.has-spacing.has-helper-text{margin-bottom:0}.paraui-v4-field-form-item.is-spacing-compact .paraui-v4-field-form-control-input{min-height:24px}.paraui-v4-field-form-item.is-spacing-compact .paraui-v4-helper-text{min-height:16px;line-height:16px}.paraui-v4-field-form-content{flex:1}.paraui-v4-field-form-content.has-spacing{margin-bottom:20px}.paraui-v4-field-form-content.has-spacing.has-helper-text{margin-bottom:0}.paraui-v4-field-form-control-input{display:flex;align-items:center;min-height:32px}.paraui-v4-field-form-control-input-content{width:100%}.paraui-v4-field-form-control-input-content .paraui-v4-radio-group>.radio-group-content .radio-item-box{margin-bottom:0}.paraui-v4-field-form-control-input-content .text-field-error-text:not(.paraui-v4-helper-text-force-visible),.paraui-v4-field-form-control-input-content .select-error-text:not(.paraui-v4-helper-text-force-visible){display:none}.paraui-v4-field-form-helper-text{line-height:20px;word-break:break-all}.paraui-v4-field-form-helper-text .is-warning>.paraui-v4-helper-text.paraui-v4-helper-text-error{color:#ff9326}

package/es/FieldForm/index.d.ts

@@ -19,3 +19,5 @@ declare const FieldForm: CompoundedComponent;
 export type { ErrorListProps, FieldFormInstance, FieldFormItemProps, FieldFormListFieldData, FieldFormListOperation, FieldFormListProps, FieldFormProps, Rule, RuleObject, RuleRender };
 export default FieldForm;
 export type * from './interface';
+export { joinNamePath } from './util';
+export { PARA_UI_COMPACT_CONTROL_MARKER } from './compactControlMarker';

package/es/FieldForm/index.js

@@ -1,21 +1,25 @@
 import { FormProvider as o } from "./context.js";
 import m from "./Form.js";
 import t from "./ErrorList.js";
-import i from "./FieldFormItem/index.js";
-import e from "./FormList.js";
+import e from "./FieldFormItem/index.js";
+import i from "./FormList.js";
 import s from "./hooks/useFormInstance.js";
 import './index.css';/* empty css           */
-import F from "./hooks/useForm.js";
-import { useWatch as p } from "rc-field-form";
+import { joinNamePath as R } from "./util.js";
+import { PARA_UI_COMPACT_CONTROL_MARKER as h } from "./compactControlMarker.js";
+import p from "./hooks/useForm.js";
+import { useWatch as F } from "rc-field-form";
 const r = m;
-r.Item = i;
-r.List = e;
+r.Item = e;
+r.List = i;
 r.ErrorList = t;
-r.useForm = F;
+r.useForm = p;
 r.useFormInstance = s;
-r.useWatch = p;
+r.useWatch = F;
 r.Provider = o;
 export {
-  r as default
+  h as PARA_UI_COMPACT_CONTROL_MARKER,
+  r as default,
+  R as joinNamePath
 };
 //# sourceMappingURL=index.js.map