[React] Customizing Column Width in TaskBoard

[riley_procore]

We are trying to set up a configuration for the users to select a minimum width for the TaskBoard columns.

Is there a native way to dynamically update the column widths?
We're curious if there's a built-in method outside of just updating the CSS on the classes.

[marcio]

Hey riley_procore,

Thanks for reaching out.

To dynamically update the column widths in the TaskBoard, you can use the width property of the ColumnModel. You can set this property programmatically to adjust the width of columns as needed.

Here's a simple example of how you might update the width of a column:

const taskBoard = new TaskBoard({
    columns: [
        { id: 'todo', text: 'Todo', width: 300 },
        { id: 'doing', text: 'Doing', width: 400 }
    ]
});

// To update the width dynamically
taskBoard.columns.getById('todo').width = 500;

This approach allows you to change the column width without directly modifying the CSS. You can also listen to user interactions and update the width accordingly.

If you need further customization or have specific requirements, feel free to provide more details.