@carefrees/form-utils-vue 0.0.13 → 0.0.15

package/README.md

@@ -6,6 +6,12 @@
 npm install @carefrees/form-utils-vue # yarn add @carefrees/form-utils-vue # pnpm add @carefrees/form-utils-vue
 ```
 
+## 加载样式
+
+```tsx
+import '@carefrees/form-utils-vue/assets/index.css';
+```
+
 ## 使用
 
 ### 基本使用
@@ -15,7 +21,6 @@ npm install @carefrees/form-utils-vue # yarn add @carefrees/form-utils-vue # pnp
 import { ref } from "vue";
 import { Form, useForm, FormItem } from "@carefrees/form-utils-vue";
 import "@carefrees/form-utils-vue/assets/index.css"
-import Input from './Input.vue';
 const formData = ref<{ a: string, b: string }>({
   a: '',
   b: ''
@@ -61,12 +66,9 @@ const onUpdateRules = () => {
   rules2.value = [{ required: false, message: "不必填" }]
 }
 
-const onValuesChange = (...rest: any[]) => {
-  console.log(rest)
-}
 </script>
 <template>
-  <Form @valuesChange='onValuesChange' :formData='formData' :form='form'>
+  <Form  :formData='formData' :form='form'>
     <FormItem label='内容' input='input' name='a' :rules='rules1' />
     <FormItem :input='Input' name='b' :rules='rules2'>
       <template #label>
@@ -79,7 +81,6 @@ const onValuesChange = (...rest: any[]) => {
         <span>extra</span>
       </template>
     </FormItem>
-    <FormItem label='Input' input='input' name='c' />
     <FormItem name='d'>
       <template #label>
         <span>d</span>

package/assets/index.css

@@ -98,7 +98,9 @@ html.dark .carefrees-form {
   gap: 8px;
 }
 .carefrees-form-item-container.left .carefrees-form-item-label-warp {
-  text-align: right;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
 }
 .carefrees-form-item-container.between {
   gap: 8px;
@@ -182,7 +184,7 @@ html.dark .carefrees-form {
   top: auto;
   left: 0;
   right: 0;
-  bottom: -16px;
+  bottom: -20px;
   padding-top: 2px;
   font-size: 12px;
   box-sizing: border-box;
@@ -197,18 +199,18 @@ html.dark .carefrees-form {
   top: auto;
   left: 0;
   right: 0;
-  bottom: -16px;
+  bottom: -20px;
 }
 .carefrees-form-item-body-error.top-left {
   justify-content: start;
-  top: -16px;
+  top: -20px;
   left: 0px;
   right: 0px;
   bottom: auto;
 }
 .carefrees-form-item-body-error.top-right {
   justify-content: flex-end;
-  top: -16px;
+  top: -20px;
   left: 0px;
   right: 0px;
   bottom: auto;

package/esm/form/form.js

@@ -29,7 +29,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]
         },
         formData: {},
-        onValuesChange: {},
         onFinish: {},
         onFinishFailed: {},
         hideData: {},
@@ -98,7 +97,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     ],
     setup (__props, { emit: __emit }) {
         const props = __props;
-        const { form, style, formData, hideData, name, onFinish, onFinishFailed, onValuesChange, layoutStyle, layoutClass, bgcolor, ...rest } = props;
+        const { form, style, formData, hideData, name, onFinish, onFinishFailed, layoutStyle, layoutClass, bgcolor, ...rest } = props;
         const cls = computed(()=>classnames("carefrees-form", props.class));
         const formStyle = computed(()=>{
             if (bgcolor) return [
@@ -124,9 +123,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         formInstance.value.onFinish = (...rest2)=>{
             emits("finish", ...rest2);
         };
-        formInstance.value.onValuesChange = (...rest2)=>{
-            emits("valuesChange", ...rest2);
-        };
         formInstance.value.onFinishFailed = (...rest2)=>{
             emits("finishFailed", ...rest2);
         };
@@ -136,7 +132,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             event?.stopPropagation?.();
             formInstance.value.submit?.();
         };
-        useFormProvide(formInstance.value);
+        useFormProvide(formInstance);
         return (_ctx, _cache)=>(openBlock(), createElementBlock("form", {
                 class: normalizeClass(cls.value),
                 style: normalizeStyle(formStyle.value),

package/esm/index.js

@@ -4,10 +4,10 @@ export * from "./utils/index.js";
 export * from "./interface/index.js";
 export * from "./interface/layout.js";
 export * from "./interface/layout.formItem.js";
-import * as __WEBPACK_EXTERNAL_MODULE__component_js_7f599402__ from "./component.js";
+import * as __rspack_external__component_js_7f599402 from "./component.js";
 const src = {
     install: (app)=>{
-        for(const c in __WEBPACK_EXTERNAL_MODULE__component_js_7f599402__)app.use(__WEBPACK_EXTERNAL_MODULE__component_js_7f599402__[c]);
+        for(const c in __rspack_external__component_js_7f599402)app.use(__rspack_external__component_js_7f599402[c]);
     }
 };
 export { src as default };

package/esm/interface/index.d.ts

@@ -1,4 +1,4 @@
-import { Component, StyleValue, UnwrapNestedRefs } from 'vue';
+import { Component, StyleValue } from 'vue';
 import { LayoutFormItemProps } from './layout.formItem';
 import { FormLayoutProps } from './layout';
 import type { FormInstanceBase, ValidateErrorEntity, FormItemAttrOptions } from '@carefrees/form-utils-vue-hooks';
@@ -16,8 +16,6 @@ export interface FormProps<T = any> extends FormLayoutProps {
     layoutStyle?: StyleValue;
     /**表单数据*/
     formData?: Object;
-    /**值更新触发*/
-    onValuesChange?: (changedValues: Partial<T>, values: UnwrapNestedRefs<T>) => void;
     /**提交保存 验证成功*/
     onFinish?: (values: T) => void;
     /**提交保存 验证失败*/

package/esm/layout/layout.js

@@ -121,7 +121,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, [
                 isExtra.value || isTitle.value ? (openBlock(), createElementBlock("div", {
                     key: 0,
-                    style: normalizeStyle(_ctx.headerStyle),
+                    style: normalizeStyle(__props.headerStyle),
                     class: normalizeClass(headerCls.value)
                 }, [
                     createElementVNode("div", {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carefrees/form-utils-vue",
   "author": "SunLxy <1011771396@qq.com>",
-  "version": "0.0.13",
+  "version": "0.0.15",
   "description": "",
   "main": "esm/index.js",
   "module": "esm/index.js",
@@ -13,6 +13,10 @@
   "publishConfig": {
     "access": "public"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/SunLxy/carefrees-form-utils.git"
+  },
   "files": [
     "assets",
     "src",
@@ -24,9 +28,9 @@
     "vue": "^3.5.13"
   },
   "dependencies": {
-    "@carefrees/form-utils": "^0.0.13",
-    "@carefrees/form-utils-vue-hooks": "^0.0.13",
+    "@carefrees/form-utils": "^0.0.15",
+    "@carefrees/form-utils-vue-hooks": "^0.0.15",
     "async-validator": "~4.2.5",
     "classnames": "2.5.1"
   }
-}
+}

package/src/form/form.vue

@@ -29,7 +29,6 @@ const {
   name,
   onFinish,
   onFinishFailed,
-  onValuesChange,
   layoutStyle,
   layoutClass,
   bgcolor,
@@ -61,20 +60,17 @@ const emits = defineEmits(["finish", 'valuesChange', 'finishFailed'])
 formInstance.value.onFinish = (...rest) => {
   emits("finish", ...rest)
 };
-formInstance.value.onValuesChange = (...rest) => {
-  emits("valuesChange", ...rest)
-};
+
 formInstance.value.onFinishFailed = (...rest) => {
   emits("finishFailed", ...rest)
 };
 useRegisterForm(formInstance, props.name)
-
 const onSubmit = (event: Event) => {
   event?.preventDefault?.();
   event?.stopPropagation?.();
   formInstance.value.submit?.();
 }
 
-useFormProvide(formInstance.value);
+useFormProvide(formInstance);
 
 </script>

package/src/interface/index.ts

@@ -1,4 +1,4 @@
-import { Component, StyleValue, UnwrapNestedRefs } from 'vue';
+import { Component, StyleValue } from 'vue';
 import { LayoutFormItemProps } from './layout.formItem';
 import { FormLayoutProps } from './layout';
 import type { FormInstanceBase, ValidateErrorEntity, FormItemAttrOptions } from '@carefrees/form-utils-vue-hooks';
@@ -18,8 +18,6 @@ export interface FormProps<T = any> extends FormLayoutProps {
   layoutStyle?: StyleValue;
   /**表单数据*/
   formData?: Object;
-  /**值更新触发*/
-  onValuesChange?: (changedValues: Partial<T>, values: UnwrapNestedRefs<T>) => void;
   /**提交保存 验证成功*/
   onFinish?: (values: T) => void;
   /**提交保存 验证失败*/