react-antd-xform 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 knowledge is limitless
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,2 @@
+# react-antd-xform
+基于react + mobx实现的antd表单方案

package/dist/_virtual/_commonjsHelpers.js

@@ -0,0 +1,8 @@
+var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
+export {
+  commonjsGlobal,
+  getDefaultExportFromCjs
+};

package/dist/_virtual/index.js

@@ -0,0 +1,4 @@
+var classnames = { exports: {} };
+export {
+  classnames as __module
+};

package/dist/_virtual/index2.js

@@ -0,0 +1,4 @@
+var shim = { exports: {} };
+export {
+  shim as __module
+};

package/dist/_virtual/jsx-runtime.js

@@ -0,0 +1,4 @@
+var jsxRuntime = { exports: {} };
+export {
+  jsxRuntime as __module
+};

package/dist/_virtual/react-jsx-runtime.development.js

@@ -0,0 +1,4 @@
+var reactJsxRuntime_development = {};
+export {
+  reactJsxRuntime_development as __exports
+};

package/dist/_virtual/react-jsx-runtime.production.min.js

@@ -0,0 +1,4 @@
+var reactJsxRuntime_production_min = {};
+export {
+  reactJsxRuntime_production_min as __exports
+};

package/dist/_virtual/use-sync-external-store-shim.development.js

@@ -0,0 +1,4 @@
+var useSyncExternalStoreShim_development = {};
+export {
+  useSyncExternalStoreShim_development as __exports
+};

package/dist/_virtual/use-sync-external-store-shim.production.js

@@ -0,0 +1,4 @@
+var useSyncExternalStoreShim_production = {};
+export {
+  useSyncExternalStoreShim_production as __exports
+};

package/dist/form/array-helper.d.ts

@@ -0,0 +1,12 @@
+import { FormModel } from './model';
+import { FormArrayLayoutInput } from './type';
+export declare const arrayHelpers: {
+    append: (arrayModel: FormModel<unknown[]>, itemFactory?: any) => void;
+    delete: (arrayModel: FormModel<unknown[]>, itemIndex: number) => void;
+    moveUp: (arrayModel: FormModel<unknown[]>, itemIndex: number) => void;
+    moveDown: (arrayModel: FormModel<unknown[]>, itemIndex: number) => void;
+    clear: (arrayModel: FormModel<unknown[]>) => void;
+    move: (arrayModel: FormModel<unknown[]>, fromIndex: number, toIndex: number) => void;
+    renderArrayItem(arrayModel: FormModel<unknown[]>, itemIndex: number, itemContent: FormArrayLayoutInput["itemContent"]): import("react/jsx-runtime").JSX.Element;
+    getKey(arrayModel: FormModel<unknown[]>, itemIndex: number): string;
+};

package/dist/form/array-helper.js

