@zeedhi/vuetify 1.45.1 → 1.46.0

package/dist/zd-vuetify.esm.js

@@ -331,9 +331,7 @@ class Application extends Service {
   }
 
   register(uid, location, size) {
-    this.application[location] = {
-      [uid]: size
-    };
+    this.application[location][uid] = size;
     this.update(location);
   }
 
@@ -658,13 +656,20 @@ function createSimpleFunctional(c, el = 'div', name) {
   return Vue.extend({
     name: name || c.replace(/__/g, '-'),
     functional: true,
+    props: {
+      tag: {
+        type: String,
+        default: el
+      }
+    },
 
     render(h, {
       data,
+      props,
       children
     }) {
       data.staticClass = `${c} ${data.staticClass || ''}`.trim();
-      return h(el, data, children);
+      return h(props.tag, data, children);
     }
 
   });
@@ -963,12 +968,12 @@ function searchItems(items, search) {
  */
 
 function getSlotType(vm, name, split) {
-  if (vm.$slots[name] && vm.$scopedSlots[name] && vm.$scopedSlots[name].name) {
+  if (vm.$slots.hasOwnProperty(name) && vm.$scopedSlots.hasOwnProperty(name) && vm.$scopedSlots[name].name) {
     return split ? 'v-slot' : 'scoped';
   }
 
-  if (vm.$slots[name]) return 'normal';
-  if (vm.$scopedSlots[name]) return 'scoped';
+  if (vm.$slots.hasOwnProperty(name)) return 'normal';
+  if (vm.$scopedSlots.hasOwnProperty(name)) return 'scoped';
 }
 function debounce(fn, delay) {
   let timeoutId = 0;
@@ -994,9 +999,9 @@ function getPrefixedScopedSlots(prefix, scopedSlots) {
   }, {});
 }
 function getSlot(vm, name = 'default', data, optional = false) {
-  if (vm.$scopedSlots[name]) {
+  if (vm.$scopedSlots.hasOwnProperty(name)) {
     return vm.$scopedSlots[name](data instanceof Function ? data() : data);
-  } else if (vm.$slots[name] && (!data || optional)) {
+  } else if (vm.$slots.hasOwnProperty(name) && (!data || optional)) {
     return vm.$slots[name];
   }
 
@@ -2216,7 +2221,7 @@ class Vuetify {
 }
 Vuetify.install = install;
 Vuetify.installed = false;
-Vuetify.version = "2.5.14";
+Vuetify.version = "2.6.4";
 Vuetify.config = {
   silent: false
 };
@@ -3478,10 +3483,6 @@ function transform(el, value) {
   el.style.webkitTransform = value;
 }
 
-function opacity(el, value) {
-  el.style.opacity = value.toString();
-}
-
 function isTouchEvent(e) {
   return e.constructor.name === 'TouchEvent';
 }
@@ -3565,13 +3566,11 @@ const ripples = {
     animation.classList.add('v-ripple__animation--enter');
     animation.classList.add('v-ripple__animation--visible');
     transform(animation, `translate(${x}, ${y}) scale3d(${scale},${scale},${scale})`);
-    opacity(animation, 0);
     animation.dataset.activated = String(performance.now());
     setTimeout(() => {
       animation.classList.remove('v-ripple__animation--enter');
       animation.classList.add('v-ripple__animation--in');
       transform(animation, `translate(${centerX}, ${centerY}) scale3d(1,1,1)`);
-      opacity(animation, 0.25);
     }, 0);
   },
 
@@ -3586,7 +3585,6 @@ const ripples = {
     setTimeout(() => {
       animation.classList.remove('v-ripple__animation--in');
       animation.classList.add('v-ripple__animation--out');
-      opacity(animation, 0);
       setTimeout(() => {
         const ripples = el.getElementsByClassName('v-ripple__animation');
 
@@ -4062,10 +4060,10 @@ function factory$2(prop = 'value', event = 'input') {
 const Toggleable = factory$2();
 
 // Styles
-const baseMixins$t = mixins(VToolbar, Scrollable, SSRBootable, Toggleable, applicationable('top', ['clippedLeft', 'clippedRight', 'computedHeight', 'invertedScroll', 'isExtended', 'isProminent', 'value']));
+const baseMixins$u = mixins(VToolbar, Scrollable, SSRBootable, Toggleable, applicationable('top', ['clippedLeft', 'clippedRight', 'computedHeight', 'invertedScroll', 'isExtended', 'isProminent', 'value']));
 /* @vue/component */
 
-var VAppBar = baseMixins$t.extend({
+var VAppBar = baseMixins$u.extend({
   name: 'v-app-bar',
   directives: {
     Scroll
@@ -4847,10 +4845,6 @@ var Routable = Vue.extend({
   },
 
   methods: {
-    click(e) {
-      this.$emit('click', e);
-    },
-
     generateRouteLink() {
       let exact = this.exact;
       let tag;
@@ -4866,7 +4860,9 @@ var Routable = Vue.extend({
           value: this.computedRipple
         }],
         [this.to ? 'nativeOn' : 'on']: { ...this.$listeners,
-          click: this.click
+          ...('click' in this ? {
+            click: this.click
+          } : undefined)
         },
         ref: 'link'
       };
@@ -4910,8 +4906,8 @@ var Routable = Vue.extend({
 
     onRouteChange() {
       if (!this.to || !this.$refs.link || !this.$route) return;
-      const activeClass = `${this.activeClass} ${this.proxyClass || ''}`.trim();
-      const exactActiveClass = `${this.exactActiveClass} ${this.proxyClass || ''}`.trim() || activeClass;
+      const activeClass = `${this.activeClass || ''} ${this.proxyClass || ''}`.trim();
+      const exactActiveClass = `${this.exactActiveClass || ''} ${this.proxyClass || ''}`.trim() || activeClass;
       const path = '_vnode.data.class.' + (this.exact ? exactActiveClass : activeClass);
       this.$nextTick(() => {
         /* istanbul ignore else */
@@ -4929,10 +4925,10 @@ var Routable = Vue.extend({
 });
 
 // Styles
-const baseMixins$s = mixins(VSheet, Routable, Positionable, Sizeable, factory$1('btnToggle'), factory$2('inputValue')
+const baseMixins$t = mixins(VSheet, Routable, Positionable, Sizeable, factory$1('btnToggle'), factory$2('inputValue')
 /* @vue/component */
 );
-var VBtn = baseMixins$s.extend().extend({
+var VBtn = baseMixins$t.extend().extend({
   name: 'v-btn',
   props: {
     activeClass: {
@@ -5831,10 +5827,10 @@ var Delayable = Vue.extend().extend({
 });
 
 // Mixins
-const baseMixins$r = mixins(Delayable, Toggleable);
+const baseMixins$s = mixins(Delayable, Toggleable);
 /* @vue/component */
 
-var Activatable = baseMixins$r.extend({
+var Activatable = baseMixins$s.extend({
   name: 'activatable',
   props: {
     activator: {
@@ -5845,6 +5841,10 @@ var Activatable = baseMixins$r.extend({
     },
     disabled: Boolean,
     internalActivator: Boolean,
+    openOnClick: {
+      type: Boolean,
+      default: true
+    },
     openOnHover: Boolean,
     openOnFocus: Boolean
   },
@@ -5897,7 +5897,7 @@ var Activatable = baseMixins$r.extend({
 
     genActivatorAttributes() {
       return {
-        role: 'button',
+        role: this.openOnClick && !this.openOnHover ? 'button' : undefined,
         'aria-haspopup': true,
         'aria-expanded': String(this.isActive)
       };
@@ -5917,7 +5917,7 @@ var Activatable = baseMixins$r.extend({
           this.getActivator(e);
           this.runDelay('close');
         };
-      } else {
+      } else if (this.openOnClick) {
         listeners.click = e => {
           const activator = this.getActivator(e);
           if (activator) activator.focus();
@@ -6321,10 +6321,10 @@ var Detachable = mixins(Bootable).extend({
 });
 
 // Mixins
-const baseMixins$q = mixins(Stackable, factory$3(['top', 'right', 'bottom', 'left', 'absolute']), Activatable, Detachable);
+const baseMixins$r = mixins(Stackable, factory$3(['top', 'right', 'bottom', 'left', 'absolute']), Activatable, Detachable);
 /* @vue/component */
 
-var Menuable = baseMixins$q.extend().extend({
+var Menuable = baseMixins$r.extend().extend({
   name: 'menuable',
   props: {
     allowOverflow: Boolean,
@@ -6356,7 +6356,6 @@ var Menuable = baseMixins$q.extend().extend({
       default: 0
     },
     offsetOverflow: Boolean,
-    openOnClick: Boolean,
     positionX: {
       type: Number,
       default: null
@@ -6416,7 +6415,8 @@ var Menuable = baseMixins$q.extend().extend({
       const activatorLeft = (this.attach !== false ? a.offsetLeft : a.left) || 0;
       const minWidth = Math.max(a.width, c.width);
       let left = 0;
-      left += this.left ? activatorLeft - (minWidth - a.width) : activatorLeft;
+      left += activatorLeft;
+      if (this.left || this.$vuetify.rtl && !this.right) left -= minWidth - a.width;
 
       if (this.offsetX) {
         const maxWidth = isNaN(Number(this.maxWidth)) ? a.width : Math.min(a.width, Number(this.maxWidth));
@@ -6574,14 +6574,16 @@ var Menuable = baseMixins$q.extend().extend({
       const listeners = Activatable.options.methods.genActivatorListeners.call(this);
       const onClick = listeners.click;
 
-      listeners.click = e => {
-        if (this.openOnClick) {
-          onClick && onClick(e);
-        }
+      if (onClick) {
+        listeners.click = e => {
+          if (this.openOnClick) {
+            onClick && onClick(e);
+          }
 
-        this.absoluteX = e.clientX;
-        this.absoluteY = e.clientY;
-      };
+          this.absoluteX = e.clientX;
+          this.absoluteY = e.clientY;
+        };
+      }
 
       return listeners;
     },
@@ -6730,10 +6732,10 @@ var Returnable = Vue.extend({
 });
 
 // Styles
-const baseMixins$p = mixins(Dependent, Delayable, Menuable, Returnable, Roundable, Toggleable, Themeable);
+const baseMixins$q = mixins(Dependent, Delayable, Returnable, Roundable, Themeable, Menuable);
 /* @vue/component */
 
-var VMenu = baseMixins$p.extend({
+var VMenu = baseMixins$q.extend({
   name: 'v-menu',
   directives: {
     ClickOutside,
@@ -6766,10 +6768,6 @@ var VMenu = baseMixins$p.extend({
     },
     offsetX: Boolean,
     offsetY: Boolean,
-    openOnClick: {
-      type: Boolean,
-      default: true
-    },
     openOnHover: Boolean,
     origin: {
       type: String,
@@ -7083,7 +7081,9 @@ var VMenu = baseMixins$p.extend({
     mouseLeaveHandler(e) {
       // Prevent accidental re-activation
       this.runDelay('close', () => {
-        if (this.$refs.content.contains(e.relatedTarget)) return;
+        var _this$$refs$content;
+
+        if ((_this$$refs$content = this.$refs.content) != null && _this$$refs$content.contains(e.relatedTarget)) return;
         requestAnimationFrame(() => {
           this.isActive = false;
           this.callDeactivate();
@@ -7412,10 +7412,10 @@ var VList = VSheet.extend().extend({
 });
 
 // Styles
-const baseMixins$o = mixins(Colorable, Routable, Themeable, factory$1('listItemGroup'), factory$2('inputValue'));
+const baseMixins$p = mixins(Colorable, Routable, Themeable, factory$1('listItemGroup'), factory$2('inputValue'));
 /* @vue/component */
 
-var VListItem = baseMixins$o.extend().extend({
+var VListItem = baseMixins$p.extend().extend({
   name: 'v-list-item',
   directives: {
     Ripple
@@ -7576,8 +7576,8 @@ var VListItemIcon = Vue.extend({
 });
 
 // Styles
-const baseMixins$n = mixins(BindsAttrs, Bootable, Colorable, inject('list'), Toggleable);
-var VListGroup = baseMixins$n.extend().extend({
+const baseMixins$o = mixins(BindsAttrs, Bootable, Colorable, inject('list'), Toggleable);
+var VListGroup = baseMixins$o.extend().extend({
   name: 'v-list-group',
   directives: {
     ripple: Ripple
@@ -7734,6 +7734,16 @@ var VListGroup = baseMixins$n.extend().extend({
 
 });
 
+var Comparable = Vue.extend({
+  name: 'comparable',
+  props: {
+    valueComparator: {
+      type: Function,
+      default: deepEqual
+    }
+  }
+});
+
 function factory(prop = 'value', event = 'change') {
   return Vue.extend({
     name: 'proxyable',
@@ -7780,7 +7790,7 @@ function factory(prop = 'value', event = 'change') {
 const Proxyable = factory();
 
 // Styles
-const BaseItemGroup = mixins(Proxyable, Themeable).extend({
+const BaseItemGroup = mixins(Comparable, Proxyable, Themeable).extend({
   name: 'base-item-group',
   props: {
     activeClass: {
@@ -7839,13 +7849,13 @@ const BaseItemGroup = mixins(Proxyable, Themeable).extend({
 
     toggleMethod() {
       if (!this.multiple) {
-        return v => this.internalValue === v;
+        return v => this.valueComparator(this.internalValue, v);
       }
 
       const internalValue = this.internalValue;
 
       if (Array.isArray(internalValue)) {
-        return v => internalValue.includes(v);
+        return v => internalValue.some(intern => this.valueComparator(intern, v));
       }
 
       return () => false;
@@ -7871,7 +7881,7 @@ const BaseItemGroup = mixins(Proxyable, Themeable).extend({
     },
 
     getValue(item, i) {
-      return item.value == null || item.value === '' ? i : item.value;
+      return item.value === undefined ? i : item.value;
     },
 
     onClick(item) {
@@ -8458,10 +8468,10 @@ var VMessages = mixins(Colorable, Themeable).extend({
 });
 
 // Mixins
-const baseMixins$m = mixins(Colorable, inject('form'), Themeable);
+const baseMixins$n = mixins(Colorable, inject('form'), Themeable);
 /* @vue/component */
 
-var Validatable = baseMixins$m.extend({
+var Validatable = baseMixins$n.extend({
   name: 'validatable',
   props: {
     disabled: Boolean,
@@ -8710,10 +8720,10 @@ var Validatable = baseMixins$m.extend({
 });
 
 // Styles
-const baseMixins$l = mixins(BindsAttrs, Validatable);
+const baseMixins$m = mixins(BindsAttrs, Validatable);
 /* @vue/component */
 
-var VInput = baseMixins$l.extend().extend({
+var VInput = baseMixins$m.extend().extend({
   name: 'v-input',
   inheritAttrs: false,
   props: {
@@ -8725,6 +8735,7 @@ var VInput = baseMixins$l.extend().extend({
     dense: Boolean,
     height: [Number, String],
     hideDetails: [Boolean, String],
+    hideSpinButtons: Boolean,
     hint: String,
     id: String,
     label: String,
@@ -8754,6 +8765,7 @@ var VInput = baseMixins$l.extend().extend({
         'v-input--is-loading': this.loading !== false && this.loading != null,
         'v-input--is-readonly': this.isReadonly,
         'v-input--dense': this.dense,
+        'v-input--hide-spin-buttons': this.hideSpinButtons,
         ...this.themeClasses
       };
     },
@@ -9061,10 +9073,10 @@ function intersectable(options) {
   });
 }
 
-const baseMixins$k = mixins(Colorable, factory$3(['absolute', 'fixed', 'top', 'bottom']), Proxyable, Themeable);
+const baseMixins$l = mixins(Colorable, factory$3(['absolute', 'fixed', 'top', 'bottom']), Proxyable, Themeable);
 /* @vue/component */
 
-var VProgressLinear = baseMixins$k.extend({
+var VProgressLinear = baseMixins$l.extend({
   name: 'v-progress-linear',
   directives: {
     intersect: Intersect
@@ -9339,13 +9351,13 @@ var Loadable = Vue.extend().extend({
 });
 
 // Styles
-const baseMixins$j = mixins(VInput, intersectable({
+const baseMixins$k = mixins(VInput, intersectable({
   onVisible: ['onResize', 'tryAutofocus']
 }), Loadable);
 const dirtyTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week', 'month'];
 /* @vue/component */
 
-var VTextField = baseMixins$j.extend().extend({
+var VTextField = baseMixins$k.extend().extend({
   name: 'v-text-field',
   directives: {
     resize: Resize,
@@ -9850,16 +9862,6 @@ var VTextField = baseMixins$j.extend().extend({
   }
 });
 
-var Comparable = Vue.extend({
-  name: 'comparable',
-  props: {
-    valueComparator: {
-      type: Function,
-      default: deepEqual
-    }
-  }
-});
-
 /* @vue/component */
 
 var Filterable = Vue.extend({
@@ -9881,10 +9883,10 @@ const defaultMenuProps$1 = {
   maxHeight: 304
 }; // Types
 
-const baseMixins$i = mixins(VTextField, Comparable, Dependent, Filterable);
+const baseMixins$j = mixins(VTextField, Comparable, Dependent, Filterable);
 /* @vue/component */
 
-var VSelect = baseMixins$i.extend().extend({
+var VSelect = baseMixins$j.extend().extend({
   name: 'v-select',
   directives: {
     ClickOutside
@@ -10081,6 +10083,14 @@ var VSelect = baseMixins$i.extend().extend({
     internalValue(val) {
       this.initialValue = val;
       this.setSelectedItems();
+
+      if (this.multiple) {
+        this.$nextTick(() => {
+          var _this$$refs$menu;
+
+          (_this$$refs$menu = this.$refs.menu) == null ? void 0 : _this$$refs$menu.updateDimensions();
+        });
+      }
     },
 
     isMenuActive(val) {
@@ -10140,7 +10150,12 @@ var VSelect = baseMixins$i.extend().extend({
       const uniqueValues = new Map();
 
       for (let index = 0; index < arr.length; ++index) {
-        const item = arr[index]; // Do not deduplicate headers or dividers (#12517)
+        const item = arr[index]; // Do not return null values if existant (#14421)
+
+        if (item == null) {
+          continue;
+        } // Do not deduplicate headers or dividers (#12517)
+
 
         if (item.header || item.divider) {
           uniqueValues.set(item, item);
@@ -10600,13 +10615,7 @@ var VSelect = baseMixins$i.extend().extend({
         i !== -1 ? internalValue.splice(i, 1) : internalValue.push(item);
         this.setValue(internalValue.map(i => {
           return this.returnObject ? i : this.getValue(i);
-        })); // When selecting multiple
-        // adjust menu after each
-        // selection
-
-        this.$nextTick(() => {
-          this.$refs.menu && this.$refs.menu.updateDimensions();
-        }); // There is no item to re-highlight
+        })); // There is no item to re-highlight
         // when selections are hidden
 
         if (this.hideSelected) {
@@ -10969,6 +10978,7 @@ var VAutocomplete = VSelect.extend({
       const value = target.value; // If typing and menu is not currently active
 
       if (target.value) this.activateMenu();
+      if (!this.multiple && value === '') this.deleteCurrentItem();
       this.internalSearch = value;
       this.badInput = target.validity && target.validity.badInput;
     },
@@ -11388,7 +11398,7 @@ mixins(VSheet, Mobile, Toggleable).extend({
   },
 
   render(h) {
-    return h(VExpandTransition, [h('div', this.setBackgroundColor(this.color, {
+    const data = {
       staticClass: 'v-banner',
       attrs: this.attrs$,
       class: this.classes,
@@ -11397,7 +11407,8 @@ mixins(VSheet, Mobile, Toggleable).extend({
         name: 'show',
         value: this.isActive
       }]
-    }), [this.genWrapper()])]);
+    };
+    return h(VExpandTransition, [h('div', this.outlined ? data : this.setBackgroundColor(this.color, data), [this.genWrapper()])]);
   }
 
 });
@@ -11484,6 +11495,9 @@ mixins(applicationable('bottom', ['height', 'inputValue']), Colorable, Measurabl
     }
 
   },
+  watch: {
+    canScroll: 'onScroll'
+  },
 
   created() {
     /* istanbul ignore next */
@@ -11494,8 +11508,13 @@ mixins(applicationable('bottom', ['height', 'inputValue']), Colorable, Measurabl
 
   methods: {
     thresholdMet() {
-      this.isActive = !this.isScrollingUp;
-      this.$emit('update:input-value', this.isActive);
+      if (this.hideOnScroll) {
+        this.isActive = !this.isScrollingUp || this.currentScroll > this.computedScrollThreshold;
+        this.$emit('update:input-value', this.isActive);
+      }
+
+      if (this.currentThreshold < this.computedScrollThreshold) return;
+      this.savedScroll = this.currentScroll;
     },
 
     updateApplication() {
@@ -11809,10 +11828,10 @@ var Overlayable = Vue.extend().extend({
 });
 
 // Styles
-const baseMixins$h = mixins(Activatable, Dependent, Detachable, Overlayable, Returnable, Stackable, Toggleable);
+const baseMixins$i = mixins(Dependent, Detachable, Overlayable, Returnable, Stackable, Activatable);
 /* @vue/component */
 
-var VDialog = baseMixins$h.extend({
+var VDialog = baseMixins$i.extend({
   name: 'v-dialog',
   directives: {
     ClickOutside
@@ -11822,10 +11841,7 @@ var VDialog = baseMixins$h.extend({
     disabled: Boolean,
     fullscreen: Boolean,
     light: Boolean,
-    maxWidth: {
-      type: [String, Number],
-      default: 'none'
-    },
+    maxWidth: [String, Number],
     noClickAnimation: Boolean,
     origin: {
       type: String,
@@ -11841,10 +11857,7 @@ var VDialog = baseMixins$h.extend({
       type: [String, Boolean],
       default: 'dialog-transition'
     },
-    width: {
-      type: [String, Number],
-      default: 'auto'
-    }
+    width: [String, Number]
   },
 
   data() {
@@ -11852,7 +11865,6 @@ var VDialog = baseMixins$h.extend({
       activatedBy: null,
       animate: false,
       animateTimeout: -1,
-      isActive: !!this.value,
       stackMinZIndex: 200,
       previousActiveElement: null
     };
@@ -12033,8 +12045,9 @@ var VDialog = baseMixins$h.extend({
       }, [this.$createElement('div', {
         class: this.contentClasses,
         attrs: {
-          role: 'document',
+          role: 'dialog',
           tabindex: this.isActive ? 0 : undefined,
+          'aria-modal': this.hideOverlay ? undefined : 'true',
           ...this.getScopeIdAttrs()
         },
         on: {
@@ -12081,8 +12094,8 @@ var VDialog = baseMixins$h.extend({
 
       if (!this.fullscreen) {
         data.style = { ...data.style,
-          maxWidth: this.maxWidth === 'none' ? undefined : convertToUnit(this.maxWidth),
-          width: this.width === 'auto' ? undefined : convertToUnit(this.width)
+          maxWidth: convertToUnit(this.maxWidth),
+          width: convertToUnit(this.width)
         };
       }
 
@@ -12096,9 +12109,6 @@ var VDialog = baseMixins$h.extend({
       staticClass: 'v-dialog__container',
       class: {
         'v-dialog__container--attached': this.attach === '' || this.attach === true || this.attach === 'attach'
-      },
-      attrs: {
-        role: 'dialog'
       }
     }, [this.genActivator(), this.genContent()]);
   }
@@ -12111,10 +12121,7 @@ var VBottomSheet = VDialog.extend({
   name: 'v-bottom-sheet',
   props: {
     inset: Boolean,
-    maxWidth: {
-      type: [String, Number],
-      default: 'auto'
-    },
+    maxWidth: [String, Number],
     transition: {
       type: String,
       default: 'bottom-sheet-transition'
@@ -12355,11 +12362,16 @@ var Mouse = Vue.extend({
 
 
             if (e && 'touches' in e) {
-              var _e$target, _e$target2;
+              var _e$currentTarget, _e$target;
+
+              const classSeparator = ' ';
+              const eventTargetClasses = (_e$currentTarget = e.currentTarget) == null ? void 0 : _e$currentTarget.className.split(classSeparator);
+              const currentTargets = document.elementsFromPoint(e.changedTouches[0].clientX, e.changedTouches[0].clientY); // Get "the same kind" current hovering target by checking
+              // If element has the same class of initial touch start element (which has touch event listener registered)
 
-              const currentTarget = document.elementFromPoint(e.changedTouches[0].clientX, e.changedTouches[0].clientY);
+              const currentTarget = currentTargets.find(t => t.className.split(classSeparator).some(c => eventTargetClasses.includes(c)));
 
-              if (currentTarget && !((_e$target = e.target) != null && _e$target.isSameNode(currentTarget)) && ((_e$target2 = e.target) == null ? void 0 : _e$target2.className) === currentTarget.className) {
+              if (currentTarget && !((_e$target = e.target) != null && _e$target.isSameNode(currentTarget))) {
                 currentTarget.dispatchEvent(new TouchEvent(e.type, {
                   changedTouches: e.changedTouches,
                   targetTouches: e.targetTouches,
@@ -12369,7 +12381,7 @@ var Mouse = Vue.extend({
               }
             }
 
-            this.$emit(event, getEvent(e));
+            this.$emit(event, getEvent(e), e);
           }
 
           return eventOptions.result;
@@ -14049,9 +14061,12 @@ var CalendarWithEvents = CalendarBase.extend({
           name: 'ripple',
           value: (_this$eventRipple2 = this.eventRipple) != null ? _this$eventRipple2 : true
         }],
-        on: {
-          click: () => this.$emit('click:more', day)
-        },
+        on: this.getDefaultMouseEventHandlers(':more', nativeEvent => {
+          return {
+            nativeEvent,
+            ...day
+          };
+        }),
         style: {
           display: 'none',
           height: `${eventHeight}px`,
@@ -14304,7 +14319,12 @@ var VCalendarWeekly = CalendarBase.extend({
         key: day.date,
         staticClass: 'v-calendar-weekly__day',
         class: this.getRelativeClasses(day, outside),
-        on: this.getDefaultMouseEventHandlers(':day', _e => day)
+        on: this.getDefaultMouseEventHandlers(':day', nativeEvent => {
+          return {
+            nativeEvent,
+            ...day
+          };
+        })
       }, [this.genDayLabel(day), ...(getSlot(this, 'day', () => ({
         outside,
         index,
@@ -14340,7 +14360,10 @@ var VCalendarWeekly = CalendarBase.extend({
             prevent: true,
             result: false
           }
-        }, _e => day)
+        }, nativeEvent => ({
+          nativeEvent,
+          ...day
+        }))
       }, hasMonth ? this.monthFormatter(day, this.shortMonths) + ' ' + this.dayFormatter(day, false) : this.dayFormatter(day, false));
     },
 
@@ -14613,8 +14636,11 @@ var VCalendarDaily = CalendarWithIntervals.extend({
         key: day.date,
         staticClass: 'v-calendar-daily_head-day',
         class: this.getRelativeClasses(day),
-        on: this.getDefaultMouseEventHandlers(':day', _e => {
-          return this.getSlotScope(day);
+        on: this.getDefaultMouseEventHandlers(':day', nativeEvent => {
+          return {
+            nativeEvent,
+            ...this.getSlotScope(day)
+          };
         })
       }, [this.genHeadWeekday(day), this.genHeadDayLabel(day), ...this.genDayHeader(day, index)]);
     },
@@ -14659,8 +14685,11 @@ var VCalendarDaily = CalendarWithIntervals.extend({
             prevent: true,
             result: false
           }
-        }, _e => {
-          return day;
+        }, nativeEvent => {
+          return {
+            nativeEvent,
+            ...day
+          };
         })
       }, this.dayFormatter(day, false));
     },
@@ -14703,8 +14732,11 @@ var VCalendarDaily = CalendarWithIntervals.extend({
         key: day.date,
         staticClass: 'v-calendar-daily__day',
         class: this.getRelativeClasses(day),
-        on: this.getDefaultMouseEventHandlers(':time', e => {
-          return this.getSlotScope(this.getTimestampAtEvent(e, day));
+        on: this.getDefaultMouseEventHandlers(':time', nativeEvent => {
+          return {
+            nativeEvent,
+            ...this.getSlotScope(this.getTimestampAtEvent(nativeEvent, day))
+          };
         })
       }, [...this.genDayIntervals(index), ...this.genDayBody(day)]);
     },
@@ -14739,8 +14771,11 @@ var VCalendarDaily = CalendarWithIntervals.extend({
         style: {
           width
         },
-        on: this.getDefaultMouseEventHandlers(':interval', e => {
-          return this.getTimestampAtEvent(e, this.parsedStart);
+        on: this.getDefaultMouseEventHandlers(':interval', nativeEvent => {
+          return {
+            nativeEvent,
+            ...this.getTimestampAtEvent(nativeEvent, this.parsedStart)
+          };
         })
       };
       return this.$createElement('div', data, this.genIntervalLabels());
@@ -14936,7 +14971,7 @@ var VCalendarCategory = VCalendarDaily.extend({
 // Styles
 /* @vue/component */
 
-CalendarWithEvents.extend({
+var VCalendar = CalendarWithEvents.extend({
   name: 'v-calendar',
   props: { ...props.calendar,
     ...props.weeks,
@@ -15307,13 +15342,13 @@ CalendarWithEvents.extend({
         value: this.updateEventVisibility
       }],
       on: { ...this.$listeners,
-        'click:date': day => {
+        'click:date': (day, e) => {
           if (this.$listeners.input) {
             this.$emit('input', day.date);
           }
 
           if (this.$listeners['click:date']) {
-            this.$emit('click:date', day);
+            this.$emit('click:date', day, e);
           }
         }
       },
@@ -15862,8 +15897,8 @@ VWindow.extend({
 });
 
 // Mixins
-const baseMixins$g = mixins(Bootable, factory$1('windowGroup', 'v-window-item', 'v-window'));
-var VWindowItem = baseMixins$g.extend().extend().extend({
+const baseMixins$h = mixins(Bootable, factory$1('windowGroup', 'v-window-item', 'v-window'));
+var VWindowItem = baseMixins$h.extend().extend().extend({
   name: 'v-window-item',
   directives: {
     Touch
@@ -16000,10 +16035,10 @@ var VWindowItem = baseMixins$g.extend().extend().extend({
 
 // Extensions
 
-const baseMixins$f = mixins(VWindowItem, Routable);
+const baseMixins$g = mixins(VWindowItem, Routable);
 /* @vue/component */
 
-baseMixins$f.extend().extend({
+baseMixins$g.extend().extend({
   name: 'v-carousel-item',
   inject: {
     parentTheme: {
@@ -16339,6 +16374,13 @@ var VCheckbox = Selectable.extend({
 });
 
 // Styles
+
+function bias(val) {
+  const c = 0.501;
+  const x = Math.abs(val);
+  return Math.sign(val) * (x / ((1 / c - 2) * (1 - x) + 1));
+}
+
 function calculateUpdatedOffset(selectedElement, widths, rtl, currentScrollOffset) {
   const clientWidth = selectedElement.clientWidth;
   const offsetLeft = rtl ? widths.content - selectedElement.offsetLeft - clientWidth : selectedElement.offsetLeft;
@@ -16482,7 +16524,10 @@ const BaseSlideGroup = mixins(BaseItemGroup, Mobile).extend({
     isOverflowing: 'setWidths',
 
     scrollOffset(val) {
-      this.$refs.content.style.transform = `translateX(${-val}px)`;
+      if (this.$vuetify.rtl) val = -val;
+      let scroll = val <= 0 ? bias(-val) : val > this.widths.content - this.widths.wrapper ? -(this.widths.content - this.widths.wrapper) + bias(this.widths.content - this.widths.wrapper - val) : -val;
+      if (this.$vuetify.rtl) scroll = -scroll;
+      this.$refs.content.style.transform = `translateX(${scroll}px)`;
     }
 
   },
@@ -16723,10 +16768,9 @@ const BaseSlideGroup = mixins(BaseItemGroup, Mobile).extend({
       }, this.$vuetify.rtl, this.scrollOffset);
     },
 
-    setWidths
-    /* istanbul ignore next */
-    () {
+    setWidths() {
       window.requestAnimationFrame(() => {
+        if (this._isDestroyed) return;
         const {
           content,
           wrapper
@@ -18640,7 +18684,7 @@ VAutocomplete.extend({
     },
 
     setValue(value) {
-      VSelect.options.methods.setValue.call(this, value != null ? value : this.internalSearch);
+      VSelect.options.methods.setValue.call(this, value === undefined ? this.internalSearch : value);
     },
 
     updateEditing() {
@@ -18743,12 +18787,10 @@ var VData = Vue.extend({
       default: () => ({})
     },
     sortBy: {
-      type: [String, Array],
-      default: () => []
+      type: [String, Array]
     },
     sortDesc: {
-      type: [Boolean, Array],
-      default: () => []
+      type: [Boolean, Array]
     },
     customSort: {
       type: Function,
@@ -19912,7 +19954,7 @@ var VDataTableHeaderDesktop = mixins(header).extend({
         return this.$createElement('th', data, [this.genSelectAll()]);
       }
 
-      children.push(this.$scopedSlots[header.value] ? this.$scopedSlots[header.value]({
+      children.push(this.$scopedSlots.hasOwnProperty(header.value) ? this.$scopedSlots[header.value]({
         header
       }) : this.$createElement('span', [header.text]));
 
@@ -20020,6 +20062,13 @@ var VDataTableHeader = Vue.extend({
 });
 
 // Types
+
+function needsTd(slot) {
+  var _slot$;
+
+  return slot.length !== 1 || !['td', 'th'].includes((_slot$ = slot[0]) == null ? void 0 : _slot$.tag);
+}
+
 var Row = Vue.extend({
   name: 'row',
   functional: true,
@@ -20040,29 +20089,29 @@ var Row = Vue.extend({
       const children = [];
       const value = getObjectValueByPath(props.item, header.value);
       const slotName = header.value;
-      const scopedSlot = data.scopedSlots && data.scopedSlots[slotName];
-      const regularSlot = computedSlots[slotName];
+      const scopedSlot = data.scopedSlots && data.scopedSlots.hasOwnProperty(slotName) && data.scopedSlots[slotName];
+      const regularSlot = computedSlots.hasOwnProperty(slotName) && computedSlots[slotName];
 
       if (scopedSlot) {
-        children.push(scopedSlot({
+        children.push(...wrapInArray(scopedSlot({
           item: props.item,
           isMobile: false,
           header,
           index: props.index,
           value
-        }));
+        })));
       } else if (regularSlot) {
-        children.push(regularSlot);
+        children.push(...wrapInArray(regularSlot));
       } else {
         children.push(value == null ? value : String(value));
       }
 
       const textAlign = `text-${header.align || 'start'}`;
-      return h('td', {
+      return needsTd(children) ? h('td', {
         class: [textAlign, header.cellClass, {
           'v-data-table__divider': header.divider
         }]
-      }, children);
+      }, children) : children;
     });
     return h('tr', data, columns);
   }
@@ -20183,8 +20232,8 @@ var MobileRow = Vue.extend({
       const children = [];
       const value = getObjectValueByPath(props.item, header.value);
       const slotName = header.value;
-      const scopedSlot = data.scopedSlots && data.scopedSlots[slotName];
-      const regularSlot = computedSlots[slotName];
+      const scopedSlot = data.scopedSlots && data.scopedSlots.hasOwnProperty(slotName) && data.scopedSlots[slotName];
+      const regularSlot = computedSlots.hasOwnProperty(slotName) && computedSlots[slotName];
 
       if (scopedSlot) {
         children.push(scopedSlot({
@@ -20947,8 +20996,8 @@ mixins(Returnable, Themeable).extend({
 
 });
 
-const baseMixins$e = mixins(VSimpleTable);
-baseMixins$e.extend().extend({
+const baseMixins$f = mixins(VSimpleTable);
+baseMixins$f.extend().extend({
   name: 'v-virtual-table',
   props: {
     chunkSize: {
@@ -21485,7 +21534,7 @@ var DatePickerTable = mixins(Colorable, Localable, Themeable
   },
 
   methods: {
-    genButtonClasses(isAllowed, isFloating, isSelected, isCurrent) {
+    genButtonClasses(isAllowed, isFloating, isSelected, isCurrent, isFirst, isLast) {
       return {
         'v-size--default': !isFloating,
         'v-date-picker-table__current': isCurrent,
@@ -21495,6 +21544,8 @@ var DatePickerTable = mixins(Colorable, Localable, Themeable
         'v-btn--rounded': isFloating,
         'v-btn--disabled': !isAllowed || this.disabled,
         'v-btn--outlined': isCurrent && !isSelected,
+        'v-date-picker--first-in-range': isFirst,
+        'v-date-picker--last-in-range': isLast,
         ...this.themeClasses
       };
     },
@@ -21514,9 +21565,17 @@ var DatePickerTable = mixins(Colorable, Localable, Themeable
       const isCurrent = value === this.current;
       const setColor = isSelected ? this.setBackgroundColor : this.setTextColor;
       const color = (isSelected || isCurrent) && (this.color || 'accent');
+      let isFirst = false;
+      let isLast = false;
+
+      if (this.range && !!this.value && Array.isArray(this.value)) {
+        isFirst = value === this.value[0];
+        isLast = value === this.value[this.value.length - 1];
+      }
+
       return this.$createElement('button', setColor(color, {
         staticClass: 'v-btn',
-        class: this.genButtonClasses(isAllowed && !isOtherMonth, isFloating, isSelected, isCurrent),
+        class: this.genButtonClasses(isAllowed && !isOtherMonth, isFloating, isSelected, isCurrent, isFirst, isLast),
         attrs: {
           type: 'button'
         },
@@ -22715,10 +22774,10 @@ var VExpansionPanel = mixins(factory$1('expansionPanels', 'v-expansion-panel', '
 
 });
 
-const baseMixins$d = mixins(Bootable, Colorable, inject('expansionPanel', 'v-expansion-panel-content', 'v-expansion-panel'));
+const baseMixins$e = mixins(Bootable, Colorable, inject('expansionPanel', 'v-expansion-panel-content', 'v-expansion-panel'));
 /* @vue/component */
 
-var VExpansionPanelContent = baseMixins$d.extend().extend({
+var VExpansionPanelContent = baseMixins$e.extend().extend({
   name: 'v-expansion-panel-content',
   data: () => ({
     isActive: false
@@ -22764,8 +22823,8 @@ var VExpansionPanelContent = baseMixins$d.extend().extend({
 });
 
 // Components
-const baseMixins$c = mixins(Colorable, inject('expansionPanel', 'v-expansion-panel-header', 'v-expansion-panel'));
-var VExpansionPanelHeader = baseMixins$c.extend().extend({
+const baseMixins$d = mixins(Colorable, inject('expansionPanel', 'v-expansion-panel-header', 'v-expansion-panel'));
+var VExpansionPanelHeader = baseMixins$d.extend().extend({
   name: 'v-expansion-panel-header',
   directives: {
     ripple: Ripple
@@ -23925,10 +23984,10 @@ mixins(Measurable, Toggleable).extend({
 });
 
 // Styles
-const baseMixins$b = mixins(applicationable('left', ['isActive', 'isMobile', 'miniVariant', 'expandOnHover', 'permanent', 'right', 'temporary', 'width']), Colorable, Dependent, Mobile, Overlayable, SSRBootable, Themeable);
+const baseMixins$c = mixins(applicationable('left', ['isActive', 'isMobile', 'miniVariant', 'expandOnHover', 'permanent', 'right', 'temporary', 'width']), Colorable, Dependent, Mobile, Overlayable, SSRBootable, Themeable);
 /* @vue/component */
 
-var VNavigationDrawer = baseMixins$b.extend({
+var VNavigationDrawer = baseMixins$c.extend({
   name: 'v-navigation-drawer',
   directives: {
     ClickOutside,
@@ -24205,6 +24264,8 @@ var VNavigationDrawer = baseMixins$b.extend({
 
     genListeners() {
       const on = {
+        mouseenter: () => this.isMouseover = true,
+        mouseleave: () => this.isMouseover = false,
         transitionend: e => {
           if (e.target !== e.currentTarget) return;
           this.$emit('transitionend', e); // IE11 does not support new Event('resize')
@@ -24219,12 +24280,6 @@ var VNavigationDrawer = baseMixins$b.extend({
         on.click = () => this.$emit('update:mini-variant', false);
       }
 
-      if (this.expandOnHover) {
-        on.mouseenter = () => this.isMouseover = true;
-
-        on.mouseleave = () => this.isMouseover = false;
-      }
-
       return on;
     },
 
@@ -24287,12 +24342,12 @@ var VNavigationDrawer = baseMixins$b.extend({
      */
     updateApplication() {
       if (!this.isActive || this.isMobile || this.temporary || !this.$el) return 0;
-      const width = Number(this.computedWidth);
+      const width = Number(this.miniVariant ? this.miniVariantWidth : this.width);
       return isNaN(width) ? this.$el.clientWidth : width;
     },
 
     updateMiniVariant(val) {
-      if (this.miniVariant !== val) this.$emit('update:mini-variant', val);
+      if (this.expandOnHover && this.miniVariant !== val) this.$emit('update:mini-variant', val);
     }
 
   },
@@ -24310,6 +24365,338 @@ var VNavigationDrawer = baseMixins$b.extend({
 
 });
 
+// Styles
+const baseMixins$b = mixins(VInput);
+/* @vue/component */
+
+var VOtpInput = baseMixins$b.extend().extend({
+  name: 'v-otp-input',
+  directives: {
+    ripple: Ripple
+  },
+  inheritAttrs: false,
+  props: {
+    length: {
+      type: [Number, String],
+      default: 6
+    },
+    type: {
+      type: String,
+      default: 'text'
+    },
+    plain: Boolean
+  },
+  data: () => ({
+    badInput: false,
+    initialValue: null,
+    isBooted: false,
+    otp: []
+  }),
+  computed: {
+    outlined() {
+      return !this.plain;
+    },
+
+    classes() {
+      return { ...VInput.options.computed.classes.call(this),
+        ...VTextField.options.computed.classes.call(this),
+        'v-otp-input--plain': this.plain
+      };
+    },
+
+    isDirty() {
+      return VInput.options.computed.isDirty.call(this) || this.badInput;
+    }
+
+  },
+  watch: {
+    isFocused: 'updateValue',
+
+    value(val) {
+      this.lazyValue = val;
+      this.otp = (val == null ? void 0 : val.split('')) || [];
+    }
+
+  },
+
+  created() {
+    var _this$internalValue;
+
+    /* istanbul ignore next */
+    if (this.$attrs.hasOwnProperty('browser-autocomplete')) {
+      breaking('browser-autocomplete', 'autocomplete', this);
+    }
+
+    this.otp = ((_this$internalValue = this.internalValue) == null ? void 0 : _this$internalValue.split('')) || [];
+  },
+
+  mounted() {
+    requestAnimationFrame(() => this.isBooted = true);
+  },
+
+  methods: {
+    /** @public */
+    focus(e, otpIdx) {
+      this.onFocus(e, otpIdx || 0);
+    },
+
+    genInputSlot(otpIdx) {
+      return this.$createElement('div', this.setBackgroundColor(this.backgroundColor, {
+        staticClass: 'v-input__slot',
+        style: {
+          height: convertToUnit(this.height)
+        },
+        on: {
+          click: () => this.onClick(otpIdx),
+          mousedown: e => this.onMouseDown(e, otpIdx),
+          mouseup: e => this.onMouseUp(e, otpIdx)
+        }
+      }), [this.genDefaultSlot(otpIdx)]);
+    },
+
+    genControl(otpIdx) {
+      return this.$createElement('div', {
+        staticClass: 'v-input__control'
+      }, [this.genInputSlot(otpIdx)]);
+    },
+
+    genDefaultSlot(otpIdx) {
+      return [this.genFieldset(), this.genTextFieldSlot(otpIdx)];
+    },
+
+    genContent() {
+      return Array.from({
+        length: +this.length
+      }, (_, i) => {
+        return this.$createElement('div', this.setTextColor(this.validationState, {
+          staticClass: 'v-input',
+          class: this.classes
+        }), [this.genControl(i)]);
+      });
+    },
+
+    genFieldset() {
+      return this.$createElement('fieldset', {
+        attrs: {
+          'aria-hidden': true
+        }
+      }, [this.genLegend()]);
+    },
+
+    genLegend() {
+      const span = this.$createElement('span', {
+        domProps: {
+          innerHTML: '&#8203;'
+        }
+      });
+      return this.$createElement('legend', {
+        style: {
+          width: '0px'
+        }
+      }, [span]);
+    },
+
+    genInput(otpIdx) {
+      const listeners = Object.assign({}, this.listeners$);
+      delete listeners.change; // Change should not be bound externally
+
+      return this.$createElement('input', {
+        style: {},
+        domProps: {
+          value: this.otp[otpIdx],
+          min: this.type === 'number' ? 0 : null
+        },
+        attrs: { ...this.attrs$,
+          disabled: this.isDisabled,
+          readonly: this.isReadonly,
+          type: this.type,
+          id: `${this.computedId}--${otpIdx}`,
+          class: `otp-field-box--${otpIdx}`,
+          maxlength: 1
+        },
+        on: Object.assign(listeners, {
+          blur: this.onBlur,
+          input: e => this.onInput(e, otpIdx),
+          focus: e => this.onFocus(e, otpIdx),
+          paste: e => this.onPaste(e, otpIdx),
+          keydown: this.onKeyDown,
+          keyup: e => this.onKeyUp(e, otpIdx)
+        }),
+        ref: 'input',
+        refInFor: true
+      });
+    },
+
+    genTextFieldSlot(otpIdx) {
+      return this.$createElement('div', {
+        staticClass: 'v-text-field__slot'
+      }, [this.genInput(otpIdx)]);
+    },
+
+    onBlur(e) {
+      this.isFocused = false;
+      e && this.$nextTick(() => this.$emit('blur', e));
+    },
+
+    onClick(otpIdx) {
+      if (this.isFocused || this.isDisabled || !this.$refs.input[otpIdx]) return;
+      this.onFocus(undefined, otpIdx);
+    },
+
+    onFocus(e, otpIdx) {
+      e == null ? void 0 : e.preventDefault();
+      e == null ? void 0 : e.stopPropagation();
+      const elements = this.$refs.input;
+      const ref = this.$refs.input && elements[otpIdx || 0];
+      if (!ref) return;
+
+      if (document.activeElement !== ref) {
+        ref.focus();
+        return ref.select();
+      }
+
+      if (!this.isFocused) {
+        this.isFocused = true;
+        ref.select();
+        e && this.$emit('focus', e);
+      }
+    },
+
+    onInput(e, otpIdx) {
+      const target = e.target;
+      const value = target.value;
+      this.applyValue(otpIdx, target.value, () => {
+        this.internalValue = this.otp.join('');
+      });
+      this.badInput = target.validity && target.validity.badInput;
+      const nextIndex = otpIdx + 1;
+
+      if (value) {
+        if (nextIndex < +this.length) {
+          this.changeFocus(nextIndex);
+        } else {
+          this.clearFocus(otpIdx);
+          this.onCompleted();
+        }
+      }
+    },
+
+    clearFocus(index) {
+      const input = this.$refs.input[index];
+      input.blur();
+    },
+
+    onKeyDown(e) {
+      if (e.keyCode === keyCodes.enter) {
+        this.$emit('change', this.internalValue);
+      }
+
+      this.$emit('keydown', e);
+    },
+
+    onMouseDown(e, otpIdx) {
+      // Prevent input from being blurred
+      if (e.target !== this.$refs.input[otpIdx]) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+
+      VInput.options.methods.onMouseDown.call(this, e);
+    },
+
+    onMouseUp(e, otpIdx) {
+      if (this.hasMouseDown) this.focus(e, otpIdx);
+      VInput.options.methods.onMouseUp.call(this, e);
+    },
+
+    onPaste(event, index) {
+      var _event$clipboardData;
+
+      const maxCursor = +this.length - 1;
+      const inputVal = event == null ? void 0 : (_event$clipboardData = event.clipboardData) == null ? void 0 : _event$clipboardData.getData('Text');
+      const inputDataArray = (inputVal == null ? void 0 : inputVal.split('')) || [];
+      event.preventDefault();
+      const newOtp = [...this.otp];
+
+      for (let i = 0; i < inputDataArray.length; i++) {
+        const appIdx = index + i;
+        if (appIdx > maxCursor) break;
+        newOtp[appIdx] = inputDataArray[i].toString();
+      }
+
+      this.otp = newOtp;
+      this.internalValue = this.otp.join('');
+      const targetFocus = Math.min(index + inputDataArray.length, maxCursor);
+      this.changeFocus(targetFocus);
+
+      if (newOtp.length === +this.length) {
+        this.onCompleted();
+        this.clearFocus(targetFocus);
+      }
+    },
+
+    applyValue(index, inputVal, next) {
+      const newOtp = [...this.otp];
+      newOtp[index] = inputVal;
+      this.otp = newOtp;
+      next();
+    },
+
+    changeFocus(index) {
+      this.onFocus(undefined, index || 0);
+    },
+
+    updateValue(val) {
+      // Sets validationState from validatable
+      this.hasColor = val;
+
+      if (val) {
+        this.initialValue = this.lazyValue;
+      } else if (this.initialValue !== this.lazyValue) {
+        this.$emit('change', this.lazyValue);
+      }
+    },
+
+    onKeyUp(event, index) {
+      event.preventDefault();
+      const eventKey = event.key;
+
+      if (['Tab', 'Shift', 'Meta', 'Control', 'Alt'].includes(eventKey)) {
+        return;
+      }
+
+      if (['Delete'].includes(eventKey)) {
+        return;
+      }
+
+      if (eventKey === 'ArrowLeft' || eventKey === 'Backspace' && !this.otp[index]) {
+        return index > 0 && this.changeFocus(index - 1);
+      }
+
+      if (eventKey === 'ArrowRight') {
+        return index + 1 < +this.length && this.changeFocus(index + 1);
+      }
+    },
+
+    onCompleted() {
+      const rsp = this.otp.join('');
+
+      if (rsp.length === +this.length) {
+        this.$emit('finish', rsp);
+      }
+    }
+
+  },
+
+  render(h) {
+    return h('div', {
+      staticClass: 'v-otp-input',
+      class: this.themeClasses
+    }, this.genContent());
+  }
+
+});
+
 // Styles
 /* @vue/component */
 
@@ -24515,13 +24902,14 @@ var VPagination = mixins(Colorable, intersectable({
 
   },
 
-  mounted() {
+  beforeMount() {
     this.init();
   },
 
   methods: {
     init() {
       this.selected = null;
+      this.onResize();
       this.$nextTick(this.onResize); // TODO: Change this (f75dee3a, cbdf7caa)
 
       setTimeout(() => this.selected = this.value, 100);
@@ -24773,7 +25161,7 @@ baseMixins$a.extend().extend({
 });
 
 // Styles
-const baseMixins$9 = mixins(Comparable, BaseItemGroup, VInput);
+const baseMixins$9 = mixins(BaseItemGroup, VInput);
 /* @vue/component */
 
 var VRadioGroup = baseMixins$9.extend({
@@ -25699,9 +26087,7 @@ var VSnackbar = mixins(VSheet, Colorable, Toggleable, factory$3(['absolute', 'bo
     },
 
     styles() {
-      // Styles are not needed when
-      // using the absolute prop.
-      if (this.absolute) return {};
+      if (this.absolute || !this.app) return {};
       const {
         bar,
         bottom,
@@ -25710,13 +26096,11 @@ var VSnackbar = mixins(VSheet, Colorable, Toggleable, factory$3(['absolute', 'bo
         left,
         right,
         top
-      } = this.$vuetify.application; // Should always move for y-axis
-      // applicationable components.
-
+      } = this.$vuetify.application;
       return {
         paddingBottom: convertToUnit(bottom + footer + insetFooter),
-        paddingLeft: !this.app ? undefined : convertToUnit(left),
-        paddingRight: !this.app ? undefined : convertToUnit(right),
+        paddingLeft: convertToUnit(left),
+        paddingRight: convertToUnit(right),
         paddingTop: convertToUnit(bar + top)
       };
     }
@@ -26592,6 +26976,12 @@ var VStepperStep = baseMixins$6.extend().extend({
       return children;
     },
 
+    keyboardClick(e) {
+      if (e.keyCode === keyCodes.space) {
+        this.click(e);
+      }
+    },
+
     toggle(step) {
       this.isActive = step.toString() === this.step.toString();
       this.isInactive = Number(step) < Number(this.step);
@@ -26601,6 +26991,9 @@ var VStepperStep = baseMixins$6.extend().extend({
 
   render(h) {
     return h('div', {
+      attrs: {
+        tabindex: this.editable ? 0 : -1
+      },
       staticClass: 'v-stepper__step',
       class: this.classes,
       directives: [{
@@ -26608,7 +27001,8 @@ var VStepperStep = baseMixins$6.extend().extend({
         value: this.editable
       }],
       on: {
-        click: this.click
+        click: this.click,
+        keydown: this.keyboardClick
       }
     }, [this.genStep(), this.genLabel()]);
   }
@@ -27340,7 +27734,8 @@ var VTab = baseMixins$3.extend().extend().extend({
     },
 
     value() {
-      let to = this.to || this.href || '';
+      let to = this.to || this.href;
+      if (to == null) return to;
 
       if (this.$router && this.to === Object(this.to)) {
         const resolve = this.$router.resolve(this.to, this.$route, this.append);
@@ -27372,7 +27767,7 @@ var VTab = baseMixins$3.extend().extend().extend({
 
     toggle() {
       // VItemGroup treats a change event as a click
-      if (!this.isActive) {
+      if (!this.isActive || !this.tabsBar.mandatory && !this.to) {
         this.$emit('change');
       }
     }
@@ -27387,7 +27782,7 @@ var VTab = baseMixins$3.extend().extend().extend({
     data.attrs = { ...data.attrs,
       'aria-selected': String(this.isActive),
       role: 'tab',
-      tabindex: 0
+      tabindex: this.disabled ? -1 : 0
     };
     data.on = { ...data.on,
       keydown: e => {
@@ -28328,11 +28723,11 @@ var VTimePicker = mixins(Picker, PickerButton
 
 // Components
 createSimpleFunctional('v-toolbar__title');
-createSimpleFunctional('v-toolbar__items');
+const VToolbarItems = createSimpleFunctional('v-toolbar__items');
 
 /* @vue/component */
 
-var VTooltip = mixins(Colorable, Delayable, Dependent, Menuable, Toggleable).extend({
+var VTooltip = mixins(Colorable, Delayable, Dependent, Menuable).extend({
   name: 'v-tooltip',
   props: {
     closeDelay: {
@@ -28348,6 +28743,10 @@ var VTooltip = mixins(Colorable, Delayable, Dependent, Menuable, Toggleable).ext
       type: Boolean,
       default: true
     },
+    openOnFocus: {
+      type: Boolean,
+      default: true
+    },
     tag: {
       type: String,
       default: 'span'
@@ -28427,7 +28826,6 @@ var VTooltip = mixins(Colorable, Delayable, Dependent, Menuable, Toggleable).ext
         left: this.calculatedLeft,
         maxWidth: convertToUnit(this.maxWidth),
         minWidth: convertToUnit(this.minWidth),
-        opacity: this.isActive ? 0.9 : 0,
         top: this.calculatedTop,
         zIndex: this.zIndex || this.activeZIndex
       };
@@ -28463,15 +28861,17 @@ var VTooltip = mixins(Colorable, Delayable, Dependent, Menuable, Toggleable).ext
     genActivatorListeners() {
       const listeners = Activatable.options.methods.genActivatorListeners.call(this);
 
-      listeners.focus = e => {
-        this.getActivator(e);
-        this.runDelay('open');
-      };
+      if (this.openOnFocus) {
+        listeners.focus = e => {
+          this.getActivator(e);
+          this.runDelay('open');
+        };
 
-      listeners.blur = e => {
-        this.getActivator(e);
-        this.runDelay('close');
-      };
+        listeners.blur = e => {
+          this.getActivator(e);
+          this.runDelay('close');
+        };
+      }
 
       listeners.keydown = e => {
         if (e.keyCode === keyCodes.esc) {
@@ -28541,6 +28941,7 @@ const VTreeviewNodeProps = {
     type: String,
     default: 'primary'
   },
+  disablePerNode: Boolean,
   expandIcon: {
     type: String,
     default: '$subgroup'
@@ -28621,7 +29022,7 @@ const VTreeviewNode = baseMixins.extend().extend({
   }),
   computed: {
     disabled() {
-      return getObjectValueByPath(this.item, this.itemDisabled) || this.parentIsDisabled && this.selectionType === 'leaf';
+      return getObjectValueByPath(this.item, this.itemDisabled) || !this.disablePerNode && this.parentIsDisabled && this.selectionType === 'leaf';
     },
 
     key() {
@@ -28805,6 +29206,7 @@ const VTreeviewNode = baseMixins.extend().extend({
           selectable: this.selectable,
           selectedColor: this.selectedColor,
           color: this.color,
+          disablePerNode: this.disablePerNode,
           expandIcon: this.expandIcon,
           indeterminateIcon: this.indeterminateIcon,
           offIcon: this.offIcon,
@@ -28907,6 +29309,7 @@ mixins(provide('treeview'), Themeable
       default: () => []
     },
     dense: Boolean,
+    disabled: Boolean,
     filter: Function,
     hoverable: Boolean,
     items: {
@@ -29257,7 +29660,7 @@ mixins(provide('treeview'), Themeable
       return !this.isExcluded(getObjectValueByPath(item, this.itemKey));
     }).map(item => {
       const genChild = VTreeviewNode.options.methods.genChild.bind(this);
-      return genChild(item, getObjectValueByPath(item, this.itemDisabled));
+      return genChild(item, this.disabled || getObjectValueByPath(item, this.itemDisabled));
     })
     /* istanbul ignore next */
     : this.$slots.default; // TODO: remove type annotation with TS 3.2
@@ -31530,8 +31933,10 @@ let ZdInput = class ZdInput extends ZdComponentRender$1 {
     }
     mounted() {
         this.inputRef = this.$refs.instance;
-        this.instance.setViewValidate(this.inputRef.validate);
-        this.instance.setViewResetValidation(this.inputRef.resetValidation);
+        if (this.inputRef) {
+            this.instance.setViewValidate(this.inputRef.validate);
+            this.instance.setViewResetValidation(this.inputRef.resetValidation);
+        }
     }
     input(value) {
         this.$emit('update:value', value);
@@ -42150,10 +42555,7 @@ let ZdMenu = class ZdMenu extends ZdComponentRender$1 {
         KeyMap.unbind(this.navigationKeyMapping, this);
     }
     showSlotOnHover() {
-        if (this.instance.miniState && this.$children.length >= 2 && this.$children[1].$el.matches(':hover')) {
-            return this.instance.miniState;
-        }
-        return !this.instance.miniState;
+        return (this.instance.miniState && this.instance.mouseOver) || (!this.instance.miniState || this.instance.mini);
     }
     doSearch({ component }) {
         this.instance.search = component.value;
@@ -42406,11 +42808,13 @@ var __vue_render__$z = function () {
                 floating: _vm.instance.floating,
                 "mini-variant-width": _vm.instance.miniWidth,
                 "mini-variant":
-                  (_vm.instance.mini ||
-                    (_vm.instance.miniState &&
-                      _vm.$refs.ZdMenu &&
-                      !_vm.$refs.ZdMenu.isMobile)) &&
-                  !_vm.instance.mouseOver,
+                  (!_vm.instance.opened && _vm.instance.mini) ||
+                  (_vm.instance.miniState &&
+                    !_vm.instance.mouseOver &&
+                    _vm.instance.miniState &&
+                    _vm.$refs.ZdMenu &&
+                    !_vm.$refs.ZdMenu.isMobile) ||
+                  (_vm.instance.miniState && _vm.instance.mini),
                 "mobile-breakpoint": _vm.instance.mobileBreakpoint,
                 temporary: _vm.instance.temporary,
                 width: _vm.instance.width,
@@ -42513,7 +42917,7 @@ __vue_render__$z._withStripped = true;
   /* style */
   const __vue_inject_styles__$z = function (inject) {
     if (!inject) return
-    inject("data-v-368f7c97_0", { source: ".zd-menu .v-list .v-list-item .v-list-item__title {\n  font-weight: var(--zd-font-body1-weight);\n  font-size: var(--zd-font-body1-size);\n  color: var(--zd-font-color);\n  text-align: left;\n}\n.zd-menu .v-list .v-list-item .v-list-item__icon .v-icon {\n  color: var(--zd-font-color);\n}\n.zd-menu .v-list .v-list-item.selected .v-list-item__title {\n  font-weight: var(--zd-font-body2-weight);\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-item.selected .v-list-item__icon .v-icon {\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-item.v-list-item--active:not(.focus-visible):not(:focus):not([data-focus-visible-added]):not(:hover):before {\n  opacity: 0;\n}\n.zd-menu .v-list .v-list-group.selected > .v-list-group__header .v-list-item__title {\n  font-weight: var(--zd-font-body2-weight);\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-group.selected > .v-list-group__header .v-list-item__icon .v-icon {\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .zd-menu-top-slot {\n  margin-bottom: 10px;\n  display: block;\n}\n.zd-menu.v-navigation-drawer--mini-variant .v-list-item {\n  justify-content: inherit;\n}\n.zd-menu.v-navigation-drawer--is-mobile div > .zd-menu-top-slot {\n  display: block !important;\n}\n.zd-menu.theme--dark .v-list .v-list-item .v-list-item__title {\n  color: var(--v--grey-lighten5);\n}\n.zd-menu.theme--dark .v-list .v-list-item .v-list-item__icon .v-icon {\n  color: var(--v--grey-lighten5);\n}", map: undefined, media: undefined });
+    inject("data-v-13b6f89c_0", { source: ".zd-menu .v-list .v-list-item .v-list-item__title {\n  font-weight: var(--zd-font-body1-weight);\n  font-size: var(--zd-font-body1-size);\n  color: var(--zd-font-color);\n  text-align: left;\n}\n.zd-menu .v-list .v-list-item .v-list-item__icon .v-icon {\n  color: var(--zd-font-color);\n}\n.zd-menu .v-list .v-list-item.selected .v-list-item__title {\n  font-weight: var(--zd-font-body2-weight);\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-item.selected .v-list-item__icon .v-icon {\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-item.v-list-item--active:not(.focus-visible):not(:focus):not([data-focus-visible-added]):not(:hover):before {\n  opacity: 0;\n}\n.zd-menu .v-list .v-list-group.selected > .v-list-group__header .v-list-item__title {\n  font-weight: var(--zd-font-body2-weight);\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .v-list-group.selected > .v-list-group__header .v-list-item__icon .v-icon {\n  color: var(--v-primary-base);\n}\n.zd-menu .v-list .zd-menu-top-slot {\n  margin-bottom: 10px;\n  display: block;\n}\n.zd-menu.v-navigation-drawer--mini-variant .v-list-item {\n  justify-content: inherit;\n}\n.zd-menu.v-navigation-drawer--is-mobile div > .zd-menu-top-slot {\n  display: block !important;\n}\n.zd-menu.theme--dark .v-list .v-list-item .v-list-item__title {\n  color: var(--v--grey-lighten5);\n}\n.zd-menu.theme--dark .v-list .v-list-item .v-list-item__icon .v-icon {\n  color: var(--v--grey-lighten5);\n}", map: undefined, media: undefined });
 
   };
   /* scoped */
@@ -48048,26 +48452,30 @@ __vue_render__$5._withStripped = true;
 let ZdTreeCheckbox = class ZdTreeCheckbox extends Vue {
     get childrenCheck() {
         var _a;
-        return (_a = this.node.children) === null || _a === void 0 ? void 0 : _a.every((child) => child.isChecked);
+        return (_a = this.node.children) === null || _a === void 0 ? void 0 : _a.every((child) => child.data && child.data[this.checkedField]);
     }
     check() {
-        this.node.isChecked = this.childrenCheck;
+        if (!this.node.data)
+            return;
+        this.node.data[this.checkedField] = this.childrenCheck;
     }
     get isIndeterminate() {
         var _a, _b;
         let count = 0;
         (_a = this.node.children) === null || _a === void 0 ? void 0 : _a.forEach((child) => {
-            if (child.isChecked)
+            if (child.data && child.data[this.checkedField])
                 count += 1;
         });
         return (count > 0) && (count < (((_b = this.node.children) === null || _b === void 0 ? void 0 : _b.length) || 0));
     }
     checkboxToggle(node) {
-        this.toggleChildren([node], !!node.isChecked);
+        this.toggleChildren([node], !!(node.data && node.data[this.checkedField]));
     }
     toggleChildren(nodes, value) {
         nodes.forEach((node) => {
-            node.isChecked = value;
+            if (!node.data)
+                return;
+            node.data[this.checkedField] = value;
             if (node.children && node.children.length > 0)
                 this.toggleChildren(node.children, value);
         });
@@ -48081,6 +48489,10 @@ __decorate([
     Prop({ type: [Object], default: () => [] }),
     __metadata("design:type", Object)
 ], ZdTreeCheckbox.prototype, "node", void 0);
+__decorate([
+    Prop({ type: [String], default: 'checked' }),
+    __metadata("design:type", String)
+], ZdTreeCheckbox.prototype, "checkedField", void 0);
 __decorate([
     Watch('childrenCheck'),
     __metadata("design:type", Function),
@@ -48108,7 +48520,7 @@ var __vue_render__$4 = function () {
       "on-icon": _vm.$getIcon("checkboxOn"),
       "off-icon": _vm.$getIcon("checkboxOff"),
       "indeterminate-icon": _vm.$getIcon("checkboxIndeterminate"),
-      "input-value": _vm.node.isChecked,
+      "input-value": _vm.node.data[_vm.checkedField],
       indeterminate: _vm.isIndeterminate,
     },
     on: {
@@ -48117,11 +48529,11 @@ var __vue_render__$4 = function () {
       },
     },
     model: {
-      value: _vm.node.isChecked,
+      value: _vm.node.data[_vm.checkedField],
       callback: function ($$v) {
-        _vm.$set(_vm.node, "isChecked", $$v);
+        _vm.$set(_vm.node.data, _vm.checkedField, $$v);
       },
-      expression: "node.isChecked",
+      expression: "node.data[checkedField]",
     },
   })
 };
@@ -48131,7 +48543,7 @@ __vue_render__$4._withStripped = true;
   /* style */
   const __vue_inject_styles__$4 = function (inject) {
     if (!inject) return
-    inject("data-v-6000ad85_0", { source: ".zd-tree-checkbox {\n  display: inline-block;\n  top: 50%;\n  transform: translate(0, -50%);\n}\n.zd-tree-checkbox > .v-input--selection-controls__input {\n  margin-right: 0;\n}", map: undefined, media: undefined });
+    inject("data-v-130a7c09_0", { source: ".zd-tree-checkbox {\n  display: inline-block;\n  top: 50%;\n  transform: translate(0, -50%);\n}\n.zd-tree-checkbox > .v-input--selection-controls__input {\n  margin-right: 0;\n}", map: undefined, media: undefined });
 
   };
   /* scoped */
@@ -48253,6 +48665,7 @@ let ZdTree = class ZdTree extends ZdComponentRender$1 {
     mounted() {
         this.instance.setTree(this.$refs.tree);
         this.setAfterTitleMargin();
+        this.nodeChange();
         this.$watch('$refs.tree.nodes', this.nodeChange, { deep: true });
     }
     dataChange() {
@@ -48383,6 +48796,10 @@ __decorate([
     Prop({ type: String, default: '' }),
     __metadata("design:type", String)
 ], ZdTree.prototype, "dataField", void 0);
+__decorate([
+    Prop({ type: String, default: 'checked' }),
+    __metadata("design:type", String)
+], ZdTree.prototype, "checkedField", void 0);
 __decorate([
     Prop({ type: [Boolean, String], default: false }),
     __metadata("design:type", Boolean)
@@ -48486,7 +48903,10 @@ var __vue_render__$2 = function () {
                 return [
                   _vm.instance.checkbox
                     ? _c("zd-tree-checkbox", {
-                        attrs: { node: _vm.instanceNode(node) },
+                        attrs: {
+                          node: _vm.instanceNode(node),
+                          checkedField: _vm.instance.checkedField,
+                        },
                         on: {
                           click: function ($event) {
                             return _vm.nodeCheck(node, $event)
@@ -48688,7 +49108,7 @@ __vue_render__$2._withStripped = true;
   /* style */
   const __vue_inject_styles__$2 = function (inject) {
     if (!inject) return
-    inject("data-v-71da43d2_0", { source: ".zd-tree {\n  color: var(--zd-font-color);\n  font-size: var(--zd-font-body1-size);\n  font-weight: normal;\n}\n.zd-tree.theme--light .sl-vue-tree-title {\n  color: var(--zd-font-color);\n}\n.zd-tree.theme--light .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n  background: #eee;\n}\n.zd-tree.theme--dark .sl-vue-tree-title {\n  color: #fff;\n}\n.zd-tree.theme--dark .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n  background: #616161;\n}\n.zd-tree .sl-vue-tree-title {\n  display: flex;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node {\n  padding-top: 3px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item {\n  height: 30px;\n  line-height: 30px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item {\n  background-color: var(--current-row-color);\n  color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item:hover {\n  background: var(--current-row-hover-color) !important;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item .sl-vue-tree-toggle .v-icon {\n  color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-toggle span .v-icon {\n  margin-right: -6px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-gap {\n  width: 32px;\n}\n.zd-tree .item-title {\n  padding-left: 6px;\n}\n.zd-tree .item-title.has-children {\n  font-weight: 700;\n}\n.zd-tree .item-title.is-clickable {\n  cursor: pointer;\n}", map: undefined, media: undefined });
+    inject("data-v-58bd8c74_0", { source: ".zd-tree {\n  color: var(--zd-font-color);\n  font-size: var(--zd-font-body1-size);\n  font-weight: normal;\n}\n.zd-tree.theme--light .sl-vue-tree-title {\n  color: var(--zd-font-color);\n}\n.zd-tree.theme--light .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n  background: #eee;\n}\n.zd-tree.theme--dark .sl-vue-tree-title {\n  color: #fff;\n}\n.zd-tree.theme--dark .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n  background: #616161;\n}\n.zd-tree .sl-vue-tree-title {\n  display: flex;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node {\n  padding-top: 3px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item {\n  height: 30px;\n  line-height: 30px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item {\n  background-color: var(--current-row-color);\n  color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item:hover {\n  background: var(--current-row-hover-color) !important;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item .sl-vue-tree-toggle .v-icon {\n  color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-toggle span .v-icon {\n  margin-right: -6px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-gap {\n  width: 32px;\n}\n.zd-tree .item-title {\n  padding-left: 6px;\n}\n.zd-tree .item-title.has-children {\n  font-weight: 700;\n}\n.zd-tree .item-title.is-clickable {\n  cursor: pointer;\n}", map: undefined, media: undefined });
 
   };
   /* scoped */
@@ -50951,6 +51371,7 @@ const Zeedhi = {
                 VBreadcrumbs,
                 VBtn,
                 VBtnToggle,
+                VCalendar,
                 VCard,
                 VCardActions,
                 VCardText,
@@ -50986,6 +51407,7 @@ const Zeedhi = {
                 VMenu,
                 VNavigationDrawer,
                 VOverlay,
+                VOtpInput,
                 VPagination,
                 VProgressCircular,
                 VProgressLinear,
@@ -51017,6 +51439,8 @@ const Zeedhi = {
                 VTextField,
                 VTimePicker,
                 VTooltip,
+                VToolbar,
+                VToolbarItems,
                 VSimpleCheckbox,
             },
         });