How to format inputs.table columns, columns width and word wrap?

Community Help
1

Hi,
I have some simple goals:

  • to define the width in percent of each column (in example 30, 20 and 50)
  • to have word wrap for cells with lots of text

I have seen some related examples and the documentation page, but I am in the first steps and can’t figure out how to do it.

Thanks for the help.

image

2

Here is an example (I’m using the Faker library to produce some dummy data):

faker = (await import("https://esm.run/@faker-js/faker@7.6")).faker

data = Array.from({length: 100}, () => ({
  ID: faker.finance.iban(),
  AMOUNT: +faker.finance.amount(),
  DESCRIPTION: faker.finance.transactionDescription(),
}))

Inputs.table(data, {
  width: {
    ID: "30%",
    AMOUNT: "20%",
    DESCRIPTION: "50%",
  },
  format: {
    DESCRIPTION: d => htl.html`<span style="white-space:normal">${d}`,
  },
})

image
image1816×562 76.4 KB

3

Thank you very much @mootari

You were very didactic and kind

1 Like