@yorkjs/hive-ui 2.0.2 → 2.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -38,6 +38,7 @@
|
|
|
38
38
|
margin-right 10PX
|
|
39
39
|
flex 1
|
|
40
40
|
overflow hidden
|
|
41
|
+
min-width 0
|
|
41
42
|
|
|
42
43
|
.flow-item-icon
|
|
43
44
|
flex-shrink 0
|
|
@@ -51,11 +52,16 @@
|
|
|
51
52
|
justify-content center
|
|
52
53
|
padding 2PX
|
|
53
54
|
box-sizing border-box
|
|
55
|
+
overflow hidden
|
|
54
56
|
|
|
55
57
|
.icon-img
|
|
56
58
|
width 100%
|
|
57
59
|
height 100%
|
|
58
60
|
|
|
61
|
+
.flow-item-icon-custom
|
|
62
|
+
flex-shrink 0
|
|
63
|
+
margin-right 10PX
|
|
64
|
+
|
|
59
65
|
.flow-item-content
|
|
60
66
|
flex 1
|
|
61
67
|
display flex
|
|
@@ -63,14 +69,29 @@
|
|
|
63
69
|
justify-content center
|
|
64
70
|
align-items flex-start
|
|
65
71
|
overflow hidden
|
|
72
|
+
min-width 0
|
|
73
|
+
|
|
74
|
+
.flow-item-title-row
|
|
75
|
+
display flex
|
|
76
|
+
flex-direction row
|
|
77
|
+
align-items center
|
|
78
|
+
width 100%
|
|
79
|
+
overflow hidden
|
|
66
80
|
|
|
67
81
|
.flow-item-title
|
|
68
82
|
font-size 16PX
|
|
69
83
|
color var(--textTitle)
|
|
70
84
|
text-align left
|
|
71
|
-
|
|
85
|
+
flex-shrink 1
|
|
86
|
+
min-width 0
|
|
72
87
|
lineClamp(1)
|
|
73
88
|
|
|
89
|
+
.flow-item-title-extra
|
|
90
|
+
flex-shrink 0
|
|
91
|
+
margin-left 5PX
|
|
92
|
+
display flex
|
|
93
|
+
align-items center
|
|
94
|
+
|
|
74
95
|
.flow-item-time-container
|
|
75
96
|
display flex
|
|
76
97
|
margin-top 5PX
|
|
@@ -10,9 +10,11 @@ import styles from './index.module.styl'
|
|
|
10
10
|
|
|
11
11
|
interface IProps {
|
|
12
12
|
/** 左侧图标链接 */
|
|
13
|
-
icon?: string
|
|
13
|
+
icon?: string | React.ReactNode
|
|
14
14
|
/** 标题 */
|
|
15
15
|
title?: string
|
|
16
|
+
/** 标题右侧的额外内容(如标签、状态) */
|
|
17
|
+
titleExtra?: React.ReactNode
|
|
16
18
|
/** 时间或下方副标题 */
|
|
17
19
|
time?: string | React.ReactNode
|
|
18
20
|
/** 右侧金额 */
|
|
@@ -35,6 +37,7 @@ const FlowItem: React.FC<IProps> = (props) => {
|
|
|
35
37
|
icon,
|
|
36
38
|
title,
|
|
37
39
|
time,
|
|
40
|
+
titleExtra,
|
|
38
41
|
amount,
|
|
39
42
|
amountColor,
|
|
40
43
|
desc,
|
|
@@ -44,6 +47,29 @@ const FlowItem: React.FC<IProps> = (props) => {
|
|
|
44
47
|
className
|
|
45
48
|
} = props
|
|
46
49
|
|
|
50
|
+
const renderIcon = () => {
|
|
51
|
+
if (isEmpty(icon)) return null
|
|
52
|
+
|
|
53
|
+
if (typeof icon === 'string') {
|
|
54
|
+
return (
|
|
55
|
+
<View className="flow-item-icon">
|
|
56
|
+
<Image
|
|
57
|
+
src={icon}
|
|
58
|
+
className="icon-img"
|
|
59
|
+
mode="aspectFit"
|
|
60
|
+
/>
|
|
61
|
+
</View>
|
|
62
|
+
)
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
// 如果是自定义元素
|
|
66
|
+
return (
|
|
67
|
+
<View className="flow-item-icon-custom">
|
|
68
|
+
{icon}
|
|
69
|
+
</View>
|
|
70
|
+
)
|
|
71
|
+
}
|
|
72
|
+
|
|
47
73
|
return (
|
|
48
74
|
<View
|
|
49
75
|
className={formatClassNames(
|
|
@@ -54,29 +80,30 @@ const FlowItem: React.FC<IProps> = (props) => {
|
|
|
54
80
|
>
|
|
55
81
|
<View className={showSeparator ? 'flow-content-no-border' : 'flow-content'}>
|
|
56
82
|
<View className="flow-item-left">
|
|
57
|
-
{
|
|
58
|
-
!isEmpty(icon)
|
|
59
|
-
? (
|
|
60
|
-
<View className="flow-item-icon">
|
|
61
|
-
<Image
|
|
62
|
-
src={icon}
|
|
63
|
-
className="icon-img"
|
|
64
|
-
mode="aspectFit"
|
|
65
|
-
/>
|
|
66
|
-
</View>
|
|
67
|
-
) : undefined
|
|
68
|
-
}
|
|
83
|
+
{renderIcon()}
|
|
69
84
|
|
|
70
85
|
<View className="flow-item-content">
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
86
|
+
|
|
87
|
+
<View className="flow-item-title-row">
|
|
88
|
+
{
|
|
89
|
+
!isEmpty(title)
|
|
90
|
+
? (
|
|
91
|
+
<Text className="flow-item-title">
|
|
92
|
+
{title}
|
|
93
|
+
</Text>
|
|
94
|
+
)
|
|
95
|
+
: undefined
|
|
96
|
+
}
|
|
97
|
+
{
|
|
98
|
+
!isEmpty(titleExtra)
|
|
99
|
+
? (
|
|
100
|
+
<View className="flow-item-title-extra">
|
|
101
|
+
{titleExtra}
|
|
102
|
+
</View>
|
|
103
|
+
)
|
|
104
|
+
: undefined
|
|
105
|
+
}
|
|
106
|
+
</View>
|
|
80
107
|
{
|
|
81
108
|
!isEmpty(time)
|
|
82
109
|
? (
|