cnhis-design-vue 3.1.17-beta.0 → 3.1.17-beta.3

package/es/packages/form-config/src/components/FormConfigCreator.js

@@ -29,7 +29,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       await formRef.validate();
       const formData = formRef.getFormValues();
-      emit("submit", { layoutWidthEnum: "ALL_LINE", ...formData, type, key: formData.name });
+      emit("submit", { layoutWidthEnum: "ALL_LINE", ...formData, type, key: formData.name, __new: true });
     }
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NButtonGroup), { size: "small" }, {
@@ -50,6 +50,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             default: withCtx(() => [
               createVNode(unref(FormRender), {
+                column: 12,
                 ref_key: "lineBreakFormRef",
                 ref: lineBreakFormRef,
                 "initial-data": unref(pick)(initialData, ["layoutWidthEnum"]),
@@ -77,6 +78,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             default: withCtx(() => [
               createVNode(unref(FormRender), {
+                column: 12,
                 ref_key: "linebarFormRef",
                 ref: linebarFormRef,
                 "initial-data": initialData,

package/es/packages/form-config/src/components/FormConfigDragDisplay.js

@@ -0,0 +1,43 @@
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, createElementVNode, normalizeStyle, resolveDynamicComponent } from 'vue';
+import Draggable from 'vuedraggable';
+import { useSortable } from '../../../../packages/form-config/src/hooks';
+import { layoutWidthEnum2Column } from '../../../../packages/form-config/src/utils';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "FormConfigDragDisplay",
+  props: {
+    fieldItem: { type: Object },
+    getRenderer: { type: Function, require: true },
+    textFormatter: { type: Function, required: true }
+  },
+  setup(__props) {
+    function getItemColumnStyle(fieldItem) {
+      return { "--item-column": fieldItem ? layoutWidthEnum2Column(fieldItem.layoutWidthEnum) : 24 };
+    }
+    const { commonConfig } = useSortable();
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Draggable), mergeProps(unref(commonConfig), {
+        style: getItemColumnStyle(__props.fieldItem),
+        group: "__display"
+      }), {
+        item: withCtx(({ element }) => [
+          createElementVNode("div", {
+            class: "form-config__displayContentItem",
+            style: normalizeStyle(getItemColumnStyle(element))
+          }, [
+            (openBlock(), createBlock(resolveDynamicComponent(__props.getRenderer(element)), {
+              "get-renderer": __props.getRenderer,
+              "field-item": element,
+              textFormatter: __props.textFormatter
+            }, null, 8, ["get-renderer", "field-item", "textFormatter"]))
+          ], 4)
+        ]),
+        _: 1
+      }, 16, ["style"]);
+    };
+  }
+});
+var FormConfigDragDisplay = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "FormConfigDragDisplay.vue"]]);
+
+export { FormConfigDragDisplay as default };

package/es/packages/form-config/src/components/FormConfigDragDisplay.vue.d.ts

