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

package/package.json

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

package/src/packages/components/Alert/alert.scss

@@ -4,6 +4,7 @@
   border-radius: plv(box-size-normal-border-radius);
   position: relative;
   padding: 8px 16px;
+  line-height: initial;
 
   .alert-label {
     font-size: plv(font-size-small);
@@ -23,7 +24,7 @@
       position: absolute;
       width: $icon-width-normal;
       left: 0;
-      top: 0.15em;
+      top: 0.075em;
       padding-top: inherit;
       display: inline-flex;
       align-items: center;

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!}/>}