3.0 (plotly#42)

* Virtualization (plotly#36) * virtualization - define base virtualization strategies - define additional props - add tscript support to project * virtualization - refactor controlledtable and table * virtualization - no strategy & fe page strategy basics * virtualization - update props - update fe and none strategy * virtualization - fix bug for when to create a new virtualizer * virtualization * virtualization - copy/paste * virtualization - legacy behavior support (n-items + trailing) * virtualization - the build.. * virtualization - fix cell key * virtualization * virtualization - remove legacy (tail rows + display rows) - be page virtualization strategy - first be python prototypes * remove expanded_rows and collapsable logic * fix lint * - refactor virtualization strategies - placeholder for filter and sort - placeholder for prototype / "state" readonly props * - viewport props (viewport dataframe & indices) - ramda @types * virtualization * - virtualizer through memoize / controlled component instead of state * fix render loop caused by virtualization when linked to BE * be and fe usage examples * restructure project * refactor project structure * clean up * refactor virtualization (wip) * clean up fe/be virtualization + paging + examples * fix lint * virtualization * version 3.0.0dev * revert * revert * revert * fix lint * fix pyling * fix pylint * pagination display * pagination display * fix demo code... * fix pr comments * fix pylint * add tslint to build * Fixed rows columns (plotly#37) * virtualization - define base virtualization strategies - define additional props - add tscript support to project * virtualization - refactor controlledtable and table * virtualization - no strategy & fe page strategy basics * virtualization - update props - update fe and none strategy * virtualization - fix bug for when to create a new virtualizer * virtualization * virtualization - copy/paste * virtualization - legacy behavior support (n-items + trailing) * virtualization - the build.. * virtualization - fix cell key * virtualization * virtualization - remove legacy (tail rows + display rows) - be page virtualization strategy - first be python prototypes * remove expanded_rows and collapsable logic * fix lint * - refactor virtualization strategies - placeholder for filter and sort - placeholder for prototype / "state" readonly props * - viewport props (viewport dataframe & indices) - ramda @types * virtualization * - virtualizer through memoize / controlled component instead of state * fix render loop caused by virtualization when linked to BE * be and fe usage examples * restructure project * refactor project structure * clean up * refactor virtualization (wip) * clean up fe/be virtualization + paging + examples * fix lint * virtualization * version 3.0.0dev * revert * revert * revert * fix lint * fix pyling * fix pylint * pagination display * pagination display * fix demo code... * fix pr comments * fix pylint * add tslint to build * refactor ControlledTable component + updates * improve fixed rows * refactor logic for creating headers and rows * fixed columns * build * remove <Fragment> usage for 15.x support * fix lint * improve/fix styling in fixed_columns mode * fixed rows and columns (wip) * refactor some styling * fix rendering with fixed columns * fix binding * demo app * fix frozen columns (th cells) height * change default cell width * overflow scroll only if necessary * dropdown not clipped by container/overflow * fix percy test * update builds * update table style * clean up styles * fix FF styling * not editable div instead of input * fix header width * no-clipping dropdown + clipping fixed columns * fix fixed columns * Merge with master * readme update * sort * update python build * fix sort * rename version * rebuild python dist * 3.0 performance (plotly#43) * performance improvements - use stylesheet element instead of inline styles for components - refactor stylesheets usage (facade) - switch out inputs for divs when inactive - refactor cell component to simplify props - update dataframe on blur instead of all changes * remove testing div wrapper * tslint - allow class arrow functions * fix regression in stylesheet * build python dist * cell reorder * fix dropdown regression * - improve stylesheet facade - fix column width bug - improve fixed columns / rows styling * fix dropdown menu regressions * sanitize stylesheet columns overrides (w/ and w/o units) * fix lint * fix click when value is undefined|null|empty * fix deletable columns * n_fixed_columns must take hidden columns into consideration * fix typo * fix header merge with fixed columns * update readme / limitations * fix fixed cell rendering after columns props change * fix fixed columns when hidden is not first or last of merged group * fix lint * cell alignment * fix dropdown alignment
HammadTheOne · Aug 17, 2018 · 5a37db7 · 5a37db7
1 parent 802907f
commit 5a37db7
Show file tree

Hide file tree

Showing 55 changed files with 17,463 additions and 1,516 deletions.
diff --git a/packages/dash-table/.babelrc b/packages/dash-table/.babelrc
@@ -1,3 +1,17 @@
 {
-  "presets": ["env", "react"]
+  "presets": [
+    ["env",
+      {
+        "targets": {
+          "browsers": [
+            "last 2 Chrome versions",
+            "last 2 Firefox versions",
+            "last 2 Safari versions",
+            "last 2 Edge versions"
+          ]
+        }
+      }
+    ],
+    "react"
+  ]
 }
diff --git a/packages/dash-table/.circleci/config.yml b/packages/dash-table/.circleci/config.yml
@@ -22,7 +22,7 @@ jobs:
 
             - run:
                 name: Run eslint
-                command: ./node_modules/.bin/eslint src
+                command: npm run lint
                 when: always
 
 

diff --git a/packages/dash-table/.eslintrc b/packages/dash-table/.eslintrc
@@ -104,7 +104,7 @@
     "yoda": ["error"],
     "spaced-comment": ["error", "always", {
       "block": {
-        exceptions: ["*"]
+        "exceptions": ["*"]
       }
     }],
     "no-unused-vars": ["error", {

diff --git a/packages/dash-table/.gitignore b/packages/dash-table/.gitignore
@@ -5,7 +5,6 @@
 
 # production
 /build
-/demo
 
 # testing
 /coverage

diff --git a/packages/dash-table/README.md b/packages/dash-table/README.md
@@ -1 +1,28 @@
 # Dash Spreadsheet
+
+## Virtualization
+    See v_be_page_usage.py and v_fe_page_usage.py for FE and BE usage scenarios.
+
+    virtual_dataframe and virtual_dataframe_indices are exposed and expected to be *readonly*. Setting them from the BE will have no impact on the FE display.
+
+### FE Virtualization
+    BE is not expected to update the dataframe when the virtualization settings are updated.
+
+### BE Virtualization
+    BE is expected to update the dataframe when the virtualization settings are updated.
+
+## Freeze Top Rows
+    Limitations
+        - the table styling is forced to { table-layout: fixed; width: 0 !important; } to ensure the frozen section and the rest of the table stay in sync (width-wise); this means that the width of the table is only driven by the width of the columns (default width is 200px)
+        - can't freeze rows and columns at the same time
+
+## Freeze Left Columns
+    Limitations
+        - performance is highly impacted if the table is in a scrollable container as the frozen columns position has to be recalculated on each scroll event; impact is minimal up to 50-100 items and makes the table difficult to use with 250-500 items
+        - can't freeze rows and columns at the same time
+        - when using merged headers, make sure that the number of fixed columns respects the merged headers, otherwise there will be some unresolved visual bugs/artefacts
+        - rows are assumed to all have the same height
+
+## Deletable Columns
+    Limitations
+        - there might be unintended side-effects if used with BE virtualization (the act of deleting a column / columns modifies the dataframe)
diff --git a/packages/dash-table/dash_table/bundle.js b/packages/dash-table/dash_table/bundle.js
diff --git a/packages/dash-table/dash_table/demo.js b/packages/dash-table/dash_table/demo.js
diff --git a/packages/dash-table/dash_table/index.html b/packages/dash-table/dash_table/index.html
@@ -0,0 +1,15 @@
+<!doctype>
+<html>
+    <head>
+        <title>dash-table</title>
+    </head>
+    <body>
+        <div id='root'></div>
+        <script src='https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js'></script>
+        <script src='https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js'></script>
+
+        <!-- <script src='https://cdnjs.cloudflare.com/ajax/libs/react/16.4.2/umd/react.development.js'></script>
+        <script src='https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.2/umd/react-dom.development.js'></script> -->
+        <script src="./demo.js"></script>
+    </body>
+</html>
diff --git a/packages/dash-table/dash_table/metadata.json b/packages/dash-table/dash_table/metadata.json
@@ -1,5 +1,5 @@
 {
-  "src/lib/components/Table.js": {
+  "src/dash-table/components/Table.js": {
     "description": "",
     "displayName": "Table",
     "methods": [],
@@ -15,13 +15,6 @@
           "computed": false
         }
       },
-      "collapsable": {
-        "type": {
-          "name": "bool"
-        },
-        "required": false,
-        "description": ""
-      },
       "columns": {
         "type": {
           "name": "arrayOf",
@@ -78,28 +71,6 @@
           "computed": false
         }
       },
-      "display_row_count": {
-        "type": {
-          "name": "number"
-        },
-        "required": false,
-        "description": "",
-        "defaultValue": {
-          "value": "20",
-          "computed": false
-        }
-      },
-      "display_tail_count": {
-        "type": {
-          "name": "number"
-        },
-        "required": false,
-        "description": "",
-        "defaultValue": {
-          "value": "5",
-          "computed": false
-        }
-      },
       "dropdown_properties": {
         "type": {
           "name": "objectOf",
@@ -158,13 +129,6 @@
         "required": false,
         "description": ""
       },
-      "expanded_rows": {
-        "type": {
-          "name": "array"
-        },
-        "required": false,
-        "description": ""
-      },
       "id": {
         "type": {
           "name": "string"
@@ -232,7 +196,10 @@
         "type": {
           "name": "arrayOf",
           "value": {
-            "name": "number"
+            "name": "arrayOf",
+            "value": {
+              "name": "number"
+            }
           }
         },
         "required": false,
@@ -268,7 +235,11 @@
           "name": "array"
         },
         "required": false,
-        "description": ""
+        "description": "",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
       },
       "sortable": {
         "type": {
@@ -296,10 +267,171 @@
       },
       "table_style": {
         "type": {
-          "name": "any"
+          "name": "arrayOf",
+          "value": {
+            "name": "shape",
+            "value": {
+              "selector": {
+                "name": "string",
+                "required": false
+              },
+              "rule": {
+                "name": "string",
+                "required": false
+              }
+            }
+          }
         },
         "required": false,
-        "description": ""
+        "description": "",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
+      },
+      "virtualization": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "'fe'",
+          "computed": false
+        }
+      },
+      "virtualization_settings": {
+        "type": {
+          "name": "shape",
+          "value": {
+            "displayed_pages": {
+              "name": "number",
+              "required": false
+            },
+            "current_page": {
+              "name": "number",
+              "required": false
+            },
+            "page_size": {
+              "name": "number",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "{\n    displayed_pages: 1,\n    current_page: 0,\n    page_size: 250\n}",
+          "computed": false
+        }
+      },
+      "navigation": {
+        "type": {
+          "name": "string"
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "'page'",
+          "computed": false
+        }
+      },
+      "filtering": {
+        "type": {
+          "name": "shape",
+          "value": {
+            "type": {
+              "name": "string",
+              "required": false
+            },
+            "options": {
+              "name": "arrayOf",
+              "value": {
+                "name": "shape",
+                "value": {
+                  "field": {
+                    "name": "string",
+                    "required": false
+                  },
+                  "rule": {
+                    "name": "any",
+                    "required": false
+                  }
+                }
+              },
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "{\n    type: 'fe',\n    options: []\n}",
+          "computed": false
+        }
+      },
+      "sorting": {
+        "type": {
+          "name": "shape",
+          "value": {
+            "type": {
+              "name": "string",
+              "required": false
+            },
+            "options": {
+              "name": "arrayOf",
+              "value": {
+                "name": "shape",
+                "value": {
+                  "field": {
+                    "name": "string",
+                    "required": false
+                  },
+                  "ascending": {
+                    "name": "custom",
+                    "raw": "PropTypes.boolean",
+                    "required": false
+                  }
+                }
+              },
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "{\n    type: 'fe',\n    options: []\n}",
+          "computed": false
+        }
+      },
+      "virtual_dataframe": {
+        "type": {
+          "name": "arrayOf",
+          "value": {
+            "name": "object"
+          }
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
+      },
+      "virtual_dataframe_indices": {
+        "type": {
+          "name": "arrayOf",
+          "value": {
+            "name": "number"
+          }
+        },
+        "required": false,
+        "description": "",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
       },
       "changed_data": {
         "defaultValue": {
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,7 +5,6 @@ @@
     # production
     /build
-    /demo
     # testing
     /coverage
@@ Expand Down @@