From 29754a8bd721ed390189ff35a0ed3b71e7e96671 Mon Sep 17 00:00:00 2001
From: chrisrc <chrisrc@qq.com>
Date: Fri, 15 Mar 2019 09:42:39 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=BACard=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=9A=84HeaderContent=E5=92=8CHeaderExtra=E6=B7=BB=E5=8A=A0Wra?=
 =?UTF-8?q?p=20style=EF=BC=8C=E4=BE=BF=E4=BA=8E=E5=AE=9A=E5=88=B6=20fixes?=
 =?UTF-8?q?=20#395?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 为Card组件的HeaderContent和HeaderExtra添加Wrap style，便于定制

* 添加测试代码，并通过测试
---
 components/card/CardHeader.tsx                |  6 ++--
 .../__tests__/__snapshots__/demo.test.js.snap | 36 +++++++++++++++++++
 components/card/style/index.tsx               |  8 +++++
 3 files changed, 48 insertions(+), 2 deletions(-)

diff --git a/components/card/CardHeader.tsx b/components/card/CardHeader.tsx
index 01a6e5c05..d4d2ff574 100644
--- a/components/card/CardHeader.tsx
+++ b/components/card/CardHeader.tsx
@@ -8,7 +8,9 @@ export interface CardHeaderPropsType
   extends WithThemeStyles<
     Pick<
       CardStyle,
+      | 'headerContentWrap'
       | 'headerContent'
+      | 'headerExtraWrap'
       | 'headerExtra'
       | 'headerImage'
       | 'headerTitle'
@@ -46,14 +48,14 @@ export default class CardHeader extends React.Component<CardHeaderProps, any> {
         {s => {
           const titleDom =
             title === undefined ? null : React.isValidElement(title) ? (
-              <View style={{ flex: 1 }}>{title}</View>
+              <View style={s.headerContentWrap}>{title}</View>
             ) : (
               <Text style={s.headerContent}>{title}</Text>
             );
 
           const extraDom =
             extra === undefined ? null : React.isValidElement(extra) ? (
-              <View style={{ flex: 1 }}>{extra}</View>
+              <View style={s.headerExtraWrap}>{extra}</View>
             ) : (
               <Text style={[s.headerExtra]}>{extra}</Text>
             );
diff --git a/components/card/__tests__/__snapshots__/demo.test.js.snap b/components/card/__tests__/__snapshots__/demo.test.js.snap
index f4825fe37..796cd1db5 100644
--- a/components/card/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/card/__tests__/__snapshots__/demo.test.js.snap
@@ -77,12 +77,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
               "flex": 1,
               "fontSize": 17,
             },
+            "headerContentWrap": Object {
+              "flex": 1,
+            },
             "headerExtra": Object {
               "color": "#888888",
               "flex": 1,
               "fontSize": 17,
               "textAlign": "right",
             },
+            "headerExtraWrap": Object {
+              "flex": 1,
+            },
             "headerImage": Object {
               "marginRight": 5,
             },
@@ -211,12 +217,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
               "flex": 1,
               "fontSize": 17,
             },
+            "headerContentWrap": Object {
+              "flex": 1,
+            },
             "headerExtra": Object {
               "color": "#888888",
               "flex": 1,
               "fontSize": 17,
               "textAlign": "right",
             },
+            "headerExtraWrap": Object {
+              "flex": 1,
+            },
             "headerImage": Object {
               "marginRight": 5,
             },
@@ -307,12 +319,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
               "flex": 1,
               "fontSize": 17,
             },
+            "headerContentWrap": Object {
+              "flex": 1,
+            },
             "headerExtra": Object {
               "color": "#888888",
               "flex": 1,
               "fontSize": 17,
               "textAlign": "right",
             },
+            "headerExtraWrap": Object {
+              "flex": 1,
+            },
             "headerImage": Object {
               "marginRight": 5,
             },
@@ -439,12 +457,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
             "flex": 1,
             "fontSize": 17,
           },
+          "headerContentWrap": Object {
+            "flex": 1,
+          },
           "headerExtra": Object {
             "color": "#888888",
             "flex": 1,
             "fontSize": 17,
             "textAlign": "right",
           },
+          "headerExtraWrap": Object {
+            "flex": 1,
+          },
           "headerImage": Object {
             "marginRight": 5,
           },
@@ -573,12 +597,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
             "flex": 1,
             "fontSize": 17,
           },
+          "headerContentWrap": Object {
+            "flex": 1,
+          },
           "headerExtra": Object {
             "color": "#888888",
             "flex": 1,
             "fontSize": 17,
             "textAlign": "right",
           },
+          "headerExtraWrap": Object {
+            "flex": 1,
+          },
           "headerImage": Object {
             "marginRight": 5,
           },
@@ -669,12 +699,18 @@ exports[`renders ./components/card/demo/basic.tsx correctly 1`] = `
             "flex": 1,
             "fontSize": 17,
           },
+          "headerContentWrap": Object {
+            "flex": 1,
+          },
           "headerExtra": Object {
             "color": "#888888",
             "flex": 1,
             "fontSize": 17,
             "textAlign": "right",
           },
+          "headerExtraWrap": Object {
+            "flex": 1,
+          },
           "headerImage": Object {
             "marginRight": 5,
           },
diff --git a/components/card/style/index.tsx b/components/card/style/index.tsx
index 29ee9def9..404e005fe 100644
--- a/components/card/style/index.tsx
+++ b/components/card/style/index.tsx
@@ -7,7 +7,9 @@ export interface CardStyle {
   headerWrap: ViewStyle;
   headerTitle: ViewStyle;
   headerImage: ImageStyle;
+  headerContentWrap: ViewStyle;
   headerContent: TextStyle;
+  headerExtraWrap: ViewStyle;
   headerExtra: TextStyle;
   body: ViewStyle;
   footerWrap: ViewStyle;
@@ -45,11 +47,17 @@ export default (theme: Theme) =>
     headerImage: {
       marginRight: theme.h_spacing_sm,
     },
+    headerContentWrap: {
+      flex: 1,
+    },
     headerContent: {
       color: theme.color_text_base,
       fontSize: theme.font_size_heading,
       flex: 1,
     },
+    headerExtraWrap: {
+      flex: 1,
+    },
     headerExtra: {
       flex: 1,
       fontSize: theme.font_size_heading,