@vunk/form 0.0.0-alpha.2 → 0.0.0-alpha.3

package/components/input-config/index.js

@@ -1,7 +1,9 @@
 import { _VkfFormCtx, VkfForm } from '@vunk/form/components/form';
-import { defineComponent, computed, resolveComponent, openBlock, createBlock, mergeProps, toHandlers, withCtx, createVNode } from 'vue';
+import { defineComponent, computed, resolveComponent, openBlock, createBlock, mergeProps, toHandlers, withCtx, createVNode, normalizeProps, guardReactiveProps, resolveDynamicComponent } from 'vue';
 import { VkfConfirmInput } from '@vunk/form/components/confirm-input';
 import { VkfFormItemRendererTemplate } from '@vunk/form/components/form-item-renderer-template';
+import { ElCollapse, ElCollapseItem } from 'element-plus';
+import { VkfRulesConfig } from '@vunk/form/components/rules-config';
 import { setData } from 'vunk/shared/helper';
 
 const props = {
@@ -21,7 +23,10 @@ var script = defineComponent({
   components: {
     VkfForm,
     VkfConfirmInput,
-    VkfFormItemRendererTemplate
+    VkfFormItemRendererTemplate,
+    ElCollapse,
+    ElCollapseItem,
+    VkfRulesConfig
   },
   emits,
   props,
@@ -31,30 +36,66 @@ var script = defineComponent({
     const formItems = computed(() => {
       return [
         {
-          prop: "prop",
-          label: "prop",
-          templateType: "VkfConfirmInput",
-          required: true,
-          disabled: props2.propDisabled
-        },
-        {
-          prop: "label",
-          label: "label",
-          templateType: "VkfInput",
-          required: true
-        },
-        {
-          prop: "placeholder",
-          label: "placeholder",
-          templateType: "VkfInput"
+          templateType: "ElCollapse",
+          modelValue: [0, 1],
+          templateSlots: [
+            {
+              templateType: "ElCollapseItem",
+              name: 0,
+              title: "\u57FA\u7840\u914D\u7F6E",
+              templateSlots: [
+                {
+                  prop: "prop",
+                  label: "prop",
+                  templateType: "VkfConfirmInput",
+                  required: true,
+                  disabled: props2.propDisabled
+                },
+                {
+                  prop: "label",
+                  label: "label",
+                  templateType: "VkfInput",
+                  required: true
+                },
+                {
+                  prop: "placeholder",
+                  label: "placeholder",
+                  templateType: "VkfInput"
+                }
+              ]
+            },
+            {
+              templateType: "ElCollapseItem",
+              name: 1,
+              title: "\u89C4\u5219\u914D\u7F6E",
+              templateSlots: [
+                {
+                  templateType: "VkfRulesConfig"
+                }
+              ]
+            }
+          ]
         }
       ];
     });
+    const setRulesData = (e) => {
+      if (!formProps.value.data.rules) {
+        emit("setData", {
+          k: "rules",
+          v: {}
+        });
+      }
+      emit("setData", {
+        k: ["rules", e.k],
+        v: e.v
+      });
+    };
     return {
       formProps,
       formEmits,
       formItems,
-      setData
+      setData,
+      setRulesData
     };
   }
 });
@@ -62,19 +103,57 @@ var script = defineComponent({
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_VkfConfirmInput = resolveComponent("VkfConfirmInput");
   const _component_VkfFormItemRendererTemplate = resolveComponent("VkfFormItemRendererTemplate");
+  const _component_ElCollapse = resolveComponent("ElCollapse");
+  const _component_ElCollapseItem = resolveComponent("ElCollapseItem");
+  const _component_VkfRulesConfig = resolveComponent("VkfRulesConfig");
   const _component_VkfForm = resolveComponent("VkfForm");
   return openBlock(), createBlock(_component_VkfForm, mergeProps(_ctx.formProps, toHandlers(_ctx.formEmits), { formItems: _ctx.formItems }), {
     rendererTemplate: withCtx(() => [
       createVNode(_component_VkfFormItemRendererTemplate, { type: "VkfConfirmInput" }, {
-        default: withCtx(({ data: sourceData }) => [
+        default: withCtx(({ data: bindProps }) => [
           createVNode(_component_VkfConfirmInput, mergeProps({
-            modelValue: _ctx.formProps.data[sourceData.prop],
+            modelValue: _ctx.formProps.data[bindProps.prop],
             "onUpdate:modelValue": ($event) => _ctx.$emit("setData", {
-              k: sourceData.prop,
+              k: bindProps.prop,
               v: $event
             }),
             "onUpdate:disabled": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:propDisabled", $event))
-          }, sourceData), null, 16, ["modelValue", "onUpdate:modelValue"])
+          }, bindProps), null, 16, ["modelValue", "onUpdate:modelValue"])
+        ]),
+        _: 1
+      }),
+      createVNode(_component_VkfFormItemRendererTemplate, { type: "ElCollapse" }, {
+        default: withCtx(({ data, Renderer, raw }) => [
+          createVNode(_component_ElCollapse, normalizeProps(guardReactiveProps(data)), {
+            default: withCtx(() => [
+              (openBlock(), createBlock(resolveDynamicComponent(Renderer), {
+                source: raw.templateSlots
+              }, null, 8, ["source"]))
+            ]),
+            _: 2
+          }, 1040)
+        ]),
+        _: 1
+      }),
+      createVNode(_component_VkfFormItemRendererTemplate, { type: "ElCollapseItem" }, {
+        default: withCtx(({ data, Renderer, raw }) => [
+          createVNode(_component_ElCollapseItem, normalizeProps(guardReactiveProps(data)), {
+            default: withCtx(() => [
+              (openBlock(), createBlock(resolveDynamicComponent(Renderer), {
+                source: raw.templateSlots
+              }, null, 8, ["source"]))
+            ]),
+            _: 2
+          }, 1040)
+        ]),
+        _: 1
+      }),
+      createVNode(_component_VkfFormItemRendererTemplate, { type: "VkfRulesConfig" }, {
+        default: withCtx(({ data }) => [
+          createVNode(_component_VkfRulesConfig, mergeProps(data, {
+            data: _ctx.formProps.data.rules || {},
+            onSetData: _ctx.setRulesData
+          }), null, 16, ["data", "onSetData"])
         ]),
         _: 1
       })

package/components/input-config/src/ctx.d.ts

@@ -12,28 +12,32 @@ export declare const props: {
         default: () => never[];
     };
     model: ObjectConstructor;
-    rules: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>, unknown, unknown, unknown, unknown>;
-    labelPosition: StringConstructor;
-    labelWidth: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, NumberConstructor], "", unknown, unknown, unknown>;
-    labelSuffix: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     inline: BooleanConstructor;
     inlineMessage: BooleanConstructor;
     statusIcon: BooleanConstructor;
-    showMessage: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, "" | "small" | "default" | "large", unknown>;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
     disabled: BooleanConstructor;
-    validateOnRuleChange: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    hideRequiredAsterisk: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     scrollToError: BooleanConstructor;
 };
 export declare const emits: {
     'update:propDisabled': (e: boolean) => boolean;
-    setData: (e: {
-        v: any;
-        k: any;
-    }) => {
-        v: any;
-        k: any;
-    };
+    setData: (e: import("../../../shared/types").SetDataEvent<any>) => import("../../../shared/types").SetDataEvent<any>;
     validate: null;
 };

package/components/input-config/src/index.vue.d.ts

@@ -1,6 +1,20 @@
-import type { FormItemRendererSource } from '@vunk/form/shared/types';
+import type { FormItemRendererSource, SetDataEvent } from '@vunk/form/shared/types';
 import type { VkfInputProps, VkfConfirmInputSource } from '@vunk/form/shared/types/form-item';
-declare type FormItemRendererSourcePlus<P = keyof VkfInputProps> = FormItemRendererSource<P> | VkfConfirmInputSource<P>;
+import { ElCollapse, ElCollapseItem } from 'element-plus';
+import type { VueComponentPropsType } from 'vunk/shared/types';
+import { VkfRulesConfig } from '@vunk/form/components/rules-config';
+declare type ElCollapseSource = VueComponentPropsType<typeof ElCollapse> & {
+    templateType: 'ElCollapse';
+    templateSlots: FormItemRendererSourcePlus[];
+};
+declare type ElCollapseItemSource = VueComponentPropsType<typeof ElCollapseItem> & {
+    templateType: 'ElCollapseItem';
+    templateSlots: FormItemRendererSourcePlus[];
+};
+declare type VkfRulesConfigSource = VueComponentPropsType<typeof VkfRulesConfig> & {
+    templateType: 'VkfRulesConfig';
+};
+declare type FormItemRendererSourcePlus<P = keyof VkfInputProps | string[]> = FormItemRendererSource<P> | VkfConfirmInputSource<P> | ElCollapseSource | ElCollapseItemSource | VkfRulesConfigSource;
 declare const _default: import("vue").DefineComponent<{
     propDisabled: {
         type: BooleanConstructor;
@@ -15,61 +29,61 @@ declare const _default: import("vue").DefineComponent<{
         default: () => never[];
     };
     model: ObjectConstructor;
-    rules: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>, unknown, unknown, unknown, unknown>;
-    labelPosition: StringConstructor;
-    labelWidth: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, NumberConstructor], "", unknown, unknown, unknown>;
-    labelSuffix: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     inline: BooleanConstructor;
     inlineMessage: BooleanConstructor;
     statusIcon: BooleanConstructor;
-    showMessage: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, "" | "small" | "default" | "large", unknown>;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
     disabled: BooleanConstructor;
-    validateOnRuleChange: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    hideRequiredAsterisk: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     scrollToError: BooleanConstructor;
 }, {
     formProps: import("vue").ComputedRef<{
         data: Record<string, any>;
         model: Record<string, any> | undefined;
         rules: Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>> | undefined;
-        labelPosition: string | undefined;
-        labelWidth: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+        labelPosition: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top", unknown>;
+        labelWidth: import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
         labelSuffix: string;
         inline: boolean;
         inlineMessage: boolean;
         statusIcon: boolean;
-        showMessage: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
-        size: import("element-plus/es/utils").BuildPropType<StringConstructor, "" | "small" | "default" | "large", unknown> | undefined;
+        showMessage: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+        size: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown> | undefined;
         disabled: boolean;
-        validateOnRuleChange: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
-        hideRequiredAsterisk: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+        validateOnRuleChange: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+        hideRequiredAsterisk: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
         scrollToError: boolean;
     }>;
     formEmits: {
-        validate: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: {
-            v: any;
-            k: any;
-        }) => void) & ((event: "update:propDisabled", e: boolean) => void);
-        setData: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: {
-            v: any;
-            k: any;
-        }) => void) & ((event: "update:propDisabled", e: boolean) => void);
+        validate: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: SetDataEvent<any>) => void) & ((event: "update:propDisabled", e: boolean) => void);
+        setData: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: SetDataEvent<any>) => void) & ((event: "update:propDisabled", e: boolean) => void);
     };
