Feature request: allow Datagrid to autosize columns like a native HTML table

[paul-balchin-ibm]

Datagrid

Brief description

Issue By default, the Datagrid sets the width of each column to 150px. This means each column will either be too wide (more empty space than necessary) or too narrow (header or cell content is truncated). It will be blind luck for any column width to be "just right".

• A column where all the cells are empty will take up a lot of empty space.
• A column of IP addresses between "0.0.0.0" and "255.255.255.255" might truncate some values if they are too long.
• Strings translated to different languages can be wildly different widths.

The native HTML table "auto-sizes" column widths By default, A <table> will auto-size each column based on the content of its header and the content of each cell below. If the width of the <table> is set wider than the contents of the columns, all the columns will automatically "grow" proportionally until they fit the table.

Request

1. A prop that instructs the table to render with auto-sized columns based on the width of their contents.
2. The user would still be able to resize the columns.

Links to other materials

Design Maintainer(s)

• Owner/main maintainer(s)
• Second/backup maintainer(s)

Tasks

Before starting work on this epic, please review and complete the following.

• [ ] Initial review of design/existing code

Working in Carbon for IBM Products package

• [ ] Have you reviewed our contribution guidelines?
• [ ] Have you noted our code guidelines?
• [ ] Did you use the CLI to scaffold your new component?