@schemx/vue 1.0.0-next.4 → 1.0.0-next.6

package/dist/index.d.ts

@@ -4,6 +4,8 @@ export { default as schemxForm } from './form';
 export type { SchemxInstallOptions } from './form';
 /** 全局渲染器注册实例 */
 export { rendererRegistry } from './utils/rendererProvider';
+/** 全局 Col 组件注册函数 */
+export { registerCol } from './utils/colProvider';
 /** 全局预设规则注册实例 */
 export { presetRuleRegistry } from './utils/presetRuleProvider';
 /** Hooks */
@@ -13,6 +15,8 @@ export { WithRemoteOptions } from './hocs';
 /** 组件 */
 export { default as Field } from './components/Field';
 export { default as Group } from './components/Group';
+export { default as Col } from './components/Col';
+export { default as Wrapper } from './components/Wrapper/index.vue';
 export { default as ConfigProvider, type ConfigProviderProps, } from './components/ConfigProvider';
 /** schemx/core 导出 */
 export * from '@schemx/core';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,oBAAoB,CAAA;AAE3B,WAAW;AACX,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAChC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,QAAQ,CAAA;AAC9C,YAAY,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAA;AAElD,gBAAgB;AAChB,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAE3D,iBAAiB;AACjB,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAE/D,YAAY;AACZ,cAAc,SAAS,CAAA;AAEvB,WAAW;AACX,OAAO,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAA;AAE1C,SAAS;AACT,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EACL,OAAO,IAAI,cAAc,EACzB,KAAK,mBAAmB,GACzB,MAAM,6BAA6B,CAAA;AAEpC,qBAAqB;AACrB,cAAc,cAAc,CAAA;AAE5B,YAAY;AACZ,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,oBAAoB,CAAA;AAE3B,WAAW;AACX,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAChC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,QAAQ,CAAA;AAC9C,YAAY,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAA;AAElD,gBAAgB;AAChB,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAE3D,oBAAoB;AACpB,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEjD,iBAAiB;AACjB,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAE/D,YAAY;AACZ,cAAc,SAAS,CAAA;AAEvB,WAAW;AACX,OAAO,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAA;AAE1C,SAAS;AACT,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACnE,OAAO,EACL,OAAO,IAAI,cAAc,EACzB,KAAK,mBAAmB,GACzB,MAAM,6BAA6B,CAAA;AAEpC,qBAAqB;AACrB,cAAc,cAAc,CAAA;AAE5B,YAAY;AACZ,cAAc,SAAS,CAAA"}

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import "./style.css";
-import { shallowRef, computed, getCurrentInstance, inject, provide, onScopeDispose, onUnmounted, ref, onMounted, watchEffect, watch, readonly, createVNode, h, createTextVNode, defineComponent, mergeProps, useAttrs, openBlock, createElementBlock, unref, renderSlot, createCommentVNode, createStaticVNode, Fragment, toDisplayString, useSlots, reactive, toRaw, normalizeClass, normalizeStyle, renderList, createBlock, createSlots, withCtx, nextTick } from "vue";
-import { isViewGroupSchema, isViewDynamicSchema, mergeSchemxConfig, createPresetRuleRegistry, createForm, createField, createWatch, isSchemxViewFieldSchema, isSchemxSchemas, defaultSchemxConfigKeys } from "@schemx/core";
+import { shallowRef, computed, getCurrentInstance, inject, provide, onScopeDispose, onUnmounted, ref, onMounted, watchEffect, watch, readonly, createVNode, h, createTextVNode, defineComponent, mergeProps, useAttrs, openBlock, createElementBlock, unref, renderSlot, createCommentVNode, createStaticVNode, Fragment, toDisplayString, markRaw, toRaw, isVNode, useSlots, reactive, normalizeClass, normalizeStyle, createSlots, renderList, withCtx, normalizeProps, guardReactiveProps, createBlock, nextTick } from "vue";
+import { isViewGroupSchema, isViewDynamicSchema, mergeSchemxConfig, createPresetRuleRegistry, createForm, createField, createWatch, isSchemxViewFieldSchema, getGlobalSchemxConfig, mergeAndResolveSchemxConfig, isSchemxSchemas, defaultSchemxConfigKeys } from "@schemx/core";
 export * from "@schemx/core";
 import classnames from "classnames";
 import { createFormStateAdapter, createRendererRegistry } from "@schemx/core/adapter";