-    formItems: import("vue").ComputedRef<FormItemRendererSourcePlus<"error" | "for" | "onChange" | "onUpdate:modelValue" | "onInput" | "onClear" | "onBlur" | "onFocus" | "onMouseleave" | "onMouseenter" | "onKeydown" | "onCompositionstart" | "onCompositionupdate" | "onCompositionend" | ("required" | "type" | "rules" | "labelWidth" | "inlineMessage" | "showMessage" | "size" | "disabled" | "modelValue" | "resize" | "autosize" | "autocomplete" | "formatter" | "parser" | "placeholder" | "form" | "readonly" | "clearable" | "showPassword" | "showWordLimit" | "suffixIcon" | "prefixIcon" | "label" | "tabindex" | "validateEvent" | "inputStyle" | "prop" | "validateStatus" | "formItemSize" | "formItemSlot" | "inputSlot" | "updateEvent")>[]>;
+    formItems: import("vue").ComputedRef<FormItemRendererSourcePlus<string[] | "rules" | "size" | "resize" | "formatter" | "parser" | "placeholder" | "prop" | "error" | "validateStatus" | "for" | "onChange" | "onUpdate:modelValue" | "onInput" | "onFocus" | "onBlur" | "onClear" | "onMouseleave" | "onMouseenter" | "onKeydown" | "onCompositionstart" | "onCompositionupdate" | "onCompositionend" | ("required" | "type" | "labelWidth" | "inlineMessage" | "showMessage" | "disabled" | "id" | "modelValue" | "autosize" | "autocomplete" | "form" | "readonly" | "clearable" | "showPassword" | "showWordLimit" | "suffixIcon" | "prefixIcon" | "containerRole" | "label" | "tabindex" | "validateEvent" | "inputStyle" | "formItemSize" | "formItemSlots" | "inputSlots")>[]>;
     setData: (obj: any, e: {
         k: any;
         v: any;
+        insert?: boolean | undefined;
     }) => void;
