I am attempting to pass an object to a child component onclick, however, the result is always an empty object. 

My parent component is pulling a custom list from apex and returning an array of objects. I am iterating through the list and setting each iteration with a data attribute "data-lead". 
 

<template>
    <div data-card="birthdayCard" class="sectionCard cardClosed">
        <div class="sectionHeader" onclick={toggleView}>
            <p class="sectionTitle">Birthdays</p>
        </div>
            <div data-id="birthdaySection" class="slds-m-around_medium main drop-down closed">
                    <template for:each={viewableLeads} for:item="lead">
                        <div key={lead.id} class="previewHeadline" data-lead={lead} onclick={selectLead}>
                            <p class="leadItem">{lead.Name} <span class="sectionName">Birthday</span></p>
                            <div class="subInfo">8/04/1994 - Closed on 4/5/12</div>
                        </div>
                    </template>
                    <template if:false={max}>
                        <p class="btn loadMoreButton" onclick={loadMore}>Load More</p> 
                    </template>
            </div>
            <div>
                <c-lead-details selected-item={currentLead}></c-lead-details>
            </div>
    </div>
</template>

I then have my JS controller

import { LightningElement, wire , track} from 'lwc';
import getbdayopps from '@salesforce/apex/WorkdayAura.getbdayopps';

export default class bData extends LightningElement{
    bdayLeads
    closed = true
    count = 9
    @track max = false
    size 
    @track viewableLeads
    @track error
    @track currentLead = {}
    constructor(){
        super()
        getbdayopps()
        .then(result => {
            this.bdayLeads = result
            this.viewableLeads = result.slice(0,this.count)
            this.size = result.length
        })
        .catch(err => {
            this.bdayLeads = undefined
        })


    }

    loadMore(){
        this.count += 10
        this.viewableLeads = this.bdayLeads.slice(0,this.count);
        if(this.count >= this.size){
            this.max = true;
        }
    }

    toggleView(evt){
        let birthday = this.template.querySelector(JSON.parse(JSON.stringify('[data-id="birthdaySection"]')))
        let card = this.template.querySelector(JSON.parse(JSON.stringify('[data-card="birthdayCard"]')))
        let classList = birthday.classList.value.split(" ")

        if(classList.includes('closed')){
            birthday.classList.remove("closed")
            card.classList.remove("cardClosed")
            this.closed = false
        }else{
            birthday.classList.add("closed")
            card.classList.add("cardClosed")
            this.closed = true
        }
    }
    
    selectLead(event){
        this.currentLead = event.target.dataset.lead
    }

    
}

finally, the child component.

import { LightningElement, api } from "lwc";

export default class ChildDynamicRecordForm extends LightningElement {
  @api selectedItem;
 
}

So on click, i am triggering "selectLead" which sets the variable currentLead to event.target.dataset.lead, which should be the object. however the child component is only receiving an empty object. Im not sure if im doing this incorrectly, but any help would be greatly appreciated.