@@ -0,0 +1,114 @@
+import { Func } from '../../../../../es/src/types';
+import { PropType } from 'vue';
+import { FormConfigItem, FormConfigTextFormatter } from '../../../../../es/packages/form-config';
+declare const _default: import("vue").DefineComponent<{
+    fieldItem: {
+        type: PropType<FormConfigItem>;
+    };
+    getRenderer: {
+        type: Func<any[], any>;
+        require: boolean;
+    };
+    textFormatter: {
+        type: PropType<FormConfigTextFormatter>;
+        required: true;
+    };
+}, {
+    getItemColumnStyle: (fieldItem?: FormConfigItem) => {
+        '--item-column': number;
+    };
+    commonConfig: {
+        onMove: ({ to, from }: import("sortablejs").SortableEvent) => void;
+        onChoose: ({ target, item }: import("sortablejs").SortableEvent) => void;
+        onUnchoose: ({ from, to, target, item }: import("sortablejs").SortableEvent) => void;
+        tag: string;
+        animation: string;
+        'item-key': string;
+    };
+    Draggable: import("vue").DefineComponent<{
+        list: {
+            type: ArrayConstructor;
+            required: boolean;
+            default: any;
+        };
+        modelValue: {
+            type: ArrayConstructor;
+            required: boolean;
+            default: any;
+        };
+        itemKey: {
+            type: (StringConstructor | FunctionConstructor)[];
+            required: boolean;
+        };
+        clone: {
+            type: FunctionConstructor;
+            default: (original: any) => any;
+        };
+        tag: {
+            type: StringConstructor;
+            default: string;
+        };
+        move: {
+            type: FunctionConstructor;
+            default: any;
+        };
+        componentData: {
+            type: ObjectConstructor;
+            required: boolean;
+            default: any;
+        };
+    }, unknown, {
+        error: boolean;
+    }, {
+        realList(): any;
+        getKey(): any;
+    }, {
+        getUnderlyingVm(domElement: any): any;
+        getUnderlyingPotencialDraggableComponent(htmElement: any): any;
+        emitChanges(evt: any): void;
+        alterList(onList: any): void;
+        spliceList(): void;
+        updatePosition(oldIndex: any, newIndex: any): void;
+        getRelatedContextFromMoveEvent({ to, related }: {
+            to: any;
+            related: any;
+        }): any;
+        getVmIndexFromDomIndex(domIndex: any): any;
+        onDragStart(evt: any): void;
+        onDragAdd(evt: any): void;
+        onDragRemove(evt: any): void;
+        onDragUpdate(evt: any): void;
+        computeFutureIndex(relatedContext: any, evt: any): any;
+        onDragMove(evt: any, originalEvent: any): any;
+        onDragEnd(): void;
+    }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any[], any, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+        move: Function;
+        tag: string;
+        clone: Function;
+        list: unknown[];
+        modelValue: unknown[];
+        componentData: Record<string, any>;
+    } & {
+        itemKey?: string | Function | undefined;
+    }>, {
+        move: Function;
+        tag: string;
+        clone: Function;
+        list: unknown[];
+        modelValue: unknown[];
+        componentData: Record<string, any>;
+    }>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    fieldItem: {
+        type: PropType<FormConfigItem>;
+    };
+    getRenderer: {
+        type: Func<any[], any>;
+        require: boolean;
+    };
+    textFormatter: {
+        type: PropType<FormConfigTextFormatter>;
+        required: true;
+    };
+}>>, {}>;
+export default _default;

package/es/packages/form-config/src/components/FormConfigEdit.js

@@ -54,6 +54,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock(Fragment, null, [
         (openBlock(), createBlock(unref(CFormRender), {
           key: key.value,
+          column: 12,
           ref_key: "formRenderRef",
           ref: formRenderRef,
           size: "small",

package/es/packages/form-config/src/components/FormConfigEdit.vue.d.ts

@@ -1687,7 +1687,9 @@ declare const _default: import("vue").DefineComponent<{}, {
             notes?: string | undefined;
             desc?: string | undefined;
             children?: any[] | undefined;
+            __new?: boolean | undefined;
         }[] | undefined;
+        __new?: boolean | undefined;
     }>;
     generateFieldListByFieldItem: (fieldItem: FormConfigItem) => FieldItem[];
     showModal: import("vue").Ref<boolean>;

package/es/packages/form-config/src/constants/index.d.ts

@@ -59,4 +59,6 @@ export declare function isNullOptionConfig(): {
         value: boolean;
     };
 };
+export declare const InjectionFieldList: InjectionKey<Ref<FormConfigItem[]>>;
+export declare const InjectionMaterialList: InjectionKey<Ref<FormConfigItem[]>>;
 export declare const InjectionActiveFieldItem: InjectionKey<Ref<UndefinedAble<FormConfigItem>>>;

package/es/packages/form-config/src/constants/index.js

@@ -24,7 +24,8 @@ function widgetWidthOptionConfig() {
       { text: "1/3", value: "ONE_THREE" },
       { text: "3/4", value: "THREE_FOUR" },
       { text: "1/4", value: "ONE_FOUR" },
-      { text: "1/6", value: "ONE_SIX" }
+      { text: "1/6", value: "ONE_SIX" },
+      { text: "1/8", value: "ONE_EIGHT" }
     ]
   };
 }
@@ -52,6 +53,8 @@ function isNullOptionConfig() {
     close: { describe: "\u4E0D\u5FC5\u586B", value: false }
   };
 }
+const InjectionFieldList = Symbol("InjectionFieldList");
+const InjectionMaterialList = Symbol("InjectionMaterialList");
 const InjectionActiveFieldItem = Symbol("InjectionActiveFieldItem");
 
