Table: Set fixed checkbox width , new prop for setting row action column width

[ElishaSamPeterPrabhu]

Description

• Added column width property for row action column
• Set a fixed width to check box

References Fixes #1922

Type of change

• [x] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
• [x] Documentation update

How Has This Been Tested?

Checklist

• [x] My code follows the style guidelines of this project
• [x] I have performed a self-review of my own code
• [ ] I have commented my code, particularly in hard-to-understand areas
• [x] I have made corresponding changes to the documentation
• [x] My changes generate no new warnings
• [ ] I have added tests that prove my fix is effective or that my feature works
• [ ] New and existing unit tests pass locally with my changes
• [x] Any dependent changes have been merged and published in downstream modules
• [x] I have checked my code and corrected any misspellings

[netlify[bot]]

✅ Deploy Preview for moduswebcomponents canceled.

Name	Link
🔨 Latest commit	9908d8e343dab1807051685725b0b794f020c433
🔍 Latest deploy log	https://app.netlify.com/sites/moduswebcomponents/deploys/66fa74f9f5314f000871e617

[coliff]

Hello! Can you please provide steps to test/review the changes? I tried changing the rowActionSize at: https://deploy-preview-2874--moduswebcomponents.netlify.app/?path=/story/components-table--checkbox-row-selection&args=rowActionSize:99999 but it didn't appear to have any effect.

[ElishaSamPeterPrabhu]

Hello! Can you please provide steps to test/review the changes? I tried changing the rowActionSize at: https://deploy-preview-2874--moduswebcomponents.netlify.app/?path=/story/components-table--checkbox-row-selection&args=rowActionSize:99999 but it didn't appear to have any effect.

The example controls for rowActions are not added in the link provided, try the Row Actions type where the examples are added and rowActions have some example controls. https://deploy-preview-2874--moduswebcomponents.netlify.app/?path=/story/components-table--row-actions

[coliff]

These changes introduce new accessibility issues - can you please be sure to resolve them.

[ElishaSamPeterPrabhu]

These changes introduce new accessibility issues - can you please be sure to resolve them.

These accessibility issues are present in the components web site as well as the sticky-right column does not have a text for its table header and the icon images of the row actions does not have alternate text

[prashanth-offcl]

@ElishaSamPeterPrabhu I can reproduce the same issue when using fullwidth to true. It might be due to the width set for other th's using getSize method, please check.

[ElishaSamPeterPrabhu]

@ElishaSamPeterPrabhu I can reproduce the same issue when using fullwidth to true. It might be due to the width set for other th's using getSize method, please check.

Sure, will check

[ElishaSamPeterPrabhu]

I attempted the following solutions, but either the row action column's width, which is set, does not remain fixed, or the widths of the other columns are reduced when the row action column's width stays the same.

• Applied a fixed width to the sticky-right column, which worked for ensuring it stayed constant but didn’t solve the issue of gaps when fewer columns were present.
• Tried using flex-grow: 1 on non-sticky columns to evenly distribute space. However, this caused the table headers to misalign and stack since flex doesn't work well within table elements.
• Set min-width and max-width for columns to manage their resizing behavior. While this helped control sizing, it didn’t fully resolve the issue of the sticky column maintaining its width when other columns shrank.