From 378cfcce489989f7b1c1fb8e0ef2d8462093ab6f Mon Sep 17 00:00:00 2001
From: Akshay Anand <aks9800@gmail.com>
Date: Sat, 27 Feb 2021 20:31:57 -0500
Subject: [PATCH] update date-fns package

---
 package-lock.json                             | 14 ++++-----
 package.json                                  |  2 +-
 src/components/VgtTableHeader.vue             | 30 +++++++++++--------
 vp-docs/guide/configuration/column-options.md |  2 +-
 4 files changed, 26 insertions(+), 22 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index db358cb6..8c0a9806 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,7 +8,7 @@
       "version": "2.21.5",
       "license": "MIT",
       "dependencies": {
-        "date-fns": "^2.0.0-beta.4",
+        "date-fns": "^2.17.0",
         "diacriticless": "1.0.1",
         "lodash.isequal": "^4.5.0"
       },
@@ -6383,9 +6383,9 @@
       }
     },
     "node_modules/date-fns": {
-      "version": "2.16.1",
-      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.16.1.tgz",
-      "integrity": "sha512-sAJVKx/FqrLYHAQeN7VpJrPhagZc9R4ImZIWYRFZaaohR3KzmuK88touwsSwSVT8Qcbd4zoDsnGfX4GFB4imyQ==",
+      "version": "2.17.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.17.0.tgz",
+      "integrity": "sha512-ZEhqxUtEZeGgg9eHNSOAJ8O9xqSgiJdrL0lzSSfMF54x6KXWJiOH/xntSJ9YomJPrYH/p08t6gWjGWq1SDJlSA==",
       "engines": {
         "node": ">=0.11"
       },
@@ -25337,9 +25337,9 @@
       }
     },
     "date-fns": {
-      "version": "2.16.1",
-      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.16.1.tgz",
-      "integrity": "sha512-sAJVKx/FqrLYHAQeN7VpJrPhagZc9R4ImZIWYRFZaaohR3KzmuK88touwsSwSVT8Qcbd4zoDsnGfX4GFB4imyQ=="
+      "version": "2.17.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.17.0.tgz",
+      "integrity": "sha512-ZEhqxUtEZeGgg9eHNSOAJ8O9xqSgiJdrL0lzSSfMF54x6KXWJiOH/xntSJ9YomJPrYH/p08t6gWjGWq1SDJlSA=="
     },
     "de-indent": {
       "version": "1.0.2",
diff --git a/package.json b/package.json
index 3cb7d82f..91fd1c78 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
     }
   },
   "dependencies": {
-    "date-fns": "^2.0.0-beta.4",
+    "date-fns": "^2.17.0",
     "diacriticless": "1.0.1",
     "lodash.isequal": "^4.5.0"
   },
diff --git a/src/components/VgtTableHeader.vue b/src/components/VgtTableHeader.vue
index 56f0c7f7..c1cbdab4 100644
--- a/src/components/VgtTableHeader.vue
+++ b/src/components/VgtTableHeader.vue
@@ -257,23 +257,27 @@ export default {
   mounted() {
     this.$nextTick(() => {
       // We're going to watch the parent element for resize events, and calculate column widths if it changes
-      this.ro = new ResizeObserver(() => {
-          this.setColumnStyles();
-      });
-      this.ro.observe(this.$parent.$el);
-      
-      // If this is a fixed-header table, we want to observe each column header from the non-fixed header.
-      // You can imagine two columns swapping widths, which wouldn't cause the above to trigger.
-      // This gets the first tr element of the primary table header, and iterates through its children (the th elements)
-      if (this.tableRef) {
-        Array.from(this.$parent.$refs['table-header-primary'].$el.children[0].children).forEach((header) => {
-          this.ro.observe(header);
-        })
+      if (ResizeObserver) {
+        this.ro = new ResizeObserver(() => {
+            this.setColumnStyles();
+        });
+        this.ro.observe(this.$parent.$el);
+        
+        // If this is a fixed-header table, we want to observe each column header from the non-fixed header.
+        // You can imagine two columns swapping widths, which wouldn't cause the above to trigger.
+        // This gets the first tr element of the primary table header, and iterates through its children (the th elements)
+        if (this.tableRef) {
+          Array.from(this.$parent.$refs['table-header-primary'].$el.children[0].children).forEach((header) => {
+            this.ro.observe(header);
+          })
+        }
       }
     });
   },
   beforeDestroy() {
-    this.ro.disconnect();
+    if (this.ro) {
+      this.ro.disconnect();
+    } 
   },
   components: {
     'vgt-filter-row': VgtFilterRow,
diff --git a/vp-docs/guide/configuration/column-options.md b/vp-docs/guide/configuration/column-options.md
index 18bbff77..28a7f2af 100644
--- a/vp-docs/guide/configuration/column-options.md
+++ b/vp-docs/guide/configuration/column-options.md
@@ -71,7 +71,7 @@ type `String`
 provide the format to parse date string. 
 
 ::: tip
-Vue-good-table uses date-fns for date parsing. [Check out their formats here](https://date-fns.org/v2.0.0-beta.4/docs/parse).
+Vue-good-table uses date-fns for date parsing. [Check out their formats here](https://date-fns.org/v2.17.0/docs/parse).
 :::
 
 ## dateOutputFormat