plain-design 1.0.0-beta.97 → 1.0.0-beta.98

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plain-design",
-  "version": "1.0.0-beta.97",
+  "version": "1.0.0-beta.98",
   "description": "",
   "main": "dist/plain-design.min.js",
   "module": "dist/plain-design.commonjs.min.js",

package/src/packages/components/Form/layout/useFormLayout.tsx

@@ -70,6 +70,7 @@ export const FormItemLayoutPropsOption = {
   singleColumnContentWidth: { type: Number },                                         // 单列的时候form item content的宽度
   colon: { type: Boolean as PropType<boolean | null>, default: null },                // label的冒号
   validateMessagePosition: { type: String as PropType<typeof FormValidateMessagePosition.TYPE> }, // 校验消息的位置
+  negativeInnerMarginTop: { type: Boolean },                                          // inner节点启用负的marginTop值
 } as const;
 
 /**
@@ -287,6 +288,10 @@ export const useFormLayout = (() => {
       }
     });
 
+    const contentInnerStyles = useStyles(style => {
+      if (props.negativeInnerMarginTop) {style.marginTop = `-${form.rowGutter.value}px`;}
+    });
+
     const refer = {
       colon,
       labelAlign,
@@ -294,6 +299,7 @@ export const useFormLayout = (() => {
       styles,
       labelStyles,
       contentStyles,
+      contentInnerStyles,
       form,
       validateMessagePosition,
     };

package/src/packages/components/FormItem/index.tsx

@@ -108,7 +108,7 @@ export const FormItem = designComponent({
           )}
           <div className="form-item-content box-message-reference" style={formItemLayout.contentStyles.value}>
             {slots.prepend.isExist() && <div className="form-item-prepend-content">{slots.prepend()}</div>}
-            <div className="form-item-content-inner">
+            <div className="form-item-content-inner" style={formItemLayout.contentInnerStyles.value}>
               <Fragment key="slot_default">{slots.default()}</Fragment>
               {/*校验消息放下边的时候放在 form-item-content-inner 内部使得与输入框左或者右对齐*/}
               {formItemLayout.validateMessagePosition.value !== 'right' && <FormItemValidateMessage message={formItemValidation.validateMessage.value!}/>}