@@ -349,7 +349,8 @@ function normalizeSchemxAppConfig(config) {
     validatorAdapters,
     defaultRendererType: config.defaultRendererType,
     rendererRegistry: config.rendererRegistry,
-    presetRuleRegistry: config.presetRuleRegistry
+    presetRuleRegistry: config.presetRuleRegistry,
+    colComponent: config.colComponent
   });
 }
 function normalizeRendererProps(source) {
@@ -376,17 +377,24 @@ const SCHEMX_CONFIG_PROVIDER_KEY = Symbol(
 );
 function provideSchemxConfigProvider(config) {
   const parentConfig = inject(SCHEMX_CONFIG_PROVIDER_KEY, void 0);
-  const mergedConfig = computed(
-    () => mergeSchemxConfig(config.value, (parentConfig == null ? void 0 : parentConfig.value) ?? {})
-  );
+  const mergedConfig = computed(() => {
+    const mergedCoreConfig = mergeSchemxConfig(config.value, (parentConfig == null ? void 0 : parentConfig.value) ?? {});
+    return {
+      ...mergedCoreConfig,
+      colComponent: config.value.colComponent ?? (parentConfig == null ? void 0 : parentConfig.value.colComponent)
+    };
+  });
   provide(SCHEMX_CONFIG_PROVIDER_KEY, mergedConfig);
 }
 function getSchemxConfigProvider() {
   var _a;
+  return (_a = getSchemxConfigProviderRef()) == null ? void 0 : _a.value;
+}
+function getSchemxConfigProviderRef() {
   if (getCurrentInstance() === null) {
     return void 0;
   }
-  return (_a = inject(SCHEMX_CONFIG_PROVIDER_KEY, void 0)) == null ? void 0 : _a.value;
+  return inject(SCHEMX_CONFIG_PROVIDER_KEY, void 0);
 }
 const presetRuleRegistry = createPresetRuleRegistry();
 const rendererRegistry = createRendererRegistry("input");
@@ -1095,7 +1103,7 @@ const _hoisted_4 = {
   key: 4,
   class: "schemx-button__suffix"
 };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   ...{ name: "SchemxButton", inheritAttrs: false },
   __name: "index",
   props: {
@@ -1132,6 +1140,58 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const registeredColComponent = shallowRef();
+function registerCol(component) {
+  registeredColComponent.value = component;
+}
+const Col = /* @__PURE__ */ defineComponent({
+  name: "SchemxCol",
+  inheritAttrs: false,
+  props: {
+    layout: {
+      type: Object,
+      required: false,
+      default: void 0
+    },
+    component: {
+      type: [Object, Function],
+      required: false,
+      default: void 0
+    }
+  },
+  setup(props, {
+    attrs,
+    slots
+  }) {
+    const resolvedComponent = computed(() => {
+      const component = props.component ?? registeredColComponent.value;
+      return component ? markRaw(toRaw(component)) : void 0;
+    });
+    return () => {
+      var _a;
+      const component = resolvedComponent.value;
+      if (!component) {
+        return ((_a = slots.default) == null ? void 0 : _a.call(slots)) ?? null;
+      }
+      const layout = props.layout ?? {};
+      const span = layout.block ? 24 : layout.span ?? 24;
+      const offset = layout.block ? 0 : layout.offset ?? 0;
+      const {
+        class: attrsClass,
+        style: attrsStyle,
+        ...restAttrs
+      } = attrs;
+      return h(component, {
+        ...restAttrs,
+        class: ["schemx-col", attrsClass],
+        style: attrsStyle,
+        span,
+        offset
+      }, slots);
+    };
+  }
+});
+const Col$1 = Col;
 function createGroupSlotRenderers(options) {
   const {
     schema,
@@ -1200,6 +1260,11 @@ const Group = /* @__PURE__ */ defineComponent({
       type: [String, Object, Array],
       required: false,
       default: void 0
+    },
+    renderChildren: {
+      type: Function,
+      required: false,
+      default: void 0
     }
   },
   setup(props, {
@@ -1273,7 +1338,7 @@ const Group = /* @__PURE__ */ defineComponent({
         readonly: Boolean(schema.readonly),
         toggle,
         slots,
-        renderChildren: () => schema.children.map(renderChild)
+        renderChildren: () => props.renderChildren ? props.renderChildren(schema.children) : schema.children.map(renderChild)
       });
       const body = createVNode("div", {
         "id": bodyId,
@@ -1329,6 +1394,11 @@ const Dynamic = /* @__PURE__ */ defineComponent({
     viewSchemas: {
       type: Array,
       required: true
+    },
+    renderChildren: {
+      type: Function,
+      required: false,
+      default: void 0
     }
   },
   /**
@@ -1369,18 +1439,113 @@ const Dynamic = /* @__PURE__ */ defineComponent({
       if (props.schema.visible === false) {
         return null;
       }
-      return props.schema.items.map((item) => createVNode(Fragment, {
-        "key": item.key
-      }, [item.children.map(renderItemSchema)]));
+      return props.schema.items.map((item) => {
+        const children = props.renderChildren ? props.renderChildren(item.children) : item.children.map(renderItemSchema);
+        return createVNode(Fragment, {
+          "key": item.key
+        }, [children]);
+      });
     };
   }
 });
 const Dynamic$1 = Dynamic;
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const SchemaList = /* @__PURE__ */ defineComponent({
+  name: "SchemxSchemaList",
+  inheritAttrs: false,
+  props: {
+    schemas: {
+      type: Array,
+      required: true
+    },
+    viewSchemas: {
+      type: Array,
+      required: true
+    },
+    colComponent: {
+      type: [Object, Function],
+      required: false,
+      default: void 0
+    },
+    fieldClassResolver: {
+      type: Function,
+      required: false,
+      default: void 0
+    }
+  },
+  setup(props, {
+    slots
+  }) {
+    const getFieldRenderKey = (schema) => `${schema.key}:${normalizeNameKey(schema.name)}`;
+    const getSchemaRenderKey = (schema) => {
+      if (isSchemxViewFieldSchema(schema)) {
+        return getFieldRenderKey(schema);
+      }
+      return schema.key;
+    };
+    const renderChildren = (schemas) => {
+      return h(SchemaList, {
+        schemas,
+        viewSchemas: props.viewSchemas,
+        colComponent: props.colComponent
+      }, slots);
+    };
+    const renderSchema = (schema) => {
+      var _a;
+      if (schema.visible === false) {
+        return null;
+      }
+      let content;
+      if (isViewGroupSchema(schema)) {
+        content = createVNode(Group$1, {
+          "key": schema.key,
+          "schema": schema,
+          "renderChildren": renderChildren
+        }, slots);
+      } else if (isViewDynamicSchema(schema)) {
+        content = createVNode(Dynamic$1, {
+          "key": schema.key,
+          "schema": schema,
+          "viewSchemas": props.viewSchemas,
+          "renderChildren": renderChildren
+        }, slots);
+      } else {
+        content = createVNode(Field$1, {
+          "key": getFieldRenderKey(schema),
+          "schema": schema,
+          "class": (_a = props.fieldClassResolver) == null ? void 0 : _a.call(props, schema)
+        }, slots);
+      }
+      if (!props.colComponent) {
+        return content;
+      }
+      return createVNode(Col$1, {
+        "key": getSchemaRenderKey(schema),
+        "component": props.colComponent,
+        "layout": schema.layout
+      }, _isSlot(content) ? content : {
+        default: () => [content]
+      });
+    };
+    return () => {
+      const children = props.schemas.map(renderSchema);
+      if (!props.colComponent) {
+        return children;
+      }
+      return createVNode("div", {
+        "class": "schemx-row"
+      }, [children]);
+    };
+  }
+});
+const SchemaList$1 = SchemaList;
 const _hoisted_1 = {
   key: 0,
   class: "schemx-actions"
 };
-const _sfc_main = /* @__PURE__ */ defineComponent({
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   ...{ name: "SchemxForm" },
   __name: "form",
   props: {
@@ -1394,6 +1559,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     resetter: { type: [Boolean, Object], default: true },
     class: { type: [Boolean, null, String, Object, Array], default: "" },
     style: { type: [Boolean, null, String, Object, Array], default: () => ({}) },
+    colComponent: { default: void 0 },
     rendererProps: { default: void 0 },
     validatorAdapters: {},
     defaultRendererType: {},
@@ -1437,18 +1603,55 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       );
     };
     const isExternalForm = props.form !== void 0;
+    const schemaConfigProps = computed(pickSchemaConfig);
+    const appConfig = getSchemxAppConfig();
+    const providerConfig = getSchemxConfigProviderRef();
+    const coreConfig = getGlobalSchemxConfig();
     const formFallbackConfig = {
       schemaConfig: {
         visible: true,
         validationTrigger: ["blur", "change"]
       }
     };
-    const initialSchemaConfig = (isExternalForm ? mergeSchemxConfig({ schemaConfig: pickSchemaConfig() }, formFallbackConfig).schemaConfig : mergeVueSchemxConfig({ schemaConfig: pickSchemaConfig() }, formFallbackConfig).schemaConfig) ?? {};
-    const formSchemaConfig = reactive(initialSchemaConfig);
+    const contextSchemaConfig = computed(() => {
+      const mergedConfig = isExternalForm ? mergeSchemxConfig({ schemaConfig: schemaConfigProps.value }, formFallbackConfig) : mergeSchemxConfig(
+        { schemaConfig: schemaConfigProps.value },
+        (providerConfig == null ? void 0 : providerConfig.value) ?? {},
+        appConfig,
+        formFallbackConfig
+      );
+      return mergedConfig.schemaConfig ?? {};
+    });
+    const resolvedSchemaConfig = computed(
+      () => mergeAndResolveSchemxConfig(
+        { schemaConfig: schemaConfigProps.value },
+        (providerConfig == null ? void 0 : providerConfig.value) ?? {},
+        appConfig,
+        formFallbackConfig,
+        coreConfig
+      ).schemaConfig
+    );
+    const initialContextSchemaConfig = contextSchemaConfig.value;
+    const initialCoreSchemaConfig = isExternalForm ? initialContextSchemaConfig : resolvedSchemaConfig.value;
+    const formSchemaConfig = reactive(
+      initialContextSchemaConfig
+    );
+    const hasSchemaConfigKey = (config, key) => Object.prototype.hasOwnProperty.call(config, key);
+    const replaceFormSchemaConfig = (nextSchemaConfig) => {
+      for (const key of defaultSchemxConfigKeys) {
+        if (!hasSchemaConfigKey(nextSchemaConfig, key)) {
+          delete formSchemaConfig[key];
+        }
+      }
+      Object.assign(formSchemaConfig, nextSchemaConfig);
+    };
+    const resolvedColComponent = computed(
+      () => props.colComponent ?? (providerConfig == null ? void 0 : providerConfig.value.colComponent) ?? appConfig.colComponent ?? registeredColComponent.value
+    );
     createFormConfigContext({ schemaConfig: formSchemaConfig });
     const providedForm = props.form ? props.form : useForm({
       schemas: props.schemas,
-      schemaConfig: initialSchemaConfig,
+      schemaConfig: initialCoreSchemaConfig,
       initialValues: Object.keys(props.modelValue).length > 0 ? props.modelValue : props.initialValues,
       rendererProps: props.rendererProps,
       rendererRegistry: props.rendererRegistry,
@@ -1577,7 +1780,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           syncingFromModel = false;
         }
       },
-      { deep: true }
+      { deep: true, immediate: isExternalForm }
     );
     const handleSubmit = () => formInstance.submit();
     const handleReset = () => {
@@ -1587,8 +1790,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     watch(
       formValues,
       (latestSnapshot) => {
-        if (syncingFromModel)
+        if (syncingFromModel) {
           return;
+        }
         emitModelValue(latestSnapshot);
       },
       { flush: "sync" }
@@ -1600,10 +1804,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           formInstance.setSchemas(schemas);
         }
       },
-      { deep: false, immediate: !!props.form }
+      { immediate: isExternalForm }
     );
     const viewSchemas = useViewSchemas(formInstance);
-    const getFieldRenderKey = (schema) => `${schema.key}:${normalizeNameKey(schema.name)}`;
     const getFieldClass = (schema) => {
       const { isFirst, isLast } = getSectionPosition(
         viewSchemas.value,
@@ -1614,14 +1817,32 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "schemx-field-wrapper--last": isLast
       };
     };
-    watch(
-      pickSchemaConfig,
-      (nextSchemaConfig) => {
-        Object.assign(formSchemaConfig, nextSchemaConfig);
-        formInstance.updateSchemaConfig(nextSchemaConfig);
-      },
-      { deep: false, immediate: isExternalForm }
-    );
+    const syncInternalSchemaConfig = (nextSchemaConfig) => {
+      replaceFormSchemaConfig(contextSchemaConfig.value);
+      formInstance.updateSchemaConfig(nextSchemaConfig);
+    };
+    const syncExternalSchemaConfig = (nextSchemaConfig, previousSchemaConfig) => {
+      const patch = { ...nextSchemaConfig };
+      if (previousSchemaConfig !== void 0) {
+        for (const key of defaultSchemxConfigKeys) {
+          if (hasSchemaConfigKey(previousSchemaConfig, key) && !hasSchemaConfigKey(nextSchemaConfig, key)) {
+            patch[key] = void 0;
+          }
+        }
+      }
+      replaceFormSchemaConfig(contextSchemaConfig.value);
+      if (Object.keys(patch).length > 0) {
+        formInstance.updateSchemaConfig(patch);
+      }
+    };
+    if (isExternalForm) {
+      watch(schemaConfigProps, syncExternalSchemaConfig, {
+        deep: true,
+        immediate: true
+      });
+    } else {
+      watch(resolvedSchemaConfig, syncInternalSchemaConfig, { deep: true });
+    }
     const exposed = {
       ...formInstance,
       submit: handleSubmit,
@@ -1633,58 +1854,28 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         class: normalizeClass(formRootClass.value),
         style: normalizeStyle(formRootStyle.value)
       }, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(viewSchemas), (schema) => {
-          return openBlock(), createElementBlock(Fragment, {
-            key: schema.key
-          }, [
-            unref(isViewGroupSchema)(schema) ? (openBlock(), createBlock(unref(Group$1), {
-              key: 0,
-              schema
-            }, createSlots({ _: 2 }, [
-              renderList(fieldSlots.value, (_, slotName) => {
-                return {
-                  name: slotName,
-                  fn: withCtx((slotProps) => [
-                    renderSlot(_ctx.$slots, slotName, mergeProps({ ref_for: true }, slotProps ?? {}))
-                  ])
-                };
-              })
-            ]), 1032, ["schema"])) : unref(isViewDynamicSchema)(schema) ? (openBlock(), createBlock(unref(Dynamic$1), {
-              key: 1,
-              schema,
-              "view-schemas": unref(viewSchemas)
-            }, createSlots({ _: 2 }, [
-              renderList(fieldSlots.value, (_, slotName) => {
-                return {
-                  name: slotName,
-                  fn: withCtx((slotProps) => [
-                    renderSlot(_ctx.$slots, slotName, mergeProps({ ref_for: true }, slotProps ?? {}))
-                  ])
-                };
-              })
-            ]), 1032, ["schema", "view-schemas"])) : (openBlock(), createBlock(unref(Field$1), {
-              key: getFieldRenderKey(schema),
-              schema,
-              class: normalizeClass(getFieldClass(schema))
-            }, createSlots({ _: 2 }, [
-              renderList(fieldSlots.value, (_, slotName) => {
-                return {
-                  name: slotName,
-                  fn: withCtx((slotProps) => [
-                    renderSlot(_ctx.$slots, slotName, mergeProps({ ref_for: true }, slotProps ?? {}))
-                  ])
-                };
-              })
-            ]), 1032, ["schema", "class"]))
-          ], 64);
-        }), 128)),
+        createVNode(unref(SchemaList$1), {
+          schemas: unref(viewSchemas),
+          "view-schemas": unref(viewSchemas),
+          "col-component": resolvedColComponent.value,
+          "field-class-resolver": getFieldClass
+        }, createSlots({ _: 2 }, [
+          renderList(fieldSlots.value, (_, slotName) => {
+            return {
+              name: slotName,
+              fn: withCtx((slotProps) => [
+                renderSlot(_ctx.$slots, slotName, normalizeProps(guardReactiveProps(slotProps ?? {})))
+              ])
+            };
+          })
+        ]), 1032, ["schemas", "view-schemas", "col-component"]),
         isActionsVisible.value ? (openBlock(), createElementBlock("div", _hoisted_1, [
           isResetterVisible.value && unref(slots).resetter ? renderSlot(_ctx.$slots, "resetter", {
             form: unref(formInstance),
             loading: effectiveLoading.value,
             disabled: isResetterDisabled.value,
             reset: handleReset
-          }, void 0, void 0, 0) : isResetterVisible.value ? (openBlock(), createBlock(unref(_sfc_main$1), mergeProps({ key: 1 }, resetterButtonProps.value, {
+          }, void 0, void 0, 0) : isResetterVisible.value ? (openBlock(), createBlock(unref(_sfc_main$2), mergeProps({ key: 1 }, resetterButtonProps.value, {
             class: "schemx-actions-button schemx-actions-button--reset",
             type: "button",
             disabled: isResetterDisabled.value,
@@ -1700,7 +1891,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             loading: effectiveLoading.value,
             disabled: isSubmitterDisabled.value,
             submit: handleSubmit
-          }, void 0, void 0, 2) : isSubmitterVisible.value ? (openBlock(), createBlock(unref(_sfc_main$1), mergeProps({ key: 3 }, submitterButtonProps.value, {
+          }, void 0, void 0, 2) : isSubmitterVisible.value ? (openBlock(), createBlock(unref(_sfc_main$2), mergeProps({ key: 3 }, submitterButtonProps.value, {
             class: "schemx-actions-button schemx-actions-button--submit",
             type: "button",
             loading: effectiveLoading.value,
@@ -1720,11 +1911,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 function withInstall(comp, extra) {
   return Object.assign(comp, extra);
 }
-const SchemxFormExport = withInstall(_sfc_main, {
+const SchemxFormExport = withInstall(_sfc_main$1, {
   /** Vue 插件安装方法 */
   install(app, options = {}) {
     provideSchemxAppConfig(app, options);
-    app.component("SchemxForm", _sfc_main);
+    app.component("SchemxForm", _sfc_main$1);
   },
   /** Field 子组件引用 */
   Field: Field$1
@@ -1762,6 +1953,53 @@ function WithRemoteOptions(WrappedComponent) {
     }
   });
 }
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "SchemxWrapper",
+    inheritAttrs: false
+  },
+  __name: "index",
+  props: {
+    readonly: { type: Boolean, default: false },
+    disabled: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const slots = useSlots();
+    const warnedReadonlySlot = ref(false);
+    const rootClass = computed(() => [
+      "schemx-wrapper",
+      attrs.class,
+      props.readonly && "schemx-wrapper--readonly",
+      props.disabled && "schemx-wrapper--disabled"
+    ]);
+    const forwardedAttrs = computed(() => {
+      const { class: _class, ...rest } = attrs;
+      return rest;
+    });
+    const warnIfReadonlySlotIsMissing = (readonly2) => {
+      if (!readonly2 || slots.readonly || warnedReadonlySlot.value || true) {
+        return;
+      }
+      warnedReadonlySlot.value = true;
+      console.warn("[schemx] SchemxWrapper is readonly but no #readonly slot was provided.");
+    };
+    onMounted(() => warnIfReadonlySlotIsMissing(props.readonly));
+    watch(() => props.readonly, warnIfReadonlySlotIsMissing);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps(forwardedAttrs.value, { class: rootClass.value }), [
+        props.readonly ? renderSlot(_ctx.$slots, "readonly", {
+          readonly: props.readonly,
+          disabled: props.disabled
+        }, void 0, void 0, 0) : renderSlot(_ctx.$slots, "default", {
+          readonly: props.readonly,
+          disabled: props.disabled
+        }, void 0, void 0, 1)
+      ], 16);
+    };
+  }
+});
 const ConfigProvider = /* @__PURE__ */ defineComponent({
   name: "SchemxConfigProvider",
   inheritAttrs: false,
@@ -1789,6 +2027,10 @@ const ConfigProvider = /* @__PURE__ */ defineComponent({
     presetRuleRegistry: {
       type: Object,
       default: void 0
+    },
+    colComponent: {
+      type: [Object, Function],
+      default: void 0
     }
   },
   setup(props, {
@@ -1800,7 +2042,8 @@ const ConfigProvider = /* @__PURE__ */ defineComponent({
       validatorAdapters: props.validatorAdapters,
       defaultRendererType: props.defaultRendererType,
       rendererRegistry: props.rendererRegistry,
-      presetRuleRegistry: props.presetRuleRegistry
+      presetRuleRegistry: props.presetRuleRegistry,
+      colComponent: props.colComponent
     }));
     provideSchemxConfigProvider(config);
     return () => {
@@ -1811,15 +2054,18 @@ const ConfigProvider = /* @__PURE__ */ defineComponent({
 });
 const ConfigProvider$1 = ConfigProvider;
 export {
+  Col$1 as Col,
   ConfigProvider$1 as ConfigProvider,
   Field$1 as Field,
   Group$1 as Group,
   WithRemoteOptions,
+  _sfc_main as Wrapper,
   createFieldContext,
   createFormConfigContext,
   createFormContext,
   SchemxFormExport$1 as default,
   presetRuleRegistry,
+  registerCol,
   rendererRegistry,
   SchemxFormExport$1 as schemxForm,
   useDictionary,