react-antd-xform 1.0.7 → 1.0.9

package/README.md

@@ -0,0 +1,17 @@
+## 📦 安装
+
+选择你喜欢的包管理器进行安装：
+
+```bash
+# npm
+npm install react-antd-xform --save
+
+# yarn
+yarn add react-antd-xform
+
+# pnpm
+pnpm add react-antd-xform
+
+```
+
+文档地址：https://jhuazhang.github.io/react-antd-xform 或者访问http://handn.xyz/react-antd-xform 

package/dist/form/array-helper.js

@@ -4,10 +4,7 @@ import invariant from "../node_modules/.pnpm/invariant@2.2.4/node_modules/invari
 import { Form } from "./index.js";
 import { composeValue } from "./common-utils.js";
 function invariantArrayShapeIsAutoOrArray(arrayModel) {
-  invariant(
-    arrayModel._valueShape === "auto" || arrayModel._valueShape === "array",
-    'arrayModel._valueShape should be "auto" or "array"'
-  );
+  invariant(arrayModel._valueShape === "auto" || arrayModel._valueShape === "array", 'arrayModel._valueShape should be "auto" or "array"');
 }
 function updateSubModelsNames(arrayModel) {
   arrayModel._subModels.forEach((mod, index) => {
@@ -34,10 +31,7 @@ const arrayHelpers = {
     if (arrayModel.values == null) {
       arrayModel.values = [];
     }
-    const value = composeValue(
-      typeof itemFactory === "function" ? itemFactory(arrayModel) : itemFactory,
-      {}
-    );
+    const value = composeValue(typeof itemFactory === "function" ? itemFactory(arrayModel) : itemFactory, {});
     arrayModel.values.push(value);
   }),
   delete: action((arrayModel, itemIndex) => {
@@ -90,18 +84,16 @@ const arrayHelpers = {
       arrayModel._subModels.length = 0;
     }
   }),
-  move: action(
-    (arrayModel, fromIndex, toIndex) => {
-      invariantArrayShapeIsAutoOrArray(arrayModel);
-      if (Array.isArray(arrayModel.values)) {
-        reorderInPlace(arrayModel.values, fromIndex, toIndex);
-      }
-      if (Array.isArray(arrayModel._subModels)) {
-        reorderInPlace(arrayModel._subModels, fromIndex, toIndex);
-        updateSubModelsNames(arrayModel);
-      }
+  move: action((arrayModel, fromIndex, toIndex) => {
+    invariantArrayShapeIsAutoOrArray(arrayModel);
+    if (Array.isArray(arrayModel.values)) {
+      reorderInPlace(arrayModel.values, fromIndex, toIndex);
     }
-  ),
+    if (Array.isArray(arrayModel._subModels)) {
+      reorderInPlace(arrayModel._subModels, fromIndex, toIndex);
+      updateSubModelsNames(arrayModel);
+    }
+  }),
   renderArrayItem(arrayModel, itemIndex, itemContent) {
     const itemModel = arrayModel.getSubModel(itemIndex);
     return /* @__PURE__ */ jsxRuntimeExports.jsx(Form.ModelProvider, { value: itemModel, children: itemContent(itemIndex, itemModel) }, itemModel.id);

package/dist/form/common-utils.js

@@ -114,9 +114,7 @@ function convertWatchableToExpression(watch, model) {
         }
       });
     };
-  } else {
-    console.warn("[xform] 无法识别的 watch 参数", watch);
-  }
+  } else ;
 }
 export {
   asCSSLength,

package/dist/form/context/formEnvContext.js

@@ -16,7 +16,10 @@ function FormEnvProvider({
   ...override
 }) {
   const parent = useFormEnv();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormEnvContext.Provider, { value: { ...parent, ...override }, children });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormEnvContext.Provider, { value: {
+    ...parent,
+    ...override
+  }, children });
 }
 export {
   FormEnvProvider,

package/dist/form/extend/form-array.js

@@ -4,30 +4,34 @@ import { useModel, ModelProvider } from "../context/modelContext.js";
 import { range } from "../common-utils.js";
 import { arrayHelpers } from "../array-helper.js";
 import { observer } from "../../node_modules/.pnpm/mobx-react-lite@4.1.0_mobx@6.13.7_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/mobx-react-lite/es/observer.js";
-const defaultArrayLayout = ({ arrayModel, itemContent, itemCount }) => {
-  return range(itemCount).map(
-    (itemIndex) => arrayHelpers.renderArrayItem(arrayModel, itemIndex, itemContent)
-  );
+const defaultArrayLayout = ({
+  arrayModel,
+  itemContent,
+  itemCount
+}) => {
+  return range(itemCount).map((itemIndex) => arrayHelpers.renderArrayItem(arrayModel, itemIndex, itemContent));
 };
-const FormArray = observer(
-  ({
-    name,
-    children,
-    layout,
-    arrayModel: arrayModelProp,
-    use
-  }) => {
-    var _a;
-    const parent = useModel();
-    if (use === false) {
-      return null;
-    }
-    const arrayModel = arrayModelProp ?? (name === "&" ? parent : parent.getSubModel(name));
-    const itemCount = ((_a = arrayModel.values) == null ? void 0 : _a.length) ?? 0;
-    const itemContent = typeof children === "function" ? children : () => children;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(ModelProvider, { value: arrayModel, children: (layout ?? defaultArrayLayout)({ arrayModel, itemCount, itemContent }) });
+const FormArray = observer(({
+  name,
+  children,
+  layout,
+  arrayModel: arrayModelProp,
+  use
+}) => {
+  var _a;
+  const parent = useModel();
+  if (use === false) {
+    return null;
   }
-);
+  const arrayModel = arrayModelProp ?? (name === "&" ? parent : parent.getSubModel(name));
+  const itemCount = ((_a = arrayModel.values) == null ? void 0 : _a.length) ?? 0;
+  const itemContent = typeof children === "function" ? children : () => children;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(ModelProvider, { value: arrayModel, children: (layout ?? defaultArrayLayout)({
+    arrayModel,
+    itemCount,
+    itemContent
+  }) });
+});
 export {
   FormArray
 };

package/dist/form/extend/form-check.js

@@ -23,13 +23,11 @@ const FormCheck = observer(function FormCheck2({
   };
   useLayoutEffect(() => check._track(checkConfig));
   useEffect(() => {
-    return reaction(
-      convertWatchableToExpression(watch, model),
-      () => {
-        check.validate();
-      },
-      { fireImmediately: checkConfig.validateOnMount }
-    );
+    return reaction(convertWatchableToExpression(watch, model), () => {
+      check.validate();
+    }, {
+      fireImmediately: checkConfig.validateOnMount
+    });
   }, [check, model, ...deps]);
   if (renderError === true) {
     return check.error;

package/dist/form/extend/form-effect.js

@@ -17,13 +17,16 @@ const FormEffect = observer(function FormEffect2({
     effectRef.current = effect;
   });
   useEffect(() => {
-    return reaction(
-      convertWatchableToExpression(watch, model),
-      (next, prev) => {
-        effectRef.current(next, { model, prev, next });
-      },
-      { fireImmediately, equals }
-    );
+    return reaction(convertWatchableToExpression(watch, model), (next, prev) => {
+      effectRef.current(next, {
+        model,
+        prev,
+        next
+      });
+    }, {
+      fireImmediately,
+      equals
+    });
   }, deps);
   return null;
 });

package/dist/form/extend/form-layout.js

@@ -141,29 +141,17 @@ function FormLayout({
   inlineError,
   containerProps
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    FormLayoutContainer,
-    {
-      style: {
-        "--label-width": asCSSLength(labelWidth),
-        "--control-width": asCSSLength(controlWidth),
-        "--form-item-gap": asCSSLength(formItemGap),
-        "--form-item-label-top-position": asCSSLength(defaultLabelTopPosition),
-        ...style
-      },
-      className: cx(
-        "xform-container",
-        {
-          horizontal: labelPosition === "left",
-          vertical: labelPosition === "top",
-          "inline-error": labelPosition === "top" && inlineError
-        },
-        className
-      ),
-      ...containerProps,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormLayoutContainer, { style: {
+    "--label-width": asCSSLength(labelWidth),
+    "--control-width": asCSSLength(controlWidth),
+    "--form-item-gap": asCSSLength(formItemGap),
+    "--form-item-label-top-position": asCSSLength(defaultLabelTopPosition),
+    ...style
+  }, className: cx("xform-container", {
+    horizontal: labelPosition === "left",
+    vertical: labelPosition === "top",
+    "inline-error": labelPosition === "top" && inlineError
+  }, className), ...containerProps, children });
 }
 export {
   FormLayout

package/dist/form/extend/form-model-consumer.js

@@ -1,7 +1,9 @@
 import "../../node_modules/.pnpm/mobx-react-lite@4.1.0_mobx@6.13.7_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/mobx-react-lite/es/index.js";
 import { useModel } from "../context/modelContext.js";
 import { observer } from "../../node_modules/.pnpm/mobx-react-lite@4.1.0_mobx@6.13.7_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/mobx-react-lite/es/observer.js";
-const FormModelConsumer = observer(({ children }) => {
+const FormModelConsumer = observer(({
+  children
+}) => {
   const model = useModel();
   return children(model);
 });

package/dist/form/extend/form-object.js

@@ -2,16 +2,18 @@ import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/no
 import "../../node_modules/.pnpm/mobx-react-lite@4.1.0_mobx@6.13.7_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/mobx-react-lite/es/index.js";
 import { useModel, ModelProvider } from "../context/modelContext.js";
 import { observer } from "../../node_modules/.pnpm/mobx-react-lite@4.1.0_mobx@6.13.7_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/mobx-react-lite/es/observer.js";
-const FormObject = observer(
-  ({ name, children, use }) => {
-    const parent = useModel();
-    if (use === false) {
-      return null;
-    }
-    const model = name === "&" ? parent : parent.getSubModel(name);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(ModelProvider, { value: model, children });
+const FormObject = observer(({
+  name,
+  children,
+  use
+}) => {
+  const parent = useModel();
+  if (use === false) {
+    return null;
   }
-);
+  const model = name === "&" ? parent : parent.getSubModel(name);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(ModelProvider, { value: model, children });
+});
 export {
   FormObject
 };

package/dist/form/extend/form-reset.js

@@ -10,15 +10,7 @@ function FormReset({
 }) {
   const model = useModel();
   const formEnv = useFormEnv();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    ButtonComponent,
-    {
-      ...props,
-      onClick: action(() => modelUtils.reset(model, formEnv)),
-      children,
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonComponent, { ...props, onClick: action(() => modelUtils.reset(model, formEnv)), children, ...props });
 }
 export {
   FormReset

package/dist/form/extend/form-submit.js

@@ -8,20 +8,15 @@ function FormSubmit({
   ...props
 }) {
   const model = useModel();
-  const { onSubmit, onError } = useFormEnv();
+  const {
+    onSubmit,
+    onError
+  } = useFormEnv();
   const submitOptions = {
     onSubmit,
     onError
   };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    ButtonComponent,
-    {
-      ...props,
-      onClick: () => modelUtils.submit(model, submitOptions),
-      children,
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonComponent, { ...props, onClick: () => modelUtils.submit(model, submitOptions), children, ...props });
 }
 export {
   FormSubmit

package/dist/form/form-item.js

@@ -61,34 +61,25 @@ function FormItemView({
   labelStyle,
   controlStyle
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "div",
-    {
-      "data-xform-id": htmlId,
-      className: cx("form-item", className),
-      style: {
-        "--label-width": asCSSLength(labelWidth),
-        "--control-width": asCSSLength(controlWidth),
-        ...style
-      },
-      children: [
-        label == null && tip == null ? null : /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "form-item-label", htmlFor: htmlId, style: labelStyle, children: [
-          asterisk && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "required-indicator" }),
-          label && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "form-item-label-text", children: label })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "form-item-control", style: controlStyle, children: [
-          children,
-          help && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "help", children: help }),
-          error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "error-message", children: error })
-        ] }),
-        rightNode
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { "data-xform-id": htmlId, className: cx("form-item", className), style: {
+    "--label-width": asCSSLength(labelWidth),
+    "--control-width": asCSSLength(controlWidth),
+    ...style
+  }, children: [
+    label == null && tip == null ? null : /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "form-item-label", htmlFor: htmlId, style: labelStyle, children: [
+      asterisk && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "required-indicator" }),
+      label && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "form-item-label-text", children: label })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "form-item-control", style: controlStyle, children: [
+      children,
+      help && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "help", children: help }),
+      error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "error-message", children: error })
+    ] }),
+    rightNode
+  ] });
 }
 function createFormItem(inputOptions) {
   const options = processCreationOptions(inputOptions);
-  console.log(options, "options");
   function FormItemComponent({
     defaultValue: defaultValueProp,
     isEmpty = options.isEmpty,
@@ -110,15 +101,14 @@ function createFormItem(inputOptions) {
     const componentProps = {
       id: htmlId,
       variant,
-      ...isPreview ? { isPreview: true } : null,
+      ...isPreview ? {
+        isPreview: true
+      } : null,
       // dataSource, readOnly, disabled,options 允许直接透传
       ...pick(props, ["dataSource", "readOnly", "disabled", "options"]),
       ...componentPropsProp,
       // status 优先用 prop 中的值，然后再根据 error 自动判断
-      [options.statusPropName]: composeValue(
-        componentPropsProp == null ? void 0 : componentPropsProp[options.statusPropName],
-        composeValue(props[options.statusPropName], error ? "error" : void 0)
-      ),
+      [options.statusPropName]: composeValue(componentPropsProp == null ? void 0 : componentPropsProp[options.statusPropName], composeValue(props[options.statusPropName], error ? "error" : void 0)),
       [options.valuePropName]: composeValue(props[options.valuePropName], value),
       onChange: composeValue(props.onChange, field.handleChange),
       onFocus: composeValue(props.onFocus, field.handleFocus),
@@ -143,15 +133,13 @@ function createFormItem(inputOptions) {
     useLayoutEffect(() => field._track(fieldConfig));
     useLayoutEffect(() => {
       if (fieldConfig.writeDefaultValueToModel === "force") {
-        return reaction(
-          () => field.value,
-          () => {
-            if (field.value === void 0 && fieldConfig.defaultValueProp !== void 0) {
-              field.value = fieldConfig.defaultValueProp;
-            }
-          },
-          { fireImmediately: true }
-        );
+        return reaction(() => field.value, () => {
+          if (field.value === void 0 && fieldConfig.defaultValueProp !== void 0) {
+            field.value = fieldConfig.defaultValueProp;
+          }
+        }, {
+          fireImmediately: true
+        });
       } else if (fieldConfig.writeDefaultValueToModel) {
         if (field.value === void 0 && fieldConfig.defaultValueProp !== void 0) {
           runInAction(() => {
@@ -179,30 +167,11 @@ function createFormItem(inputOptions) {
         return null;
       }
     }
-    console.log(isPreview, "isPreviewisPreviewisPreview");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      FormItemView,
-      {
-        htmlId,
-        label: props.label,
-        help: props.help,
-        asterisk: props.asterisk ?? props.required,
-        error,
-        tip: props.tip,
-        style: props.style,
-        className: cx(props.className, {
-          "form-item-hidden": options.hidden,
-          "form-item-preview": isPreview,
-          "auto-control-width": options.hasIntrinsicWidth
-        }),
-        labelWidth: props.labelWidth,
-        labelStyle: props.labelStyle,
-        controlWidth: props.controlWidth,
-        controlStyle: props.controlStyle,
-        rightNode: props.rightNode,
-        children: isPreview ? renderPreview(componentProps) : options.render(componentProps)
-      }
-    );
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(FormItemView, { htmlId, label: props.label, help: props.help, asterisk: props.asterisk ?? props.required, error, tip: props.tip, style: props.style, className: cx(props.className, {
+      "form-item-hidden": options.hidden,
+      "form-item-preview": isPreview,
+      "auto-control-width": options.hasIntrinsicWidth
+    }), labelWidth: props.labelWidth, labelStyle: props.labelStyle, controlWidth: props.controlWidth, controlStyle: props.controlStyle, rightNode: props.rightNode, children: isPreview ? renderPreview(componentProps) : options.render(componentProps) });
   }
   FormItemComponent.displayName = `FormItem__${options.name}`;
   return observer(FormItemComponent);
@@ -214,34 +183,33 @@ for (const config of ALL_COMPONENTS) {
 }
 const AnonymousFormItem = createFormItem({
   name: "anonymous",
-  render({ $Component: Component, ...props }) {
+  render({
+    $Component: Component,
+    ...props
+  }) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, { ...props });
   }
 });
 const NotFound = createFormItem({
   name: "notFound",
   isEmpty: () => false,
-  render({ $Component }) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        style: {
-          border: "1px dashed red",
-          fontSize: 14,
-          padding: 4,
-          color: "red"
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("code", { children: [
-            "<FormItem component='",
-            $Component,
-            "' />"
-          ] }),
-          " ",
-          "没有找到对应组件，请检查组件名称是否拼写正确"
-        ]
-      }
-    );
+  render({
+    $Component
+  }) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
+      border: "1px dashed red",
+      fontSize: 14,
+      padding: 4,
+      color: "red"
+    }, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("code", { children: [
+        "<FormItem component='",
+        $Component,
+        "' />"
+      ] }),
+      " ",
+      "没有找到对应组件，请检查组件名称是否拼写正确"
+    ] });
   }
 });
 const Hidden = createFormItem({
@@ -252,38 +220,50 @@ const Hidden = createFormItem({
   isEmpty() {
     return false;
   },
-  render({ id, value }) {
+  render({
+    id,
+    value
+  }) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx("input", { type: "hidden", value: stringifyObject(value), id });
   }
 });
-function FormItem({ use, component, ...props }) {
+function FormItem({
+  use,
+  component,
+  ...props
+}) {
   const formEnv = useFormEnv();
   const variant = formEnv.variant;
   if (use === false) {
     return null;
   }
   if (component == null) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(NotFound, { ...props, componentProps: { $Component: String(component) } });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(NotFound, { ...props, componentProps: {
+      $Component: String(component)
+    } });
   } else if (typeof component === "string") {
     if (component === "hidden") {
       return /* @__PURE__ */ jsxRuntimeExports.jsx(Hidden, { ...props });
     }
     const Comp = COMPONENT_DICT[component];
     if (Comp == null) {
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(NotFound, { ...props, componentProps: { $Component: component } });
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(NotFound, { ...props, componentProps: {
+        $Component: component
+      } });
     }
     return React.createElement(Comp, {
       ...props,
-      componentProps: { ...props.componentProps, variant }
+      componentProps: {
+        ...props.componentProps,
+        variant
+      }
     });
   } else {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      AnonymousFormItem,
-      {
-        ...props,
-        componentProps: { ...props.componentProps, variant, $Component: component }
-      }
-    );
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(AnonymousFormItem, { ...props, componentProps: {
+      ...props.componentProps,
+      variant,
+      $Component: component
+    } });
   }
 }
 export {

package/dist/form/helpers/AsyncValue.js

@@ -71,27 +71,25 @@ const _AsyncValue = class _AsyncValue {
     this.name = typeof options.name === "string" ? options.name : `AsyncValue_${_AsyncValue._globalCount++}`;
     this._atom = createAtom(`${this.name}#state`);
     this._refreshAtom = createAtom(`${this.name}#refresh`);
-    makeObservable(
-      this,
-      {
-        status: computed,
-        error: computed,
-        _inner_current: computed({ name: `${this.name}.inner_current` }),
-        isLoading: computed,
-        isError: computed,
-        isReady: computed
-      },
-      { name: this.name }
-    );
+    makeObservable(this, {
+      status: computed,
+      error: computed,
+      _inner_current: computed({
+        name: `${this.name}.inner_current`
+      }),
+      isLoading: computed,
+      isError: computed,
+      isReady: computed
+    }, {
+      name: this.name
+    });
     this._disposers.push(this._stop);
     this._disposers.push(onBecomeObserved(this._atom, this._start));
-    this._disposers.push(
-      onBecomeUnobserved(this._atom, () => {
-        if (!this.options.keepAlive) {
-          this._stop();
-        }
-      })
-    );
+    this._disposers.push(onBecomeUnobserved(this._atom, () => {
+      if (!this.options.keepAlive) {
+        this._stop();
+      }
+    }));
     this._disposers.push(() => {
       this._status = "ready";
       this._current = null;