+    setRulesData: (e: SetDataEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     'update:propDisabled': (e: boolean) => boolean;
-    setData: (e: {
-        v: any;
-        k: any;
-    }) => {
-        v: any;
-        k: any;
-    };
+    setData: (e: SetDataEvent<any>) => SetDataEvent<any>;
     validate: null;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     propDisabled: {
@@ -85,39 +99,45 @@ declare const _default: import("vue").DefineComponent<{
         default: () => never[];
     };
     model: ObjectConstructor;
-    rules: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>, unknown, unknown, unknown, unknown>;
-    labelPosition: StringConstructor;
-    labelWidth: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, NumberConstructor], "", unknown, unknown, unknown>;
-    labelSuffix: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     inline: BooleanConstructor;
     inlineMessage: BooleanConstructor;
     statusIcon: BooleanConstructor;
-    showMessage: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, "" | "small" | "default" | "large", unknown>;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
     disabled: BooleanConstructor;
-    validateOnRuleChange: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
-    hideRequiredAsterisk: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     scrollToError: BooleanConstructor;
 }>> & {
     onValidate?: ((...args: any[]) => any) | undefined;
-    onSetData?: ((e: {
-        v: any;
-        k: any;
-    }) => any) | undefined;
+    onSetData?: ((e: SetDataEvent<any>) => any) | undefined;
     "onUpdate:propDisabled"?: ((e: boolean) => any) | undefined;
 }, {
     data: Record<string, any>;
-    rules: Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>;
-    labelWidth: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    labelPosition: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top", unknown>;
+    labelWidth: import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
     labelSuffix: string;
     inline: boolean;
     inlineMessage: boolean;
     statusIcon: boolean;
-    showMessage: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
-    size: import("element-plus/es/utils").BuildPropType<StringConstructor, "" | "small" | "default" | "large", unknown>;
+    showMessage: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
     disabled: boolean;
-    validateOnRuleChange: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
-    hideRequiredAsterisk: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
     scrollToError: boolean;
     formItems: any[];
     propDisabled: boolean;

package/components/rules-config/index.d.ts

@@ -0,0 +1,3 @@
+import VkfRulesConfig from './src/index.vue';
+export { VkfRulesConfig, };
+export default VkfRulesConfig;

package/components/rules-config/index.js

@@ -0,0 +1,63 @@
+import { _VkfFormCtx, VkfForm } from '@vunk/form/components/form';
+import { defineComponent, computed, resolveComponent, openBlock, createBlock, mergeProps, toHandlers, withCtx, renderSlot } from 'vue';
+
+const props = {
+  ..._VkfFormCtx.props
+};
+const emits = {
+  ..._VkfFormCtx.emits
+};
+
+var script = defineComponent({
+  name: "VkfRulesConfig",
+  components: {
+    VkfForm
+  },
+  emits,
+  props,
+  setup(props2, { emit }) {
+    const bindProps = _VkfFormCtx.createBindProps(props2, ["formItems"]);
+    const onEmits = _VkfFormCtx.createOnEmits(emit);
+    const formItems = computed(() => {
+      const data = [
+        {
+          templateType: "VkfSwitch",
+          prop: "required",
+          label: "required"
+        }
+      ];
+      if (bindProps.value.data.required) {
+        data.push({
+          templateType: "VkfInput",
+          prop: "message",
+          label: "message"
+        });
+      }
+      return data;
+    });
+    return {
+      formItems,
+      bindProps,
+      onEmits
+    };
+  }
+});
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_VkfForm = resolveComponent("VkfForm");
+  return openBlock(), createBlock(_component_VkfForm, mergeProps({ formItems: _ctx.formItems }, _ctx.bindProps, toHandlers(_ctx.onEmits)), {
+    default: withCtx(() => [
+      renderSlot(_ctx.$slots, "default")
+    ]),
+    _: 3
+  }, 16, ["formItems"]);
+}
+
+script.render = render;
+script.__file = "rules-config/src/index.vue";
+
+script.install = (app) => {
+  app.component(script.name, script);
+};
+
+export { script as VkfRulesConfig, script as default };

