feat(Table): use <colgroup/> to set cells width

gravity-ui · Jul 19, 2023 · f4b190c · f4b190c
1 parent c01ad33
commit f4b190c
Showing 1 changed file with 18 additions and 0 deletions.
diff --git a/src/components/Table/Table.tsx b/src/components/Table/Table.tsx
@@ -332,6 +332,23 @@ export class Table<I extends TableDataItem = Record<string, string>> extends Rea
         );
     }
 
+    private renderColgroup() {
+        const {columns} = this.props;
+        const {columnsStyles} = this.state;
+
+        if (!columnsStyles.length) {
+            return null;
+        }
+
+        return (
+            <colgroup>
+                {columnsStyles.map(({width}, index) => (
+                    <col style={{width}} key={columns[index].id} />
+                ))}
+            </colgroup>
+        );
+    }
+
     private renderHead() {
         const {columns, edgePadding} = this.props;
         const {columnsStyles} = this.state;
@@ -381,6 +398,7 @@ export class Table<I extends TableDataItem = Record<string, string>> extends Rea
     private renderTable() {
         return (
             <table ref={this.tableRef} className={b('table')}>
+                {this.renderColgroup()}
                 {this.renderHead()}
                 {this.renderBody()}
             </table>