@@ -0,0 +1,115 @@
+import { j as jsxRuntimeExports } from "../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { action } from "mobx";
+import invariant from "../node_modules/.pnpm/invariant@2.2.4/node_modules/invariant/browser.js";
+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"'
+  );
+}
+function updateSubModelsNames(arrayModel) {
+  arrayModel._subModels.forEach((mod, index) => {
+    mod.name = String(index);
+  });
+}
+function reorderInPlace(list, fromIndex, toIndex) {
+  if (list == null) {
+    return;
+  }
+  const [movingItem] = list.splice(fromIndex, 1);
+  list.splice(toIndex, 0, movingItem);
+}
+function swapInPlace(values, a, b) {
+  if (values == null) {
+    return;
+  }
+  const temp = values[a];
+  values[a] = values[b];
+  values[b] = temp;
+}
+const arrayHelpers = {
+  append: action((arrayModel, itemFactory) => {
+    if (arrayModel.values == null) {
+      arrayModel.values = [];
+    }
+    const value = composeValue(
+      typeof itemFactory === "function" ? itemFactory(arrayModel) : itemFactory,
+      {}
+    );
+    arrayModel.values.push(value);
+  }),
+  delete: action((arrayModel, itemIndex) => {
+    invariantArrayShapeIsAutoOrArray(arrayModel);
+    if (Array.isArray(arrayModel.values)) {
+      arrayModel.values.splice(itemIndex, 1);
+    }
+    if (Array.isArray(arrayModel._subModels)) {
+      const [subModel] = arrayModel._subModels.splice(itemIndex, 1);
+      subModel._markDeleted();
+      updateSubModelsNames(arrayModel);
+    }
+  }),
+  moveUp: action((arrayModel, itemIndex) => {
+    invariantArrayShapeIsAutoOrArray(arrayModel);
+    if (itemIndex === 0) {
+      return;
+    }
+    if (Array.isArray(arrayModel.values)) {
+      swapInPlace(arrayModel.values, itemIndex, itemIndex - 1);
+    }
+    if (Array.isArray(arrayModel._subModels)) {
+      swapInPlace(arrayModel._subModels, itemIndex, itemIndex - 1);
+      updateSubModelsNames(arrayModel);
+    }
+  }),
+  moveDown: action((arrayModel, itemIndex) => {
+    invariantArrayShapeIsAutoOrArray(arrayModel);
+    if (Array.isArray(arrayModel.values)) {
+      if (itemIndex === arrayModel.values.length - 1) {
+        return;
+      }
+      swapInPlace(arrayModel.values, itemIndex, itemIndex + 1);
+    }
+    if (Array.isArray(arrayModel._subModels)) {
+      swapInPlace(arrayModel._subModels, itemIndex, itemIndex + 1);
+      updateSubModelsNames(arrayModel);
+    }
+  }),
+  clear: action((arrayModel) => {
+    invariantArrayShapeIsAutoOrArray(arrayModel);
+    if (arrayModel.values == null || arrayModel.values.length === 0) {
+      return;
+    }
+    arrayModel.values = [];
+    if (Array.isArray(arrayModel)) {
+      arrayModel._subModels.forEach((subModel) => {
+        subModel._markDeleted();
+      });
+      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);
+      }
+    }
+  ),
+  renderArrayItem(arrayModel, itemIndex, itemContent) {
+    const itemModel = arrayModel.getSubModel(itemIndex);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Form.ModelProvider, { value: itemModel, children: itemContent(itemIndex, itemModel) }, itemModel.id);
+  },
+  getKey(arrayModel, itemIndex) {
+    return arrayModel.getSubModel(itemIndex).id;
+  }
+};
+export {
+  arrayHelpers
+};

package/dist/form/common-utils.d.ts

@@ -0,0 +1,12 @@
+export declare function keyToValueShape(key: string): "array" | "object";
+export declare function splitToPath(name: number | string): string[];
+/** 合并两个值，如果第一个不为 undefined，则使用第一个值，否则使用第二个值 */
+export declare function composeValue<T>(first: T, second: T): T;
+/** lodash.get(...) for mobx observables */
+export declare function observableGetIn(obj: any, key: string | string[], defaultValue?: any): any;
+/** lodash.set(...) for mobx observables */
+export declare function observableSetIn(obj: unknown, key: string | string[], value: unknown): void;
+export declare function useHtmlIdPrefix(htmlIdPrefixProp?: string): string;
+export declare function asCSSLength(len: number | string): string;
+export declare function isFalsyOrEmptyArray(value: any): boolean;
+export declare const range: (n: number) => number[];

package/dist/form/common-utils.js

@@ -0,0 +1,90 @@
+import { useState } from "react";
+import * as mobx from "mobx";
+function isNumericKey(key) {
+  return String(Number.parseInt(key)) === key;
+}
+function keyToValueShape(key) {
+  return isNumericKey(key) ? "array" : "object";
+}
+function splitToPath(name) {
+  return String(name).split(".");
+}
+function composeValue(first, second) {
+  if (first !== void 0) {
+    return first;
+  }
+  return second;
+}
+function observableGetIn(obj, key, defaultValue) {
+  const path = Array.isArray(key) ? key : splitToPath(key);
+  let target = obj;
+  for (let i = 0; i < path.length; i += 1) {
+    if (!mobx.isObservable(target)) {
+      return defaultValue;
+    }
+    target = mobx.get(target, path[i]);
+  }
+  if (target === void 0) {
+    return defaultValue;
+  }
+  return target;
+}
+function observableSetIn(obj, key, value) {
+  const path = Array.isArray(key) ? key : splitToPath(key);
+  const lastPartIndex = path.length - 1;
+  let target = obj;
+  for (let i = 0; i < lastPartIndex; i += 1) {
+    const part = path[i];
+    if (mobx.get(target, part) == null) {
+      if (isNumericKey(path[i + 1])) {
+        mobx.set(target, part, []);
+      } else {
+        mobx.set(target, part, {});
+      }
+    }
+    target = mobx.get(target, part);
+    if (!mobx.isObservable(target)) {
+      return;
+    }
+  }
+  if (mobx.isObservable(target)) {
+    mobx.set(target, path[lastPartIndex], value);
+  }
+}
+function generateRandomId(len) {
+  const byteToHex = (byte) => ("0" + byte.toString(16)).slice(-2);
+  const arr = new Uint8Array(len / 2);
+  window.crypto.getRandomValues(arr);
+  return Array.from(arr, byteToHex).join("");
+}
+function useHtmlIdPrefix(htmlIdPrefixProp) {
+  const [autoGeneratedPrefix] = useState(() => `xform_${generateRandomId(6)}.`);
+  if (htmlIdPrefixProp !== void 0) {
+    return htmlIdPrefixProp;
+  }
+  return autoGeneratedPrefix;
+}
+function asCSSLength(len) {
+  return typeof len === "number" ? `${len}px` : len;
+}
+function isFalsyOrEmptyArray(value) {
+  return !value || Array.isArray(value) && value.length === 0;
+}
+const range = (n) => {
+  const result = [];
+  for (let i = 0; i < n; i++) {
+    result.push(i);
+  }
+  return result;
+};
+export {
+  asCSSLength,
+  composeValue,
+  isFalsyOrEmptyArray,
+  keyToValueShape,
+  observableGetIn,
+  observableSetIn,
+  range,
+  splitToPath,
+  useHtmlIdPrefix
+};

