react-calendar-timeline pop up not working

Question

I can't get an onclick popup to work for react-calendar-timeline

https://www.assuredlimited.co.uk/temp/react-calendar-timeline-demo/dist/index.asp is the link

  itemRenderer: ({
          item,
          itemContext,
          getItemProps,
          getResizeProps
        }) => {    
          const { left: leftResizeProps, right: rightResizeProps } = getResizeProps()
          const Theetails = item.Address;
          return ("<div {...getItemProps({style: {background, color, borderColor, boxShadow, borderStyle: 'solid', borderWidth: 1, borderRadius: 4, borderLeftWidth: itemContext.selected ? 3 : 1, borderRightWidth: itemContext.selected ? 3 : 1 } })} onMouseEnter={() =>{ this.setState({ showModal: true })}} onMouseLeave={() =>{this.setState({ showModal: false }) }} onClick={() =>{ this.setState({ showModal: false })}} > <div style={{ height: itemContext.dimensions.height,overflow: 'hidden',marginLeft: '10px',paddingLeft: 3,textOverflow: 'ellipsis',lineHeight: '20px',marginTop: '15px'}}>{itemContext.title}</div>{this.state.showModal && <div className='itemModal' style={{left: left,right: right}}><div className='itemModal'>" & TheDetails & "</div></div>}</div>")}
  
  var props = {
    groups: groups,
    items: items,
    fixedHeader: 'fixed',
    canMove: false, // defaults
    canResize: true,
    itemsSorted: true,
    itemTouchSendsClick: false,
    stackItems: true,
    itemHeightRatio: 0.75,
    dragSnap: 1000 * 60 * 15,
    itemRenderer: this.itemRenderer,
    defaultTimeStart: new Date(TheMoment - (7 * OneDay)),    
    defaultTimeEnd: new Date(TheMoment + (7 * OneDay)),
    

    minZoom: 60 * 60 * 1000, // 1 hour
    maxZoom: 5 * 365.24 * 86400 * 1000, // 5 years

    keys: {
      groupIdKey: 'id',
      groupTitleKey: 'title',
      itemIdKey: 'id',
      itemTitleKey: 'title',
      itemGroupKey: 'group',
      itemTimeStartKey: 'start',
      itemTimeEndKey: 'end'
    },

   
    // this limits the timeline to -6 months ... +6 months
    onTimeChange: function (visibleTimeStart, visibleTimeEnd) {
            
      if (visibleTimeStart < minTime && visibleTimeEnd > maxTime) {
        
        this.updateScrollCanvas(minTime, maxTime)
      } else if (visibleTimeStart < minTime) {
         
        this.updateScrollCanvas(minTime, minTime + (visibleTimeEnd - visibleTimeStart))
      } else if (visibleTimeEnd > maxTime) {
        
        this.updateScrollCanvas(maxTime - (visibleTimeEnd - visibleTimeStart), maxTime)
          
          
          
          
      } else {
        
        this.updateScrollCanvas(visibleTimeStart, visibleTimeEnd)
      }
    }
  }
  var filter = React.createElement("div", {}, "The filter");

  /* jshint undef:false */
  ReactDOM.render(React.createElement(ReactCalendarTimeline['default'], props, filter), document.getElementById('main'));

Is part of my code.nothing happesns when I click on a job title but I want the address to poup in a modal. Thanksenter code here