This repository was archived by the owner on Nov 30, 2020. It is now read-only.
File tree Expand file tree Collapse file tree 3 files changed +40
-4
lines changed Expand file tree Collapse file tree 3 files changed +40
-4
lines changed Original file line number Diff line number Diff line change 3
3
:class =" classes"
4
4
class =" mdc-card"
5
5
>
6
- <slot />
6
+ <div
7
+ v-if =" primaryAction"
8
+ class =" mdc-card__primary-action"
9
+ tabindex =" 0"
10
+ v-on =" $listeners"
11
+ >
12
+ <slot />
13
+ </div >
14
+ <slot v-else />
7
15
<div
8
16
v-if =" $slots['actionButtons'] || $slots['actionIcons'] || $slots['fullBleedButton']"
9
17
:class =" actionClasses"
@@ -42,6 +50,10 @@ export default {
42
50
fullBleedAction: {
43
51
type: Boolean ,
44
52
default: false
53
+ },
54
+ primaryAction: {
55
+ type: Boolean ,
56
+ default: false
45
57
}
46
58
},
47
59
data () {
@@ -59,9 +71,6 @@ export default {
59
71
return {
60
72
' mdc-card__actions--full-bleed' : this .fullBleedAction
61
73
}
62
- },
63
- primaryAction () {
64
- return this .$slots .actionableContent != null
65
74
}
66
75
},
67
76
mounted () {
Original file line number Diff line number Diff line change @@ -105,6 +105,22 @@ describe('Card', () => {
105
105
expect ( w . classes ( ) ) . toContain ( 'mdc-card__action--icon' )
106
106
} )
107
107
} )
108
+
109
+ it ( 'should render with primary action' , ( ) => {
110
+ let wrapper = mount ( Card , {
111
+ slots : {
112
+ default : [ CardMedia ]
113
+ } ,
114
+ propsData : {
115
+ primaryAction : true
116
+ }
117
+ } )
118
+ expect ( wrapper ) . toMatchSnapshot ( )
119
+
120
+ let primaryAction = wrapper . find ( '.mdc-card__primary-action' )
121
+ expect ( primaryAction . exists ( ) ) . toBe ( true )
122
+ expect ( primaryAction . find ( '.mdc-card__media' ) . exists ( ) ) . toBe ( true )
123
+ } )
108
124
} )
109
125
110
126
describe ( 'CardPrimaryAction' , ( ) => {
Original file line number Diff line number Diff line change @@ -67,4 +67,15 @@ exports[`Card should render with no prop 1`] = `
67
67
</div >
68
68
` ;
69
69
70
+ exports [` Card should render with primary action 1` ] = `
71
+ <div class = " mdc-card" >
72
+ <div tabindex = " 0" class = " mdc-card__primary-action" >
73
+ <div class = " mdc-card__media mdc-card__media--square" >
74
+ <div class = " mdc-card__media-content" ></div >
75
+ </div >
76
+ </div >
77
+ <!---->
78
+ </div >
79
+ ` ;
80
+
70
81
exports [` CardPrimaryAction should render with no prop 1` ] = ` <div tabindex = " 0" class = " mdc-card__primary-action" ></div >` ;
You can’t perform that action at this time.
0 commit comments