Action Icons appearing as plain text

I tried the following which solved the problem for me 1)Icon imported from material-ui/icons

import ExitToAppIcon from '@material-ui/icons/ExitToApp';
const tableIcons = {
LogOut: forwardRef((props, ref) => <ExitToAppIcon {...props} ref={ref} />)
}

2) Usage

<MaterialTable
  title="User List"
  icons={tableIcons} 
actions{[{icon:tableIcons.LogOut,tooltip:'LogoutUser',onClick(event,rowData)=>{console.log('Logout clicked')}}]}
/>

In your case it will be tableIcons.Print


I had that problem as well and updated the typescript docs accordinly. You have to wrap them in a function. And to enable the tooltip, you have to forward the ref since muiv4 like this:

Add: forwardRef((props, ref) => <Add {...props} ref={ref} color='action' />)

I just used the same library and it is either an error in the documentation or code bug, anyway it is fixed as follows:

actions={[
  {
    icon: () => <AddBox />,
    tooltip: 'Add User',
    onClick: (event) => alert("You want to add a new row")
  }
]}

Obviously you must change the action and the icon to what you want to use.