From 1197202d718372c7ae0ed50bff06515c14459871 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Tue, 18 Jan 2022 15:24:12 +0800
Subject: [PATCH] refactor(components): [row] add namespace & instance type
 (#5454)

* refactor(components): [row] add namespace & instance type

* refactor: remove useless annotation
---
 packages/components/row/src/row.ts | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/packages/components/row/src/row.ts b/packages/components/row/src/row.ts
index cf552bac38..a9fec8d26e 100644
--- a/packages/components/row/src/row.ts
+++ b/packages/components/row/src/row.ts
@@ -1,6 +1,7 @@
 import { defineComponent, computed, h, provide } from 'vue'
 import { buildProps } from '@element-plus/utils/props'
-import type { ExtractPropTypes } from 'vue'
+import { useNamespace } from '@element-plus/hooks'
+import type { ExtractPropTypes, CSSProperties } from 'vue'
 
 export const rowProps = buildProps({
   tag: {
@@ -24,26 +25,28 @@ export const rowProps = buildProps({
 } as const)
 export type RowProps = ExtractPropTypes<typeof rowProps>
 
-export default defineComponent({
+const Row = defineComponent({
   name: 'ElRow',
   props: rowProps,
 
   setup(props, { slots }) {
+    const ns = useNamespace('row')
+
     const gutter = computed(() => props.gutter)
     provide('ElRow', {
       gutter,
     })
 
     const style = computed(() => {
-      const ret = {
+      const styles: CSSProperties = {
         marginLeft: '',
         marginRight: '',
       }
       if (props.gutter) {
-        ret.marginLeft = `-${props.gutter / 2}px`
-        ret.marginRight = ret.marginLeft
+        styles.marginLeft = `-${props.gutter / 2}px`
+        styles.marginRight = styles.marginLeft
       }
-      return ret
+      return styles
     })
 
     return () =>
@@ -51,7 +54,7 @@ export default defineComponent({
         props.tag,
         {
           class: [
-            'el-row',
+            ns.b(),
             props.justify !== 'start' ? `is-justify-${props.justify}` : '',
             props.align !== 'top' ? `is-align-${props.align}` : '',
           ],
@@ -61,3 +64,6 @@ export default defineComponent({
       )
   },
 })
+
+export default Row
+export type RowInstance = InstanceType<typeof Row>