package/dist/form/context/formEnvContext.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { FormEnvContextType } from '../type';
+export declare const useFormEnv: () => FormEnvContextType;
+export declare function FormEnvProvider({ children, ...override }: FormEnvContextType & {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/form/context/formEnvContext.js

@@ -0,0 +1,23 @@
+import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { useContext, createContext } from "react";
+const FormEnvContext = createContext({
+  isPreview: false,
+  validateOnMount: false,
+  validateOnBlur: true,
+  validateOnChange: true,
+  writeDefaultValueToModel: false,
+  autoUnmount: false
+});
+FormEnvContext.displayName = "FormEnvContext";
+const useFormEnv = () => useContext(FormEnvContext);
+function FormEnvProvider({
+  children,
+  ...override
+}) {
+  const parent = useFormEnv();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormEnvContext.Provider, { value: { ...parent, ...override }, children });
+}
+export {
+  FormEnvProvider,
+  useFormEnv
+};

package/dist/form/context/modelContext.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { FormModel } from '../model';
+export declare function useModel<T = any>(): FormModel<T>;
+export declare const ModelProvider: React.Provider<FormModel<any>>;

package/dist/form/context/modelContext.js

@@ -0,0 +1,11 @@
+import { createContext, useContext } from "react";
+const ModelContext = createContext(null);
+function useModel() {
+  return useContext(ModelContext);
+}
+ModelContext.displayName = "ModelContext";
+const ModelProvider = ModelContext.Provider;
+export {
+  ModelProvider,
+  useModel
+};

package/dist/form/enum.d.ts

@@ -0,0 +1,9 @@
+export declare enum ModelType {
+    rootModel = "rootModel",
+    subModel = "subModel"
+}
+export declare enum FieldType {
+    normal = "normal",
+    tuple = "tuple",
+    readonly = "readonly"
+}

package/dist/form/enum.js

@@ -0,0 +1,15 @@
+var ModelType = /* @__PURE__ */ ((ModelType2) => {
+  ModelType2["rootModel"] = "rootModel";
+  ModelType2["subModel"] = "subModel";
+  return ModelType2;
+})(ModelType || {});
+var FieldType = /* @__PURE__ */ ((FieldType2) => {
+  FieldType2["normal"] = "normal";
+  FieldType2["tuple"] = "tuple";
+  FieldType2["readonly"] = "readonly";
+  return FieldType2;
+})(FieldType || {});
+export {
+  FieldType,
+  ModelType
+};

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

@@ -0,0 +1,15 @@
+import { FormItemCreationOptions, FormItemProps, FormItemViewProps } from './type';
+export declare function FormItemView({ htmlId, label, help, tip, asterisk, error, children, className, style, labelWidth, controlWidth, rightNode, labelStyle, controlStyle, }: FormItemViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function createFormItem(inputOptions: FormItemCreationOptions): {
+    ({ defaultValue: defaultValueProp, isEmpty, renderPreview, componentProps: componentPropsProp, name, field: fieldProp, ...props }: Omit<FormItemProps, "component">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+} & {
+    displayName: string;
+};
+export declare const AnonymousFormItem: {
+    ({ defaultValue: defaultValueProp, isEmpty, renderPreview, componentProps: componentPropsProp, name, field: fieldProp, ...props }: Omit<FormItemProps, "component">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+} & {
+    displayName: string;
+};
+export declare function FormItem({ use, component, ...props }: FormItemProps): import("react/jsx-runtime").JSX.Element;