cnhis-design-vue 3.4.0-beta.3 → 3.4.0-beta.30

package/es/components/form-render/src/FormRender.vue.d.ts

@@ -3,7 +3,7 @@ import { AnyObject, LowCodeTypes } from '../../../shared/types';
 import { Component, FunctionalComponent, PropType } from 'vue';
 import { AnnotationItem } from '../../../components/annotation-edit/src/type';
 import { FieldItem, FieldVisitor, FormBusinessFormatter, FormRenderExpose } from './types';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     fieldList: {
         type: PropType<FieldItem[]>;
     };
@@ -97,7 +97,7 @@ declare const _default: import("vue").DefineComponent<{
         }>>;
     };
     components: {
-        type: PropType<Record<string, Component | FunctionalComponent<{}, {}>>>;
+        type: PropType<Record<string, Component | FunctionalComponent<{}, {}, any, {}>>>;
         default: () => {};
     };
     scope: {
@@ -182,11 +182,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<string[]>;
     };
     linebarDirection: {
-        type: PropType<"horizontal" | "vertical">;
+        type: PropType<"vertical" | "horizontal">;
         default: string;
     };
     linebarTextDirection: {
-        type: PropType<"horizontal" | "vertical">;
+        type: PropType<"vertical" | "horizontal">;
         default: string;
     };
     linebarWidth: {
@@ -211,8 +211,8 @@ declare const _default: import("vue").DefineComponent<{
     lazyRender: BooleanConstructor;
     linebreaksToTitle: BooleanConstructor;
     dialogFn: {};
-}, {
-    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+}>, {
+    props: import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         fieldList: {
             type: PropType<FieldItem[]>;
         };
@@ -306,7 +306,7 @@ declare const _default: import("vue").DefineComponent<{
             }>>;
         };
         components: {
-            type: PropType<Record<string, Component | FunctionalComponent<{}, {}>>>;
+            type: PropType<Record<string, Component | FunctionalComponent<{}, {}, any, {}>>>;
             default: () => {};
         };
         scope: {
@@ -391,11 +391,11 @@ declare const _default: import("vue").DefineComponent<{
             type: PropType<string[]>;
         };
         linebarDirection: {
-            type: PropType<"horizontal" | "vertical">;
+            type: PropType<"vertical" | "horizontal">;
             default: string;
         };
         linebarTextDirection: {
-            type: PropType<"horizontal" | "vertical">;
+            type: PropType<"vertical" | "horizontal">;
             default: string;
         };
         linebarWidth: {
@@ -420,19 +420,19 @@ declare const _default: import("vue").DefineComponent<{
         lazyRender: BooleanConstructor;
         linebreaksToTitle: BooleanConstructor;
         dialogFn: {};
-    }>> & {
+    }>> & Readonly<{
         onFormChange?: ((...args: any[]) => any) | undefined;
         onScroll?: ((...args: any[]) => any) | undefined;
         onAnnotationChange?: ((...args: any[]) => any) | undefined;
         "onUpdate:selectedFields"?: ((...args: any[]) => any) | undefined;
         onLinebarChange?: ((...args: any[]) => any) | undefined;
         onReady?: ((...args: any[]) => any) | undefined;
-    }>>;
+    }> & {}>;
     emit: (event: "scroll" | "formChange" | "annotationChange" | "update:selectedFields" | "linebarChange" | "ready", ...args: any[]) => void;
     cssVars: import("vue").ComputedRef<AnyObject>;
     nuiThemeOverrides: import("naive-ui").GlobalThemeOverrides;
-    formRenderRef: import("vue").Ref<HTMLElement | undefined>;
-    formWidth: import("vue").Ref<number>;
+    formRenderRef: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    formWidth: import("vue").Ref<number, number>;
     formHeight: import("vue").ComputedRef<string>;
     SchemaField: import("vue").DefineComponent<import("@formily/vue").ISchemaFieldProps>;
     businessCollector: import("./hooks").BusinessCollector;
@@ -445,13 +445,21 @@ declare const _default: import("vue").DefineComponent<{
     formUUID: string;
     anchorBarRef: import("vue").Ref<{
         syncBarPosition: import("../../../shared/types").AnyFn;
+    } | undefined, {
+        syncBarPosition: import("../../../shared/types").AnyFn;
     } | undefined>;
-    currentAnchor: import("vue").WritableComputedRef<string>;
+    currentAnchor: import("vue").WritableComputedRef<string, string>;
     updateAnchorList: (field: import("@formily/core").GeneralField) => void;
     anchorIdList: import("vue").Ref<{
         name: string;
         title: string;
         index: number;
+    }[], (Record<"name" | "title", string> & {
+        index: number;
+    })[] | {
+        name: string;
+        title: string;
+        index: number;
     }[]>;
     onScroll: (scrollEvent: Event) => void;
     generateAnchorList: (formModel: import("@formily/core").Form<any>) => Promise<void>;
@@ -478,7 +486,7 @@ declare const _default: import("vue").DefineComponent<{
     setGraph: (field: import("@formily/core").GeneralField) => void;
     removeGraph: (field: import("@formily/core").GeneralField) => void;
     lowCodeEventTrigger: (field: import("@formily/core").GeneralField) => void;
-    emitFormChange: import("vue").Ref<boolean>;
+    emitFormChange: import("vue").Ref<boolean, boolean>;
     formModel: import("@formily/core").Form<{
         [x: string]: any;
     }>;
@@ -555,7 +563,7 @@ declare const _default: import("vue").DefineComponent<{
             "x-read-pretty"?: boolean | undefined;
             "x-compile-omitted"?: string[] | undefined;
         }>;
-        components: Record<string, Component | FunctionalComponent<{}, {}>>;
+        components: Record<string, Component | FunctionalComponent<{}, {}, any, {}>>;
         scope: AnyObject;
         annotation: Record<string, AnnotationItem>;
         annotationShortcuts: (string | {
@@ -579,6 +587,7 @@ declare const _default: import("vue").DefineComponent<{
         enterToNextWidget: boolean | ((fieldItem: FieldItem) => boolean | void);
         autoExpand: boolean;
         lowCodeReactions: LowCodeTypes.reactionConfig[];
+        newLowCodeReactions: LowCodeTypes.newReactionConfig[];
         linebarAutoHidden: boolean;
         labelPlacementOverwrite: boolean;
         bordered: string | boolean;
@@ -590,8 +599,8 @@ declare const _default: import("vue").DefineComponent<{
         selectMode: boolean;
         selectedFields: string[];
         linebarWidth: string | number;
-        linebarDirection: "horizontal" | "vertical";
-        linebarTextDirection: "horizontal" | "vertical";
+        linebarDirection: "vertical" | "horizontal";
+        linebarTextDirection: "vertical" | "horizontal";
         autoWidth: number | boolean;
         feedbackType: "default" | "tooltip";
         fixMemoLeak: boolean;
@@ -774,16 +783,16 @@ declare const _default: import("vue").DefineComponent<{
     onKeydown: (event: KeyboardEvent) => Promise<void>;
     clearSpan: (uuid: string) => void;
     exposeEvent: Omit<FormRenderExpose, "updateAnchor" | "getFieldList" | "optionInited" | "formModel" | "reload">;
-    useVersion: typeof useVersion;
-    FormConsumer: import("vue").DefineComponent<{}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-    FormProvider: import("vue").DefineComponent<Record<"form", any>, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<Record<"form", any>>>, {
+    readonly useVersion: typeof useVersion;
+    readonly FormConsumer: import("vue").DefineComponent<{}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    readonly FormProvider: import("vue").DefineComponent<Record<"form", any>, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<Record<"form", any>>>, {
         form: any;
-    }>;
-    NConfigProvider: any;
-    NForm: any;
-    NTabPane: any;
-    NTabs: any;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "formChange" | "annotationChange" | "update:selectedFields" | "linebarChange" | "ready")[], "scroll" | "formChange" | "annotationChange" | "update:selectedFields" | "linebarChange" | "ready", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    readonly NConfigProvider: any;
+    readonly NForm: any;
+    readonly NTabPane: any;
+    readonly NTabs: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "formChange" | "annotationChange" | "update:selectedFields" | "linebarChange" | "ready")[], "scroll" | "formChange" | "annotationChange" | "update:selectedFields" | "linebarChange" | "ready", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     fieldList: {
         type: PropType<FieldItem[]>;
     };
@@ -877,7 +886,7 @@ declare const _default: import("vue").DefineComponent<{
         }>>;
     };
     components: {
-        type: PropType<Record<string, Component | FunctionalComponent<{}, {}>>>;
+        type: PropType<Record<string, Component | FunctionalComponent<{}, {}, any, {}>>>;
         default: () => {};
     };
     scope: {
@@ -962,11 +971,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<string[]>;
     };
     linebarDirection: {
-        type: PropType<"horizontal" | "vertical">;
+        type: PropType<"vertical" | "horizontal">;
         default: string;
     };
     linebarTextDirection: {
-        type: PropType<"horizontal" | "vertical">;
+        type: PropType<"vertical" | "horizontal">;
         default: string;
     };
     linebarWidth: {
@@ -991,18 +1000,18 @@ declare const _default: import("vue").DefineComponent<{
     lazyRender: BooleanConstructor;
     linebreaksToTitle: BooleanConstructor;
     dialogFn: {};
-}>> & {
+}>> & Readonly<{
     onFormChange?: ((...args: any[]) => any) | undefined;
     onScroll?: ((...args: any[]) => any) | undefined;
     onAnnotationChange?: ((...args: any[]) => any) | undefined;
     "onUpdate:selectedFields"?: ((...args: any[]) => any) | undefined;
     onLinebarChange?: ((...args: any[]) => any) | undefined;
     onReady?: ((...args: any[]) => any) | undefined;
-}, {
+}>, {
+    maxHeight: string | number;
     anchor: boolean;
     column: number;
-    maxHeight: string | number;
-    components: Record<string, Component | FunctionalComponent<{}, {}>>;
+    components: Record<string, Component | FunctionalComponent<{}, {}, any, {}>>;
     initialData: AnyObject;
     parallelism: number;
     scope: AnyObject;
@@ -1018,8 +1027,8 @@ declare const _default: import("vue").DefineComponent<{
     wordSplitFilter: boolean;
     selectMode: boolean;
     linebarWidth: string | number;
-    linebarDirection: "horizontal" | "vertical";
-    linebarTextDirection: "horizontal" | "vertical";
+    linebarDirection: "vertical" | "horizontal";
+    linebarTextDirection: "vertical" | "horizontal";
     autoWidth: number | boolean;
     feedbackType: "default" | "tooltip";
     fixMemoLeak: boolean;
@@ -1028,5 +1037,5 @@ declare const _default: import("vue").DefineComponent<{
     nominalAge: boolean;
     operationalFormInit: boolean;
     incrementalRender: boolean;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/form-render/src/FormRender.vue2.js

@@ -48,154 +48,59 @@ import { GlobalState } from '@formily/core/esm/shared/constants';
 
 const _hoisted_1 = {
   key: 0,
-  style: {
-    "height": "54px"
-  }
-};
-const _hoisted_2 = {
-  style: {
-    "white-space": "pre"
-  }
+  style: { "height": "54px" }
 };
+const _hoisted_2 = { style: { "white-space": "pre" } };
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "FormRender",
   props: {
-    fieldList: {
-      type: Array
-    },
-    initialData: {
-      type: Object,
-      default: () => ({})
-    },
-    fieldVisitor: {
-      type: Object
-    },
-    column: {
-      type: Number,
-      default: 24
-    },
-    maxHeight: {
-      type: [Number, String],
-      default: ""
-    },
-    anchor: {
-      type: Boolean,
-      default: false
-    },
-    parallelism: {
-      type: Number,
-      default: 5
-    },
-    businessFormatter: {
-      type: Function
-    },
-    nominalAge: {
-      type: Boolean,
-      default: false
-    },
-    schema: {
-      type: Object
-    },
+    fieldList: { type: Array },
+    initialData: { type: Object, default: () => ({}) },
+    fieldVisitor: { type: Object },
+    column: { type: Number, default: 24 },
+    maxHeight: { type: [Number, String], default: "" },
+    anchor: { type: Boolean, default: false },
+    parallelism: { type: Number, default: 5 },
+    businessFormatter: { type: Function },
+    nominalAge: { type: Boolean, default: false },
+    schema: { type: Object },
     components: {
       type: Object,
       default: () => ({})
     },
-    scope: {
-      type: Object,
-      default: () => ({})
-    },
-    annotation: {
-      type: Object
-    },
-    annotationShortcuts: {
-      type: Array
-    },
-    consumer: {
-      type: Boolean,
-      default: false
-    },
-    uuid: {
-      type: String
-    },
-    lifeCycle: {
-      type: Object
-    },
-    requestInstance: {
-      type: Object
-    },
+    scope: { type: Object, default: () => ({}) },
+    annotation: { type: Object },
+    annotationShortcuts: { type: Array },
+    consumer: { type: Boolean, default: false },
+    uuid: { type: String },
+    lifeCycle: { type: Object },
+    requestInstance: { type: Object },
     enterToNextWidget: {
       type: [Boolean, Function],
       default: true
     },
     autoExpand: Boolean,
-    lowCodeReactions: {
-      type: Array
-    },
-    newLowCodeReactions: {
-      type: Array
-    },
-    operationalForm: {
-      type: Array
-    },
-    dateOperationalForm: {
-      type: Object
-    },
-    operationalFormInit: {
-      type: Boolean,
-      default: true
-    },
-    linebarAutoHidden: {
-      type: Boolean
-    },
-    bordered: {
-      type: [Boolean, String],
-      default: true
-    },
+    lowCodeReactions: { type: Array },
+    newLowCodeReactions: { type: Array },
+    operationalForm: { type: Array },
+    dateOperationalForm: { type: Object },
+    operationalFormInit: { type: Boolean, default: true },
+    linebarAutoHidden: { type: Boolean },
+    bordered: { type: [Boolean, String], default: true },
     labelPlacementOverwrite: Boolean,
-    outBordered: {
-      type: Boolean,
-      default: false
-    },
-    uniqueCacheData: {
-      type: Boolean,
-      default: false
-    },
+    outBordered: { type: Boolean, default: false },
+    uniqueCacheData: { type: Boolean, default: false },
     forceClearable: Boolean,
-    wordSplitFilter: {
-      type: Boolean,
-      default: true
-    },
+    wordSplitFilter: { type: Boolean, default: true },
     selectMode: Boolean,
-    selectedFields: {
-      type: Array
-    },
-    linebarDirection: {
-      type: String,
-      default: "vertical"
-    },
-    linebarTextDirection: {
-      type: String,
-      default: "horizontal"
-    },
-    linebarWidth: {
-      type: [Number, String],
-      default: 120
-    },
-    autoWidth: {
-      type: [Boolean, Number],
-      default: false
-    },
-    incrementalRender: {
-      type: Boolean,
-      default: false
-    },
-    feedbackType: {
-      type: String,
-      default: "default"
-    },
-    fixMemoLeak: {
-      type: Boolean
-    },
+    selectedFields: { type: Array },
+    linebarDirection: { type: String, default: "vertical" },
+    linebarTextDirection: { type: String, default: "horizontal" },
+    linebarWidth: { type: [Number, String], default: 120 },
+    autoWidth: { type: [Boolean, Number], default: false },
+    incrementalRender: { type: Boolean, default: false },
+    feedbackType: { type: String, default: "default" },
+    fixMemoLeak: { type: Boolean },
     lazyRender: Boolean,
     linebreaksToTitle: Boolean,
     dialogFn: {}
@@ -208,60 +113,40 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     "linebarChange",
     "ready"
   ],
-  setup(__props, {
-    expose,
-    emit
-  }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
+    const emit = __emit;
     const cssVars = useTheme();
-    const {
-      nuiThemeOverrides
-    } = useNuiThemeOverrides();
+    const { nuiThemeOverrides } = useNuiThemeOverrides();
     validateMessageLocale();
     const formRenderRef = ref();
-    const {
-      width: formWidth
-    } = useElementSize(formRenderRef);
-    provide(InjectionFormColumnWidth, computed(() => {
-      if (!formWidth.value)
-        return 0;
-      return (formWidth.value - (props.column - 1) * 16) / 24;
-    }));
+    const { width: formWidth } = useElementSize(formRenderRef);
+    provide(
+      InjectionFormColumnWidth,
+      computed(() => {
+        if (!formWidth.value)
+          return 0;
+        return (formWidth.value - (props.column - 1) * 16) / 24;
+      })
+    );
     const formHeight = computed(() => {
       if (isNumber(props.maxHeight))
         return props.maxHeight + "px";
       return props.maxHeight;
     });
-    const {
-      SchemaField,
-      businessCollector,
-      formItemDepsCollector,
-      changeContextCollector,
-      asyncQueue,
-      formUUID
-    } = useFormContext(props, emit);
-    const {
-      anchorBarRef,
-      currentAnchor,
-      updateAnchorList,
-      anchorIdList,
-      onScroll,
-      generateAnchorList
-    } = useAnchor(props, emit, formRenderRef, formItemDepsCollector);
-    const {
-      callLifeCycle
-    } = useFormRenderLifeCycle(props);
+    const { SchemaField, businessCollector, formItemDepsCollector, changeContextCollector, asyncQueue, formUUID } = useFormContext(props, emit);
+    const { anchorBarRef, currentAnchor, updateAnchorList, anchorIdList, onScroll, generateAnchorList } = useAnchor(
+      props,
+      emit,
+      formRenderRef,
+      formItemDepsCollector
+    );
+    const { callLifeCycle } = useFormRenderLifeCycle(props);
     provide(InjectionFormLifeCycleCaller, callLifeCycle);
     callLifeCycle("onSetup");
-    const {
-      observeFormGraph,
-      setGraph,
-      removeGraph
-    } = useFormGraph();
+    const { observeFormGraph, setGraph, removeGraph } = useFormGraph();
     provide(InjectionFormGraph, observeFormGraph);
-    const {
-      lowCodeEventTrigger
-    } = useLowCodeEvent();
+    const { lowCodeEventTrigger } = useLowCodeEvent();
     const emitFormChange = ref(true);
     const formModel = createForm({
       initialValues: props.initialData,
@@ -303,17 +188,17 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         }
       }
     });
-    const {
-      lowCodeReactionsHandler
-    } = useLowCodeReactions(computed(() => props.lowCodeReactions), formModel);
-    const {
-      newLowCodeReactionsHandler
-    } = useNewLowCodeReactions(computed(() => props.newLowCodeReactions), formModel);
+    const { lowCodeReactionsHandler } = useLowCodeReactions(
+      computed(() => props.lowCodeReactions),
+      formModel
+    );
+    const { newLowCodeReactionsHandler } = useNewLowCodeReactions(
+      computed(() => props.newLowCodeReactions),
+      formModel
+    );
     const operationalFormHandler = useOperationalForm(props, formModel);
     const wordbookSettingHandler = useWordbookSetting().create(formModel, changeContextCollector);
-    const {
-      schemaAdaptor
-    } = useFieldListAdaptor(businessCollector, props);
+    const { schemaAdaptor } = useFieldListAdaptor(businessCollector, props);
     let _fieldList = props.fieldList || [];
     let incrementalRenderList = [];
     const parsedSchema = computed(() => {
@@ -368,17 +253,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         emit("ready");
       }
     }
-    const {
-      onKeydown
-    } = useFormDomEvent({
-      formModel,
-      formRenderRef,
-      props,
-      formUUID
-    });
-    const {
-      clearSpan
-    } = useComplexOptionsSpan();
+    const { onKeydown } = useFormDomEvent({ formModel, formRenderRef, props, formUUID });
+    const { clearSpan } = useComplexOptionsSpan();
     onBeforeUnmount(() => {
       clearSpan(formUUID);
       props.fixMemoLeak && (GlobalState.lifecycles.length = 0);
@@ -395,7 +271,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       changeContextCollector,
       emitFormChange
     });
-    expose({
+    __expose({
       formModel,
       validate(path = "*", options = {}) {
         return exposeEvent.validate(path, options);
@@ -451,59 +327,59 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NForm), mergeProps({
-        class: ["form-render", {
-          "form-render--out-border": __props.outBordered
-        }],
+        class: ["form-render", { "form-render--out-border": __props.outBordered }],
         "require-mark-placement": "left",
         style: unref(cssVars)
-      }, unref(useVersion)(), {
-        uuid: unref(formUUID)
-      }), {
-        default: withCtx(() => [__props.anchor && unref(anchorIdList).length ? (openBlock(), createElementBlock("section", _hoisted_1, [createVNode(unref(NTabs), {
-          value: unref(currentAnchor),
-          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => isRef(currentAnchor) ? currentAnchor.value = $event : null),
-          type: "line",
-          ref_key: "anchorBarRef",
-          ref: anchorBarRef
-        }, {
-          default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(anchorIdList), (anchor) => {
-            return openBlock(), createBlock(unref(NTabPane), {
-              name: anchor.name,
-              tab: anchor.title,
-              key: anchor.name
-            }, null, 8, ["name", "tab"]);
-          }), 128))]),
-          _: 1
-        }, 8, ["value"])])) : createCommentVNode("v-if", true), createVNode(unref(NConfigProvider), {
-          "theme-overrides": unref(nuiThemeOverrides)
-        }, {
-          default: withCtx(() => [createElementVNode("section", {
-            class: "form-render__wrapper",
-            style: normalizeStyle({
-              "--column": __props.column,
-              "--form-height": unref(formHeight)
-            }),
-            ref_key: "formRenderRef",
-            ref: formRenderRef,
-            onScroll: _cache[1] || (_cache[1] = (...args) => unref(onScroll) && unref(onScroll)(...args)),
-            onKeydownCapture: _cache[2] || (_cache[2] = (...args) => unref(onKeydown) && unref(onKeydown)(...args))
-          }, [createVNode(unref(FormProvider), {
-            form: unref(formModel)
-          }, {
-            default: withCtx(() => [createVNode(unref(SchemaField), {
-              schema: unref(parsedSchema)
-            }, null, 8, ["schema"]), __props.consumer ? (openBlock(), createBlock(unref(FormConsumer), {
-              key: 0
+      }, unref(useVersion)(), { uuid: unref(formUUID) }), {
+        default: withCtx(() => [
+          __props.anchor && unref(anchorIdList).length ? (openBlock(), createElementBlock("section", _hoisted_1, [
+            createVNode(unref(NTabs), {
+              value: unref(currentAnchor),
+              "onUpdate:value": _cache[0] || (_cache[0] = ($event) => isRef(currentAnchor) ? currentAnchor.value = $event : null),
+              type: "line",
+              ref_key: "anchorBarRef",
+              ref: anchorBarRef
             }, {
-              default: withCtx(({
-                form
-              }) => [createElementVNode("div", _hoisted_2, toDisplayString(JSON.stringify(form.values, null, 2)), 1)]),
+              default: withCtx(() => [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(anchorIdList), (anchor) => {
+                  return openBlock(), createBlock(unref(NTabPane), {
+                    name: anchor.name,
+                    tab: anchor.title,
+                    key: anchor.name
+                  }, null, 8, ["name", "tab"]);
+                }), 128))
+              ]),
               _: 1
-            })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "default")]),
+            }, 8, ["value"])
+          ])) : createCommentVNode("v-if", true),
+          createVNode(unref(NConfigProvider), { "theme-overrides": unref(nuiThemeOverrides) }, {
+            default: withCtx(() => [
+              createElementVNode("section", {
+                class: "form-render__wrapper",
+                style: normalizeStyle({ "--column": __props.column, "--form-height": formHeight.value }),
+                ref_key: "formRenderRef",
+                ref: formRenderRef,
+                onScroll: _cache[1] || (_cache[1] = (...args) => unref(onScroll) && unref(onScroll)(...args)),
+                onKeydownCapture: _cache[2] || (_cache[2] = (...args) => unref(onKeydown) && unref(onKeydown)(...args))
+              }, [
+                createVNode(unref(FormProvider), { form: unref(formModel) }, {
+                  default: withCtx(() => [
+                    createVNode(unref(SchemaField), { schema: parsedSchema.value }, null, 8, ["schema"]),
+                    __props.consumer ? (openBlock(), createBlock(unref(FormConsumer), { key: 0 }, {
+                      default: withCtx(({ form }) => [
+                        createElementVNode("div", _hoisted_2, toDisplayString(JSON.stringify(form.values, null, 2)), 1)
+                      ]),
+                      _: 1
+                    })) : createCommentVNode("v-if", true),
+                    renderSlot(_ctx.$slots, "default")
+                  ]),
+                  _: 3
+                }, 8, ["form"])
+              ], 36)
+            ]),
             _: 3
-          }, 8, ["form"])], 36)]),
-          _: 3
-        }, 8, ["theme-overrides"])]),
+          }, 8, ["theme-overrides"])
+        ]),
         _: 3
       }, 16, ["class", "style", "uuid"]);
     };