Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@ag-media/react-pdf-table
Advanced tools
Readme
@ag-media/react-pdf-table
is a declarative table generator for @react-pdf/renderer.
Warning
The library is specifically designed for use with @react-pdf/renderer and will not work with other react renderers.
npm install --save-dev @ag-media/react-pdf-table
import {Table, TR, TH, TD} from '@ag-media/react-pdf-table';
const Component = () => (
<Table>
<TH>
<TD>Header 1</TD>
<TD>Header 2</TD>
</TH>
<TR>
<TD>Data 1</TD>
<TD>Data 2</TD>
</TR>
</Table>
);
Hint: you can use the short (<TH />
, <TR />
, <TD />
) or
long (<TableHeader />
, <TableRow />
, <TableCell />
) named imports.
Refer to the repo's Storybook for more examples.
While this library covers the usual table layouts, it's not a complete or bullet-proof solution. Because not all layouts are 100% achievable with the current react-pdf primitives, the table components need to be implemented in react-pdf (upvote this issue).
Content in a TableCell must evaluate to a string
, number
, <Fragment />
or a @react-pdf/renderer
component (View
, Text
etc.).
tdProps
and trProps
These two props will be passed down to all TableCells and TableRows. Can be used to style cells/rows (styles example).
weighting
Weightings can be defined once for all rows in Table's weightings
prop
and for each TableCell individually. TableCell's weighting
props has precedence
over the Table's weightings
.
If weighting
is not defined for a table cell then it will default to ocupy
an equal amount of the remaining space.
The sum of all weighting
s for one line must should to 1, unless you want
a row to be smaller than the table.
page wrapping may happen in unexpected ways:
flex layout is used to simulate how a table looks. Because of this, it's trivial to make columns not line up.
border collapse
Because there's no such thing in react-pdf, this has to be "emulated" with negative margins. This is especially painfull for non-default border styles (e.g. outer border)
dashed and dotted table borders may meet irregularly or overlap
FAQs
Declarative table generator for for the @react-pdf/renderer.
The npm package @ag-media/react-pdf-table receives a total of 2,182 weekly downloads. As such, @ag-media/react-pdf-table popularity was classified as popular.
We found that @ag-media/react-pdf-table demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.