@carefrees/form-utils-vue 0.0.8 → 0.0.9

package/esm/form/form.vue2.mjs

@@ -0,0 +1,4 @@
+import _sfc_main from "./form.vue.mjs";
+export {
+  _sfc_main as default
+};

package/esm/form/index.mjs

@@ -1,4 +1,4 @@
-import _sfc_main from "./index.vue.mjs";
+import _sfc_main from "./form.vue.mjs";
 import { withInstall } from "../utils/withInstall.mjs";
 const Form = withInstall(_sfc_main);
 export {

package/esm/formItem/form.Item.base.vue.mjs

@@ -11,7 +11,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/esm/formItem/form.hide.item.vue.mjs

@@ -10,7 +10,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/esm/formItem/formItem.vue.mjs

@@ -10,7 +10,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/esm/hooks/attr/attr.FormItem.d.ts

@@ -1,5 +1,6 @@
 import { FormInstanceBase, FormItemInstanceBase } from '@carefrees/form-utils';
 import { RegisterFormItemOptions } from './../register/register.FormItem';
+import { Ref } from 'vue';
 import { RuleInstanceBase2 } from '../../instance/ruleIntsnace';
 export interface FormItemAttrOptions extends RegisterFormItemOptions {
     /**依赖更新项*/
@@ -13,7 +14,7 @@ export interface FormItemAttrOptions extends RegisterFormItemOptions {
     /**是否保护值(不进行表单项组件卸载重置初始值)*/
     preserve?: boolean;
     /**重写规则*/
-    useRules?: (ruleInstance: RuleInstanceBase2, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => void;
+    useRules?: (ruleInstance: Ref<RuleInstanceBase2>, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => void;
     /**输入框属性重写*/
     useAttrs?: (attrs: any, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => any;
     /**输入框属性*/
@@ -38,7 +39,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
     onChange: (event: any) => void;
     formItemInstance: FormItemInstanceBase;
     form: FormInstanceBase<any>;
-    ruleInstance: import('vue').Ref<{
+    ruleInstance: Ref<{
         sort?: string | undefined;
         instance?: {
             formData: Partial<any>;
@@ -830,7 +831,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
         isPrototypeOf(v: Object): boolean;
         propertyIsEnumerable(v: PropertyKey): boolean;
     }>;
-    attrsLastData: import('vue').Ref<{
+    attrsLastData: Ref<{
         name: string;
         id: string;
         constructor: Function;
@@ -861,7 +862,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
         isPrototypeOf: (v: Object) => boolean;
         propertyIsEnumerable: (v: PropertyKey) => boolean;
     }>;
-    validateResult: import('vue').Ref<{
+    validateResult: Ref<{
         tip: string | (string | undefined)[];
         isInvalid: boolean;
     }, {

package/esm/hooks/attr/attr.FormItem.mjs

@@ -38,7 +38,7 @@ const useFormItemAttr = (options) => {
   formItemInstance.preserve = preserve;
   const oldValue = ref(get(form.formData, toValue(newName)));
   watch(() => [get(form.formData, toValue(newName)), toValue(newName)], () => {
-    oldValue.value = form.getFieldValue(newName.value);
+    oldValue.value = form.getFieldValue(toValue(newName));
   }, {
     immediate: true
   });
@@ -55,7 +55,7 @@ const useFormItemAttr = (options) => {
         value = formatValue(value, form, formItemInstance, event);
       }
       if (oldValue.value !== value) {
-        form.updatedFieldValue(newName.value, value, "validate");
+        form.updatedFieldValue(toValue(newName), value, "validate");
         (_a = formItemInstance.onAfterUpdate) == null ? void 0 : _a.call(formItemInstance, value, form, formItemInstance, event);
         if (Array.isArray(formItemInstance.noticeWatchField) && formItemInstance.noticeWatchField.length) {
           form.noticeWatch(formItemInstance.noticeWatchField);
@@ -90,16 +90,16 @@ const useFormItemAttr = (options) => {
   });
   const attrsLastData = ref(toValue(newAttrs));
   watch(() => [toValue(newAttrs), toValue(deepRefData), toValue(oldValue)], () => {
-    attrsLastData.value = (useAttrs == null ? void 0 : useAttrs(newAttrs.value, form, formItemInstance)) || newAttrs.value;
+    attrsLastData.value = (useAttrs == null ? void 0 : useAttrs(toValue(newAttrs), form, formItemInstance)) || toValue(newAttrs);
   }, {
     immediate: true
   });
-  const validateResult = ref(ruleInstance.value.getValidateResult());
+  const validateResult = ref(toValue(ruleInstance).getValidateResult());
   watch(() => [toValue(deepRefData), toValue(oldValue)], () => {
-    useRules == null ? void 0 : useRules(ruleInstance.value, form, formItemInstance);
+    useRules == null ? void 0 : useRules(ruleInstance, form, formItemInstance);
   });
-  watch(() => [ruleInstance.value.messages, ruleInstance.value.rules, toValue(oldValue)], () => {
-    validateResult.value = ruleInstance.value.getValidateResult();
+  watch(() => [toValue(ruleInstance).messages, toValue(ruleInstance).rules, toValue(oldValue)], () => {
+    validateResult.value = toValue(ruleInstance).getValidateResult();
   });
   return {
     valuePropName,

package/esm/hooks/register/register.FormHideItem.mjs

@@ -1,4 +1,4 @@
-import { ref, watch } from "vue";
+import { ref, watch, toValue } from "vue";
 import { FormHideItemInstanceBase } from "@carefrees/form-utils";
 import { useFormItemParentNameInject } from "../useFormItemParentName.mjs";
 import { useFormInject } from "../useForm.mjs";
@@ -10,7 +10,7 @@ const useRegisterFormHideItem = (options) => {
   const hideItemInstance = ref(new FormHideItemInstanceBase().ctor(newName.value));
   const isHide = ref(form.getFieldHideValue(newName.value));
   watch(
-    [isHide.value],
+    () => [toValue(isHide)],
     () => {
       hideItemInstance.value.preHideValue = isHide.value;
     },
@@ -21,15 +21,15 @@ const useRegisterFormHideItem = (options) => {
   };
   hideItemInstance.value.updatedItem = setValue;
   watch(
-    [form, newSort.value],
+    () => [form, toValue(newSort)],
     () => {
       hideItemInstance.value.instance = form;
-      hideItemInstance.value.sort = newSort.value;
+      hideItemInstance.value.sort = toValue(newSort);
     },
     { immediate: true }
   );
   useEffect(() => {
-    return form.registerFormHideItem(hideItemInstance.value);
+    return form.registerFormHideItem(toValue(hideItemInstance));
   });
   return { form, isHide };
 };

package/esm/hooks/register/register.FormItem.mjs

@@ -12,7 +12,7 @@ const useRegisterFormItem = (options) => {
   const ruleInstance = ref(new RuleInstanceBase2());
   const formItemInstance = useFormItem();
   watch(
-    [form],
+    () => [form],
     () => {
       ruleInstance.value.instance = form;
       formItemInstance.instance = form;
@@ -20,30 +20,30 @@ const useRegisterFormItem = (options) => {
     { immediate: true }
   );
   watch(
-    [newName.value],
+    () => [toValue(newName)],
     () => {
-      ruleInstance.value.ctor(newName.value, rules || []);
-      formItemInstance.ctor(newName.value, ruleInstance.value);
+      ruleInstance.value.ctor(toValue(newName), rules || []);
+      formItemInstance.ctor(toValue(newName), toValue(ruleInstance));
     },
     { immediate: true }
   );
   watch(
-    [newSort.value],
+    () => [toValue(newSort)],
     () => {
-      ruleInstance.value.sort = newSort.value;
-      formItemInstance.sort = newSort.value;
+      ruleInstance.value.sort = toValue(newSort);
+      formItemInstance.sort = toValue(newSort);
     },
     { immediate: true }
   );
   watch(
-    [parentItem.value],
+    () => [toValue(parentItem)],
     () => {
-      formItemInstance.parentDataField = toValue(parentItem.value.name);
+      formItemInstance.parentDataField = toValue(toValue(parentItem).name);
     },
     { immediate: true }
   );
   const updated = () => {
-    deepRefData.value = { a: (/* @__PURE__ */ new Date()).valueOf() };
+    deepRefData.value = { __temp: (/* @__PURE__ */ new Date()).valueOf() };
   };
   formItemInstance.updated = updated;
   ruleInstance.value.updated = updated;

package/esm/hooks/register/register.FormList.mjs

@@ -6,23 +6,23 @@ const useRegisterFormList = (options) => {
   const { ruleInstance, formItemInstance, form, newName, parentItem } = useRegisterFormItem(options);
   const formListInstance = useFormList();
   watch(
-    [newName.value],
+    () => [toValue(newName)],
     () => {
-      formListInstance.ctor(newName.value);
+      formListInstance.ctor(toValue(newName));
     },
     { immediate: true }
   );
   watch(
-    [form, formItemInstance, ruleInstance.value],
+    () => [form, formItemInstance, toValue(ruleInstance)],
     () => {
       formListInstance.instance = form;
       formListInstance.formItemInstance = formItemInstance;
-      formListInstance.rule = ruleInstance.value;
+      formListInstance.rule = toValue(ruleInstance);
     },
     { immediate: true }
   );
   watch(
-    [options.sort, parentItem.value],
+    () => [options.sort, toValue(parentItem)],
     () => {
       formListInstance.sort = toValue(parentItem.value.sort);
       formListInstance.parentDataField = toValue(parentItem.value.name);

package/esm/hooks/useAttrs.mjs

@@ -1,4 +1,4 @@
-import { inject, computed, toRefs, ref, provide, reactive } from "vue";
+import { inject, computed, ref, provide, reactive } from "vue";
 const attrsProvideSymbol = Symbol("carefrees-attrs");
 function useAttrsProvide(options) {
   const {
@@ -28,14 +28,12 @@ function useAttrsProvide(options) {
 function useAttrsInject() {
   const attrs = inject(
     attrsProvideSymbol,
-    computed(
-      () => toRefs({
-        colCount: 4,
-        errorLayout: "left-bottom",
-        labelMode: "top",
-        showColon: true
-      })
-    )
+    computed(() => ({
+      colCount: ref(4),
+      errorLayout: ref("left-bottom"),
+      labelMode: ref("top"),
+      showColon: ref(true)
+    }))
   );
   return attrs;
 }

package/esm/interface/index.d.ts

@@ -1,4 +1,4 @@
-import { ComputedRef, Ref, VNodeChild, StyleValue, UnwrapNestedRefs } from 'vue';
+import { ComputedRef, Ref, Component, StyleValue, UnwrapNestedRefs } from 'vue';
 import { FormItemAttrOptions } from '../hooks/attr/attr.FormItem';
 import { LayoutFormItemProps } from './layout.formItem';
 import { FormLayoutProps } from './layout';
@@ -11,7 +11,7 @@ export interface FormItemProps extends FormItemAttrOptions, LayoutFormItemProps
     /**不进行样式渲染*/
     noStyle?: boolean;
     /**输入框组件*/
-    input?: VNodeChild;
+    input?: Component | string;
 }
 export interface FormProps<T = any> extends FormLayoutProps {
     form?: FormInstanceBase;

package/lib/form/form.vue2.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const form_vue_vue_type_script_setup_true_lang = require("./form.vue.js");
+exports.default = form_vue_vue_type_script_setup_true_lang.default;

package/lib/form/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index_vue_vue_type_script_setup_true_lang = require("./index.vue.js");
+const form_vue_vue_type_script_setup_true_lang = require("./form.vue.js");
 const withInstall = require("../utils/withInstall.js");
-const Form = withInstall.withInstall(index_vue_vue_type_script_setup_true_lang.default);
+const Form = withInstall.withInstall(form_vue_vue_type_script_setup_true_lang.default);
 exports.Form = Form;

package/lib/formItem/form.Item.base.vue.js

@@ -13,7 +13,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/lib/formItem/form.hide.item.vue.js

@@ -12,7 +12,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/lib/formItem/formItem.vue.js

@@ -12,7 +12,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...__default__,
   props: {
     noStyle: { type: Boolean },
-    input: { type: [Object, String, Number, Boolean, null, Array] },
+    input: {},
     dependencies: {},
     noticeOnlyRuleDataField: {},
     isNoticeParentField: { type: Boolean },

package/lib/hooks/attr/attr.FormItem.d.ts

@@ -1,5 +1,6 @@
 import { FormInstanceBase, FormItemInstanceBase } from '@carefrees/form-utils';
 import { RegisterFormItemOptions } from './../register/register.FormItem';
+import { Ref } from 'vue';
 import { RuleInstanceBase2 } from '../../instance/ruleIntsnace';
 export interface FormItemAttrOptions extends RegisterFormItemOptions {
     /**依赖更新项*/
@@ -13,7 +14,7 @@ export interface FormItemAttrOptions extends RegisterFormItemOptions {
     /**是否保护值(不进行表单项组件卸载重置初始值)*/
     preserve?: boolean;
     /**重写规则*/
-    useRules?: (ruleInstance: RuleInstanceBase2, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => void;
+    useRules?: (ruleInstance: Ref<RuleInstanceBase2>, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => void;
     /**输入框属性重写*/
     useAttrs?: (attrs: any, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => any;
     /**输入框属性*/
@@ -38,7 +39,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
     onChange: (event: any) => void;
     formItemInstance: FormItemInstanceBase;
     form: FormInstanceBase<any>;
-    ruleInstance: import('vue').Ref<{
+    ruleInstance: Ref<{
         sort?: string | undefined;
         instance?: {
             formData: Partial<any>;
@@ -830,7 +831,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
         isPrototypeOf(v: Object): boolean;
         propertyIsEnumerable(v: PropertyKey): boolean;
     }>;
-    attrsLastData: import('vue').Ref<{
+    attrsLastData: Ref<{
         name: string;
         id: string;
         constructor: Function;
@@ -861,7 +862,7 @@ export declare const useFormItemAttr: (options: FormItemAttrOptions) => {
         isPrototypeOf: (v: Object) => boolean;
         propertyIsEnumerable: (v: PropertyKey) => boolean;
     }>;
-    validateResult: import('vue').Ref<{
+    validateResult: Ref<{
         tip: string | (string | undefined)[];
         isInvalid: boolean;
     }, {

package/lib/hooks/attr/attr.FormItem.js

@@ -40,7 +40,7 @@ const useFormItemAttr = (options) => {
   formItemInstance.preserve = preserve;
   const oldValue = vue.ref(formUtils.get(form.formData, vue.toValue(newName)));
   vue.watch(() => [formUtils.get(form.formData, vue.toValue(newName)), vue.toValue(newName)], () => {
-    oldValue.value = form.getFieldValue(newName.value);
+    oldValue.value = form.getFieldValue(vue.toValue(newName));
   }, {
     immediate: true
   });
@@ -57,7 +57,7 @@ const useFormItemAttr = (options) => {
         value = formatValue(value, form, formItemInstance, event);
       }
       if (oldValue.value !== value) {
-        form.updatedFieldValue(newName.value, value, "validate");
+        form.updatedFieldValue(vue.toValue(newName), value, "validate");
         (_a = formItemInstance.onAfterUpdate) == null ? void 0 : _a.call(formItemInstance, value, form, formItemInstance, event);
         if (Array.isArray(formItemInstance.noticeWatchField) && formItemInstance.noticeWatchField.length) {
           form.noticeWatch(formItemInstance.noticeWatchField);
@@ -92,16 +92,16 @@ const useFormItemAttr = (options) => {
   });
   const attrsLastData = vue.ref(vue.toValue(newAttrs));
   vue.watch(() => [vue.toValue(newAttrs), vue.toValue(deepRefData), vue.toValue(oldValue)], () => {
-    attrsLastData.value = (useAttrs == null ? void 0 : useAttrs(newAttrs.value, form, formItemInstance)) || newAttrs.value;
+    attrsLastData.value = (useAttrs == null ? void 0 : useAttrs(vue.toValue(newAttrs), form, formItemInstance)) || vue.toValue(newAttrs);
   }, {
     immediate: true
   });
-  const validateResult = vue.ref(ruleInstance.value.getValidateResult());
+  const validateResult = vue.ref(vue.toValue(ruleInstance).getValidateResult());
   vue.watch(() => [vue.toValue(deepRefData), vue.toValue(oldValue)], () => {
-    useRules == null ? void 0 : useRules(ruleInstance.value, form, formItemInstance);
+    useRules == null ? void 0 : useRules(ruleInstance, form, formItemInstance);
   });
-  vue.watch(() => [ruleInstance.value.messages, ruleInstance.value.rules, vue.toValue(oldValue)], () => {
-    validateResult.value = ruleInstance.value.getValidateResult();
+  vue.watch(() => [vue.toValue(ruleInstance).messages, vue.toValue(ruleInstance).rules, vue.toValue(oldValue)], () => {
+    validateResult.value = vue.toValue(ruleInstance).getValidateResult();
   });
   return {
     valuePropName,

package/lib/hooks/register/register.FormHideItem.js

@@ -12,7 +12,7 @@ const useRegisterFormHideItem = (options) => {
   const hideItemInstance = vue.ref(new formUtils.FormHideItemInstanceBase().ctor(newName.value));
   const isHide = vue.ref(form.getFieldHideValue(newName.value));
   vue.watch(
-    [isHide.value],
+    () => [vue.toValue(isHide)],
     () => {
       hideItemInstance.value.preHideValue = isHide.value;
     },
@@ -23,15 +23,15 @@ const useRegisterFormHideItem = (options) => {
   };
   hideItemInstance.value.updatedItem = setValue;
   vue.watch(
-    [form, newSort.value],
+    () => [form, vue.toValue(newSort)],
     () => {
       hideItemInstance.value.instance = form;
-      hideItemInstance.value.sort = newSort.value;
+      hideItemInstance.value.sort = vue.toValue(newSort);
     },
     { immediate: true }
   );
   useEffect.useEffect(() => {
-    return form.registerFormHideItem(hideItemInstance.value);
+    return form.registerFormHideItem(vue.toValue(hideItemInstance));
   });
   return { form, isHide };
 };

package/lib/hooks/register/register.FormItem.js

@@ -14,7 +14,7 @@ const useRegisterFormItem = (options) => {
   const ruleInstance = vue.ref(new ruleIntsnace.RuleInstanceBase2());
   const formItemInstance = useFormItem.useFormItem();
   vue.watch(
-    [form],
+    () => [form],
     () => {
       ruleInstance.value.instance = form;
       formItemInstance.instance = form;
@@ -22,30 +22,30 @@ const useRegisterFormItem = (options) => {
     { immediate: true }
   );
   vue.watch(
-    [newName.value],
+    () => [vue.toValue(newName)],
     () => {
-      ruleInstance.value.ctor(newName.value, rules || []);
-      formItemInstance.ctor(newName.value, ruleInstance.value);
+      ruleInstance.value.ctor(vue.toValue(newName), rules || []);
+      formItemInstance.ctor(vue.toValue(newName), vue.toValue(ruleInstance));
     },
     { immediate: true }
   );
   vue.watch(
-    [newSort.value],
+    () => [vue.toValue(newSort)],
     () => {
-      ruleInstance.value.sort = newSort.value;
-      formItemInstance.sort = newSort.value;
+      ruleInstance.value.sort = vue.toValue(newSort);
+      formItemInstance.sort = vue.toValue(newSort);
     },
     { immediate: true }
   );
   vue.watch(
-    [parentItem.value],
+    () => [vue.toValue(parentItem)],
     () => {
-      formItemInstance.parentDataField = vue.toValue(parentItem.value.name);
+      formItemInstance.parentDataField = vue.toValue(vue.toValue(parentItem).name);
     },
     { immediate: true }
   );
   const updated = () => {
-    deepRefData.value = { a: (/* @__PURE__ */ new Date()).valueOf() };
+    deepRefData.value = { __temp: (/* @__PURE__ */ new Date()).valueOf() };
   };
   formItemInstance.updated = updated;
   ruleInstance.value.updated = updated;

package/lib/hooks/register/register.FormList.js

@@ -8,23 +8,23 @@ const useRegisterFormList = (options) => {
   const { ruleInstance, formItemInstance, form, newName, parentItem } = register_FormItem.useRegisterFormItem(options);
   const formListInstance = useFormList.useFormList();
   vue.watch(
-    [newName.value],
+    () => [vue.toValue(newName)],
     () => {
-      formListInstance.ctor(newName.value);
+      formListInstance.ctor(vue.toValue(newName));
     },
     { immediate: true }
   );
   vue.watch(
-    [form, formItemInstance, ruleInstance.value],
+    () => [form, formItemInstance, vue.toValue(ruleInstance)],
     () => {
       formListInstance.instance = form;
       formListInstance.formItemInstance = formItemInstance;
-      formListInstance.rule = ruleInstance.value;
+      formListInstance.rule = vue.toValue(ruleInstance);
     },
     { immediate: true }
   );
   vue.watch(
-    [options.sort, parentItem.value],
+    () => [options.sort, vue.toValue(parentItem)],
     () => {
       formListInstance.sort = vue.toValue(parentItem.value.sort);
       formListInstance.parentDataField = vue.toValue(parentItem.value.name);

package/lib/hooks/useAttrs.js

@@ -30,14 +30,12 @@ function useAttrsProvide(options) {
 function useAttrsInject() {
   const attrs = vue.inject(
     attrsProvideSymbol,
-    vue.computed(
-      () => vue.toRefs({
-        colCount: 4,
-        errorLayout: "left-bottom",
-        labelMode: "top",
-        showColon: true
-      })
-    )
+    vue.computed(() => ({
+      colCount: vue.ref(4),
+      errorLayout: vue.ref("left-bottom"),
+      labelMode: vue.ref("top"),
+      showColon: vue.ref(true)
+    }))
   );
   return attrs;
 }

package/lib/interface/index.d.ts

@@ -1,4 +1,4 @@
-import { ComputedRef, Ref, VNodeChild, StyleValue, UnwrapNestedRefs } from 'vue';
+import { ComputedRef, Ref, Component, StyleValue, UnwrapNestedRefs } from 'vue';
 import { FormItemAttrOptions } from '../hooks/attr/attr.FormItem';
 import { LayoutFormItemProps } from './layout.formItem';
 import { FormLayoutProps } from './layout';
@@ -11,7 +11,7 @@ export interface FormItemProps extends FormItemAttrOptions, LayoutFormItemProps
     /**不进行样式渲染*/
     noStyle?: boolean;
     /**输入框组件*/
-    input?: VNodeChild;
+    input?: Component | string;
 }
 export interface FormProps<T = any> extends FormLayoutProps {
     form?: FormInstanceBase;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carefrees/form-utils-vue",
   "author": "SunLxy <1011771396@qq.com>",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "",
   "main": "lib/index.js",
   "module": "esm/index.mjs",
@@ -26,8 +26,8 @@
     "vue": "^3.5.13"
   },
   "dependencies": {
+    "@carefrees/form-utils": "^0.0.9",
     "async-validator": "~4.2.5",
-    "@carefrees/form-utils": "^0.0.8",
     "classnames": "2.5.1"
   }
-}
+}

package/src/form/{index.vue → form.vue}

@@ -11,7 +11,7 @@
 import { computed, defineProps, withDefaults, reactive, defineEmits } from "vue"
 import type { FormProps } from "../interface/index"
 import { useRegisterForm } from "../hooks/register/register.form"
-import { useForm, useFormProvide } from "./../hooks/useForm"
+import { useForm, useFormProvide } from "../hooks/useForm"
 import FormLayout from "../layout/layout.vue"
 import clx from 'classnames';
 

package/src/form/index.ts

@@ -1,3 +1,3 @@
-import _Form from './index.vue';
+import _Form from './form.vue';
 import { withInstall } from '../utils';
 export const Form = withInstall(_Form);

package/src/hooks/attr/attr.FormItem.tsx

@@ -1,7 +1,7 @@
 import { FormInstanceBase, FormItemInstanceBase, get } from '@carefrees/form-utils';
 import { useHtmlFor } from './../useHtmlFor';
 import { useRegisterFormItem, RegisterFormItemOptions } from './../register/register.FormItem';
-import { computed, ref, toValue, watch } from 'vue';
+import { computed, Ref, ref, toValue, watch } from 'vue';
 import type { RuleInstanceBase2 } from '../../instance/ruleIntsnace';
 
 export interface FormItemAttrOptions extends RegisterFormItemOptions {
@@ -16,7 +16,11 @@ export interface FormItemAttrOptions extends RegisterFormItemOptions {
   /**是否保护值(不进行表单项组件卸载重置初始值)*/
   preserve?: boolean;
   /**重写规则*/
-  useRules?: (ruleInstance: RuleInstanceBase2, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => void;
+  useRules?: (
+    ruleInstance: Ref<RuleInstanceBase2>,
+    form: FormInstanceBase,
+    formItemInstance: FormItemInstanceBase,
+  ) => void;
   /**输入框属性重写*/
   useAttrs?: (attrs: any, form: FormInstanceBase, formItemInstance: FormItemInstanceBase) => any;
   /**输入框属性*/
@@ -67,7 +71,7 @@ export const useFormItemAttr = (options: FormItemAttrOptions) => {
   watch(
     () => [get(form.formData, toValue(newName)), toValue(newName)],
     () => {
-      oldValue.value = form.getFieldValue(newName.value);
+      oldValue.value = form.getFieldValue(toValue(newName));
     },
     { immediate: true },
   );
@@ -84,7 +88,7 @@ export const useFormItemAttr = (options: FormItemAttrOptions) => {
         value = formatValue(value, form, formItemInstance, event);
       }
       if (oldValue.value !== value) {
-        form.updatedFieldValue(newName.value, value, 'validate');
+        form.updatedFieldValue(toValue(newName), value, 'validate');
         formItemInstance.onAfterUpdate?.(value, form, formItemInstance, event);
         if (Array.isArray(formItemInstance.noticeWatchField) && formItemInstance.noticeWatchField.length) {
           form.noticeWatch(formItemInstance.noticeWatchField);
@@ -132,25 +136,25 @@ export const useFormItemAttr = (options: FormItemAttrOptions) => {
   watch(
     () => [toValue(newAttrs), toValue(deepRefData), toValue(oldValue)],
     () => {
-      attrsLastData.value = useAttrs?.(newAttrs.value, form, formItemInstance) || newAttrs.value;
+      attrsLastData.value = useAttrs?.(toValue(newAttrs), form, formItemInstance) || toValue(newAttrs);
     },
     { immediate: true },
   );
 
   /**规则处理**/
-  const validateResult = ref(ruleInstance.value.getValidateResult());
+  const validateResult = ref(toValue(ruleInstance).getValidateResult());
 
   watch(
     () => [toValue(deepRefData), toValue(oldValue)],
     () => {
-      useRules?.(ruleInstance.value as any, form, formItemInstance);
+      useRules?.(ruleInstance as any, form, formItemInstance);
     },
   );
 
   watch(
-    () => [ruleInstance.value.messages, ruleInstance.value.rules, toValue(oldValue)],
+    () => [toValue(ruleInstance).messages, toValue(ruleInstance).rules, toValue(oldValue)],
     () => {
-      validateResult.value = ruleInstance.value.getValidateResult();
+      validateResult.value = toValue(ruleInstance).getValidateResult();
     },
   );
 

package/src/hooks/register/register.FormHideItem.ts

@@ -1,4 +1,4 @@
-import { ref, watch } from 'vue';
+import { ref, toValue, watch } from 'vue';
 import { RegisterFormItemOptions } from './register.FormItem';
 import { FormHideItemInstanceBase } from '@carefrees/form-utils';
 import { useFormItemParentNameInject } from '../useFormItemParentName';
@@ -15,7 +15,7 @@ export const useRegisterFormHideItem = (options: RegisterFormHideItemOptions) =>
   const hideItemInstance = ref<FormHideItemInstanceBase>(new FormHideItemInstanceBase().ctor(newName.value));
   const isHide = ref(form.getFieldHideValue(newName.value));
   watch(
-    [isHide.value],
+    () => [toValue(isHide)],
     () => {
       hideItemInstance.value.preHideValue = isHide.value;
     },
@@ -29,16 +29,16 @@ export const useRegisterFormHideItem = (options: RegisterFormHideItemOptions) =>
   hideItemInstance.value.updatedItem = setValue;
 
   watch(
-    [form, newSort.value],
+    () => [form, toValue(newSort)],
     () => {
       hideItemInstance.value.instance = form;
-      hideItemInstance.value.sort = newSort.value;
+      hideItemInstance.value.sort = toValue(newSort);
     },
     { immediate: true },
   );
 
   useEffect(() => {
-    return form.registerFormHideItem(hideItemInstance.value as FormHideItemInstanceBase);
+    return form.registerFormHideItem(toValue(hideItemInstance) as FormHideItemInstanceBase);
   });
 
   return { form, isHide };

package/src/hooks/register/register.FormItem.ts

@@ -33,7 +33,7 @@ export const useRegisterFormItem = (options: RegisterFormItemOptions) => {
   const formItemInstance = useFormItem();
 
   watch(
-    [form],
+    () => [form],
     () => {
       ruleInstance.value.instance = form;
       formItemInstance.instance = form;
@@ -42,33 +42,33 @@ export const useRegisterFormItem = (options: RegisterFormItemOptions) => {
   );
 
   watch(
-    [newName.value],
+    () => [toValue(newName)],
     () => {
-      ruleInstance.value.ctor(newName.value, rules || []);
-      formItemInstance.ctor(newName.value, ruleInstance.value as any);
+      ruleInstance.value.ctor(toValue(newName), rules || []);
+      formItemInstance.ctor(toValue(newName), toValue(ruleInstance) as any);
     },
     { immediate: true },
   );
 
   watch(
-    [newSort.value],
+    () => [toValue(newSort)],
     () => {
-      ruleInstance.value.sort = newSort.value;
-      formItemInstance.sort = newSort.value;
+      ruleInstance.value.sort = toValue(newSort);
+      formItemInstance.sort = toValue(newSort);
     },
     { immediate: true },
   );
 
   watch(
-    [parentItem.value],
+    () => [toValue(parentItem)],
     () => {
-      formItemInstance.parentDataField = toValue(parentItem.value.name);
+      formItemInstance.parentDataField = toValue(toValue(parentItem).name);
     },
     { immediate: true },
   );
 
   const updated = () => {
-    deepRefData.value = { a: new Date().valueOf() };
+    deepRefData.value = { __temp: new Date().valueOf() };
   };
 
   formItemInstance.updated = updated;

package/src/hooks/register/register.FormList.ts

@@ -11,25 +11,25 @@ export const useRegisterFormList = (options: RegisterFormListOptions) => {
   const formListInstance = useFormList();
 
   watch(
-    [newName.value],
+    () => [toValue(newName)],
     () => {
-      formListInstance.ctor(newName.value);
+      formListInstance.ctor(toValue(newName));
     },
     { immediate: true },
   );
 
   watch(
-    [form, formItemInstance, ruleInstance.value],
+    () => [form, formItemInstance, toValue(ruleInstance)],
     () => {
       formListInstance.instance = form;
       formListInstance.formItemInstance = formItemInstance;
-      formListInstance.rule = ruleInstance.value as any;
+      formListInstance.rule = toValue(ruleInstance) as any;
     },
     { immediate: true },
   );
 
   watch(
-    [options.sort, parentItem.value],
+    () => [options.sort, toValue(parentItem)],
     () => {
       formListInstance.sort = toValue(parentItem.value.sort);
       formListInstance.parentDataField = toValue(parentItem.value.name);

package/src/hooks/useAttrs.ts

@@ -53,14 +53,12 @@ export function useAttrsProvide(options: AttrsOptions) {
 export function useAttrsInject() {
   const attrs = inject<ComputedRef<AttrsOptions>>(
     attrsProvideSymbol,
-    computed(() =>
-      toRefs({
-        colCount: 4,
-        errorLayout: 'left-bottom',
-        labelMode: 'top',
-        showColon: true,
-      }),
-    ),
+    computed(() => ({
+      colCount: ref(4),
+      errorLayout: ref('left-bottom'),
+      labelMode: ref('top'),
+      showColon: ref(true),
+    })),
   );
   return attrs;
 }

package/src/interface/index.ts

@@ -1,4 +1,4 @@
-import { ComputedRef, Ref, VNodeChild, StyleValue, UnwrapNestedRefs } from 'vue';
+import { ComputedRef, Ref, VNode, Component, StyleValue, UnwrapNestedRefs } from 'vue';
 import { FormItemAttrOptions } from '../hooks/attr/attr.FormItem';
 import { LayoutFormItemProps } from './layout.formItem';
 import { FormLayoutProps } from './layout';
@@ -14,7 +14,7 @@ export interface FormItemProps extends FormItemAttrOptions, LayoutFormItemProps
   /**不进行样式渲染*/
   noStyle?: boolean;
   /**输入框组件*/
-  input?: VNodeChild;
+  input?: Component | string;
 }
 
 export interface FormProps<T = any> extends FormLayoutProps {

package/src/layout/layout.formItem.vue

@@ -47,7 +47,7 @@
 
 <script lang="ts" setup>
 import clx from 'classnames';
-import { defineProps, withDefaults, toValue, computed, StyleValue, watch } from "vue"
+import { defineProps, withDefaults, toValue, computed, StyleValue } from "vue"
 import type { LayoutFormItemProps } from "../interface/layout.formItem"
 import { useAttrsInject } from "../hooks/useAttrs"
 const preCls = 'carefrees-form-item';

package/esm/form/index.vue2.mjs

@@ -1,4 +0,0 @@
-import _sfc_main from "./index.vue.mjs";
-export {
-  _sfc_main as default
-};

package/lib/form/index.vue2.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const index_vue_vue_type_script_setup_true_lang = require("./index.vue.js");
-exports.default = index_vue_vue_type_script_setup_true_lang.default;