atherdon / react-email-table

yarn add react-email-components-table

Example React component "library" using rollup that is published to npm.

My requirements for this package were

1. Use babel
2. Use semantic-release
3. Use sass
4. Support umd and es modules
5. Use storybook
6. Make the exported components really simple

---

Components inside

• Table
• BasicTable
• Row
• Rows
• Section
• TableLeft

Table

Main Table component, aka Raw table

BasicTable

this is a simple wrapper around table, with just a set of basic attributes

<table 
    border="0" 
    cellpadding="0" 
    cellspacing="0" 
    role="presentation" 
    width="100%">
    <tbody>
      ...
    </tbody>
  </table>

Row

Row should help a little bit to remove a number of lines. Can be with or without <tbody>

 <table
    className={className}
    dir={reverse && 'rtl'}
>
    <tbody className={bodyClassName}>
    <tr>
        {children}
    </tr>
    </tbody>
</table>

Rows

Rows is my interpretation of a previous component. I just want to have a support for a few TR`s if it will be necessary

like:

<tbody>
    <tr>
        <td align="center" valign="top" class="big-title" style="-webkit-text-size-adjust: 100%; ...">...</td>
    </tr>
    <tr>
        <td align="center" valign="top" style="padding-bottom: 30px; ...">
            ...
        </td>
    </tr>
    <tr>
        <td align="center" valign="top" class="board-pic" style="padding-bottom: 40px; ...">...</td>
    </tr>

Section

TableLeft