Add smooth scroll property

Author: Nii Yeboah

package.json

@@ -45,10 +45,10 @@
   "dependencies": {
     "@juggle/resize-observer": "^3.1.3",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "^23.2.4",
-    "@vaadin/tabs": "^23.2.4",
-    "@vaadin/vaadin-lumo-styles": "^23.2.4",
-    "@vaadin/vaadin-themable-mixin": "^23.2.4",
+    "@vaadin/component-base": "^23.2.8",
+    "@vaadin/tabs": "^23.2.8",
+    "@vaadin/vaadin-lumo-styles": "^23.2.8",
+    "@vaadin/vaadin-themable-mixin": "^23.2.8",
     "intersection-observer": "^0.10.0",
     "smoothscroll-polyfill": "^0.4.4",
     "stickyfilljs": "^2.1.0"

src/vcf-anchor-nav.js

@@ -188,6 +188,15 @@ export class AnchorNavElement extends ElementMixin(ThemableMixin(PolymerElement)
       disablePreserveOnRefresh: {
         type: Boolean,
         value: false
+      },
+
+      /**
+       * Set true to enable smooth scroll animation on tab clicks.
+       * @type {Boolean}
+       */
+      smoothScroll: {
+        type: Boolean,
+        value: true
       }
     };
   }
@@ -323,9 +332,7 @@ export class AnchorNavElement extends ElementMixin(ThemableMixin(PolymerElement)
   _initTab(tab, section) {
     tab.id = tab.id || section.defaultTabId;
     tab.setAttribute('part', 'tab');
-    tab.addEventListener('click', () => {
-      this._scrollToSection(section.id, false, this._deepLinks);
-    });
+    tab.addEventListener('click', () => this._scrollToSection(section.id, this.smoothScroll, this._deepLinks));
     this._setTabAnchor(tab, section);
   }