-export { EditAbleField, InjectionActiveFieldItem, WidgetTextMap, isEditOptionConfig, isNotFoldOptionConfig, isNullOptionConfig, isShowOptionConfig, widgetWidthOptionConfig };
+export { EditAbleField, InjectionActiveFieldItem, InjectionFieldList, InjectionMaterialList, WidgetTextMap, isEditOptionConfig, isNotFoldOptionConfig, isNullOptionConfig, isShowOptionConfig, widgetWidthOptionConfig };

package/es/packages/form-config/src/hooks/useConfigurationField.js

@@ -2,24 +2,24 @@ import { EditAbleField, widgetWidthOptionConfig, isShowOptionConfig, isNotFoldOp
 
 function useConfigurationField() {
   const fieldMap = /* @__PURE__ */ new Map([
-    [EditAbleField.NAME, { alias: "\u540D\u79F0", elem_width: 12, is_null: "0", html_type: "INPUT" }],
-    [EditAbleField.NOTES, { alias: "\u95EE\u53F7\u63D0\u793A", elem_width: 12, html_type: "INPUT" }],
+    [EditAbleField.NAME, { alias: "\u540D\u79F0", elem_width: 6, is_null: "0", html_type: "INPUT" }],
+    [EditAbleField.NOTES, { alias: "\u95EE\u53F7\u63D0\u793A", elem_width: 6, html_type: "INPUT" }],
     [
       EditAbleField.DEFAULT_VALUE,
-      { alias: "\u9ED8\u8BA4\u503C", elem_width: 12, html_type: "INPUT", validate: { max_length: 20 } }
+      { alias: "\u9ED8\u8BA4\u503C", elem_width: 6, html_type: "INPUT", validate: { max_length: 20 } }
     ],
     [
       EditAbleField.LAYOUT_WIDTH_ENUM,
-      { alias: "\u5BBD\u5EA6", fieldType: "number", html_type: "SELECT", elem_width: 12, ...widgetWidthOptionConfig() }
+      { alias: "\u5BBD\u5EA6", fieldType: "number", html_type: "SELECT", elem_width: 6, ...widgetWidthOptionConfig() }
     ],
-    [EditAbleField.DESC, { alias: "\u8BF4\u660E\u6587\u672C", elem_width: 12, html_type: "INPUT", validate: { max_length: 30 } }],
+    [EditAbleField.DESC, { alias: "\u8BF4\u660E\u6587\u672C", elem_width: 6, html_type: "INPUT", validate: { max_length: 30 } }],
     [
       EditAbleField.DEFAULT_EXPAND,
-      { alias: "\u662F\u5426\u9ED8\u8BA4\u5C55\u5F00", html_type: "SWITCH", elem_width: 12, ...isShowOptionConfig() }
+      { alias: "\u662F\u5426\u9ED8\u8BA4\u5C55\u5F00", html_type: "SWITCH", elem_width: 6, ...isShowOptionConfig() }
     ],
-    [EditAbleField.FOLD, { alias: "\u662F\u5426\u53EF\u6298\u53E0", html_type: "SWITCH", elem_width: 12, ...isNotFoldOptionConfig() }],
-    [EditAbleField.EDITABLE, { alias: "\u662F\u5426\u53EF\u7F16\u8F91", html_type: "SWITCH", elem_width: 12, ...isEditOptionConfig() }],
-    [EditAbleField.REQUIRED, { alias: "\u662F\u5426\u5FC5\u586B", html_type: "SWITCH", elem_width: 12, ...isNullOptionConfig() }]
+    [EditAbleField.FOLD, { alias: "\u662F\u5426\u53EF\u6298\u53E0", html_type: "SWITCH", elem_width: 6, ...isNotFoldOptionConfig() }],
+    [EditAbleField.EDITABLE, { alias: "\u662F\u5426\u53EF\u7F16\u8F91", html_type: "SWITCH", elem_width: 6, ...isEditOptionConfig() }],
+    [EditAbleField.REQUIRED, { alias: "\u662F\u5426\u5FC5\u586B", html_type: "SWITCH", elem_width: 6, ...isNullOptionConfig() }]
   ]);
   function generateFieldListByKeys(keyList) {
     return keyList.map((key) => {

package/es/packages/form-config/src/hooks/usePresetRenderer.d.ts

@@ -1,4 +1,4 @@
-import { FormConfigItem, FormConfigTextFormatter } from '../types';
-export declare function usePresetRenderer(textFormatter: FormConfigTextFormatter): {
+import { FormConfigItem } from '../types';
+export declare function usePresetRenderer(): {
     getRenderer: (fieldItem: FormConfigItem) => import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | import("vue").FunctionalComponent<{}, {}>;
 };

package/es/packages/form-config/src/hooks/usePresetRenderer.js

@@ -1,94 +1,16 @@
-import { defineComponent, computed, createVNode, mergeProps, inject } from 'vue';
 import { isString, isArray, isFunction } from 'lodash-es';
-import Draggable from 'vuedraggable';
-import { InjectionActiveFieldItem, WidgetTextMap } from '../../../../packages/form-config/src/constants';
-import { useSortable } from '../../../../packages/form-config/src/hooks/useSortable';
-import { layoutWidthEnum2Column } from '../../../../packages/form-config/src/utils';
-import { NEllipsis } from 'naive-ui';
+import { computed } from 'vue';
+import DefaultNode from '../components/DefaultNode.js';
+import ComplexNode from '../components/ComplexNode.js';
 
-function usePresetRenderer(textFormatter) {
+function usePresetRenderer() {
   const renderDefaultNode = {
     matcher: () => true,
-    renderer({
-      fieldItem
-    }) {
-      const currentActiveEditField = inject(InjectionActiveFieldItem);
-      return createVNode("section", {
-        "onClick": () => currentActiveEditField.value = fieldItem,
-        "class": {
-          "is-active": currentActiveEditField.value === fieldItem
-        }
-      }, [createVNode(NEllipsis, {
-        "class": ["form-config__renderer--default", {
-          "is-required": fieldItem.required,
-          "is-disabled": fieldItem.editable === false
-        }]
-      }, {
-        default: () => getDisplayText()
-      })]);
-      function getDisplayText() {
-        const type = WidgetTextMap.get(fieldItem.type);
-        return textFormatter(fieldItem, `${fieldItem.name}${type ? `(${type})` : ""}`);
-      }
-    }
+    renderer: DefaultNode
   };
   const renderComplexNode = {
     matcher: ["COMPLEX", "COMBINATION"],
-    renderer: defineComponent({
-      props: {
-        fieldItem: {
-          type: Object,
-          required: true
-        }
-      },
-      setup(props) {
-        function fieldFor(key) {
-          return props.fieldItem[key];
-        }
-        const classList = computed(() => {
-          return "form-config__renderer--complex form-config__renderer--complex--grid";
-        });
-        const style = computed(() => {
-          return {
-            "--item-column": layoutWidthEnum2Column(fieldFor("layoutWidthEnum"))
-          };
-        });
-        function renderField(fieldItem) {
-          const Renderer = getRenderer(fieldItem);
-          return createVNode("div", {
-            "class": "form-config__displayContentItem",
-            "style": {
-              "--item-column": layoutWidthEnum2Column(fieldItem.layoutWidthEnum)
-            }
-          }, [createVNode(Renderer, {
-            "fieldItem": fieldItem
-          }, null)]);
-        }
-        const childrenList = computed({
-          get() {
-            return fieldFor("children");
-          },
-          set(v) {
-            props.fieldItem.children = v;
-          }
-        });
-        const {
-          commonConfig
-        } = useSortable();
-        const DraggableComponent = Draggable;
-        return () => createVNode(DraggableComponent, mergeProps(commonConfig, {
-          "class": classList.value,
-          "style": style.value,
-          "group": fieldFor("key"),
-          "modelValue": childrenList.value,
-          "onUpdate:modelValue": ($event) => childrenList.value = $event
-        }), {
-          item: ({
-            element
-          }) => renderField(element)
-        });
-      }
-    })
+    renderer: ComplexNode
   };
   const rendererWithPreset = computed(() => {
     return [renderComplexNode, renderDefaultNode];

package/es/packages/form-config/src/hooks/useSortable.js

@@ -15,13 +15,9 @@ function useSortable() {
   }
   let prevTo;
   function onMove({ to, from }) {
-    if (to === from) {
-      prevTo == null ? void 0 : prevTo.classList.remove("is-choosing-area");
-      prevTo = null;
-    } else {
-      from.classList.remove("is-choosing-area");
-      prevTo = to;
-    }
+    prevTo == null ? void 0 : prevTo.classList.remove("is-choosing-area");
+    prevTo = to;
+    from.classList.remove("is-choosing-area");
     to.classList.add("is-choosing-area");
   }
   const commonConfig = { onMove, onChoose, onUnchoose, tag: "section", animation: "150", "item-key": "key" };

package/es/packages/form-config/src/types/index.d.ts

@@ -8,7 +8,7 @@ export declare type FormConfigRenderer = {
     renderer: Component | FunctionalComponent;
 };
 export declare type FormConfigType = 'NEWLINE' | 'LINE_BAR' | 'OTHER' | string;
-export declare type FormConfigWidth = 'ALL_LINE' | 'HALF_LINE' | 'FIVE_SIX' | 'TWO_THREE' | 'ONE_THREE' | 'THREE_FOUR' | 'ONE_FOUR' | 'ONE_SIX';
+export declare type FormConfigWidth = 'ALL_LINE' | 'HALF_LINE' | 'FIVE_SIX' | 'TWO_THREE' | 'ONE_THREE' | 'THREE_FOUR' | 'ONE_FOUR' | 'ONE_SIX' | 'ONE_EIGHT';
 export declare type FormConfigItem = {
     key: string;
     layoutWidthEnum: FormConfigWidth;
@@ -24,6 +24,7 @@ export declare type FormConfigItem = {
     notes: string;
     desc: string;
     children: FormConfigItem[];
+    __new: boolean;
 }>;
 export interface FormConfigTextFormatter {
     (fieldItem: FormConfigItem, parsedText: string): string;

package/es/packages/form-config/src/utils/index.d.ts

@@ -1,2 +1,9 @@
-import { FormConfigWidth } from '../../../../../es/packages/form-config';
+import { Func } from '../../../../../es/src/types';
+import { FormConfigItem, FormConfigWidth } from '../../../../../es/packages/form-config';
 export declare function layoutWidthEnum2Column(layoutWidthEnum: FormConfigWidth): number;
+export declare function stopModifier(fn: Func): (event: Event, ...args: unknown[]) => any;
+export declare function bindHover(fieldItem: FormConfigItem): {
+    onMouseenter: () => FormConfigItem;
+    onMouseleave: () => undefined;
+    'is-hovering': boolean;
+};

package/es/packages/form-config/src/utils/index.js

@@ -1,15 +1,29 @@
+import { ref, withModifiers } from 'vue';
+
 function layoutWidthEnum2Column(layoutWidthEnum) {
   const transferMap = {
-    ALL_LINE: 12,
-    HALF_LINE: 6,
-    FIVE_SIX: 10,
-    TWO_THREE: 8,
-    ONE_THREE: 4,
-    THREE_FOUR: 9,
-    ONE_FOUR: 3,
-    ONE_SIX: 2
+    ALL_LINE: 24,
+    HALF_LINE: 12,
+    FIVE_SIX: 20,
+    TWO_THREE: 16,
+    ONE_THREE: 8,
+    THREE_FOUR: 18,
+    ONE_FOUR: 6,
+    ONE_SIX: 4,
+    ONE_EIGHT: 3
   };
   return transferMap[layoutWidthEnum] || 12;
 }
+function stopModifier(fn) {
+  return withModifiers(fn, ["stop"]);
+}
+const hovering = ref();
+function bindHover(fieldItem) {
+  return {
+    onMouseenter: () => hovering.value = fieldItem,
+    onMouseleave: () => hovering.value = void 0,
+    "is-hovering": hovering.value === fieldItem
+  };
+}
 
-export { layoutWidthEnum2Column };
+export { bindHover, layoutWidthEnum2Column, stopModifier };

package/es/packages/form-config/style/index.css

@@ -30,6 +30,7 @@
   display: flex;
   align-items: center;
   padding: 8px;
+  cursor: move;
   border: 1px dashed #d9d9d9;
   box-sizing: border-box;
   background-color: #fafafa;
@@ -58,8 +59,8 @@
   height: fit-content;
   background: #eeeeee;
   display: grid !important;
-  grid-template-columns: repeat(12, minmax(0px, 1fr));
-  gap: 8px 16px;
+  grid-template-columns: repeat(24, minmax(0px, 1fr));
+  gap: 8px;
 }
 .form-config__displayContentItem {
   grid-column: span var(--item-column) / span var(--item-column);
@@ -85,6 +86,9 @@
   overflow-y: auto;
   max-height: var(--max-height);
 }
+.form-config__renderer {
+  cursor: move;
+}
 .form-config__renderer--default {
   display: flex;
   align-items: center;
@@ -97,13 +101,21 @@
   width: 100%;
 }
 .form-config__renderer--complex {
-  border: 1px dashed lightblue;
+  border: 1px dashed skyblue;
+  border-radius: 8px;
+  padding: 8px;
+}
+.form-config__renderer--complexHeader {
+  display: flex;
+  justify-content: center;
   padding: 8px;
+  margin-top: -8px;
+  position: relative;
 }
 .form-config__renderer--complex--grid {
   display: grid !important;
-  grid-template-columns: repeat(12, minmax(0px, 1fr));
-  gap: 8px 16px;
+  grid-template-columns: repeat(24, minmax(0px, 1fr));
+  gap: 8px;
   grid-column: span var(--item-column) / span var(--item-column);
 }
 .form-config__renderer--complex--flex {
@@ -130,3 +142,12 @@
 .form-config .is-choosing-area {
   background: #f0f7ff;
 }
+.form-config [is-hovering='true'] > .form-config__renderer--closeButton {
+  visibility: visible;
+}
+.form-config .form-config__renderer--closeButton {
+  position: absolute;
+  visibility: hidden;
+  top: 12px;
+  right: 5px;
+}

package/es/packages/form-render/index.js

@@ -7,7 +7,7 @@ export { useCommonLog } from './src/hooks/useCommonLog.js';
 export { useFormField } from './src/hooks/useFormField.js';
 export { AsyncQueue, useAsyncQueue } from './src/hooks/useAsyncQueue.js';
 export { useFieldVisitor } from './src/hooks/useFieldVisitor.js';
-export { useTypeNormalize } from './src/hooks/useTypeNormalize.js';
+export { useFieldNormalize } from './src/hooks/useFieldNormalize.js';
 export { useFormValidator } from './src/hooks/useFormValidator.js';
 export { BusinessCollector, useBusinessBinding } from './src/hooks/useBusinessBinding.js';
 export { ContextCollector, useChangeContext } from './src/hooks/useChangeContext.js';

package/es/packages/form-render/src/hooks/index.d.ts

@@ -4,7 +4,7 @@ export * from './useCommonLog';
 export * from './useFormField';
 export * from './useAsyncQueue';
 export * from './useFieldVisitor';
-export * from './useTypeNormalize';
+export * from './useFieldNormalize';
 export * from './useFormValidator';
 export * from './useBusinessBinding';
 export * from './useChangeContext';

package/es/packages/form-render/src/hooks/index.js

@@ -4,7 +4,7 @@ export { useCommonLog } from './useCommonLog.js';
 export { useFormField } from './useFormField.js';
 export { AsyncQueue, useAsyncQueue } from './useAsyncQueue.js';
 export { useFieldVisitor } from './useFieldVisitor.js';
-export { useTypeNormalize } from './useTypeNormalize.js';
+export { useFieldNormalize } from './useFieldNormalize.js';
 export { useFormValidator } from './useFormValidator.js';
 export { BusinessCollector, useBusinessBinding } from './useBusinessBinding.js';
 export { ContextCollector, useChangeContext } from './useChangeContext.js';

package/es/packages/form-render/src/hooks/useBusinessBinding.d.ts

@@ -12,12 +12,11 @@ export declare class BusinessCollector {
     private getField;
     private getType;
     private getValueByField;
-    private getValueByType;
-    private setValueByType;
-    private handlerIdCardType;
-    private handlerBirthdayType;
-    private handlerAgeType;
-    private handlerChangeMap;
+    getValueByType(type: FIELD_BUSINESS_TYPE): unknown;
+    setValueByType(type: FIELD_BUSINESS_TYPE, value: unknown, force?: boolean): void;
+    registerChangeBusiness(type: FIELD_BUSINESS_TYPE, handler: () => void): this;
+    registerBlurBusiness(type: FIELD_BUSINESS_TYPE, handler: () => void): this;
+    private changeHandlerMap;
     private blurHandlerMap;
     trigger(fieldName: string, triggerType?: 'change' | 'blur'): void;
 }

package/es/packages/form-render/src/hooks/useBusinessBinding.js

@@ -10,14 +10,8 @@ class BusinessCollector {
     this.businessFormatter = businessFormatter;
     this.typeCollector = /* @__PURE__ */ new Map();
     this.fieldNameCollector = /* @__PURE__ */ new Map();
-    this.handlerChangeMap = /* @__PURE__ */ new Map([
-      [FIELD_BUSINESS_TYPE.ID_CARD, this.handlerIdCardType.bind(this)],
-      [FIELD_BUSINESS_TYPE.AGE_UNIT, this.handlerAgeType.bind(this)]
-    ]);
-    this.blurHandlerMap = /* @__PURE__ */ new Map([
-      [FIELD_BUSINESS_TYPE.BIRTHDAY, this.handlerBirthdayType.bind(this)],
-      [FIELD_BUSINESS_TYPE.AGE, this.handlerAgeType.bind(this)]
-    ]);
+    this.changeHandlerMap = /* @__PURE__ */ new Map([]);
+    this.blurHandlerMap = /* @__PURE__ */ new Map([]);
   }
   formatter(...args) {
     return isFunction(this.businessFormatter) ? this.businessFormatter(...args) : args[0].value;
@@ -48,7 +42,23 @@ class BusinessCollector {
       state.value = this.formatter({ value, type, fieldKey: field });
     });
   }
-  handlerIdCardType() {
+  registerChangeBusiness(type, handler) {
+    this.changeHandlerMap.set(type, handler);
+    return this;
+  }
+  registerBlurBusiness(type, handler) {
+    this.blurHandlerMap.set(type, handler);
+    return this;
+  }
+  trigger(fieldName, triggerType = "change") {
+    var _a, _b;
+    const type = this.getType(fieldName);
+    const handlerMaps = { change: this.changeHandlerMap, blur: this.blurHandlerMap };
+    type && ((_b = (_a = handlerMaps[triggerType]) == null ? void 0 : _a.get(type)) == null ? void 0 : _b.call(this));
+  }
+}
+function useBusinessBinding() {
+  function handlerIdCardType() {
     const idCard = this.getValueByType(FIELD_BUSINESS_TYPE.ID_CARD);
     if (!idCard || !isString(idCard) || !isIdCard(idCard))
       return;
@@ -59,7 +69,7 @@ class BusinessCollector {
     this.setValueByType(FIELD_BUSINESS_TYPE.SEX, info.sex);
     this.setValueByType(FIELD_BUSINESS_TYPE.BIRTHDAY, info.birthday);
   }
-  handlerBirthdayType() {
+  function handlerBirthdayType() {
     const birthday = this.getValueByType(FIELD_BUSINESS_TYPE.BIRTHDAY);
     if (!isString(birthday))
       return;
@@ -67,7 +77,7 @@ class BusinessCollector {
     this.setValueByType(FIELD_BUSINESS_TYPE.AGE_UNIT, ageUnit);
     this.setValueByType(FIELD_BUSINESS_TYPE.AGE, age);
   }
-  handlerAgeType() {
+  function handlerAgeType() {
     const age = this.getValueByType(FIELD_BUSINESS_TYPE.AGE);
     const ageUnit = this.getValueByType(FIELD_BUSINESS_TYPE.AGE_UNIT);
     if (!isString(age) && !isNumber(age) || age === "")
@@ -76,16 +86,8 @@ class BusinessCollector {
       return;
     this.setValueByType(FIELD_BUSINESS_TYPE.BIRTHDAY, parseAge2Birthday(+age, ageUnit), false);
   }
-  trigger(fieldName, triggerType = "change") {
-    var _a;
-    const type = this.getType(fieldName);
-    const handler = triggerType === "change" ? this.handlerChangeMap : triggerType === "blur" ? this.blurHandlerMap : null;
-    type && ((_a = handler == null ? void 0 : handler.get(type)) == null ? void 0 : _a());
-  }
-}
-function useBusinessBinding() {
   function create(formModel, formatter) {
-    return new BusinessCollector(formModel, formatter);
+    return new BusinessCollector(formModel, formatter).registerChangeBusiness(FIELD_BUSINESS_TYPE.ID_CARD, handlerIdCardType).registerChangeBusiness(FIELD_BUSINESS_TYPE.AGE_UNIT, handlerAgeType).registerBlurBusiness(FIELD_BUSINESS_TYPE.BIRTHDAY, handlerBirthdayType).registerBlurBusiness(FIELD_BUSINESS_TYPE.AGE, handlerAgeType);
   }
   return { create };
 }