How can I right-align text in a table?

[felixmerz00]

Hello,

Thank you very much for creating SwissQRBill. I love this package. I have a question tough. I can't figure out how to right-align the text in a specific column of a table. I would like to right-align all values in the column "Price". I use TypeScript. This is the first row in my table.

{
  fillColor: '#ECF0F1',
  columns: [
    {
      text: 'Product',
      width: mm2pt(15),
    },
    {
      text: 'Price',
    },
  ],
};

I tried using the attribute align: 'right'. But this has no effect. Defining the absolute position based on the page width didn't work either. How can I right-align text in specific columns in my table?

Kind regards, Felix

[schoero]

Hi,

Thank you for you kind feedback. You can use textOptions: { align: "right" } for that.

However, I noticed that there is an error in the calculation of the column width, where the padding is not subtracted. So by default, the text overflows the column by the width of the padding, which is 5 by default.

As a workaround, you can set the left padding to a negative number of the padding that you actually want for that column. If you didn't set a padding manually, this would be padding: [undefined, undefined, undefined, -5].

{
  rows: [
    {
      fillColor: '#ECF0F1',
      columns: [
        {
          text: 'Product',
          width: mm2pt(15),
        },
        {
          text: 'Price',
          textOptions: { align: "right" },
          padding: [undefined, undefined, undefined, -5]
        },
      ],
    }
  ]
};

Here are two images to illustrate what i mean:

Without the workaround:

With negative padding:

Unfortunately I don't wan't to publish a fix for this issue, because at this point, it would most certainly be a breaking change for some users who have already worked around this issue. And for the next major release, this is already fixed.

[schoero]

I'm going to close this issue, as the question seems to be answered.