expand slot on data table not working inside wrapper component - vue.js

Question

expand slot on data table not working inside wrapper component
I have a wrapper component around v-data-table like so:
<template>
<div>
<wrapper-data-table
:headers="tableHeaders"
:items="partLines"
:expand="expand"
>
<template v-slot:items="line">
<tr #click="line.expanded = !line.expanded">
<td>{{ line.item.binLocation }}</td>
<td>{{ line.item.reqQuantity }}</td>
</tr>
</template>
<template v-slot:expand="line">
<v-card flat>
<v-card-text>Peek-a-boo!</v-card-text>
</v-card>
</template>
</wrapper-data-table>
</div>
</template>
Wrapper Data-Table component
<template>
<div>
<div>
<v-data-table
v-model="selected"
v-bind.sync="tableProps"
:expand="expand"
item-key="name"
>
<!-- Pass on all slots -->
<slot v-for="slot in Object.keys($slots)" :name="slot" :slot="slot" />
<!-- Pass on all scoped slots -->
<template v-for="slot in Object.keys($scopedSlots)" :slot="slot" slot-scope="scope">
<slot :name="slot" v-bind="scope" />
</template>
</v-data-table>
</div>
</div>
</template>
I'm passing through all scoped slots which mostly works fine. However the expand slot doesn't seem to work. I want to expand the row on row click just like the example in the docs.
It works if I'm using the data table directly without the wrapper. however, when it's wrapped, there is no expansion. I can see that the 'expanded' prop is being changed though.