Column widths

CHANGELOG.md

@@ -2,8 +2,26 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## 0.5.2
+### Added
+- A `column_widths` property can be used to set the column widths of the
+`DataTable`. Simple example:
+```python
+ROWS = [
+    {'a': 'AA', 'b': 1},
+    {'a': 'AB', 'b': 2},
+]
+
+dt.DataTable(
+    rows=ROWS,
+    columns=['a', 'b'],
+    column_widths=[200, 400]
+)
+```
+
 ## 0.5.1
-`datatable` now automatically resizes to fit data that has less than 10 rows.
+### Added
+- `DataTable` now automatically resizes to fit data that has less than 10 rows.
 
 ## 0.5.0
 ### Added

dash_table_experiments/metadata.json

@@ -91,6 +91,13 @@
         "params": [],
         "returns": null
       },
+      {
+        "name": "getMinHeight",
+        "docblock": null,
+        "modifiers": [],
+        "params": [],
+        "returns": null
+      },
       {
         "name": "onRowsSelected",
         "docblock": null,
@@ -169,6 +176,16 @@
           "computed": false
         }
       },
+      "column_widths": {
+        "type": {
+          "name": "arrayOf",
+          "value": {
+            "name": "number"
+          }
+        },
+        "required": false,
+        "description": ""
+      },
       "columns": {
         "type": {
           "name": "arrayOf",

dash_table_experiments/version.py

@@ -1 +1 @@
-__version__ = '0.5.1'
+__version__ = '0.5.2'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dash-table-experiments",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "Dash table experiments",
   "main": "lib/index.js",
   "repository": {

src/components/DataTable.react.js

@@ -89,6 +89,11 @@ class DataTable extends Component {
             sortable: Boolean(props.sortable),
             filterable: Boolean(props.filterable)
         }));
+        if (props.column_widths) {
+            newState.columns.forEach((c, i) => {
+                c.width = props.column_widths[i];
+            });
+        }
 
         this.setState(newState);
     }
@@ -322,6 +327,8 @@ DataTable.propTypes = {
     editable: PropTypes.bool,
     filterable: PropTypes.bool,
     sortable: PropTypes.bool,
+    column_widths: PropTypes.arrayOf(PropTypes.number),
+
     /**
      * Order of columns. Note that the column names are specified in
      * `rows` but without order. This attribute allows you to specify