refactor(form): [form] refactor form style

examples/sites/demos/apis/form.js

@@ -44,11 +44,10 @@ export default {
         {
           name: 'hide-required-asterisk',
           type: 'boolean',
-          defaultValue: 'false',
+          defaultValue: 'true',
           desc: {
-            'zh-CN': '是否隐藏必填字段的标签旁边的红色星号，SMB 主题下默认值为true',
-            'en-US':
-              'Whether to hide the red asterisk next to the label of mandatory fields, The default value for SMB theme is true'
+            'zh-CN': '是否隐藏必填字段的标签旁边的红色星号',
+            'en-US': 'Whether to hide the red asterisk next to the label of mandatory fields'
           },
           mode: ['pc', 'mobile-first'],
           pcDemo: 'smb-required',
@@ -120,7 +119,7 @@ export default {
         {
           name: 'label-width',
           type: 'string',
-          defaultValue: "'80px'",
+          defaultValue: "'84px'",
           desc: {
             'zh-CN': '表单中标签占位宽度',
             'en-US': 'Label placeholder width in the form'
@@ -132,11 +131,11 @@ export default {
         },
         {
           name: 'message-type',
-          type: "'inline' | 'block'",
-          defaultValue: '',
+          type: "'inline' | 'block' | 'absolute'",
+          defaultValue: "'block'",
           desc: {
             'zh-CN':
-              '当 validate-type 设置为 text 时，配置文本类型错误类型，可配置行内或者块级，不设置则为 absolute 定位',
+              '当 validate-type 设置为 text 时，配置文本类型错误类型，可配置行内或者块级，其他值都为 absolute 定位',
             'en-US':
               'Configure the text type error type, which can be configured at the inline or block level when validate-type is set to text. The default is absolute positioning'
           },

packages/design/aurora/src/form/index.ts

@@ -1,6 +1,11 @@
 export default {
+  icons: {
+    validateIcon: ''
+  },
   state: {
     labelWidth: '100px',
     tooltipType: 'error'
-  }
+  },
+  hideRequiredAsterisk: false,
+  messageType: ''
 }

packages/design/saas/src/form/index.ts

@@ -1,6 +1,11 @@
 export default {
+  icons: {
+    validateIcon: ''
+  },
   state: {
     labelWidth: '100px',
     tooltipType: 'error'
-  }
+  },
+  hideRequiredAsterisk: false,
+  messageType: ''
 }

packages/design/smb/index.ts

@@ -4,7 +4,6 @@ import Popconfirm from './src/popconfirm'
 import Drawer from './src/drawer'
 import Dropdown from './src/dropdown'
 import DropdownItem from './src/dropdown-item'
-import Form from './src/form'
 import FilterBox from './src/filter-box'
 import Grid from './src/grid'
 import Guide from './src/guide'
@@ -30,7 +29,6 @@ export default {
     Drawer,
     Dropdown,
     DropdownItem,
-    Form,
     FilterBox,
     Grid,
     Guide,

packages/renderless/src/form/index.ts

@@ -47,13 +47,13 @@ export const computedAutoLabelWidth =
 export const computedHideRequiredAsterisk =
   ({ props, designConfig }: Pick<IFormRenderlessParams, 'props' | 'designConfig'>) =>
   (): boolean => {
-    return props.hideRequiredAsterisk ?? designConfig?.hideRequiredAsterisk ?? false
+    return props.hideRequiredAsterisk ?? designConfig?.hideRequiredAsterisk ?? true
   }
 
 export const computedValidateIcon =
   ({ props, designConfig }: Pick<IFormRenderlessParams, 'props' | 'designConfig'>) =>
   (): object | null => {
-    return props.validateIcon ?? designConfig?.icons?.validateIcon ?? null
+    return props.validateIcon ?? designConfig?.icons?.validateIcon ?? 'icon-error'
   }
 
 export const computedIsErrorInline =
@@ -65,7 +65,7 @@ export const computedIsErrorInline =
     if (typeof props.inlineMessage === 'boolean') {
       return props.inlineMessage
     }
-    return designConfig?.messageType === 'inline' || false
+    return designConfig?.messageType === 'inline'
   }
 
 export const computedIsErrorBlock =
@@ -74,7 +74,10 @@ export const computedIsErrorBlock =
     if (props.messageType) {
       return props.messageType === 'block'
     }
-    return designConfig?.messageType === 'block' || false
+    if (designConfig && Object.hasOwnProperty.call(designConfig, 'messageType')) {
+      return designConfig.messageType === 'block'
+    }
+    return true
   }
 
 export const created =

packages/renderless/src/form/vue.ts

@@ -81,7 +81,7 @@ export const renderless = (
         return false
       }
     }),
-    labelWidth: computed(() => props.labelWidth || designConfig?.state?.labelWidth || '80px'),
+    labelWidth: computed(() => props.labelWidth || designConfig?.state?.labelWidth || '84px'),
     tooltipType: computed(() => designConfig?.state?.tooltipType || 'normal')
   })