@vuetify/nightly 3.4.11-dev.2024-01-19 → 3.5.0-dev.2024-01-20

package/dist/vuetify.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.4.11-dev.2024-01-19
+* Vuetify v3.5.0-dev.2024-01-20
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -2154,7 +2154,7 @@
     vue.provide(LocaleSymbol, data);
     return data;
   }
-  function genDefaults$1() {
+  function genDefaults$2() {
     return {
       af: false,
       ar: true,
@@ -2201,7 +2201,7 @@
     };
   }
   function createRtl(i18n, options) {
-    const rtl = vue.ref(options?.rtl ?? genDefaults$1());
+    const rtl = vue.ref(options?.rtl ?? genDefaults$2());
     const isRtl = vue.computed(() => rtl.value[i18n.current.value] ?? false);
     return {
       isRtl,
@@ -2234,7 +2234,7 @@
   const makeThemeProps = propsFactory({
     theme: String
   }, 'theme');
-  function genDefaults() {
+  function genDefaults$1() {
     return {
       defaultTheme: 'light',
       variations: {
@@ -2321,8 +2321,8 @@
     };
   }
   function parseThemeOptions() {
-    let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : genDefaults();
-    const defaults = genDefaults();
+    let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : genDefaults$1();
+    const defaults = genDefaults$1();
     if (!options) return {
       ...defaults,
       isDisabled: true
@@ -9045,7 +9045,7 @@
   }
 
   /** Get the difference between two points */
-  function getOffset$1(a, b) {
+  function getOffset$2(a, b) {
     return {
       x: a.x - b.x,
       y: a.y - b.y
@@ -9292,7 +9292,7 @@
         let {
           x,
           y
-        } = getOffset$1(targetPoint, contentPoint);
+        } = getOffset$2(targetPoint, contentPoint);
         switch (_placement.anchor.side) {
           case 'top':
             y -= offset.value[0];
@@ -9827,7 +9827,7 @@
     const target = vue.computed(() => {
       if (props.target === 'cursor' && cursorTarget.value) return cursorTarget.value;
       if (targetRef.value) return refElement(targetRef.value);
-      return getTarget(props.target, vm) || activatorEl.value;
+      return getTarget$1(props.target, vm) || activatorEl.value;
     });
     const targetEl = vue.computed(() => {
       return Array.isArray(target.value) ? undefined : target.value;
@@ -9899,14 +9899,14 @@
     }
     function getActivator() {
       let selector = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : props.activator;
-      const activator = getTarget(selector, vm);
+      const activator = getTarget$1(selector, vm);
 
       // The activator should only be a valid element (Ignore comments and text nodes)
       activatorEl.value = activator?.nodeType === Node.ELEMENT_NODE ? activator : undefined;
       return activatorEl.value;
     }
   }
-  function getTarget(selector, vm) {
+  function getTarget$1(selector, vm) {
     if (!selector) return;
     let target;
     if (selector === 'parent') {
@@ -14528,7 +14528,7 @@
   // Types
 
   const VSliderSymbol = Symbol.for('vuetify:v-slider');
-  function getOffset(e, el, direction) {
+  function getOffset$1(e, el, direction) {
     const vertical = direction === 'vertical';
     const rect = el.getBoundingClientRect();
     const touch = 'touches' in e ? e.touches[0] : e;
@@ -14687,7 +14687,7 @@
       activeThumbRef.value.focus();
       mousePressed.value = true;
       if (activeThumbRef.value.contains(e.target)) {
-        startOffset.value = getOffset(e, activeThumbRef.value, props.direction);
+        startOffset.value = getOffset$1(e, activeThumbRef.value, props.direction);
       } else {
         startOffset.value = 0;
         onSliderMove({
@@ -17532,6 +17532,112 @@
     return Math.floor(diffDays / 7) + 1;
   }
 
+  // Utilities
+
+  // Types
+
+  const GoToSymbol = Symbol.for('vuetify:goto');
+  function genDefaults() {
+    return {
+      container: undefined,
+      duration: 300,
+      layout: false,
+      offset: 0,
+      easing: 'easeInOutCubic',
+      patterns: {
+        linear: t => t,
+        easeInQuad: t => t ** 2,
+        easeOutQuad: t => t * (2 - t),
+        easeInOutQuad: t => t < 0.5 ? 2 * t ** 2 : -1 + (4 - 2 * t) * t,
+        easeInCubic: t => t ** 3,
+        easeOutCubic: t => --t ** 3 + 1,
+        easeInOutCubic: t => t < 0.5 ? 4 * t ** 3 : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1,
+        easeInQuart: t => t ** 4,
+        easeOutQuart: t => 1 - --t ** 4,
+        easeInOutQuart: t => t < 0.5 ? 8 * t ** 4 : 1 - 8 * --t ** 4,
+        easeInQuint: t => t ** 5,
+        easeOutQuint: t => 1 + --t ** 5,
+        easeInOutQuint: t => t < 0.5 ? 16 * t ** 5 : 1 + 16 * --t ** 5
+      }
+    };
+  }
+  function getContainer(el) {
+    return getTarget(el) ?? (document.scrollingElement || document.body);
+  }
+  function getTarget(el) {
+    return typeof el === 'string' ? document.querySelector(el) : refElement(el);
+  }
+  function getOffset(target, horizontal, rtl) {
+    if (typeof target === 'number') return horizontal && rtl ? -target : target;
+    let el = getTarget(target);
+    let totalOffset = 0;
+    while (el) {
+      totalOffset += horizontal ? el.offsetLeft : el.offsetTop;
+      el = el.offsetParent;
+    }
+    return totalOffset;
+  }
+  function createGoTo(options, locale) {
+    return {
+      rtl: locale.isRtl,
+      options: mergeDeep(genDefaults(), options)
+    };
+  }
+  async function scrollTo(_target, _options, horizontal, goTo) {
+    const options = mergeDeep(goTo?.options, _options);
+    const rtl = goTo?.rtl.value;
+    const target = (typeof _target === 'number' ? _target : getTarget(_target)) ?? 0;
+    const container = options.container === 'parent' && target instanceof HTMLElement ? target.parentElement : getContainer(options.container);
+    const ease = typeof options.easing === 'function' ? options.easing : options.patterns[options.easing];
+    if (!ease) throw new TypeError(`Easing function "${options.easing}" not found.`);
+    let targetLocation;
+    if (typeof target === 'number') {
+      targetLocation = getOffset(target, horizontal, rtl);
+    } else {
+      targetLocation = getOffset(target, horizontal, rtl) - getOffset(container, horizontal, rtl);
+      if (options.layout) {
+        const styles = window.getComputedStyle(target);
+        const layoutOffset = styles.getPropertyValue('--v-layout-top');
+        if (layoutOffset) targetLocation -= parseInt(layoutOffset, 10);
+      }
+    }
+    targetLocation += options.offset;
+    const startLocation = (horizontal ? container.scrollLeft : container.scrollTop) ?? 0;
+    if (targetLocation === startLocation) return Promise.resolve(targetLocation);
+    const startTime = performance.now();
+    return new Promise(resolve => requestAnimationFrame(function step(currentTime) {
+      const timeElapsed = currentTime - startTime;
+      const progress = Math.abs(options.duration ? Math.min(timeElapsed / options.duration, 1) : 1);
+      const location = Math.floor(startLocation + (targetLocation - startLocation) * ease(progress));
+      container[horizontal ? 'scrollLeft' : 'scrollTop'] = location;
+      if (progress === 1) return resolve(targetLocation);
+      let clientSize;
+      let reachEnd;
+      if (!horizontal) {
+        clientSize = container === document.body ? document.documentElement.clientHeight : container.clientHeight;
+        reachEnd = clientSize + container.scrollTop >= container.scrollHeight;
+        if (targetLocation > container.scrollTop && reachEnd) return resolve(targetLocation);
+      } else {
+        clientSize = container === document.body ? document.documentElement.clientWidth : container.clientWidth;
+        reachEnd = clientSize + container.scrollLeft >= container.scrollWidth;
+        if (targetLocation > container.scrollLeft && reachEnd) return resolve(targetLocation);
+      }
+      requestAnimationFrame(step);
+    }));
+  }
+  function useGoTo() {
+    let _options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    const goTo = vue.inject(GoToSymbol);
+    if (!goTo) throw new Error('[Vuetify] Could not find injected goto instance');
+    async function go(target, options) {
+      return scrollTo(target, mergeDeep(_options, options), false, goTo);
+    }
+    go.horizontal = async (target, options) => {
+      return scrollTo(target, mergeDeep(_options, options), true, goTo);
+    };
+    return go;
+  }
+
   // Composables
 
   // Types
@@ -23014,8 +23120,8 @@
       } = useRtl();
       function getActiveThumb(e) {
         if (!startThumbRef.value || !stopThumbRef.value) return;
-        const startOffset = getOffset(e, startThumbRef.value.$el, props.direction);
-        const stopOffset = getOffset(e, stopThumbRef.value.$el, props.direction);
+        const startOffset = getOffset$1(e, startThumbRef.value.$el, props.direction);
+        const stopOffset = getOffset$1(e, stopThumbRef.value.$el, props.direction);
         const a = Math.abs(startOffset);
         const b = Math.abs(stopOffset);
         return a < b || a === b && startOffset < 0 ? startThumbRef.value.$el : stopThumbRef.value.$el;
@@ -24190,6 +24296,10 @@
               isReadonly,
               isValid
             } = _ref2;
+            const slotProps = {
+              model,
+              isValid
+            };
             return vue.createVNode(VSelectionControl, vue.mergeProps({
               "ref": control
             }, controlProps, {
@@ -24214,7 +24324,13 @@
                   "class": ['v-switch__track', ...backgroundColorClasses.value],
                   "style": backgroundColorStyles.value,
                   "onClick": onTrackClick
-                }, null);
+                }, [slots['track-true'] && vue.createVNode("div", {
+                  "key": "prepend",
+                  "class": "v-switch__track-true"
+                }, [slots['track-true'](slotProps)]), slots['track-false'] && vue.createVNode("div", {
+                  "key": "append",
+                  "class": "v-switch__track-false"
+                }, [slots['track-false'](slotProps)])]);
               },
               input: _ref4 => {
                 let {
@@ -24228,9 +24344,21 @@
                     'v-switch__thumb--filled': icon || props.loading
                   }, props.inset ? undefined : backgroundColorClasses.value],
                   "style": props.inset ? undefined : backgroundColorStyles.value
-                }, [vue.createVNode(VScaleTransition, null, {
+                }, [slots.thumb ? vue.createVNode(VDefaultsProvider, {
+                  "defaults": {
+                    VIcon: {
+                      icon,
+                      size: 'x-small'
+                    }
+                  }
+                }, {
+                  default: () => [slots.thumb({
+                    ...slotProps,
+                    icon
+                  })]
+                }) : vue.createVNode(VScaleTransition, null, {
                   default: () => [!props.loading ? icon && vue.createVNode(VIcon, {
-                    "key": icon,
+                    "key": String(icon),
                     "icon": icon,
                     "size": "x-small"
                   }, null) : vue.createVNode(LoaderSlot, {
@@ -25450,6 +25578,7 @@
     const icons = createIcons(options.icons);
     const locale = createLocale(options.locale);
     const date = createDate(options.date, locale);
+    const goTo = createGoTo(options.goTo, locale);
     const install = app => {
       for (const key in directives) {
         app.directive(key, directives[key]);
@@ -25472,6 +25601,7 @@
       app.provide(LocaleSymbol, locale);
       app.provide(DateOptionsSymbol, date.options);
       app.provide(DateAdapterSymbol, date.instance);
+      app.provide(GoToSymbol, goTo);
       if (IN_BROWSER && options.ssr) {
         if (app.$nuxt) {
           app.$nuxt.hook('app:suspense:resolve', () => {
@@ -25514,10 +25644,11 @@
       theme,
       icons,
       locale,
-      date
+      date,
+      goTo
     };
   }
-  const version$1 = "3.4.11-dev.2024-01-19";
+  const version$1 = "3.5.0-dev.2024-01-20";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -25542,7 +25673,7 @@
       ...options
     });
   };
-  const version = "3.4.11-dev.2024-01-19";
+  const version = "3.5.0-dev.2024-01-20";
   createVuetify.version = version;
 
   exports.components = components;
@@ -25551,6 +25682,7 @@
   exports.useDate = useDate;
   exports.useDefaults = useDefaults;
   exports.useDisplay = useDisplay;
+  exports.useGoTo = useGoTo;
   exports.useLayout = useLayout;
   exports.useLocale = useLocale;
   exports.useRtl = useRtl;