How to add padding to DataTableCell?

[akosijiji]

Hi! I am using this library. However, I would like to add some padding to each data table cell. I tried adding:

style={{ padding: 5 }}

to no avail. Anybody has encountered doing this? Appreciate your help. Thanks!

[gino8080]

I just tried using style and it worked

simple example:

export const PdfTable = () => {

  const style = { padding: 5 }
  return (
    <Table
      data={[
        { firstName: "John", lastName: "Smith", dob: new Date(2000, 1, 1), country: "Australia", phoneNumber: "xxx-0000-0000" }
      ]}
    >
      <TableHeader>
        <TableCell style={style}> First Name   </TableCell>
        <TableCell style={style}> Last Name </TableCell>
        <TableCell style={style}> DOB </TableCell>
        <TableCell style={style}> Country  </TableCell>
        <TableCell style={style}> Phone Number  </TableCell>
      </TableHeader>
      <TableBody>
        <DataTableCell getContent={(r) => r.firstName} style={style} />
        <DataTableCell getContent={(r) => r.lastName} style={style} />
        <DataTableCell getContent={(r) => r.dob.toLocaleString()} style={style} />
        <DataTableCell getContent={(r) => r.country} style={style} />
        <DataTableCell getContent={(r) => r.phoneNumber} style={style} />
      </TableBody>
    </Table>
  )
}

[akosijiji]

@gino8080 thanks for this. How about <DataTableCell>?

Edit: I've tried also adding the style to TableCell but it didn't work.

[dmk99]

Are you using version 0.1.* of the library? If you are the style property needs to be styles. In version 0.3.0 this has changed to style as above. This was to align with ReactPDF property names.

I'd recommend upgrading to 0.3.*