@farris/ui-vue 1.7.2-beta.1 → 1.7.2-beta.2

package/components/dynamic-form/index.esm.js

@@ -1,111 +1,691 @@
-import { defineComponent as H, ref as L, computed as W, withDirectives as pe, createVNode as D, resolveDirective as de, watch as Y, createTextVNode as fe, mergeProps as ce } from "vue";
-import { LocaleService as ge } from "../locale/index.esm.js";
-import ye from "../accordion/index.esm.js";
-import Ce from "../avatar/index.esm.js";
-import he from "../../designer/button-edit/index.esm.js";
-import Fe from "../button-group/index.esm.js";
-import be from "../calendar/index.esm.js";
-import ve from "../../designer/capsule/index.esm.js";
-import ie from "../../designer/checkbox/index.esm.js";
-import ae from "../../designer/checkbox-group/index.esm.js";
-import Ie from "../combo-list/index.esm.js";
-import we from "../combo-tree/index.esm.js";
-import Ve from "../component/index.esm.js";
-import Be from "../color-picker/index.esm.js";
-import Me from "../content-container/index.esm.js";
-import Te from "../../designer/date-picker/index.esm.js";
-import Le from "../../designer/data-grid/index.esm.js";
-import ke from "../dropdown/index.esm.js";
-import Ee from "../../designer/dynamic-form/index.esm.js";
-import Pe from "../events-editor/index.esm.js";
-import Ue from "../filter-bar/index.esm.js";
-import De from "../field-selector/index.esm.js";
-import Ne from "../binding-selector/index.esm.js";
-import Ae from "../image-cropper/index.esm.js";
-import Re from "../../designer/input-group/index.esm.js";
-import Oe from "../layout/index.esm.js";
-import qe from "../list-nav/index.esm.js";
-import xe from "../../designer/list-view/index.esm.js";
-import Ge from "../lookup/index.esm.js";
-import je from "../mapping-editor/index.esm.js";
-import $e from "../nav/index.esm.js";
-import We from "../number-range/index.esm.js";
-import Ke from "../../designer/number-spinner/index.esm.js";
-import Xe from "../order/index.esm.js";
-import _e from "../page-header/index.esm.js";
-import Je from "../page-footer/index.esm.js";
-import Qe from "../pagination/index.esm.js";
-import ze from "../progress/index.esm.js";
-import Ye from "../query-solution/index.esm.js";
-import Ze from "../../designer/radio-group/index.esm.js";
-import Se from "../../designer/rate/index.esm.js";
-import He from "../../designer/response-toolbar/index.esm.js";
-import et from "../response-layout/index.esm.js";
-import tt, { useResponseLayoutEditorSetting as ot } from "../../designer/response-layout-editor/index.esm.js";
-import nt from "../search-box/index.esm.js";
-import rt from "../../designer/section/index.esm.js";
-import it from "../smoke-detector/index.esm.js";
-import at from "../splitter/index.esm.js";
-import st from "../step/index.esm.js";
-import lt from "../../designer/switch/index.esm.js";
-import ct from "../../designer/tabs/index.esm.js";
-import ut from "../../designer/tags/index.esm.js";
-import mt from "../text/index.esm.js";
-import pt from "../../designer/time-picker/index.esm.js";
-import dt from "../transfer/index.esm.js";
-import ft from "../tree-view/index.esm.js";
-import gt from "../uploader/index.esm.js";
-import yt from "../verify-detail/index.esm.js";
-import Ct from "../video/index.esm.js";
-import ht from "../../designer/textarea/index.esm.js";
-import Ft from "../schema-selector/index.esm.js";
-import bt from "../../designer/tree-grid/index.esm.js";
-import vt from "../event-parameter/index.esm.js";
-import It from "../filter-condition-editor/index.esm.js";
-import wt from "../fieldset/index.esm.js";
-import Vt from "../sort-condition-editor/index.esm.js";
-import Bt from "../menu-lookup/index.esm.js";
-import Mt from "../../designer/drawer/index.esm.js";
-import Tt from "../json-editor/index.esm.js";
-import Lt from "../property-editor/index.esm.js";
-import kt from "../expression-editor/index.esm.js";
-import Et from "../code-editor/index.esm.js";
-import Pt from "../html-template/index.esm.js";
-import Ut from "../collection-property-editor/index.esm.js";
-import Dt from "../../designer/modal/index.esm.js";
-import Nt from "../external-container/index.esm.js";
-import At from "../language-textbox/index.esm.js";
-import Rt from "../image/index.esm.js";
-import Ot from "../comment/index.esm.js";
-import { schemaResolverMap as qt, propertyEffectMap as xt, propertyConfigSchemaMap as Gt, schemaMap as ue, createPropsResolver as jt } from "../dynamic-resolver/index.esm.js";
-import { useThirdComponent as $t, isMobilePhone as Wt, useGuid as se } from "../common/index.esm.js";
-import { DgControl as S, refreshCanvas as Kt, UseTemplateDragAndDropRules as Xt, useDragulaCommonRule as _t } from "../designer-canvas/index.esm.js";
-import { BaseControlProperty as Jt, FormBindingType as Q } from "../property-panel/index.esm.js";
-const Qt = {
+var Pe = Object.defineProperty;
+var Be = (t, e, r) => e in t ? Pe(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
+var re = (t, e, r) => Be(t, typeof e != "symbol" ? e + "" : e, r);
+import { defineComponent as te, ref as U, computed as J, onMounted as ke, watch as z, withDirectives as he, createVNode as q, resolveDirective as Fe, reactive as ce, createTextVNode as Ee, mergeProps as be } from "vue";
+import { resolveAppearance as Ue, createPropsResolver as le, schemaResolverMap as Le, propertyEffectMap as Oe, propertyConfigSchemaMap as Ne, schemaMap as ve } from "../dynamic-resolver/index.esm.js";
+import { FormSchemaEntityField$Type as ue, FormSchemaEntityFieldTypeName as pe, getCustomClass as Ve, useThirdComponent as De, isMobilePhone as Re, useGuid as me } from "../common/index.esm.js";
+import { cloneDeep as Ae, mergeWith as je, merge as $e } from "lodash-es";
+import { LocaleService as Ie } from "../locale/index.esm.js";
+import { loadRegister as qe, useComponentManager as xe, useBindingData as Ge, useEntityState as We, useDynamicViewUtils as Ke, componentMap as ae, resolverMap as _e } from "../dynamic-view/index.esm.js";
+import Xe from "../accordion/index.esm.js";
+import Je from "../avatar/index.esm.js";
+import Qe from "../../designer/button-edit/index.esm.js";
+import ze from "../button-group/index.esm.js";
+import Ye from "../calendar/index.esm.js";
+import Ze from "../../designer/capsule/index.esm.js";
+import de from "../../designer/checkbox/index.esm.js";
+import fe from "../../designer/checkbox-group/index.esm.js";
+import Se from "../combo-list/index.esm.js";
+import He from "../combo-tree/index.esm.js";
+import et from "../component/index.esm.js";
+import tt from "../color-picker/index.esm.js";
+import ot from "../content-container/index.esm.js";
+import nt from "../../designer/date-picker/index.esm.js";
+import rt from "../../designer/data-grid/index.esm.js";
+import st from "../dropdown/index.esm.js";
+import it from "../../designer/dynamic-form/index.esm.js";
+import at from "../events-editor/index.esm.js";
+import lt from "../filter-bar/index.esm.js";
+import ct from "../field-selector/index.esm.js";
+import ut from "../binding-selector/index.esm.js";
+import pt from "../image-cropper/index.esm.js";
+import mt from "../../designer/input-group/index.esm.js";
+import dt from "../layout/index.esm.js";
+import ft from "../list-nav/index.esm.js";
+import yt from "../../designer/list-view/index.esm.js";
+import gt from "../lookup/index.esm.js";
+import Ct from "../mapping-editor/index.esm.js";
+import ht from "../nav/index.esm.js";
+import Ft from "../number-range/index.esm.js";
+import bt from "../../designer/number-spinner/index.esm.js";
+import vt from "../order/index.esm.js";
+import Vt from "../page-header/index.esm.js";
+import It from "../page-footer/index.esm.js";
+import Tt from "../pagination/index.esm.js";
+import Mt from "../progress/index.esm.js";
+import wt from "../query-solution/index.esm.js";
+import Pt from "../../designer/radio-group/index.esm.js";
+import Bt from "../../designer/rate/index.esm.js";
+import kt from "../../designer/response-toolbar/index.esm.js";
+import Et from "../response-layout/index.esm.js";
+import Ut, { useResponseLayoutEditorSetting as Lt } from "../../designer/response-layout-editor/index.esm.js";
+import Ot from "../search-box/index.esm.js";
+import Nt from "../../designer/section/index.esm.js";
+import Dt from "../smoke-detector/index.esm.js";
+import Rt from "../splitter/index.esm.js";
+import At from "../step/index.esm.js";
+import jt from "../../designer/switch/index.esm.js";
+import $t from "../../designer/tabs/index.esm.js";
+import qt from "../../designer/tags/index.esm.js";
+import xt from "../text/index.esm.js";
+import Gt from "../../designer/time-picker/index.esm.js";
+import Wt from "../transfer/index.esm.js";
+import Kt from "../tree-view/index.esm.js";
+import _t from "../uploader/index.esm.js";
+import Xt from "../verify-detail/index.esm.js";
+import Jt from "../video/index.esm.js";
+import Qt from "../../designer/textarea/index.esm.js";
+import zt from "../schema-selector/index.esm.js";
+import Yt from "../../designer/tree-grid/index.esm.js";
+import Zt from "../event-parameter/index.esm.js";
+import St from "../filter-condition-editor/index.esm.js";
+import Ht from "../fieldset/index.esm.js";
+import eo from "../sort-condition-editor/index.esm.js";
+import to from "../menu-lookup/index.esm.js";
+import oo from "../../designer/drawer/index.esm.js";
+import no from "../json-editor/index.esm.js";
+import ro from "../property-editor/index.esm.js";
+import so from "../expression-editor/index.esm.js";
+import io from "../code-editor/index.esm.js";
+import ao from "../html-template/index.esm.js";
+import lo from "../collection-property-editor/index.esm.js";
+import co from "../../designer/modal/index.esm.js";
+import uo from "../external-container/index.esm.js";
+import po from "../language-textbox/index.esm.js";
+import mo from "../image/index.esm.js";
+import fo from "../comment/index.esm.js";
+import { DgControl as ee, refreshCanvas as yo, UseTemplateDragAndDropRules as go, useDragulaCommonRule as Co } from "../designer-canvas/index.esm.js";
+import { BaseControlProperty as ho, FormBindingType as S } from "../property-panel/index.esm.js";
+const Fo = "root-viewmodel";
+class bo {
+  constructor(e, r) {
+    re(this, "formSchemaUtils");
+    re(this, "controlCreatorUtils");
+    re(this, "designViewModelUtils");
+    this.resolver = e, this.designerHostService = r, this.formSchemaUtils = this.designerHostService.formSchemaUtils, this.controlCreatorUtils = this.designerHostService.controlCreatorUtils, this.designViewModelUtils = this.designerHostService.designViewModelUtils;
+  }
+  createComponent(e) {
+    const r = this.createComponentRefNode(e), f = this.createComponentNode(e), i = this.createViewModeNode(e), F = this.formSchemaUtils.getFormSchema();
+    return F.module.viewmodels.push(i), F.module.components.push(f), this.designViewModelUtils.assembleDesignViewModel(), r;
+  }
+  createComponentRefNode(e) {
+    const r = this.resolver.getSchemaByType("component-ref");
+    return Object.assign(r, {
+      id: `${e.componentId}-component-ref`,
+      component: `${e.componentId}-component`
+    }), r;
+  }
+  createComponentNode(e) {
+    const r = this.resolver.getSchemaByType("component"), f = this.createFormComponentContents(e);
+    return Object.assign(r, {
+      id: `${e.componentId}-component`,
+      viewModel: `${e.componentId}-component-viewmodel`,
+      componentType: e.componentType,
+      appearance: {
+        class: this.getFormComponentClass(e)
+      },
+      formColumns: e.formColumns,
+      contents: f
+    }), r;
+  }
+  /**
+   * 获取卡片组件层级的class样式
+   */
+  getFormComponentClass(e) {
+    var f, i;
+    const { templateId: r } = this.formSchemaUtils.getFormSchema().module;
+    if (r === "double-list-in-tab-template" && ((i = (f = e.parentComponentInstance) == null ? void 0 : f.schema) == null ? void 0 : i.type) === "tab-page") {
+      const F = e.parentComponentInstance.parent && e.parentComponentInstance.parent.schema;
+      if ((F == null ? void 0 : F.type) === "tabs" && (F == null ? void 0 : F.fill) === !0)
+        return "f-struct-wrapper f-utils-fill-flex-column";
+    }
+    return "f-struct-wrapper";
+  }
+  createFormComponentContents(e) {
+    var T, V;
+    const r = this.resolver.getSchemaByType("section");
+    Object.assign(r, {
+      id: e.componentId + "-form-section",
+      appearance: {
+        class: "f-section-form f-section-in-mainsubcard"
+      },
+      mainTitle: e.componentName
+    });
+    const f = this.resolver.getSchemaByType("response-form"), i = [];
+    Object.assign(f, {
+      id: e.componentId + "-form",
+      appearance: {
+        class: "f-form-layout farris-form farris-form-controls-inline"
+      },
+      contents: i,
+      controlsInline: !0
+    }), r.contents = [f];
+    const { selectedFields: F } = e;
+    F == null || F.forEach((C) => {
+      if (C.$type === ue.SimpleField) {
+        const w = Ae(C), b = this.resolveControlClassByFormColumns(e), I = this.controlCreatorUtils.setFormFieldProperty(w, "", b);
+        I && i.push(I);
+      }
+    });
+    const { templateId: v } = this.formSchemaUtils.getFormSchema().module;
+    if (v === "double-list-in-tab-template" && ((V = (T = e.parentComponentInstance) == null ? void 0 : T.schema) == null ? void 0 : V.type) === "tab-page") {
+      const C = e.parentComponentInstance.parent && e.parentComponentInstance.parent.schema;
+      (C == null ? void 0 : C.type) === "tabs" && (C == null ? void 0 : C.fill) === !0 && (r.appearance.class = "f-section-grid f-section-in-main px-0 pt-0", r.fill = !0);
+    }
+    return [r];
+  }
+  resolveControlClassByFormColumns(e) {
+    let r = "";
+    switch (e.formColumns) {
+      case 1: {
+        r = "col-12 col-md-12 col-xl-12 col-el-12";
+        break;
+      }
+      case 2: {
+        r = "col-12 col-md-6 col-xl-6 col-el-6";
+        break;
+      }
+      case 3: {
+        r = "col-12 col-md-6 col-xl-4 col-el-4";
+        break;
+      }
+      case 4: {
+        r = "col-12 col-md-6 col-xl-3 col-el-2";
+        break;
+      }
+    }
+    return r;
+  }
+  /**
+   * 添加viewModel节点
+   */
+  createViewModeNode(e) {
+    return {
+      id: `${e.componentId}-component-viewmodel`,
+      code: `${e.componentId}-component-viewmodel`,
+      name: e.componentName,
+      bindTo: e.bindTo,
+      parent: Fo,
+      fields: this.assembleViewModelFields(e),
+      commands: [],
+      states: [],
+      enableValidation: !0
+    };
+  }
+  /**
+   * 组装viewModel fields 节点
+   */
+  assembleViewModelFields(e) {
+    const r = [], { selectedFields: f } = e;
+    return f == null || f.forEach((i) => {
+      if (i.$type === ue.SimpleField) {
+        let F = "blur";
+        const v = i.type.name;
+        (v === pe.Enum || v === pe.Boolean) && (F = "change"), r.push({
+          type: "Form",
+          id: i.id,
+          fieldName: i.bindingField,
+          groupId: null,
+          groupName: null,
+          updateOn: F,
+          fieldSchema: {}
+        });
+      }
+    }), r;
+  }
+}
+function Te(t, e, r, f) {
+  var F, v, T, V, C, w;
+  const i = r.parentComponentInstance;
+  if (i && f) {
+    const b = (F = i.schema) == null ? void 0 : F.type, R = {
+      componentId: `form-${Math.random().toString(36).slice(2, 6)}`,
+      componentName: ((v = r.bindingSourceContext) == null ? void 0 : v.entityTitle) || ((V = (T = r.bindingSourceContext) == null ? void 0 : T.bindingEntity) == null ? void 0 : V.name) || "标题",
+      componentType: "form",
+      formColumns: b === "splitter-pane" ? 1 : 4,
+      parentContainerId: i.schema.id,
+      parentComponentInstance: i,
+      bindTo: ((C = r.bindingSourceContext) == null ? void 0 : C.bindTo) || "/",
+      selectedFields: (w = r.bindingSourceContext) == null ? void 0 : w.bindingEntityFields
+    };
+    return new bo(t, f).createComponent(R);
+  } else
+    return e;
+}
+const vo = "https://json-schema.org/draft/2020-12/schema", Vo = "https://farris-design.gitee.io/response-form.schema.json", Io = "response-form", To = "A Farris Data Collection Component", Mo = "object", wo = {
+  id: {
+    description: "The unique identifier for a form group",
+    type: "string"
+  },
+  type: {
+    description: "The type string of form group component",
+    type: "string",
+    default: "response-form"
+  },
+  appearance: {
+    description: "",
+    type: "object",
+    properties: {
+      class: {
+        type: "string"
+      },
+      style: {
+        type: "string"
+      }
+    },
+    default: {}
+  },
+  contents: {
+    description: "",
+    type: "array",
+    default: []
+  },
+  visible: {
+    description: "",
+    type: "boolean",
+    default: !0
+  },
+  labelAutoOverflow: {
+    description: "",
+    type: "boolean",
+    default: !1
+  },
+  adaptForLanguage: {
+    description: "",
+    type: "boolean",
+    default: !0
+  },
+  layout: {
+    description: "",
+    type: "string",
+    default: "col-12 col-md-6 col-xl-3 col-el-2"
+  },
+  fields: {
+    description: "",
+    type: "array"
+  },
+  formData: {
+    description: "",
+    type: "object"
+  },
+  formType: {
+    description: "",
+    type: "string",
+    default: "static"
+  }
+}, Po = [
+  "id",
+  "type",
+  "contents"
+], Bo = {
+  $schema: vo,
+  $id: Vo,
+  title: Io,
+  description: To,
+  type: Mo,
+  properties: wo,
+  required: Po
+}, Me = /* @__PURE__ */ new Map([
+  ["appearance", Ue]
+]), ko = "https://json-schema.org/draft/2020-12/schema", Eo = "https://farris-design.gitee.io/dynamic-form.schema.json", Uo = "dynamic-form", Lo = "A Farris Data Collection Component", Oo = "object", No = {
+  id: {
+    description: "The unique identifier for a form group",
+    type: "string"
+  },
+  type: {
+    description: "The type string of form group component",
+    type: "string",
+    default: "dynamic-form"
+  },
+  appearance: {
+    description: "",
+    type: "object",
+    properties: {
+      class: {
+        type: "string"
+      },
+      style: {
+        type: "string"
+      }
+    },
+    default: {}
+  },
+  contents: {
+    description: "",
+    type: "array",
+    default: []
+  },
+  visible: {
+    description: "",
+    type: "boolean",
+    default: !0
+  },
+  labelAutoOverflow: {
+    description: "",
+    type: "boolean",
+    default: !1
+  },
+  adaptForLanguage: {
+    description: "",
+    type: "boolean",
+    default: !0
+  },
+  formType: {
+    description: "",
+    type: "string",
+    default: "dynamic"
+  },
+  layout: {
+    description: "",
+    type: "string",
+    default: "col-12 col-md-6 col-xl-3 col-el-2"
+  },
+  fields: {
+    description: "",
+    type: "array"
+  },
+  formData: {
+    description: "",
+    type: "object"
+  }
+}, Do = [
+  "id",
+  "type",
+  "contents"
+], Ro = {
+  $schema: ko,
+  $id: Eo,
+  title: Uo,
+  description: Lo,
+  type: Oo,
+  properties: No,
+  required: Do
+}, ie = {
   customClass: { type: String, default: "" },
   customStyle: { type: String, defaut: "" },
   /** 控制是否可见 */
   visible: { type: Boolean, default: !0 },
   /** 内部控件布局是否响应国际化 */
-  adaptForLanguage: { type: Boolean, default: !0 }
-}, re = /* @__PURE__ */ H({
+  adaptForLanguage: { type: Boolean, default: !0 },
+  /** 绑定动态字段 */
+  fields: { type: Array, default: [] },
+  /** 绑定动态字段的值*/
+  formData: { type: Object, default: null },
+  /** 为动态字段指定样式*/
+  layout: { type: String, default: "col-12 col-md-6 col-xl-3 col-el-2" }
+}, Ao = Object.assign({}, ie, {
+  // 是否渲染form层级
+  canRenderForm: { type: Boolean, default: !0 },
+  callback: { type: Function }
+}), Pr = le(ie, Bo, Me, Te), Br = le(ie, Ro, Me, Te), se = /* @__PURE__ */ te({
+  name: "FDynamicForm",
+  props: Ao,
+  emits: ["update:modelValue", "event"],
+  setup(t, e) {
+    const r = U(t.fields), f = /* @__PURE__ */ new Map(), i = U(t.callback);
+    qe();
+    const F = xe(), v = U(t.formData || {}), T = Ge(v, e);
+    We(r.value).setup();
+    const C = /* @__PURE__ */ new Map(), w = U(t.canRenderForm), {
+      mergeArray: b,
+      resolveCallbacks: I,
+      resolveEvents: R
+    } = Ke(), G = J(() => {
+      const o = Ie.getLocale(), a = t.fields && t.fields.length > 0, m = {
+        "f-form-layout": a,
+        "farris-form": a
+      };
+      return t.adaptForLanguage && o && (m["farris-form-controls-inline"] = o !== "en"), Ve(m, t.customClass);
+    });
+    function K() {
+      function o(a, m) {
+        const {
+          id: g
+        } = a || {}, {
+          field: h
+        } = a.binding || {};
+        return {
+          modelValue: m.getValue(g),
+          "onUpdate:modelValue": (y) => {
+            m.setValue(g, h || g, y);
+          }
+        };
+      }
+      return {
+        resolve: o
+      };
+    }
+    function _(o) {
+      const a = K();
+      return T.getValue(o.id) === void 0 && Object.hasOwnProperty.call(o, "modelValue") && T.setValue(o.id, void 0, o.modelValue), a.resolve(o, T);
+    }
+    function X(o) {
+      const a = {};
+      return o && Object.entries(o).forEach(([m, g]) => {
+        a[m] = () => Array.isArray(g) ? g.map((h) => A(h)) : A(g);
+      }), a;
+    }
+    function B(o) {
+      return o.type ? o.type : o.fields ? "fieldset" : "form-group";
+    }
+    function P(o) {
+      const a = B(o);
+      let m = o.customClass;
+      m || (m = a === "form-group" ? t.layout : "col-12 px-0");
+      const {
+        fields: g,
+        customClass: h,
+        ...y
+      } = o, M = {
+        ...R(o, e, a)
+      }, E = {
+        ...I(o, i, a)
+      };
+      return {
+        props: {
+          ...{
+            ...y,
+            customClass: m,
+            ..._(o)
+          },
+          key: o.id,
+          ref: (O) => {
+            if (O && o.id && !F.has(o.id)) {
+              F.register(o.id, O);
+              const N = {
+                token: o.id,
+                name: "component:ready",
+                type: B(o),
+                payloads: [U(O)],
+                schema: o
+              };
+              e.emit("event", N);
+            }
+          },
+          onVnodeUnmounted: (O) => {
+            if (o.id && F.has(o.id)) {
+              F.remove(o.id);
+              const N = {
+                token: o.id,
+                name: "component:unmounted",
+                type: B(o),
+                payloads: [O],
+                schema: o
+              };
+              e.emit("event", N);
+            }
+          }
+        },
+        eventProps: M,
+        callbackProps: E
+      };
+    }
+    function k(o, a) {
+      return Array.isArray(o) ? o.map((m) => a(m)) : a(o);
+    }
+    function A(o, a) {
+      var E;
+      const m = B(o), g = ae[m];
+      if (o.id && f.set(o.id, o), !g)
+        return null;
+      const h = () => o.fields ? o.fields.map((x) => A(x)) : null, y = (x, $, O) => {
+        let N;
+        return O && O.length > 0 ? N = q(x, {
+          ...$
+        }, O) : N = q(x, {
+          ...$
+        }, null), N;
+      }, M = ((E = C.get(o.id)) == null ? void 0 : E.props) || {};
+      return o.fields && o.fields.length > 0 ? y(g, M, [h()]) : o.slots ? y(g, M, [...Object.values(X(o.slots))]) : y(g, M);
+    }
+    function j(o) {
+      const a = B(o);
+      if (!ae[a])
+        return;
+      const {
+        props: g,
+        eventProps: h,
+        callbackProps: y
+      } = P(o), M = _e[a], E = M ? M.editorResolver : null, {
+        componentEventProps: x,
+        editorEventProps: $
+      } = h, {
+        componentCallbackProps: O,
+        editorCallbackProps: N
+      } = y;
+      if (x && Object.keys(x).length > 0 && Object.assign(g, x), O && Object.keys(O).length > 0 && Object.assign(g, O), E && $ && Object.keys($).length > 0) {
+        const D = E.resolve(o);
+        Object.assign(D, $);
+      }
+      if (E && N && Object.keys(N).length > 0) {
+        const D = E.resolve(o);
+        Object.assign(D, N);
+      }
+      if (g && Object.keys(g).length > 0) {
+        const D = C.get(o.id);
+        D ? $e(D == null ? void 0 : D.props, g) : C.set(o.id, ce({
+          props: g
+        }));
+      }
+      !o.fields || !Array.isArray(o.fields) || o.fields.forEach((D) => j(D));
+    }
+    function Y(o) {
+      const a = B(o);
+      ae[a] && (Q(o), !(!o.fields || !Array.isArray(o.fields)) && o.fields.forEach((g) => Y(g)));
+    }
+    function Q(o) {
+      const a = _(o);
+      if (a && Object.keys(a).length > 0) {
+        const m = C.get(o.id);
+        if (!m)
+          C.set(o.id, ce({
+            props: a
+          }));
+        else {
+          const g = {
+            ...m == null ? void 0 : m.props
+          };
+          Object.keys(a).forEach((h) => {
+            g[h] = a[h];
+          }), Object.assign(m == null ? void 0 : m.props, g);
+        }
+      }
+    }
+    ke(() => {
+    }), z(() => t.formData, (o) => {
+      v.value = o;
+    }), z(() => v.value, (o) => {
+      k(r.value, Y);
+    }, {
+      deep: !0
+    });
+    function Z(o) {
+      o && k(r.value, j);
+    }
+    z(() => t.fields, (o) => {
+      f.clear(), F.clear(), v.value = t.formData || {}, C.clear(), r.value = o, Z(o);
+    }), Z(t.fields);
+    function oe(o) {
+      o.$forceUpdate && o.$forceUpdate();
+    }
+    function ne(o) {
+      return T.getValue(o);
+    }
+    function H() {
+      return v.value;
+    }
+    function L(o, a) {
+      T.setValue(o, void 0, a);
+      const m = f.get(o);
+      m && Q(m);
+    }
+    function W(o) {
+      var a;
+      return (a = C.get(o)) == null ? void 0 : a.props;
+    }
+    function n(o, a) {
+      const m = C.get(o);
+      je(m == null ? void 0 : m.props, a, b);
+    }
+    e.expose({
+      componentManager: F,
+      rerender: oe,
+      getProps: W,
+      setProps: n,
+      getControlValue: ne,
+      setControlValue: L,
+      getValues: H
+    });
+    function s() {
+      return w.value && he(q("div", {
+        class: G.value,
+        style: t.customStyle
+      }, [e.slots.default && e.slots.default(), r.value && r.value.length > 0 && k(r.value, A)]), [[Fe("area-response")]]);
+    }
+    function d() {
+      return !w.value && r.value && r.value.length > 0 && k(r.value, A);
+    }
+    return () => t.visible ? s() || d() : null;
+  }
+}), ye = /* @__PURE__ */ te({
   name: "FResponseForm",
-  props: Qt,
+  props: ie,
   emits: [],
-  setup(t, o) {
-    const y = L(), d = W(() => {
-      const c = ge.getLocale(), V = t.customClass.split(" "), F = {
-        "drag-container": !0
+  setup(t, e) {
+    var b;
+    const r = U(), f = U(), i = J(() => {
+      const I = Ie.getLocale(), R = t.fields && t.fields.length > 0, G = {
+        "drag-container": !0,
+        "f-form-layout": R,
+        "farris-form": R
       };
-      return V.reduce((v, b) => (v[b] = !0, v), F), t.adaptForLanguage && c && (F["farris-form-controls-inline"] = c !== "en"), F;
-    });
-    return () => t.visible && pe(D("div", {
-      ref: y,
-      class: d.value,
+      return t.adaptForLanguage && I && (G["farris-form-controls-inline"] = I !== "en"), Ve(G, t.customClass);
+    }), F = (b = f.value) == null ? void 0 : b.componentManager;
+    function v(I) {
+      f.value.render(I);
+    }
+    function T(I) {
+      return f.value.getControlValue(I);
+    }
+    function V(I, R) {
+      f.value.setControlValue(I, R);
+    }
+    function C(I) {
+      return f.value.getProps(I);
+    }
+    function w(I, R) {
+      f.value.setProps(I, R);
+    }
+    return e.expose({
+      componentManager: F,
+      rerender: v,
+      getProps: C,
+      setProps: w,
+      getControlValue: T,
+      setControlValue: V
+    }), () => t.visible && he(q("div", {
+      ref: r,
+      class: i.value,
       style: t.customStyle
-    }, [o.slots.default && o.slots.default()]), [[de("area-response")]]);
+    }, [e.slots.default && e.slots.default(), t.fields && t.fields.length > 0 && q(se, {
+      ref: f,
+      fields: t.fields,
+      canRenderForm: !1,
+      formData: t.formData,
+      layout: t.layout
+    }, null)]), [[Fe("area-response")]]);
   }
-}), zt = {
+}), jo = {
   id: { type: String, default: "" },
   customClass: { type: String, default: "" },
   customStyle: { type: String, default: "" },
@@ -113,7 +693,7 @@ const Qt = {
   editor: { type: Object, default: {} },
   label: { type: String, default: "" },
   /** value is uncertain because type is uncertain, default value should not be set */
-  modelValue: { type: [String, Boolean, Array, Number] },
+  modelValue: { type: [String, Boolean, Array, Number], default: null },
   // readonly: { type: Boolean, default: false },
   visible: { type: Boolean, default: !0 },
   required: { type: Boolean, default: !1 },
@@ -126,7 +706,7 @@ const Qt = {
   componentId: { type: String, default: "" },
   errors: { type: Object, default: null },
   fill: { type: Boolean, default: !1 }
-}, Yt = {
+}, $o = {
   id: { type: String },
   required: { type: Boolean, default: !1 },
   text: { type: String, default: "" },
@@ -137,69 +717,69 @@ const Qt = {
    * 实际支持 'visible'可见 | 'reserve-space' 占位不显示
    */
   showType: { type: String, default: "visible" }
-}, Zt = /* @__PURE__ */ H({
+}, qo = /* @__PURE__ */ te({
   name: "FDynamicFormLabel",
-  props: Yt,
+  props: $o,
   emits: [],
-  setup(t, o) {
-    L(t.title || t.text);
-    const y = L(t.required), d = L(t.text), c = L(t.valid), V = L(t.inValidTip);
-    Y(() => t.text, () => {
-      d.value = t.text;
-    }), Y(() => t.required, (P, I) => {
-      P !== I && (y.value = P);
-    }), Y([() => t.valid, () => t.inValidTip], ([P, I]) => {
-      c.value = P, V.value = I;
+  setup(t, e) {
+    U(t.title || t.text);
+    const r = U(t.required), f = U(t.text), i = U(t.valid), F = U(t.inValidTip);
+    z(() => t.text, () => {
+      f.value = t.text;
+    }), z(() => t.required, (w, b) => {
+      w !== b && (r.value = w);
+    }), z([() => t.valid, () => t.inValidTip], ([w, b]) => {
+      i.value = w, F.value = b;
     });
-    const F = W(() => c.value ? d.value : V.value), v = W(() => c.value ? "" : "color:red"), b = W(() => ({
+    const v = J(() => i.value ? f.value : F.value), T = J(() => i.value ? "" : "color:red"), V = J(() => ({
       "col-form-label": !0,
       // 指定必填，当显示模式是隐藏或者没有指定标签名时，宽度不限定
-      "f-width-auto": y.value && (t.showType === "none" || !d.value)
-    })), C = W(() => t.showType === "force-none" ? !1 : t.showType === "reserve-space" || y.value || !!d.value && t.showType !== "none");
-    return () => C.value && D("label", {
-      class: b.value,
-      title: F.value,
-      style: v.value
-    }, [!c.value && D("span", {
+      "f-width-auto": r.value && (t.showType === "none" || !f.value)
+    })), C = J(() => t.showType === "force-none" ? !1 : t.showType === "reserve-space" || r.value || !!f.value && t.showType !== "none");
+    return () => C.value && q("label", {
+      class: V.value,
+      title: v.value,
+      style: T.value
+    }, [!i.value && q("span", {
       class: "f-icon f-icon-warning mr-1",
       style: "color: red; min-width: 16px;",
-      title: V.value
-    }, null), D("span", {
+      title: F.value
+    }, null), q("span", {
       class: "farris-label-text"
-    }, [y.value && D("span", {
+    }, [r.value && q("span", {
       class: "farris-label-info text-danger"
-    }, [fe("*")]), t.showType === "visible" && d.value])]);
+    }, [Ee("*")]), t.showType === "visible" && f.value])]);
   }
-}), { globalStorageKey: St } = $t(), r = {}, i = {}, a = {}, s = {};
-async function Ht() {
+}), { globalStorageKey: xo } = De(), l = {}, c = {}, u = {}, p = {};
+async function Go() {
   {
     const t = {
-      schemaMap: ue,
-      propertyConfigSchemaMap: Gt,
-      propertyEffectMap: xt,
-      schemaResolverMap: qt
+      schemaMap: ve,
+      propertyConfigSchemaMap: Ne,
+      propertyEffectMap: Oe,
+      schemaResolverMap: Le
     };
-    Ce.register(r, i, a, s), ye.register(r, i, a, s), he.register(r, i, a, s), Fe.register(r, i, a, s), be.register(r, i, a, s, t), ve.register(r, i, a, s), ie.register(r, i, a, s, t), ae.register(r, i, a, s, t), ie.register(r, i, a, s, t), ae.register(r, i, a, s, t), Ie.register(r, i, a, s, t), we.register(r, i, a, s), Ve.register(r, i, a, s), Me.register(r, i, a, s, t), Be.register(r, i, a, s), Te.register(r, i, a, s, t), Le.register(r, i, a, s, t), ke.register(r, i, a, s), Ee.register(r, i, a, s, t), Pe.register(r, i, a, s), kt.register(r, i, a, s), Ue.register(r, i, a, s), De.register(r, i, a, s), It.register(r, i, a, s), Ae.register(r, i, a, s), Re.register(r, i, a, s, t), Oe.register(r, i, a, s, t), xe.register(r, i, a, s, t), qe.register(r, i, a, s), Ge.register(r, i, a, s, t), je.register(r, i, a, s), $e.register(r, i, a, s), We.register(r, i, a, s), Ke.register(r, i, a, s, t), Xe.register(r, i, a, s), _e.register(r, i, a, s, t), Je.register(r, i, a, s), Qe.register(r, i, a, s), ze.register(r, i, a, s), Ye.register(r, i, a, s, t), Ze.register(r, i, a, s, t), Se.register(r, i, a, s), et.register(r, i, a, s, t), tt.register(r, i, a, s), He.register(r, i, a, s), Ft.register(r, i, a), nt.register(r, i, a, s), rt.register(r, i, a, s, t), it.register(r, i, a, s), at.register(r, i, a, s), st.register(r, i, a, s), lt.register(r, i, a, s, t), Vt.register(r, i, a, s), ct.register(r, i, a, s, t), ut.register(r, i, a, s), mt.register(r, i, a, s), pt.register(r, i, a, s, t), dt.register(r, i, a, s), ft.register(r, i, a, s), yt.register(r, i, a, s), gt.register(r, i, a, s), Ct.register(r, i, a, s), ht.register(r, i, a, s, t), bt.register(r, i, a, s), Ne.register(r, i, a, s), vt.register(r, i, a, s), wt.register(r, i, a, s, t), Bt.register(r, i, a, s), Mt.register(r, i, a, s), Tt.register(r, i, a, s), Lt.register(r, i, a, s), Et.register(r, i, a, s), Pt.register(r, i, a, s, t), Ut.register(r, i, a, s), Dt.register(r, i, a, s), Nt.register(r, i, a, s), At.register(r, i, a, s, t), Rt.register(r, i, a, s, t), Ot.register(r, i, a, s);
-    const o = window[St];
-    if (o)
-      for (const y in o)
-        o[y].createPropsResolver = jt, o[y].register(r, i, a);
+    Je.register(l, c, u, p), Xe.register(l, c, u, p), Qe.register(l, c, u, p), ze.register(l, c, u, p), Ye.register(l, c, u, p, t), Ze.register(l, c, u, p), de.register(l, c, u, p, t), fe.register(l, c, u, p, t), de.register(l, c, u, p, t), fe.register(l, c, u, p, t), Se.register(l, c, u, p, t), He.register(l, c, u, p), et.register(l, c, u, p), ot.register(l, c, u, p, t), tt.register(l, c, u, p), nt.register(l, c, u, p, t), rt.register(l, c, u, p, t), st.register(l, c, u, p), it.register(l, c, u, p, t), at.register(l, c, u, p), so.register(l, c, u, p), lt.register(l, c, u, p), ct.register(l, c, u, p), St.register(l, c, u, p), pt.register(l, c, u, p), mt.register(l, c, u, p, t), dt.register(l, c, u, p, t), yt.register(l, c, u, p, t), ft.register(l, c, u, p), gt.register(l, c, u, p, t), Ct.register(l, c, u, p), ht.register(l, c, u, p), Ft.register(l, c, u, p), bt.register(l, c, u, p, t), vt.register(l, c, u, p), Vt.register(l, c, u, p, t), It.register(l, c, u, p), Tt.register(l, c, u, p), Mt.register(l, c, u, p), wt.register(l, c, u, p, t), Pt.register(l, c, u, p, t), Bt.register(l, c, u, p), Et.register(l, c, u, p, t), Ut.register(l, c, u, p), kt.register(l, c, u, p), zt.register(l, c, u), Ot.register(l, c, u, p), Nt.register(l, c, u, p, t), Dt.register(l, c, u, p), Rt.register(l, c, u, p), At.register(l, c, u, p), jt.register(l, c, u, p, t), eo.register(l, c, u, p), $t.register(l, c, u, p, t), qt.register(l, c, u, p), xt.register(l, c, u, p), Gt.register(l, c, u, p, t), Wt.register(l, c, u, p), Kt.register(l, c, u, p), Xt.register(l, c, u, p), _t.register(l, c, u, p), Jt.register(l, c, u, p), Qt.register(l, c, u, p, t), Yt.register(l, c, u, p), ut.register(l, c, u, p), Zt.register(l, c, u, p), Ht.register(l, c, u, p, t), to.register(l, c, u, p), oo.register(l, c, u, p), no.register(l, c, u, p), ro.register(l, c, u, p), io.register(l, c, u, p), ao.register(l, c, u, p, t), lo.register(l, c, u, p), co.register(l, c, u, p), uo.register(l, c, u, p), po.register(l, c, u, p, t), mo.register(l, c, u, p, t), fo.register(l, c, u, p);
+    const e = window[xo];
+    if (e)
+      for (const r in e)
+        e[r].createPropsResolver = le, e[r].register(l, c, u);
   }
 }
-function me() {
-  Ht();
-  function t(F) {
-    const v = r[F];
-    if (!v)
-      throw new Error(`Could not find the editor of type '${F}'`);
-    return v;
+function we() {
+  Go();
+  function t(v) {
+    const T = l[v];
+    if (!T)
+      throw new Error(`Could not find the editor of type '${v}'`);
+    return T;
   }
-  function o(F, v) {
-    const b = i[F];
-    return b ? b(v) : {};
+  function e(v, T) {
+    const V = c[v];
+    return V ? V(T) : {};
   }
-  function y(F) {
-    switch (F) {
+  function r(v) {
+    switch (v) {
       case "check-box":
         return "onChangeValue";
       case "switch":
@@ -273,31 +853,31 @@ function me() {
         return "onUpdate:modelValue";
     }
   }
-  function d(F) {
-    switch (F) {
+  function f(v) {
+    switch (v) {
       case "combo-list":
       case "input-group":
       case "textarea":
         return "onClear";
     }
   }
-  function c(F) {
-    switch (F) {
+  function i(v) {
+    switch (v) {
       case "input-group":
       case "textarea":
         return "onMousedownEvent";
     }
   }
-  function V(F) {
-    switch (F) {
+  function F(v) {
+    switch (v) {
       case "input-group":
       case "textarea":
         return "onMouseupEvent";
     }
   }
-  return { resolveEditorProps: o, resolveEditorType: t, getChangeFunctionName: y, getClearFunctionName: d, getMousedownFunctionName: c, getMouseupFunctionName: V };
+  return { resolveEditorProps: e, resolveEditorType: t, getChangeFunctionName: r, getClearFunctionName: f, getMousedownFunctionName: i, getMouseupFunctionName: F };
 }
-const eo = {
+const Wo = {
   /**
    * 显示的错误信息
    */
@@ -305,122 +885,122 @@ const eo = {
     type: Object,
     default: null
   }
-}, to = /* @__PURE__ */ H({
+}, Ko = /* @__PURE__ */ te({
   name: "FValidationMessage",
-  props: eo,
+  props: Wo,
   emits: [],
-  setup(t, o) {
-    const y = L(t.errors);
-    Y(() => t.errors, (V) => {
-      y.value = V;
+  setup(t, e) {
+    const r = U(t.errors);
+    z(() => t.errors, (F) => {
+      r.value = F;
     });
-    const d = L(!0), c = W(() => {
-      if (y.value) {
-        const V = Object.keys(y.value).map((F) => {
-          var v;
-          return (v = y.value[F]) == null ? void 0 : v.name;
+    const f = U(!0), i = J(() => {
+      if (r.value) {
+        const F = Object.keys(r.value).map((v) => {
+          var T;
+          return (T = r.value[v]) == null ? void 0 : T.name;
         });
-        return V.length ? V.join(" ") : "";
+        return F.length ? F.join(" ") : "";
       }
       return "";
     });
-    return () => c.value && D("div", {
+    return () => i.value && q("div", {
       class: "farris-feedback f-state-invalid",
-      onClick: () => d.value = !d.value
-    }, [!d.value && D("span", {
+      onClick: () => f.value = !f.value
+    }, [!f.value && q("span", {
       class: "f-icon f-icon-message_warning f-feedback-icon"
-    }, null), d.value && D("span", {
+    }, null), f.value && q("span", {
       class: "f-feedback-message"
-    }, [c.value])]);
+    }, [i.value])]);
   }
-}), le = /* @__PURE__ */ H({
+}), ge = /* @__PURE__ */ te({
   name: "FDynamicFormGroup",
-  props: zt,
+  props: jo,
   emits: ["change", "update:modelValue"],
-  setup(t, o) {
-    var te;
-    const y = L(t.id), d = L(t.customClass), c = L(t.editor), V = L(t.label), F = L(t.modelValue), v = L(t.readonly), b = L(((te = t.editor) == null ? void 0 : te.required) || t.required), C = L(t.showLabel), P = L(t.visible);
-    L(t.type);
-    const I = L(), A = L(t.errors), G = Wt(), q = L(t.editor.type || "input-group"), j = W(() => C.value ? t.showLabelType : "none"), {
-      resolveEditorProps: X,
-      resolveEditorType: K,
-      getChangeFunctionName: T,
-      getClearFunctionName: w
-    } = me(), B = W(() => {
-      const k = {
+  setup(t, e) {
+    var H;
+    const r = U(t.id), f = U(t.customClass), i = U(t.editor), F = U(t.label), v = U(t.modelValue), T = U(t.readonly), V = U(((H = t.editor) == null ? void 0 : H.required) || t.required), C = U(t.showLabel), w = U(t.visible);
+    U(t.type);
+    const b = U(), I = U(t.errors), R = Re(), G = U(t.editor.type || "input-group"), K = J(() => C.value ? t.showLabelType : "none"), {
+      resolveEditorProps: _,
+      resolveEditorType: X,
+      getChangeFunctionName: B,
+      getClearFunctionName: P
+    } = we(), k = J(() => {
+      const L = {
         "form-group": !0,
         "farris-form-group": !0,
         "common-group": !0,
-        "q-state-readonly": v.value,
-        "form-group--in-mobile": G
+        "q-state-readonly": T.value,
+        "form-group--in-mobile": R
       };
-      return k["form-group--has-" + q.value] = !0, k;
-    }), N = W(() => {
+      return L["form-group--has-" + G.value] = !0, L;
+    }), A = J(() => {
       if (t.fill)
         return {
           maxWidth: "none"
         };
     });
-    function U(k, R, e) {
-      F.value = R !== void 0 ? R : k, o.emit("update:modelValue", F.value), o.emit("change", F.value, {
-        newValue: k,
-        newModelValue: R,
-        parameters: e
+    function j(L, W, n) {
+      v.value = W !== void 0 ? W : L, e.emit("update:modelValue", v.value), e.emit("change", v.value, {
+        newValue: L,
+        newModelValue: W,
+        parameters: n
       });
     }
-    function Z() {
-      o.emit("update:modelValue", "");
+    function Y() {
+      e.emit("update:modelValue", "");
     }
-    function z(k) {
-      return (...R) => {
-        Z(), typeof k == "function" && k(...R);
+    function Q(L) {
+      return (...W) => {
+        Y(), typeof L == "function" && L(...W);
       };
     }
-    function ee(k) {
-      return (R, e, n) => {
-        U(R, e, n), typeof k == "function" && k(R, e, n);
+    function Z(L) {
+      return (W, n, s) => {
+        j(W, n, s), typeof L == "function" && L(W, n, s);
       };
     }
-    const oe = W(() => {
-      const k = c.value.type || "input-group", R = K(k), e = X(k, c.value), n = T(k), l = w(c.value.type);
-      return l && (e[l] = z(e[l])), n && (e[n] = ee(e[n])), (e.id == null || e.id === "") && (e.id = y.value), k === "number-range" && c.value.onBeginValueChange && typeof c.value.onBeginValueChange == "function" ? (c.value.onBeginValueChange && typeof c.value.onBeginValueChange == "function" && (e.onBeginValueChange = c.value.onBeginValueChange), c.value.onEndValueChange && typeof c.value.onEndValueChange == "function" && (e.onEndValueChange = c.value.onEndValueChange)) : k === "lookup" && c.value["onUpdate:idValue"] && typeof c.value["onUpdate:idValue"] == "function" ? (e["onUpdate:idValue"] = c.value["onUpdate:idValue"], e.id = y.value) : k === "collection-property-editor" && c.value.onSelectionChange && typeof c.value.onSelectionChange == "function" ? e.onSelectionChange = c.value.onSelectionChange : k === "property-editor" && (e.onBeforeOpenVariables = c.value.onBeforeOpenVariables), () => D(R, ce({
-        ref: I
-      }, e, {
-        modelValue: F.value,
-        "onUpdate:modelValue": (m) => F.value = m
-      }), o.slots);
+    const oe = J(() => {
+      const L = i.value.type || "input-group", W = X(L), n = _(L, i.value), s = B(L), d = P(i.value.type);
+      return d && (n[d] = Q(n[d])), s && (n[s] = Z(n[s])), (n.id == null || n.id === "") && (n.id = r.value), L === "number-range" && i.value.onBeginValueChange && typeof i.value.onBeginValueChange == "function" ? (i.value.onBeginValueChange && typeof i.value.onBeginValueChange == "function" && (n.onBeginValueChange = i.value.onBeginValueChange), i.value.onEndValueChange && typeof i.value.onEndValueChange == "function" && (n.onEndValueChange = i.value.onEndValueChange)) : L === "lookup" && i.value["onUpdate:idValue"] && typeof i.value["onUpdate:idValue"] == "function" ? (n["onUpdate:idValue"] = i.value["onUpdate:idValue"], n.id = r.value) : L === "collection-property-editor" && i.value.onSelectionChange && typeof i.value.onSelectionChange == "function" ? n.onSelectionChange = i.value.onSelectionChange : L === "property-editor" && (n.onBeforeOpenVariables = i.value.onBeforeOpenVariables), () => q(W, be({
+        ref: b
+      }, n, {
+        modelValue: v.value,
+        "onUpdate:modelValue": (o) => v.value = o
+      }), e.slots);
     });
     function ne() {
-      return D(to, {
-        id: `${y.value}-validation-message`,
-        errors: A.value
+      return q(Ko, {
+        id: `${r.value}-validation-message`,
+        errors: I.value
       }, null);
     }
-    return Y([() => t.id, () => t.customClass, () => t.editor, () => t.label, () => t.modelValue, () => t.readonly, () => t.required, () => t.showLabel, () => t.visible, () => t.errors], ([k, R, e, n, l, m, f, g, h, p]) => {
-      var u;
-      y.value = k, d.value = R, c.value = e, V.value = n, F.value = l, v.value = m, b.value = ((u = c.value) == null ? void 0 : u.required) || f, C.value = g, P.value = h, A.value = p;
-    }), o.expose({
-      editorRef: I
-    }), () => P.value && D("div", {
-      id: `${y.value}-form-group`,
-      class: d.value,
+    return z([() => t.id, () => t.customClass, () => t.editor, () => t.label, () => t.modelValue, () => t.readonly, () => t.required, () => t.showLabel, () => t.visible, () => t.errors], ([L, W, n, s, d, o, a, m, g, h]) => {
+      var y;
+      r.value = L, f.value = W, i.value = n, F.value = s, v.value = d, T.value = o, V.value = ((y = i.value) == null ? void 0 : y.required) || a, C.value = m, w.value = g, I.value = h;
+    }), e.expose({
+      editorRef: b
+    }), () => w.value && q("div", {
+      id: `${r.value}-form-group`,
+      class: f.value,
       style: t.customStyle
-    }, [D("div", {
+    }, [q("div", {
       class: "farris-group-wrap",
-      style: N.value
-    }, [D("div", {
-      class: B.value
-    }, [D(Zt, {
-      id: `${y.value}-lable`,
-      showType: j.value,
-      required: b.value,
-      text: V.value,
-      title: V.value
-    }, null), D("div", {
+      style: A.value
+    }, [q("div", {
+      class: k.value
+    }, [q(qo, {
+      id: `${r.value}-lable`,
+      showType: K.value,
+      required: V.value,
+      text: F.value,
+      title: F.value
+    }, null), q("div", {
       class: "farris-input-wrap"
     }, [oe.value(), ne()])])])]);
   }
-}), oo = {
+}), _o = {
   id: { type: String, default: "" },
   /** 筛选组件配置器，具体配置项可查看各组件文档 */
   editor: { type: Object, default: {} },
@@ -434,458 +1014,530 @@ const eo = {
    * 作为内嵌编辑器被创建后默认选中文本
    */
   selectOnCreated: { type: Boolean, default: !1 }
-}, Rn = /* @__PURE__ */ H({
+}, Ce = /* @__PURE__ */ te({
   name: "FDynamicFormInput",
-  props: oo,
+  props: _o,
   emits: ["change", "update:modelValue", "mousedown", "mouseup"],
-  setup(t, o) {
-    const y = L(t.id), d = L(t.editor), c = L(t.modelValue), {
-      resolveEditorProps: V,
-      resolveEditorType: F,
-      getChangeFunctionName: v,
-      getMousedownFunctionName: b,
+  setup(t, e) {
+    const r = U(t.id), f = U(t.editor), i = U(t.modelValue), {
+      resolveEditorProps: F,
+      resolveEditorType: v,
+      getChangeFunctionName: T,
+      getMousedownFunctionName: V,
       getMouseupFunctionName: C,
-      getClearFunctionName: P
-    } = me();
-    function I(T, w, B) {
-      c.value = w !== void 0 ? w : T, o.emit("update:modelValue", c.value), o.emit("change", c.value, {
-        newValue: T,
-        newModelValue: w,
-        parameters: B
+      getClearFunctionName: w
+    } = we();
+    function b(B, P, k) {
+      i.value = P !== void 0 ? P : B, e.emit("update:modelValue", i.value), e.emit("change", i.value, {
+        newValue: B,
+        newModelValue: P,
+        parameters: k
       });
     }
-    function A(T) {
-      o.emit("mousedown", T);
+    function I(B) {
+      e.emit("mousedown", B);
     }
-    function G(T) {
-      o.emit("mouseup", T);
+    function R(B) {
+      e.emit("mouseup", B);
     }
-    function q() {
-      o.emit("update:modelValue", "");
+    function G() {
+      e.emit("update:modelValue", "");
     }
-    function j(T) {
-      return (...w) => {
-        q(), typeof T == "function" && T(...w);
+    function K(B) {
+      return (...P) => {
+        G(), typeof B == "function" && B(...P);
       };
     }
-    function X(T) {
-      return (w, B, N) => {
-        I(w, B, N), typeof T == "function" && T(w, B, N);
+    function _(B) {
+      return (P, k, A) => {
+        b(P, k, A), typeof B == "function" && B(P, k, A);
       };
     }
-    const K = W(() => {
-      const T = F(d.value.type), w = V(d.value.type, d.value);
-      w.focusOnCreated = t.focusOnCreated, w.selectOnCreated = t.selectOnCreated;
-      const B = v(d.value.type), N = P(d.value.type);
-      N && (w[N] = j(w[N])), B && (w[B] = X(w[B]));
-      const U = b(d.value.type);
-      w[U] = A;
-      const Z = C(d.value.type);
-      return w[Z] = G, w.id = y.value, () => D(T, ce(w, {
-        modelValue: c.value,
-        "onUpdate:modelValue": (z) => c.value = z
+    const X = J(() => {
+      const B = v(f.value.type), P = F(f.value.type, f.value);
+      P.focusOnCreated = t.focusOnCreated, P.selectOnCreated = t.selectOnCreated;
+      const k = T(f.value.type), A = w(f.value.type);
+      A && (P[A] = K(P[A])), k && (P[k] = _(P[k]));
+      const j = V(f.value.type);
+      P[j] = I;
+      const Y = C(f.value.type);
+      return P[Y] = R, P.id = r.value, () => q(B, be(P, {
+        modelValue: i.value,
+        "onUpdate:modelValue": (Q) => i.value = Q
       }), null);
     });
-    return Y([() => t.id, () => t.editor, () => t.modelValue], ([T, w, B]) => {
-      y.value = T, d.value = w, c.value = B;
-    }), () => K.value();
+    return z([() => t.id, () => t.editor, () => t.modelValue], ([B, P, k]) => {
+      r.value = B, f.value = P, i.value = k;
+    }), () => X.value();
   }
 });
-function no(t, o) {
-  function y(b, C = null) {
+function Xo(t, e) {
+  function r(V, C = null) {
     if (C)
       return C;
-    const P = t.getComponentById(o);
-    return t.selectNode(P, (I) => I.id === b);
+    const w = t.getComponentById(e);
+    return t.selectNode(w, (b) => b.id === V);
   }
-  function d(b) {
-    const C = t.getComponentById(b);
+  function f(V) {
+    const C = t.getComponentById(V);
     return !(!C || !C.componentType || !C.componentType.startsWith("form"));
   }
-  function c(b) {
-    const C = new Set(b);
+  function i(V) {
+    const C = new Set(V);
     return Array.from(C).length === 1;
   }
-  function V(b) {
-    const C = y(b.id), P = ot(t), I = [];
-    P.getResonseFormLayoutConfig(C, I, 1);
-    const A = I.map((B) => B.columnInSM), G = I.map((B) => B.columnInMD), q = I.map((B) => B.columnInLG), j = I.map((B) => B.columnInEL), X = c(A) ? A[0] : 0, K = c(G) ? G[0] : 0, T = c(q) ? q[0] : 0, w = c(j) ? j[0] : 0;
+  function F(V) {
+    const C = r(V.id), w = Lt(t), b = [];
+    w.getResonseFormLayoutConfig(C, b, 1);
+    const I = b.map((k) => k.columnInSM), R = b.map((k) => k.columnInMD), G = b.map((k) => k.columnInLG), K = b.map((k) => k.columnInEL), _ = i(I) ? I[0] : 0, X = i(R) ? R[0] : 0, B = i(G) ? G[0] : 0, P = i(K) ? K[0] : 0;
     return {
-      uniqueColClassInSM: X,
-      uniqueColClassInMD: K,
-      uniqueColClassInLG: T,
-      uniqueColClassInEL: w
+      uniqueColClassInSM: _,
+      uniqueColClassInMD: X,
+      uniqueColClassInLG: B,
+      uniqueColClassInEL: P
     };
   }
-  function F(b, C) {
-    let P, I, A, G, q = [];
-    if (b) {
-      const B = b.split(" "), N = B.filter((U) => U.startsWith("col-"));
-      P = N.find((U) => /^col-([1-9]|10|11|12)$/.test(U)), I = N.find((U) => /^col-md-([1-9]|10|11|12)$/.test(U)), A = N.find((U) => /^col-xl-([1-9]|10|11|12)$/.test(U)), G = N.find((U) => /^col-el-([1-9]|10|11|12)$/.test(U)), q = B.filter((U) => !U.startsWith("col-"));
+  function v(V, C) {
+    let w, b, I, R, G = [];
+    if (V) {
+      const k = V.split(" "), A = k.filter((j) => j.startsWith("col-"));
+      w = A.find((j) => /^col-([1-9]|10|11|12)$/.test(j)), b = A.find((j) => /^col-md-([1-9]|10|11|12)$/.test(j)), I = A.find((j) => /^col-xl-([1-9]|10|11|12)$/.test(j)), R = A.find((j) => /^col-el-([1-9]|10|11|12)$/.test(j)), G = k.filter((j) => !j.startsWith("col-"));
     }
-    const j = C.uniqueColClassInSM ? "col-" + C.uniqueColClassInSM : P, X = C.uniqueColClassInMD ? "col-md-" + C.uniqueColClassInMD : I, K = C.uniqueColClassInLG ? "col-xl-" + C.uniqueColClassInLG : A, T = C.uniqueColClassInEL ? "col-el-" + C.uniqueColClassInEL : G;
-    return [j, X, K, T].concat(q).join(" ");
+    const K = C.uniqueColClassInSM ? "col-" + C.uniqueColClassInSM : w, _ = C.uniqueColClassInMD ? "col-md-" + C.uniqueColClassInMD : b, X = C.uniqueColClassInLG ? "col-xl-" + C.uniqueColClassInLG : I, B = C.uniqueColClassInEL ? "col-el-" + C.uniqueColClassInEL : R;
+    return [K, _, X, B].concat(G).join(" ");
   }
-  function v(b, C, P) {
-    b = y(P, b), b.contents.forEach((I) => {
-      if (I.type === S.fieldset.type) {
-        v(I, C, I.id);
+  function T(V, C, w) {
+    V = r(w, V), V.contents.forEach((b) => {
+      if (b.type === ee["dynamic-form"].type)
+        return;
+      if (b.type === ee.fieldset.type) {
+        T(b, C, b.id);
         return;
       }
-      I.appearance || (I.appearance = {});
-      const A = I.appearance.class;
-      I.appearance.class = F(A, C);
+      b.appearance || (b.appearance = {});
+      const I = b.appearance.class;
+      b.appearance.class = v(I, C);
     });
   }
-  return { checkIsInFormComponent: d, assembleUnifiedLayoutContext: V, changeFormControlsByUnifiedLayoutConfig: v };
+  return { checkIsInFormComponent: f, assembleUnifiedLayoutContext: F, changeFormControlsByUnifiedLayoutConfig: T, changeControlClassInByColumn: v };
 }
-class ro extends Jt {
-  constructor(o, y) {
-    super(o, y);
-  }
-  getPropertyConfig(o, y) {
-    const d = this;
-    this.propertyConfig.categories.basic = this.getBasicPropConfig(o);
-    const { checkIsInFormComponent: c, assembleUnifiedLayoutContext: V, changeFormControlsByUnifiedLayoutConfig: F } = no(this.formSchemaUtils, this.componentId), v = this.getAppearanceConfig(o), b = c(this.componentId);
-    return v.properties.adaptForLanguage = {
+class Jo extends ho {
+  constructor(e, r) {
+    super(e, r);
+  }
+  getPropertyConfig(e, r) {
+    const f = this;
+    this.propertyConfig.categories.basic = this.getBasicPropConfig(e);
+    const { checkIsInFormComponent: i, assembleUnifiedLayoutContext: F, changeFormControlsByUnifiedLayoutConfig: v, changeControlClassInByColumn: T } = Xo(this.formSchemaUtils, this.componentId), V = this.getAppearanceConfig(e), C = i(this.componentId);
+    V.properties.adaptForLanguage = {
       title: "控件布局响应国际化",
       description: "启用国际化后：简体中文、繁体中文环境下控件标签与输入框在一行展示，其他语言环境下控件标签与输入框上下排列。",
-      visible: b,
+      visible: e.formType === "dynamic" || C,
       type: "boolean"
-    }, v.properties.labelAutoOverflow = {
+    }, V.properties.labelAutoOverflow = {
       title: "控件标签换行",
       description: "控件标签字数超长时，换行显示。控件标签与输入框在一行展示时，此属性有效。",
-      visible: b,
+      visible: e.formType === "dynamic" || C,
       type: "boolean"
-    }, v.properties.unifiedLayout = {
+    }, V.properties.formType = {
+      title: "控件来源",
+      description: "",
+      type: "enum",
+      editor: {
+        readonly: e.type === "dynamic-form",
+        type: "combo-list",
+        textField: "name",
+        valueField: "value",
+        data: [
+          {
+            value: "static",
+            name: "静态"
+          },
+          {
+            value: "dynamic",
+            name: "动态"
+          },
+          {
+            value: "mixed",
+            name: "混合"
+          }
+        ]
+      },
+      refreshPanelAfterChanged: !0
+    }, V.properties.unifiedLayout = {
       title: "统一布局配置",
       description: "统一配置卡片区域内所有控件的宽度，只支持标准模式",
-      visible: b,
+      visible: e.formType === "dynamic" || C,
       refreshPanelAfterChanged: !0,
       editor: {
         type: "response-form-layout-setting",
-        initialState: V(o)
+        initialState: F(e)
       }
-    }, v.setPropertyRelates = function(C, P) {
-      if (C)
-        switch (C && C.propertyID) {
+    }, V.setPropertyRelates = function(b, I) {
+      if (b)
+        switch (b && b.propertyID) {
           case "unifiedLayout": {
-            F(null, C.propertyValue, o.id), d.updateElementByParentContainer(o.id, y);
+            e.formType === "dynamic" ? e.layout = T("", b.propertyValue) : (v(null, b.propertyValue, e.id), f.updateElementByParentContainer(e.id, r));
             break;
           }
           case "labelAutoOverflow": {
-            d.setLabelAutoOverflow(o, C.propertyValue), Kt();
+            f.setLabelAutoOverflow(e, b.propertyValue), yo();
             break;
           }
         }
-    }, this.propertyConfig.categories.appearance = v, this.propertyConfig.categories.behavior = this.getBehaviorConfig(o), this.propertyConfig;
+    }, this.propertyConfig.categories.appearance = V;
+    let w = {};
+    if (e.formType && ["dynamic", "mixed"].indexOf(e.formType) > -1) {
+      const b = this.getPropertyEditorParams(e, ["Variable", "Custom"], "fields", {}, { newVariablePrefix: "", newVariableType: "Array" }), I = this.getPropertyEditorParams(e, ["Variable", "Custom"], "formData", {}, { newVariablePrefix: "", newVariableType: "Object" });
+      w = {
+        fields: {
+          title: "动态控件列表",
+          type: "string",
+          description: "动态控件列表",
+          editor: b
+        },
+        formData: {
+          title: "动态控件列表初始值",
+          type: "string",
+          description: "动态控件列表初始值",
+          editor: I
+        }
+      };
+    }
+    return this.propertyConfig.categories.behavior = this.getBehaviorConfig(e, "", w, (b, I) => {
+      switch (b.propertyID) {
+        case "fields":
+        case "formData":
+          f.afterMutilEditorChanged(e, b);
+          break;
+      }
+    }), this.propertyConfig;
   }
-  setLabelAutoOverflow(o, y, d) {
-    if (!d) {
-      const c = this.formSchemaUtils.getComponentById(this.componentId);
-      d = this.formSchemaUtils.selectNode(c, (V) => V.id === o.id);
+  setLabelAutoOverflow(e, r, f) {
+    if (!f) {
+      const i = this.formSchemaUtils.getComponentById(this.componentId);
+      f = this.formSchemaUtils.selectNode(i, (F) => F.id === e.id);
     }
-    d && d.contents && d.contents.length && d.contents.forEach((c) => {
-      if (c.type === S.fieldset.type) {
-        this.setLabelAutoOverflow(null, y, c);
+    f && f.contents && f.contents.length && f.contents.forEach((i) => {
+      if (i.type === ee.fieldset.type) {
+        this.setLabelAutoOverflow(null, r, i);
         return;
       }
-      c.appearance || (c.appearance = {
+      i.appearance || (i.appearance = {
         class: ""
-      }), c.appearance.class || (c.appearance.class = ""), y ? c.appearance.class.includes("farris-group-multi-label") || (c.appearance.class = c.appearance.class + " farris-group-multi-label") : c.appearance.class = c.appearance.class.replace("farris-group-multi-label", "").trim();
+      }), i.appearance.class || (i.appearance.class = ""), r ? i.appearance.class.includes("farris-group-multi-label") || (i.appearance.class = i.appearance.class + " farris-group-multi-label") : i.appearance.class = i.appearance.class.replace("farris-group-multi-label", "").trim();
     });
   }
 }
-function On(t, o) {
-  const y = t.schema, d = new Xt(), { canMove: c, canAccept: V, canDelete: F } = d.getTemplateRule(t, o);
-  function v(e, n) {
-    const { sourceElement: l } = e, { componentInstance: m } = l, f = o == null ? void 0 : o.formSchemaUtils;
-    if (!f)
+function kr(t, e) {
+  const r = t.schema, f = new go(), { canMove: i, canAccept: F, canDelete: v } = f.getTemplateRule(t, e);
+  function T(n, s) {
+    const { sourceElement: d } = n, { componentInstance: o } = d, a = e == null ? void 0 : e.formSchemaUtils;
+    if (!a)
       return !0;
-    const g = f.getComponentById(m.value.belongedComponentId), h = f.getViewModelById(g.viewModel), p = f.getComponentById(t.componentInstance.value.belongedComponentId), u = f.getViewModelById(p.viewModel);
-    return n ? h != null && h.id && (u != null && u.id) && h.id !== u.id ? h.bindTo === u.bindTo : !0 : (h == null ? void 0 : h.id) === (u == null ? void 0 : u.id);
+    const m = a.getComponentById(o.value.belongedComponentId), g = a.getViewModelById(m.viewModel), h = a.getComponentById(t.componentInstance.value.belongedComponentId), y = a.getViewModelById(h.viewModel);
+    return s ? g != null && g.id && (y != null && y.id) && g.id !== y.id ? g.bindTo === y.bindTo : !0 : (g == null ? void 0 : g.id) === (y == null ? void 0 : y.id);
   }
-  function b(e) {
-    const { bindingTargetId: n } = e;
-    if (!o)
+  function V(n) {
+    const { bindingTargetId: s } = n;
+    if (!e)
       return;
-    const { formSchemaUtils: l, schemaService: m } = o, f = l.getComponentById(t.componentInstance.value.belongedComponentId), g = m.getFieldByIDAndVMID(n, f.viewModel);
-    return !!(g != null && g.schemaField);
+    const { formSchemaUtils: d, schemaService: o } = e, a = d.getComponentById(t.componentInstance.value.belongedComponentId), m = o.getFieldByIDAndVMID(s, a.viewModel);
+    return !!(m != null && m.schemaField);
   }
-  function C(e) {
-    const n = d.getComponentContext(t);
-    if (n && n.componentClassList && n.componentClassList.includes("f-form-layout") && n.componentClassList.includes("farris-form")) {
-      if (e.sourceType === "control" && (e.componentCategory === "input" || e.componentType === "fieldset"))
+  function C(n) {
+    const s = f.getComponentContext(t);
+    if (s && s.componentClassList && s.componentClassList.includes("f-form-layout") && s.componentClassList.includes("farris-form")) {
+      if (n.sourceType === "control" && (n.componentCategory === "input" || n.componentType && ["fieldset", "dynamic-form"].indexOf(n.componentType) > -1))
         return !0;
-      if (e.sourceType === "move") {
-        if (e.componentType === "form-group")
-          return v(e, !0);
-        if (e.componentType === "fieldset")
-          return v(e, !1);
+      if (n.sourceType === "move") {
+        if (n.componentType === "form-group")
+          return T(n, !0);
+        if (n.componentType === "fieldset")
+          return T(n, !1);
+        if (n.componentType === "dynamic-form")
+          return !0;
       }
-      return e.sourceType === "field" && e.componentCategory === "input" ? b(e) : !1;
+      return n.sourceType === "field" && n.componentCategory === "input" ? V(n) : !1;
     }
     return !0;
   }
-  function P(e) {
-    return !(!_t().basalDragulaRuleForContainer(e, o) || !V || !C(e));
+  function w(n) {
+    return !(!Co().basalDragulaRuleForContainer(n, e) || !F || !C(n));
   }
-  function I(e) {
-    var u;
-    const n = e.componentInstance, l = n.value.schema, m = o == null ? void 0 : o.formSchemaUtils, f = o == null ? void 0 : o.designViewModelUtils, g = m.getViewModelIdByComponentId(n.value.belongedComponentId), h = f.getDgViewModel(g), p = n.value.parent;
-    if (p && S.fieldset && ((u = p.schema) == null ? void 0 : u.type) === S.fieldset.type && h) {
+  function b(n) {
+    var y;
+    const s = n.componentInstance, d = s.value.schema, o = e == null ? void 0 : e.formSchemaUtils, a = e == null ? void 0 : e.designViewModelUtils, m = o.getViewModelIdByComponentId(s.value.belongedComponentId), g = a.getDgViewModel(m), h = s.value.parent;
+    if (h && ee.fieldset && ((y = h.schema) == null ? void 0 : y.type) === ee.fieldset.type && g) {
       const M = { groupId: null, groupName: null };
-      switch (l.binding.type) {
-        case Q.Form: {
-          h.changeField(l.binding.field, M);
+      switch (d.binding.type) {
+        case S.Form: {
+          g.changeField(d.binding.field, M);
           break;
         }
-        case Q.Variable: {
-          m.modifyViewModelFieldById(g, l.binding.field, M, !0);
+        case S.Variable: {
+          o.modifyViewModelFieldById(m, d.binding.field, M, !0);
           break;
         }
       }
     }
   }
-  function A(e, n, l) {
-    const m = n.fields.find((u) => u.id === e), f = o == null ? void 0 : o.designViewModelUtils, g = f.getDgViewModel(n.id), h = g.fields.find((u) => u.id === e);
-    g.removeField([e]);
-    const p = f.getDgViewModel(l);
-    p.addField(h), m.fieldSchema && p.changeField(h.id, m.fieldSchema);
+  function I(n, s, d) {
+    const o = s.fields.find((y) => y.id === n), a = e == null ? void 0 : e.designViewModelUtils, m = a.getDgViewModel(s.id), g = m.fields.find((y) => y.id === n);
+    m.removeField([n]);
+    const h = a.getDgViewModel(d);
+    h.addField(g), o.fieldSchema && h.changeField(g.id, o.fieldSchema);
   }
-  function G(e, n, l, m = []) {
-    const f = n.id, g = e.binding.field, h = n.fields.findIndex((u) => u.id === g);
-    if (h > -1 && (l.fields.push(n.fields[h]), n.fields.splice(h, 1)), f === "root-viewmodel" && l.id !== "root-viewmodel") {
-      e.binding.path && !e.binding.path.includes("root-component.") && (e.binding.path = "root-component." + e.binding.path);
+  function R(n, s, d, o = []) {
+    const a = s.id, m = n.binding.field, g = s.fields.findIndex((y) => y.id === m);
+    if (g > -1 && (d.fields.push(s.fields[g]), s.fields.splice(g, 1)), a === "root-viewmodel" && d.id !== "root-viewmodel") {
+      n.binding.path && !n.binding.path.includes("root-component.") && (n.binding.path = "root-component." + n.binding.path);
       return;
     }
-    if (l.id === "root-viewmodel" && f !== "root-viewmodel" && e.binding.path && e.binding.path.includes("root-component.")) {
-      e.binding.path = e.binding.path.replace("root-component.", "");
+    if (d.id === "root-viewmodel" && a !== "root-viewmodel" && n.binding.path && n.binding.path.includes("root-component.")) {
+      n.binding.path = n.binding.path.replace("root-component.", "");
       return;
     }
-    const p = n.states.find((u) => u.id === g);
-    p && (l.states = l.states ? l.states : [], l.states.findIndex((u) => u.id === p.id) < 0 && (l.states.push(p), m.push(p.id)));
+    const h = s.states.find((y) => y.id === m);
+    h && (d.states = d.states ? d.states : [], d.states.findIndex((y) => y.id === h.id) < 0 && (d.states.push(h), o.push(h.id)));
   }
-  function q(e, n, l, m = []) {
-    var h;
-    if (!e)
+  function G(n, s, d, o = []) {
+    var g;
+    if (!n)
       return;
-    const f = n.id === "root-viewmodel" && l.id !== "root-viewmodel", g = l.id === "root-viewmodel" && n.id !== "root-viewmodel";
-    Object.keys(e).forEach((p) => {
-      if (p === "binding")
+    const a = s.id === "root-viewmodel" && d.id !== "root-viewmodel", m = d.id === "root-viewmodel" && s.id !== "root-viewmodel";
+    Object.keys(n).forEach((h) => {
+      if (h === "binding")
         return;
-      const u = e[p];
-      if (u && typeof u == "object" && u.type === Q.Variable && u.field) {
-        if (f) {
-          u.path && !u.path.includes("root-component.") && (u.path = "root-component." + u.path);
+      const y = n[h];
+      if (y && typeof y == "object" && y.type === S.Variable && y.field) {
+        if (a) {
+          y.path && !y.path.includes("root-component.") && (y.path = "root-component." + y.path);
           return;
         }
-        if (g && u.path && u.path.includes("root-component.")) {
-          u.path = u.path.replace("root-component.", "");
+        if (m && y.path && y.path.includes("root-component.")) {
+          y.path = y.path.replace("root-component.", "");
           return;
         }
-        const M = n.states.find((E) => E.id === u.field);
+        const M = s.states.find((E) => E.id === y.field);
         if (M) {
-          m.push(M.id), l.states = l.states ? l.states : [];
-          const E = l.states.find((_) => _.code === M.code);
+          o.push(M.id), d.states = d.states ? d.states : [];
+          const E = d.states.find((x) => x.code === M.code);
           if (E)
-            u.field = E.id;
+            y.field = E.id;
           else {
-            const _ = Object.assign({}, { newId: se().guid() }, M);
-            l.states.push(_), u.field = _.newId;
+            const x = Object.assign({}, { newId: me().guid() }, M);
+            d.states.push(x), y.field = x.newId;
           }
         }
       }
-    }), (h = l.states) != null && h.length && l.states.map((p) => {
-      p.newId && (p.id = p.newId, delete p.newId);
+    }), (g = d.states) != null && g.length && d.states.map((h) => {
+      h.newId && (h.id = h.newId, delete h.newId);
     });
   }
-  function j(e, n, l) {
-    if (e && (n(e, l), e.contents))
-      for (const m of e.contents)
-        j(m, n, l);
+  function K(n, s, d) {
+    if (n && (s(n, d), n.contents))
+      for (const o of n.contents)
+        K(o, s, d);
   }
-  function X(e = [], n) {
-    if (!e.length)
+  function _(n = [], s) {
+    if (!n.length)
       return;
-    const l = o == null ? void 0 : o.formSchemaUtils, m = l.getComponentByViewModelId(n), f = [], g = (p, u) => {
-      p && (Object.keys(p).forEach((M) => {
-        const E = p[M];
-        E && typeof E == "object" && E.type === Q.Variable && e.includes(E.field) && !u.includes(E.field) && u.push(E.field);
-      }), p.editor && g(p.editor, u));
+    const d = e == null ? void 0 : e.formSchemaUtils, o = d.getComponentByViewModelId(s), a = [], m = (h, y) => {
+      h && (Object.keys(h).forEach((M) => {
+        const E = h[M];
+        E && typeof E == "object" && E.type === S.Variable && n.includes(E.field) && !y.includes(E.field) && y.push(E.field);
+      }), h.editor && m(h.editor, y));
     };
-    j(m, g, f);
-    const h = l.getViewModelById(n);
-    e.forEach((p) => {
-      f.includes(p) || (h.states = h.states.filter((u) => u.id !== p));
+    K(o, m, a);
+    const g = d.getViewModelById(s);
+    n.forEach((h) => {
+      a.includes(h) || (g.states = g.states.filter((y) => y.id !== h));
     });
   }
-  function K(e) {
-    const n = se().guid(), l = Object.assign({}, e, {
-      id: n,
-      code: e.code + n.slice(0, 4),
-      name: e.name + n.slice(0, 4)
-    }), g = (o == null ? void 0 : o.formSchemaUtils).getCommands().find((h) => h.id === e.cmpId);
-    return g && g.refedHandlers.push({
-      host: n,
-      handler: e.handlerName
-    }), l;
-  }
-  function T(e, n, l) {
-    var M, E, _;
-    const m = {}, f = e.type === "form-group" && e.editor ? e.editor.type : e.type, g = (M = ue[f]) == null ? void 0 : M.events;
-    if (!g)
+  function X(n) {
+    const s = me().guid(), d = Object.assign({}, n, {
+      id: s,
+      code: n.code + s.slice(0, 4),
+      name: n.name + s.slice(0, 4)
+    }), m = (e == null ? void 0 : e.formSchemaUtils).getCommands().find((g) => g.id === n.cmpId);
+    return m && m.refedHandlers.push({
+      host: s,
+      handler: n.handlerName
+    }), d;
+  }
+  function B(n, s, d) {
+    var M, E, x;
+    const o = {}, a = n.type === "form-group" && n.editor ? n.editor.type : n.type, m = (M = ve[a]) == null ? void 0 : M.events;
+    if (!m)
       return;
-    Object.keys(e).forEach((J) => {
-      const $ = Object.keys(g).find((x) => x === J);
-      if ($ && e[$]) {
-        const x = n.commands.find((O) => O.code === e[$]);
-        if (x) {
-          let O = m[x.code];
-          O || (O = K(x), m[x.code] = O, l.commands.push(O)), e[$] = O.code;
+    Object.keys(n).forEach(($) => {
+      const O = Object.keys(m).find((N) => N === $);
+      if (O && n[O]) {
+        const N = s.commands.find((D) => D.code === n[O]);
+        if (N) {
+          let D = o[N.code];
+          D || (D = X(N), o[N.code] = D, d.commands.push(D)), n[O] = D.code;
         }
       }
     });
-    const p = (o == null ? void 0 : o.designViewModelUtils).getDgViewModel(l.id), u = ["valueChanging", "valueChanged"];
-    if (((E = e.binding) == null ? void 0 : E.type) === Q.Form) {
-      const J = (_ = l.fields) == null ? void 0 : _.find(($) => $.id === e.binding.field);
-      J && u.forEach(($) => {
-        if (J[$]) {
-          const x = n.commands.find((O) => O.code === J[$]);
-          if (!x)
+    const h = (e == null ? void 0 : e.designViewModelUtils).getDgViewModel(d.id), y = ["valueChanging", "valueChanged"];
+    if (((E = n.binding) == null ? void 0 : E.type) === S.Form) {
+      const $ = (x = d.fields) == null ? void 0 : x.find((O) => O.id === n.binding.field);
+      $ && y.forEach((O) => {
+        if ($[O]) {
+          const N = s.commands.find((D) => D.code === $[O]);
+          if (!N)
             return;
-          if (m[x.code])
-            p.changeField(J.id, { [$]: m[x.code].code });
+          if (o[N.code])
+            h.changeField($.id, { [O]: o[N.code].code });
           else {
-            const O = K(x);
-            m[x.code] = O, l.commands.push(O), p.changeField(J.id, { [$]: O.code });
+            const D = X(N);
+            o[N.code] = D, d.commands.push(D), h.changeField($.id, { [O]: D.code });
           }
         }
       });
     }
   }
-  function w(e) {
-    const n = o == null ? void 0 : o.formSchemaUtils, l = e.componentInstance, m = l.value.schema, f = n.getViewModelIdByComponentId(l.value.belongedComponentId), g = n.getViewModelById(f), h = n.getComponentById(t.componentInstance.value.belongedComponentId), p = n.getViewModelById(h.viewModel);
-    if (f !== p.id) {
-      const u = m.binding.type, M = m.binding.field, E = [];
-      switch (u) {
-        case Q.Form: {
-          A(M, g, p.id);
+  function P(n) {
+    var y, M;
+    const s = e == null ? void 0 : e.formSchemaUtils, d = n.componentInstance, o = d.value.schema, a = s.getViewModelIdByComponentId(d.value.belongedComponentId), m = s.getViewModelById(a), g = s.getComponentById(t.componentInstance.value.belongedComponentId), h = s.getViewModelById(g.viewModel);
+    if (a !== h.id) {
+      const E = (y = o.binding) == null ? void 0 : y.type, x = (M = o.binding) == null ? void 0 : M.field, $ = [];
+      switch (E) {
+        case S.Form: {
+          I(x, m, h.id);
           break;
         }
-        case Q.Variable: {
-          G(m, g, p, E);
+        case S.Variable: {
+          R(o, m, h, $);
           break;
         }
       }
-      q(m, g, p, E), q(m.editor, g, p, E), T(m, g, p), f !== "root-viewmodel" && X(E, f);
+      G(o, m, h, $), G(o.editor, m, h, $), B(o, m, h), a !== "root-viewmodel" && _($, a);
     }
   }
-  function B(e) {
-    if (!e || !e.componentInstance)
+  function k(n) {
+    var o;
+    if (!n || !n.componentInstance)
       return;
-    const l = e.componentInstance.value.schema;
-    !l.binding || !l.binding.field || (I(e), w(e));
+    const d = n.componentInstance.value.schema;
+    if (d.type === "dynamic-form") {
+      const a = ((o = d == null ? void 0 : d.appearance) == null ? void 0 : o.class) || "";
+      a.indexOf("col-12") < 0 && (d.appearance = {
+        ...d.appearance,
+        class: a + " col-12 px-0"
+      }), P(n);
+      return;
+    }
+    !d.binding || !d.binding.field || (b(n), P(n));
   }
-  function N() {
-    return y.componentType ? "display:inherit;flex-direction:inherit;margin-bottom:10px" : "";
+  function A() {
+    return r.componentType ? "display:inherit;flex-direction:inherit;margin-bottom:10px" : "";
   }
-  function U(e) {
-    let n = "";
-    switch (e) {
+  function j(n) {
+    let s = "";
+    switch (n) {
       case 1: {
-        n = "col-12 col-md-12 col-xl-12 col-el-12";
+        s = "col-12 col-md-12 col-xl-12 col-el-12";
         break;
       }
       case 2: {
-        n = "col-12 col-md-6 col-xl-6 col-el-6";
+        s = "col-12 col-md-6 col-xl-6 col-el-6";
         break;
       }
       case 3: {
-        n = "col-12 col-md-6 col-xl-4 col-el-4";
+        s = "col-12 col-md-6 col-xl-4 col-el-4";
         break;
       }
       case 4: {
-        n = "col-12 col-md-6 col-xl-3 col-el-2";
+        s = "col-12 col-md-6 col-xl-3 col-el-2";
         break;
       }
     }
-    return n;
+    return s;
   }
-  function Z(e, n) {
-    let l = !1;
+  function Y(n, s) {
+    let d = !1;
     if (t.schema && Object.prototype.hasOwnProperty.call(t.schema, "labelAutoOverflow"))
-      l = t.schema.labelAutoOverflow;
+      d = t.schema.labelAutoOverflow;
     else {
-      const m = o == null ? void 0 : o.formSchemaUtils, f = m == null ? void 0 : m.selectNode(n, (g) => g.type === S["response-form"].type);
-      f && (l = f.labelAutoOverflow);
+      const o = e == null ? void 0 : e.formSchemaUtils, a = o == null ? void 0 : o.selectNode(s, (m) => m.type === ee["response-form"].type);
+      a && (d = a.labelAutoOverflow);
     }
-    return l && (e += " farris-group-multi-label"), e;
+    return d && (n += " farris-group-multi-label"), n;
   }
-  function z(e) {
-    const n = t.componentInstance.value.getBelongedComponentInstance(t.componentInstance);
-    if (n && n.schema && n.schema.componentType) {
-      const { formColumns: l } = n.schema;
-      let m = U(l);
-      m = o == null ? void 0 : o.formSchemaUtils.getControlClassByFormUnifiedLayout(m, n.schema.id, t.schema), m = Z(m, n.schema), e.appearance || (e.appearance = {}), e.appearance.class = m;
+  function Q(n) {
+    const s = t.componentInstance.value.getBelongedComponentInstance(t.componentInstance);
+    if (s && s.schema && s.schema.componentType) {
+      const { formColumns: d } = s.schema;
+      let o = j(d);
+      o = e == null ? void 0 : e.formSchemaUtils.getControlClassByFormUnifiedLayout(o, s.schema.id, t.schema), o = Y(o, s.schema), n.appearance || (n.appearance = {}), n.appearance.class = o;
     }
   }
-  function ee(e, n, l, m) {
-    const { bindingSourceContext: f, parentComponentInstance: g } = e;
-    if (f != null && f.entityFieldNode && g) {
-      const h = o == null ? void 0 : o.designViewModelUtils, u = (o == null ? void 0 : o.formSchemaUtils).getViewModelIdByComponentId(g.belongedComponentId), M = h.getDgViewModel(u);
-      M.removeField([f.entityFieldNode.id]), M.addField(f.designViewModelField), n && M.changeField(f.entityFieldNode.id, { editor: { $type: n }, groupId: l, groupName: m });
+  function Z(n, s, d, o) {
+    const { bindingSourceContext: a, parentComponentInstance: m } = n;
+    if (a != null && a.entityFieldNode && m) {
+      const g = e == null ? void 0 : e.designViewModelUtils, y = (e == null ? void 0 : e.formSchemaUtils).getViewModelIdByComponentId(m.belongedComponentId), M = g.getDgViewModel(y);
+      M.removeField([a.entityFieldNode.id]), M.addField(a.designViewModelField), s && M.changeField(a.entityFieldNode.id, { editor: { $type: s }, groupId: d, groupName: o });
     }
   }
-  function oe(e, n) {
-    var g, h, p;
-    const l = y;
-    if ((l.appearance && l.appearance.class || "").split(" ").includes("f-form-layout") && e.componentCategory === "input") {
-      const { label: u } = e;
+  function oe(n, s) {
+    var m, g, h;
+    const d = r;
+    if ((d.appearance && d.appearance.class || "").split(" ").includes("f-form-layout") && n.componentCategory === "input") {
+      const { label: y } = n;
       let M;
-      const E = o == null ? void 0 : o.controlCreatorUtils;
-      return (g = e.bindingSourceContext) != null && g.entityFieldNode ? M = E.setFormFieldProperty((h = e.bindingSourceContext) == null ? void 0 : h.entityFieldNode, n == null ? void 0 : n.type) : (M = E.createFormGroupWithoutField(n == null ? void 0 : n.type), M.label = u), z(M), ee(e, (p = M.editor) == null ? void 0 : p.type), M;
+      const E = e == null ? void 0 : e.controlCreatorUtils;
+      return (m = n.bindingSourceContext) != null && m.entityFieldNode ? M = E.setFormFieldProperty((g = n.bindingSourceContext) == null ? void 0 : g.entityFieldNode, s == null ? void 0 : s.type) : (M = E.createFormGroupWithoutField(s == null ? void 0 : s.type), M.label = y), Q(M), Z(n, (h = M.editor) == null ? void 0 : h.type), M;
     }
-    return n;
+    return n.componentType === "dynamic-form" && (s.appearance = {
+      class: "col-12",
+      ...s.appearance
+    }), s;
   }
   function ne() {
-    return c;
+    return i;
   }
-  function te() {
-    return F;
+  function H() {
+    return v;
   }
-  function k() {
+  function L() {
     return !1;
   }
-  function R(e) {
-    return new ro(e, o).getPropertyConfig(y, t.componentInstance.value);
+  function W(n) {
+    return new Jo(n, e).getPropertyConfig(r, t.componentInstance.value);
   }
   return {
-    canAccepts: P,
-    checkCanDeleteComponent: te,
+    canAccepts: w,
+    checkCanDeleteComponent: H,
     checkCanMoveComponent: ne,
-    getStyles: N,
-    getPropsConfig: R,
-    hideNestedPaddingInDesginerView: k,
-    onAcceptMovedChildElement: B,
+    getStyles: A,
+    getPropsConfig: W,
+    hideNestedPaddingInDesginerView: L,
+    onAcceptMovedChildElement: k,
     onResolveNewComponentSchema: oe,
-    moveInputBetweenComponent: w,
-    resolveFormGroupAppearance: z,
-    syncFieldToViewModel: ee
+    moveInputBetweenComponent: P,
+    resolveFormGroupAppearance: Q,
+    syncFieldToViewModel: Z
   };
 }
-re.install = (t) => {
-  t.component(re.name, re).component(le.name, le);
+se.install = (t) => {
+  t.component(ye.name, ye).component(Ce.name, Ce).component(se.name, se).component(ge.name, ge);
 };
 export {
-  le as FDynamicFormGroup,
-  Rn as FDynamicFormInput,
-  Zt as FDynamicFormLabel,
-  re as FResponseForm,
-  re as default,
-  zt as dynamicFormGroupProps,
-  oo as dynamicFormInputProps,
-  Qt as responseFormProps,
-  On as useDesignerRules,
-  me as useTypeResolver
+  se as FDynamicForm,
+  ge as FDynamicFormGroup,
+  Ce as FDynamicFormInput,
+  qo as FDynamicFormLabel,
+  ye as FResponseForm,
+  se as default,
+  jo as dynamicFormGroupProps,
+  _o as dynamicFormInputProps,
+  Ao as dynamicFormProps,
+  Br as dynamicFormPropsResolver,
+  Pr as formPropsResolver,
+  ie as responseFormProps,
+  kr as useDesignerRules,
+  we as useTypeResolver
 };