package/components/rules-config/src/ctx.d.ts

@@ -0,0 +1,38 @@
+export declare const props: {
+    data: {
+        type: import("vue").PropType<Record<string, any>>;
+        default: () => {};
+    };
+    formItems: {
+        type: import("vue").PropType<any[]>;
+        default: () => never[];
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<import("element-plus").FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    scrollToError: BooleanConstructor;
+};
+export declare const emits: {
+    setData: (e: import("../../../shared/types").SetDataEvent<any>) => import("../../../shared/types").SetDataEvent<any>;
+    validate: null;
+};

package/components/rules-config/src/index.vue.d.ts

@@ -0,0 +1,113 @@
+import { FormItemRendererSource } from '@vunk/form/shared/types';
+import { FormItemRule } from 'element-plus';
+declare const _default: import("vue").DefineComponent<{
+    data: {
+        type: import("vue").PropType<Record<string, any>>;
+        default: () => {};
+    };
+    formItems: {
+        type: import("vue").PropType<any[]>;
+        default: () => never[];
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    scrollToError: BooleanConstructor;
+}, {
+    formItems: import("vue").ComputedRef<FormItemRendererSource<keyof FormItemRule>[]>;
+    bindProps: import("vue").ComputedRef<{
+        data: Record<string, any>;
+        model: Record<string, any> | undefined;
+        rules: Partial<Record<string, import("element-plus/es/utils").Arrayable<FormItemRule>>> | undefined;
+        labelPosition: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top", unknown>;
+        labelWidth: import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+        labelSuffix: string;
+        inline: boolean;
+        inlineMessage: boolean;
+        statusIcon: boolean;
+        showMessage: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+        size: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown> | undefined;
+        disabled: boolean;
+        validateOnRuleChange: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+        hideRequiredAsterisk: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+        scrollToError: boolean;
+    }>;
+    onEmits: {
+        validate: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: import("@vunk/form/shared/types").SetDataEvent<any>) => void);
+        setData: ((event: "validate", ...args: any[]) => void) & ((event: "setData", e: import("@vunk/form/shared/types").SetDataEvent<any>) => void);
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    setData: (e: import("@vunk/form/shared/types").SetDataEvent<any>) => import("@vunk/form/shared/types").SetDataEvent<any>;
+    validate: null;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: import("vue").PropType<Record<string, any>>;
+        default: () => {};
+    };
+    formItems: {
+        type: import("vue").PropType<any[]>;
+        default: () => never[];
+    };
+    model: ObjectConstructor;
+    rules: {
+        readonly type: import("vue").PropType<Partial<Record<string, import("element-plus/es/utils").Arrayable<FormItemRule>>>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    labelPosition: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "left" | "right" | "top", unknown, "right", boolean>;
+    labelWidth: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
+    labelSuffix: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    inline: BooleanConstructor;
+    inlineMessage: BooleanConstructor;
+    statusIcon: BooleanConstructor;
+    showMessage: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: {
+        readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    disabled: BooleanConstructor;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    scrollToError: BooleanConstructor;
+}>> & {
+    onValidate?: ((...args: any[]) => any) | undefined;
+    onSetData?: ((e: import("@vunk/form/shared/types").SetDataEvent<any>) => any) | undefined;
+}, {
+    data: Record<string, any>;
+    labelPosition: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "left" | "right" | "top", unknown>;
+    labelWidth: import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    labelSuffix: string;
+    inline: boolean;
+    inlineMessage: boolean;
+    statusIcon: boolean;
+    showMessage: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    disabled: boolean;
+    validateOnRuleChange: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    hideRequiredAsterisk: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    scrollToError: boolean;
+    formItems: any[];
+}>;
+export default _default;

package/components/select/index.d.ts

@@ -0,0 +1,4 @@
+import VkfSelect from './src/index.vue';
+export * as __VkfSelect from './src/types';
+export { VkfSelect, };
+export default VkfSelect;