@vuetify/nightly 3.0.0-beta.0 → 3.0.0-beta.4

package/lib/components/VSlideGroup/VSlideGroup.mjs

@@ -9,7 +9,8 @@ import { makeGroupProps, useGroup } from "../../composables/group.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { useDisplay } from "../../composables/index.mjs";
 import { useResizeObserver } from "../../composables/resizeObserver.mjs";
-import { useRtl } from "../../composables/rtl.mjs"; // Utilities
+import { useRtl } from "../../composables/rtl.mjs";
+import { IconValue } from "../../composables/icons.mjs"; // Utilities
 
 import { bias, calculateCenteredOffset, calculateUpdatedOffset } from "./helpers.mjs";
 import { clamp, defineComponent, useRender } from "../../util/index.mjs";
@@ -19,10 +20,6 @@ export const VSlideGroupSymbol = Symbol.for('vuetify:v-slide-group');
 export const VSlideGroup = defineComponent({
   name: 'VSlideGroup',
   props: {
-    activeClass: {
-      type: String,
-      default: 'v-slide-item--active'
-    },
     centerActive: Boolean,
     direction: {
       type: String,
@@ -33,11 +30,11 @@ export const VSlideGroup = defineComponent({
       default: VSlideGroupSymbol
     },
     nextIcon: {
-      type: String,
+      type: IconValue,
       default: '$next'
     },
     prevIcon: {
-      type: String,
+      type: IconValue,
       default: '$prev'
     },
     showArrows: {
@@ -45,7 +42,9 @@ export const VSlideGroup = defineComponent({
       validator: v => typeof v === 'boolean' || ['always', 'desktop', 'mobile'].includes(v)
     },
     ...makeTagProps(),
-    ...makeGroupProps()
+    ...makeGroupProps({
+      selectedClass: 'v-slide-group-item--active'
+    })
   },
   emits: {
     'update:modelValue': value => true
@@ -71,21 +70,31 @@ export const VSlideGroup = defineComponent({
       resizeRef: containerRef,
       contentRect: containerRect
     } = useResizeObserver();
-    const contentRef = ref();
+    const {
+      resizeRef: contentRef,
+      contentRect
+    } = useResizeObserver();
     watchEffect(() => {
-      if (!containerRect.value || !contentRef.value) return;
+      if (!containerRect.value || !contentRect.value) return;
       const sizeProperty = isHorizontal.value ? 'width' : 'height';
       containerSize.value = containerRect.value[sizeProperty];
-      contentSize.value = contentRef.value.getBoundingClientRect()[sizeProperty];
+      contentSize.value = contentRect.value[sizeProperty];
       isOverflowing.value = containerSize.value + 1 < contentSize.value;
     });
-    watch(group.selected, selected => {
-      if (!selected.length || !contentRef.value) return;
-      const index = group.items.value.findIndex(item => item.id === selected[selected.length - 1]); // TODO: Is this too naive? Should we store element references in group composable?
+    const firstSelectedIndex = computed(() => {
+      if (!group.selected.value.length) return -1;
+      return group.items.value.findIndex(item => item.id === group.selected.value[0]);
+    });
+    const lastSelectedIndex = computed(() => {
+      if (!group.selected.value.length) return -1;
+      return group.items.value.findIndex(item => item.id === group.selected.value[group.selected.value.length - 1]);
+    });
+    watch(group.selected, () => {
+      if (firstSelectedIndex.value < 0 || !contentRef.value) return; // TODO: Is this too naive? Should we store element references in group composable?
 
-      const selectedElement = contentRef.value.children[index];
+      const selectedElement = contentRef.value.children[lastSelectedIndex.value];
 
-      if (index === 0 || !isOverflowing.value) {
+      if (firstSelectedIndex.value === 0 || !isOverflowing.value) {
         scrollOffset.value = 0;
       } else if (props.centerActive) {
         scrollOffset.value = calculateCenteredOffset({
@@ -106,6 +115,20 @@ export const VSlideGroup = defineComponent({
         });
       }
     });
+    let firstOverflow = true;
+    watch(isOverflowing, () => {
+      if (!firstOverflow || !contentRef.value || firstSelectedIndex.value < 0) return;
+      firstOverflow = false; // TODO: Is this too naive? Should we store element references in group composable?
+
+      const selectedElement = contentRef.value.children[firstSelectedIndex.value];
+      scrollOffset.value = calculateCenteredOffset({
+        selectedElement,
+        containerSize: containerSize.value,
+        contentSize: contentSize.value,
+        isRtl: isRtl.value,
+        isHorizontal: isHorizontal.value
+      });
+    });
     const disableTransition = ref(false);
     let startTouch = 0;
     let startOffset = 0;
@@ -253,7 +276,7 @@ export const VSlideGroup = defineComponent({
         // Always show arrows on desktop
 
         case 'desktop':
-          return mobile.value;
+          return !mobile.value;
         // Show arrows on mobile when overflowing.
         // This matches the default 2.2 behavior
 

package/lib/components/VSlideGroup/VSlideGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VSlideGroup/VSlideGroup.tsx"],"names":["VFadeTransition","VIcon","makeGroupProps","useGroup","makeTagProps","useDisplay","useResizeObserver","useRtl","bias","calculateCenteredOffset","calculateUpdatedOffset","clamp","defineComponent","useRender","computed","ref","watch","watchEffect","VSlideGroupSymbol","Symbol","for","VSlideGroup","name","props","activeClass","type","String","default","centerActive","Boolean","direction","symbol","nextIcon","prevIcon","showArrows","validator","v","includes","emits","value","setup","slots","isRtl","mobile","group","isOverflowing","scrollOffset","containerSize","contentSize","isHorizontal","resizeRef","containerRef","contentRect","containerRect","contentRef","sizeProperty","getBoundingClientRect","selected","length","index","items","findIndex","item","id","selectedElement","children","currentScrollOffset","disableTransition","startTouch","startOffset","onTouchstart","e","touches","onTouchmove","onTouchend","maxScrollOffset","onScroll","scrollLeft","isFocused","onFocusin","el","composedPath","onFocusout","onFocus","relatedTarget","contains","focus","onKeydown","key","location","querySelector","focusable","querySelectorAll","filter","hasAttribute","nextElementSibling","previousElementSibling","firstElementChild","lastElementChild","scrollTo","sign","newAbosluteOffset","contentStyles","scrollAmount","transform","transition","willChange","slotProps","next","prev","select","isSelected","hasAffixes","Math","abs","hasPrev","hasNext"],"mappings":";AAAA;AACA,2B,CAEA;;SACSA,e;SACAC,K,8BAET;;SACSC,c,EAAgBC,Q;SAChBC,Y;SACAC,U;SACAC,iB;SACAC,M,qCAET;;SACSC,I,EAAMC,uB,EAAyBC,sB;SAC/BC,K,EAAOC,e,EAAiBC,S;AACjC,SAASC,QAAT,EAAmBC,GAAnB,EAAwBC,KAAxB,EAA+BC,WAA/B,QAAkD,KAAlD,C,CAEA;;AAIA,OAAO,MAAMC,iBAA6C,GAAGC,MAAM,CAACC,GAAP,CAAW,uBAAX,CAAtD;AAEP,OAAO,MAAMC,WAAW,GAAGT,eAAe,CAAC;AACzCU,EAAAA,IAAI,EAAE,aADmC;AAGzCC,EAAAA,KAAK,EAAE;AACLC,IAAAA,WAAW,EAAE;AACXC,MAAAA,IAAI,EAAEC,MADK;AAEXC,MAAAA,OAAO,EAAE;AAFE,KADR;AAKLC,IAAAA,YAAY,EAAEC,OALT;AAMLC,IAAAA,SAAS,EAAE;AACTL,MAAAA,IAAI,EAAEC,MADG;AAETC,MAAAA,OAAO,EAAE;AAFA,KANN;AAULI,IAAAA,MAAM,EAAE;AACNN,MAAAA,IAAI,EAAE,IADA;AAENE,MAAAA,OAAO,EAAET;AAFH,KAVH;AAcLc,IAAAA,QAAQ,EAAE;AACRP,MAAAA,IAAI,EAAEC,MADE;AAERC,MAAAA,OAAO,EAAE;AAFD,KAdL;AAkBLM,IAAAA,QAAQ,EAAE;AACRR,MAAAA,IAAI,EAAEC,MADE;AAERC,MAAAA,OAAO,EAAE;AAFD,KAlBL;AAsBLO,IAAAA,UAAU,EAAE;AACVT,MAAAA,IAAI,EAAE,CAACI,OAAD,EAAUH,MAAV,CADI;AAEVS,MAAAA,SAAS,EAAGC,CAAD,IACT,OAAOA,CAAP,KAAa,SAAb,IAA0B,CACxB,QADwB,EAExB,SAFwB,EAGxB,QAHwB,EAIxBC,QAJwB,CAIfD,CAJe;AAHlB,KAtBP;AAgCL,OAAGhC,YAAY,EAhCV;AAiCL,OAAGF,cAAc;AAjCZ,GAHkC;AAuCzCoC,EAAAA,KAAK,EAAE;AACL,yBAAsBC,KAAD,IAAgB;AADhC,GAvCkC;;AA2CzCC,EAAAA,KAAK,CAAEjB,KAAF,QAAoB;AAAA,QAAX;AAAEkB,MAAAA;AAAF,KAAW;AACvB,UAAM;AAAEC,MAAAA;AAAF,QAAYnC,MAAM,EAAxB;AACA,UAAM;AAAEoC,MAAAA;AAAF,QAAatC,UAAU,EAA7B;AACA,UAAMuC,KAAK,GAAGzC,QAAQ,CAACoB,KAAD,EAAQA,KAAK,CAACQ,MAAd,CAAtB;AACA,UAAMc,aAAa,GAAG9B,GAAG,CAAC,KAAD,CAAzB;AACA,UAAM+B,YAAY,GAAG/B,GAAG,CAAC,CAAD,CAAxB;AACA,UAAMgC,aAAa,GAAGhC,GAAG,CAAC,CAAD,CAAzB;AACA,UAAMiC,WAAW,GAAGjC,GAAG,CAAC,CAAD,CAAvB;AACA,UAAMkC,YAAY,GAAGnC,QAAQ,CAAC,MAAMS,KAAK,CAACO,SAAN,KAAoB,YAA3B,CAA7B;AAEA,UAAM;AAAEoB,MAAAA,SAAS,EAAEC,YAAb;AAA2BC,MAAAA,WAAW,EAAEC;AAAxC,QAA0D/C,iBAAiB,EAAjF;AACA,UAAMgD,UAAU,GAAGvC,GAAG,EAAtB;AAEAE,IAAAA,WAAW,CAAC,MAAM;AAChB,UAAI,CAACoC,aAAa,CAACd,KAAf,IAAwB,CAACe,UAAU,CAACf,KAAxC,EAA+C;AAE/C,YAAMgB,YAAY,GAAGN,YAAY,CAACV,KAAb,GAAqB,OAArB,GAA+B,QAApD;AAEAQ,MAAAA,aAAa,CAACR,KAAd,GAAsBc,aAAa,CAACd,KAAd,CAAoBgB,YAApB,CAAtB;AACAP,MAAAA,WAAW,CAACT,KAAZ,GAAoBe,UAAU,CAACf,KAAX,CAAiBiB,qBAAjB,GAAyCD,YAAzC,CAApB;AAEAV,MAAAA,aAAa,CAACN,KAAd,GAAsBQ,aAAa,CAACR,KAAd,GAAsB,CAAtB,GAA0BS,WAAW,CAACT,KAA5D;AACD,KATU,CAAX;AAWAvB,IAAAA,KAAK,CAAC4B,KAAK,CAACa,QAAP,EAAiBA,QAAQ,IAAI;AAChC,UAAI,CAACA,QAAQ,CAACC,MAAV,IAAoB,CAACJ,UAAU,CAACf,KAApC,EAA2C;AAE3C,YAAMoB,KAAK,GAAGf,KAAK,CAACgB,KAAN,CAAYrB,KAAZ,CAAkBsB,SAAlB,CAA4BC,IAAI,IAAIA,IAAI,CAACC,EAAL,KAAYN,QAAQ,CAACA,QAAQ,CAACC,MAAT,GAAkB,CAAnB,CAAxD,CAAd,CAHgC,CAKhC;;AACA,YAAMM,eAAe,GAAGV,UAAU,CAACf,KAAX,CAAiB0B,QAAjB,CAA0BN,KAA1B,CAAxB;;AAEA,UAAIA,KAAK,KAAK,CAAV,IAAe,CAACd,aAAa,CAACN,KAAlC,EAAyC;AACvCO,QAAAA,YAAY,CAACP,KAAb,GAAqB,CAArB;AACD,OAFD,MAEO,IAAIhB,KAAK,CAACK,YAAV,EAAwB;AAC7BkB,QAAAA,YAAY,CAACP,KAAb,GAAqB9B,uBAAuB,CAAC;AAC3CuD,UAAAA,eAD2C;AAE3CjB,UAAAA,aAAa,EAAEA,aAAa,CAACR,KAFc;AAG3CS,UAAAA,WAAW,EAAEA,WAAW,CAACT,KAHkB;AAI3CG,UAAAA,KAAK,EAAEA,KAAK,CAACH,KAJ8B;AAK3CU,UAAAA,YAAY,EAAEA,YAAY,CAACV;AALgB,SAAD,CAA5C;AAOD,OARM,MAQA,IAAIM,aAAa,CAACN,KAAlB,EAAyB;AAC9BO,QAAAA,YAAY,CAACP,KAAb,GAAqB7B,sBAAsB,CAAC;AAC1CsD,UAAAA,eAD0C;AAE1CjB,UAAAA,aAAa,EAAEA,aAAa,CAACR,KAFa;AAG1CS,UAAAA,WAAW,EAAEA,WAAW,CAACT,KAHiB;AAI1CG,UAAAA,KAAK,EAAEA,KAAK,CAACH,KAJ6B;AAK1C2B,UAAAA,mBAAmB,EAAEpB,YAAY,CAACP,KALQ;AAM1CU,UAAAA,YAAY,EAAEA,YAAY,CAACV;AANe,SAAD,CAA3C;AAQD;AACF,KA5BI,CAAL;AA8BA,UAAM4B,iBAAiB,GAAGpD,GAAG,CAAC,KAAD,CAA7B;AAEA,QAAIqD,UAAU,GAAG,CAAjB;AACA,QAAIC,WAAW,GAAG,CAAlB;;AAEA,aAASC,YAAT,CAAuBC,CAAvB,EAAsC;AACpC,YAAMhB,YAAY,GAAGN,YAAY,CAACV,KAAb,GAAqB,SAArB,GAAiC,SAAtD;AACA8B,MAAAA,WAAW,GAAGvB,YAAY,CAACP,KAA3B;AACA6B,MAAAA,UAAU,GAAGG,CAAC,CAACC,OAAF,CAAU,CAAV,EAAajB,YAAb,CAAb;AACAY,MAAAA,iBAAiB,CAAC5B,KAAlB,GAA0B,IAA1B;AACD;;AAED,aAASkC,WAAT,CAAsBF,CAAtB,EAAqC;AACnC,UAAI,CAAC1B,aAAa,CAACN,KAAnB,EAA0B;AAE1B,YAAMgB,YAAY,GAAGN,YAAY,CAACV,KAAb,GAAqB,SAArB,GAAiC,SAAtD;AACAO,MAAAA,YAAY,CAACP,KAAb,GAAqB8B,WAAW,GAAGD,UAAd,GAA2BG,CAAC,CAACC,OAAF,CAAU,CAAV,EAAajB,YAAb,CAAhD;AACD;;AAED,aAASmB,UAAT,CAAqBH,CAArB,EAAoC;AAClC,YAAMI,eAAe,GAAG3B,WAAW,CAACT,KAAZ,GAAoBQ,aAAa,CAACR,KAA1D;;AAEA,UAAIG,KAAK,CAACH,KAAV,EAAiB;AACf,YAAIO,YAAY,CAACP,KAAb,GAAqB,CAArB,IAA0B,CAACM,aAAa,CAACN,KAA7C,EAAoD;AAClDO,UAAAA,YAAY,CAACP,KAAb,GAAqB,CAArB;AACD,SAFD,MAEO,IAAIO,YAAY,CAACP,KAAb,IAAsB,CAACoC,eAA3B,EAA4C;AACjD7B,UAAAA,YAAY,CAACP,KAAb,GAAqB,CAACoC,eAAtB;AACD;AACF,OAND,MAMO;AACL,YAAI7B,YAAY,CAACP,KAAb,GAAqB,CAArB,IAA0B,CAACM,aAAa,CAACN,KAA7C,EAAoD;AAClDO,UAAAA,YAAY,CAACP,KAAb,GAAqB,CAArB;AACD,SAFD,MAEO,IAAIO,YAAY,CAACP,KAAb,IAAsBoC,eAA1B,EAA2C;AAChD7B,UAAAA,YAAY,CAACP,KAAb,GAAqBoC,eAArB;AACD;AACF;;AAEDR,MAAAA,iBAAiB,CAAC5B,KAAlB,GAA0B,KAA1B;AACD;;AAED,aAASqC,QAAT,GAAqB;AACnBzB,MAAAA,YAAY,CAACZ,KAAb,KAAuBY,YAAY,CAACZ,KAAb,CAAmBsC,UAAnB,GAAgC,CAAvD;AACD;;AAED,UAAMC,SAAS,GAAG/D,GAAG,CAAC,KAAD,CAArB;;AACA,aAASgE,SAAT,CAAoBR,CAApB,EAAmC;AACjCO,MAAAA,SAAS,CAACvC,KAAV,GAAkB,IAAlB;AAEA,UAAI,CAACM,aAAa,CAACN,KAAf,IAAwB,CAACe,UAAU,CAACf,KAAxC,EAA+C,OAHd,CAKjC;AACA;;AACA,WAAK,MAAMyC,EAAX,IAAiBT,CAAC,CAACU,YAAF,EAAjB,EAAmC;AACjC,aAAK,MAAMnB,IAAX,IAAmBR,UAAU,CAACf,KAAX,CAAiB0B,QAApC,EAA8C;AAC5C,cAAIH,IAAI,KAAKkB,EAAb,EAAiB;AACflC,YAAAA,YAAY,CAACP,KAAb,GAAqB7B,sBAAsB,CAAC;AAC1CsD,cAAAA,eAAe,EAAEF,IADyB;AAE1Cf,cAAAA,aAAa,EAAEA,aAAa,CAACR,KAFa;AAG1CS,cAAAA,WAAW,EAAEA,WAAW,CAACT,KAHiB;AAI1CG,cAAAA,KAAK,EAAEA,KAAK,CAACH,KAJ6B;AAK1C2B,cAAAA,mBAAmB,EAAEpB,YAAY,CAACP,KALQ;AAM1CU,cAAAA,YAAY,EAAEA,YAAY,CAACV;AANe,aAAD,CAA3C;AAQA;AACD;AACF;AACF;AACF;;AAED,aAAS2C,UAAT,CAAqBX,CAArB,EAAoC;AAClCO,MAAAA,SAAS,CAACvC,KAAV,GAAkB,KAAlB;AACD;;AAED,aAAS4C,OAAT,CAAkBZ,CAAlB,EAAiC;AAAA;;AAC/B,UACE,CAACO,SAAS,CAACvC,KAAX,IACA,EAAEgC,CAAC,CAACa,aAAF,yBAAmB9B,UAAU,CAACf,KAA9B,aAAmB,kBAAkB8C,QAAlB,CAA2Bd,CAAC,CAACa,aAA7B,CAArB,CAFF,EAGEE,KAAK;AACR;;AAED,aAASC,SAAT,CAAoBhB,CAApB,EAAsC;AACpC,UAAI,CAACjB,UAAU,CAACf,KAAhB,EAAuB;;AAEvB,UAAIgC,CAAC,CAACiB,GAAF,MAAWvC,YAAY,CAACV,KAAb,GAAqB,YAArB,GAAoC,WAA/C,CAAJ,EAAiE;AAC/D+C,QAAAA,KAAK,CAAC,MAAD,CAAL;AACD,OAFD,MAEO,IAAIf,CAAC,CAACiB,GAAF,MAAWvC,YAAY,CAACV,KAAb,GAAqB,WAArB,GAAmC,SAA9C,CAAJ,EAA8D;AACnE+C,QAAAA,KAAK,CAAC,MAAD,CAAL;AACD,OAFM,MAEA,IAAIf,CAAC,CAACiB,GAAF,KAAU,MAAd,EAAsB;AAC3BF,QAAAA,KAAK,CAAC,OAAD,CAAL;AACD,OAFM,MAEA,IAAIf,CAAC,CAACiB,GAAF,KAAU,KAAd,EAAqB;AAC1BF,QAAAA,KAAK,CAAC,MAAD,CAAL;AACD;AACF;;AAED,aAASA,KAAT,CAAgBG,QAAhB,EAA+D;AAC7D,UAAI,CAACnC,UAAU,CAACf,KAAhB,EAAuB;;AAEvB,UAAI,CAACkD,QAAL,EAAe;AAAA;;AACbnC,QAAAA,UAAU,CAACf,KAAX,CAAiBmD,aAAjB,CAA+B,YAA/B;AACA,cAAMC,SAAS,GAAG,CAAC,GAAGrC,UAAU,CAACf,KAAX,CAAiBqD,gBAAjB,CACpB,0EADoB,CAAJ,EAEfC,MAFe,CAERb,EAAE,IAAI,CAACA,EAAE,CAACc,YAAH,CAAgB,UAAhB,CAFC,CAAlB;AAGA,uBAAAH,SAAS,CAAC,CAAD,CAAT,iCAAcL,KAAd;AACD,OAND,MAMO,IAAIG,QAAQ,KAAK,MAAjB,EAAyB;AAAA;;AAC9B,cAAMT,EAAE,4BAAG1B,UAAU,CAACf,KAAX,CAAiBmD,aAAjB,CAA+B,QAA/B,CAAH,qBAAG,sBAA0CK,kBAArD;AACA,YAAIf,EAAJ,EAAQA,EAAE,CAACM,KAAH,GAAR,KACKA,KAAK,CAAC,OAAD,CAAL;AACN,OAJM,MAIA,IAAIG,QAAQ,KAAK,MAAjB,EAAyB;AAAA;;AAC9B,cAAMT,EAAE,6BAAG1B,UAAU,CAACf,KAAX,CAAiBmD,aAAjB,CAA+B,QAA/B,CAAH,qBAAG,uBAA0CM,sBAArD;AACA,YAAIhB,EAAJ,EAAQA,EAAE,CAACM,KAAH,GAAR,KACKA,KAAK,CAAC,MAAD,CAAL;AACN,OAJM,MAIA,IAAIG,QAAQ,KAAK,OAAjB,EAA0B;AAAA;;AAC/B,iCAACnC,UAAU,CAACf,KAAX,CAAiB0D,iBAAlB,2CAAqDX,KAArD;AACD,OAFM,MAEA,IAAIG,QAAQ,KAAK,MAAjB,EAAyB;AAAA;;AAC9B,iCAACnC,UAAU,CAACf,KAAX,CAAiB2D,gBAAlB,2CAAoDZ,KAApD;AACD;AACF;;AAED,aAASa,QAAT,CAAmBV,QAAnB,EAA8C;AAC5C,YAAMW,IAAI,GAAG1D,KAAK,CAACH,KAAN,GAAc,CAAC,CAAf,GAAmB,CAAhC;AACA,YAAM8D,iBAAiB,GAAGD,IAAI,GAAGtD,YAAY,CAACP,KAApB,GACxB,CAACkD,QAAQ,KAAK,MAAb,GAAsB,CAAC,CAAvB,GAA2B,CAA5B,IAAiC1C,aAAa,CAACR,KADjD;AAGAO,MAAAA,YAAY,CAACP,KAAb,GAAqB6D,IAAI,GAAGzF,KAAK,CAAC0F,iBAAD,EAAoB,CAApB,EAAuBrD,WAAW,CAACT,KAAZ,GAAoBQ,aAAa,CAACR,KAAzD,CAAjC;AACD;;AAED,UAAM+D,aAAa,GAAGxF,QAAQ,CAAC,MAAM;AACnC,YAAMyF,YAAY,GAAGzD,YAAY,CAACP,KAAb,IAAsB,CAAtB,GACjB/B,IAAI,CAAC,CAACsC,YAAY,CAACP,KAAf,CADa,GAEjBO,YAAY,CAACP,KAAb,GAAqBS,WAAW,CAACT,KAAZ,GAAoBQ,aAAa,CAACR,KAAvD,GACE,EAAES,WAAW,CAACT,KAAZ,GAAoBQ,aAAa,CAACR,KAApC,IAA6C/B,IAAI,CAACwC,WAAW,CAACT,KAAZ,GAAoBQ,aAAa,CAACR,KAAlC,GAA0CO,YAAY,CAACP,KAAxD,CADnD,GAEE,CAACO,YAAY,CAACP,KAJpB;AAMA,aAAO;AACLiE,QAAAA,SAAS,EAAG,YAAWvD,YAAY,CAACV,KAAb,GAAqB,GAArB,GAA2B,GAAI,IAAGgE,YAAa,KADjE;AAELE,QAAAA,UAAU,EAAEtC,iBAAiB,CAAC5B,KAAlB,GAA0B,MAA1B,GAAmC,EAF1C;AAGLmE,QAAAA,UAAU,EAAEvC,iBAAiB,CAAC5B,KAAlB,GAA0B,WAA1B,GAAwC;AAH/C,OAAP;AAKD,KAZ6B,CAA9B;AAcA,UAAMoE,SAAS,GAAG7F,QAAQ,CAAC,OAAO;AAChC8F,MAAAA,IAAI,EAAEhE,KAAK,CAACgE,IADoB;AAEhCC,MAAAA,IAAI,EAAEjE,KAAK,CAACiE,IAFoB;AAGhCC,MAAAA,MAAM,EAAElE,KAAK,CAACkE,MAHkB;AAIhCC,MAAAA,UAAU,EAAEnE,KAAK,CAACmE;AAJc,KAAP,CAAD,CAA1B;AAOA,UAAMC,UAAU,GAAGlG,QAAQ,CAAC,MAAM;AAChC,cAAQS,KAAK,CAACW,UAAd;AACE;AACA,aAAK,QAAL;AAAe,iBAAO,IAAP;AAEf;;AACA,aAAK,SAAL;AAAgB,iBAAOS,MAAM,CAACJ,KAAd;AAEhB;AACA;;AACA,aAAK,IAAL;AAAW,iBAAOM,aAAa,CAACN,KAAd,IAAuB0E,IAAI,CAACC,GAAL,CAASpE,YAAY,CAACP,KAAtB,IAA+B,CAA7D;AAEX;;AACA,aAAK,QAAL;AAAe,iBACbI,MAAM,CAACJ,KAAP,IACCM,aAAa,CAACN,KAAd,IAAuB0E,IAAI,CAACC,GAAL,CAASpE,YAAY,CAACP,KAAtB,IAA+B,CAF1C;AAKf;AACA;AACA;;AACA;AAAS,iBACP,CAACI,MAAM,CAACJ,KAAR,KACCM,aAAa,CAACN,KAAd,IAAuB0E,IAAI,CAACC,GAAL,CAASpE,YAAY,CAACP,KAAtB,IAA+B,CADvD,CADO;AApBX;AAyBD,KA1B0B,CAA3B;AA4BA,UAAM4E,OAAO,GAAGrG,QAAQ,CAAC,MAAM;AAC7B,aAAOkG,UAAU,CAACzE,KAAX,IAAoBO,YAAY,CAACP,KAAb,GAAqB,CAAhD;AACD,KAFuB,CAAxB;AAIA,UAAM6E,OAAO,GAAGtG,QAAQ,CAAC,MAAM;AAC7B,UAAI,CAACkG,UAAU,CAACzE,KAAhB,EAAuB,OAAO,KAAP,CADM,CAG7B;;AACA,aAAOS,WAAW,CAACT,KAAZ,GAAoB0E,IAAI,CAACC,GAAL,CAASpE,YAAY,CAACP,KAAtB,IAA+BQ,aAAa,CAACR,KAAxE;AACD,KALuB,CAAxB;AAOA1B,IAAAA,SAAS,CAAC;AAAA;;AAAA;AAAA,iBAEC,CACL,eADK,EAEL;AACE,qCAA2B,CAACoC,YAAY,CAACV,KAD3C;AAEE,wCAA8ByE,UAAU,CAACzE,KAF3C;AAGE,2CAAiCM,aAAa,CAACN;AAHjD,SAFK,CAFD;AAAA,oBAUMuC,SAAS,CAACvC,KAAV,IAAmBK,KAAK,CAACa,QAAN,CAAelB,KAAf,CAAqBmB,MAAzC,GAAmD,CAAC,CAApD,GAAwD,CAV7D;AAAA,mBAWIyB;AAXJ;AAAA,wBAaJ6B,UAAU,CAACzE,KAAX;AAAA,mBAES,CACL,qBADK,EAEL;AAAE,6CAAiC,CAAC4E,OAAO,CAAC5E;AAA5C,WAFK,CAFT;AAAA,qBAMY,MAAM4D,QAAQ,CAAC,MAAD;AAN1B,2CAQI1D,KAAK,CAACoE,IARV,qBAQI,kBAAApE,KAAK,EAAQkE,SAAS,CAACpE,KAAlB,CART;AAAA;AAAA,oBAUoBhB,KAAK,CAACU;AAV1B;AAAA,YAbI;AAAA,iBA8BEkB,YA9BF;AAAA,mBA+BE,0BA/BF;AAAA,sBAgCOyB;AAhCP;AAAA,iBAmCItB,UAnCJ;AAAA,mBAoCI,wBApCJ;AAAA,mBAqCMgD,aAAa,CAAC/D,KArCpB;AAAA,iCAsCoB+B,YAtCpB;AAAA,gCAuCmBG,WAvCnB;AAAA,+BAwCkBC,UAxClB;AAAA,uBAyCUK,SAzCV;AAAA,wBA0CWG,UA1CX;AAAA,uBA2CUK;AA3CV,8BA6CA9C,KAAK,CAACd,OA7CN,qBA6CA,oBAAAc,KAAK,EAAWkE,SAAS,CAACpE,KAArB,CA7CL,MAiDJyE,UAAU,CAACzE,KAAX;AAAA,mBAES,CACL,qBADK,EAEL;AAAE,6CAAiC,CAAC6E,OAAO,CAAC7E;AAA5C,WAFK,CAFT;AAAA,qBAMY,MAAM4D,QAAQ,CAAC,MAAD;AAN1B,2CAQI1D,KAAK,CAACmE,IARV,qBAQI,kBAAAnE,KAAK,EAAQkE,SAAS,CAACpE,KAAlB,CART;AAAA;AAAA,oBAUoBhB,KAAK,CAACS;AAV1B;AAAA,YAjDI;AAAA;AAAA,KAAD,CAAT;AAmEA,WAAO;AACLyB,MAAAA,QAAQ,EAAEb,KAAK,CAACa,QADX;AAEL0C,MAAAA,QAFK;AAGLrD,MAAAA,YAHK;AAILwC,MAAAA;AAJK,KAAP;AAMD;;AAnWwC,CAAD,CAAnC","sourcesContent":["// Styles\nimport './VSlideGroup.sass'\n\n// Components\nimport { VFadeTransition } from '@/components/transitions'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeTagProps } from '@/composables/tag'\nimport { useDisplay } from '@/composables'\nimport { useResizeObserver } from '@/composables/resizeObserver'\nimport { useRtl } from '@/composables/rtl'\n\n// Utilities\nimport { bias, calculateCenteredOffset, calculateUpdatedOffset } from './helpers'\nimport { clamp, defineComponent, useRender } from '@/util'\nimport { computed, ref, watch, watchEffect } from 'vue'\n\n// Types\nimport type { GroupProvide } from '@/composables/group'\nimport type { InjectionKey } from 'vue'\n\nexport const VSlideGroupSymbol: InjectionKey<GroupProvide> = Symbol.for('vuetify:v-slide-group')\n\nexport const VSlideGroup = defineComponent({\n  name: 'VSlideGroup',\n\n  props: {\n    activeClass: {\n      type: String,\n      default: 'v-slide-item--active',\n    },\n    centerActive: Boolean,\n    direction: {\n      type: String,\n      default: 'horizontal',\n    },\n    symbol: {\n      type: null,\n      default: VSlideGroupSymbol,\n    },\n    nextIcon: {\n      type: String,\n      default: '$next',\n    },\n    prevIcon: {\n      type: String,\n      default: '$prev',\n    },\n    showArrows: {\n      type: [Boolean, String],\n      validator: (v: any) => (\n        typeof v === 'boolean' || [\n          'always',\n          'desktop',\n          'mobile',\n        ].includes(v)\n      ),\n    },\n    ...makeTagProps(),\n    ...makeGroupProps(),\n  },\n\n  emits: {\n    'update:modelValue': (value: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { isRtl } = useRtl()\n    const { mobile } = useDisplay()\n    const group = useGroup(props, props.symbol)\n    const isOverflowing = ref(false)\n    const scrollOffset = ref(0)\n    const containerSize = ref(0)\n    const contentSize = ref(0)\n    const isHorizontal = computed(() => props.direction === 'horizontal')\n\n    const { resizeRef: containerRef, contentRect: containerRect } = useResizeObserver()\n    const contentRef = ref<HTMLElement>()\n\n    watchEffect(() => {\n      if (!containerRect.value || !contentRef.value) return\n\n      const sizeProperty = isHorizontal.value ? 'width' : 'height'\n\n      containerSize.value = containerRect.value[sizeProperty]\n      contentSize.value = contentRef.value.getBoundingClientRect()[sizeProperty]\n\n      isOverflowing.value = containerSize.value + 1 < contentSize.value\n    })\n\n    watch(group.selected, selected => {\n      if (!selected.length || !contentRef.value) return\n\n      const index = group.items.value.findIndex(item => item.id === selected[selected.length - 1])\n\n      // TODO: Is this too naive? Should we store element references in group composable?\n      const selectedElement = contentRef.value.children[index] as HTMLElement\n\n      if (index === 0 || !isOverflowing.value) {\n        scrollOffset.value = 0\n      } else if (props.centerActive) {\n        scrollOffset.value = calculateCenteredOffset({\n          selectedElement,\n          containerSize: containerSize.value,\n          contentSize: contentSize.value,\n          isRtl: isRtl.value,\n          isHorizontal: isHorizontal.value,\n        })\n      } else if (isOverflowing.value) {\n        scrollOffset.value = calculateUpdatedOffset({\n          selectedElement,\n          containerSize: containerSize.value,\n          contentSize: contentSize.value,\n          isRtl: isRtl.value,\n          currentScrollOffset: scrollOffset.value,\n          isHorizontal: isHorizontal.value,\n        })\n      }\n    })\n\n    const disableTransition = ref(false)\n\n    let startTouch = 0\n    let startOffset = 0\n\n    function onTouchstart (e: TouchEvent) {\n      const sizeProperty = isHorizontal.value ? 'clientX' : 'clientY'\n      startOffset = scrollOffset.value\n      startTouch = e.touches[0][sizeProperty]\n      disableTransition.value = true\n    }\n\n    function onTouchmove (e: TouchEvent) {\n      if (!isOverflowing.value) return\n\n      const sizeProperty = isHorizontal.value ? 'clientX' : 'clientY'\n      scrollOffset.value = startOffset + startTouch - e.touches[0][sizeProperty]\n    }\n\n    function onTouchend (e: TouchEvent) {\n      const maxScrollOffset = contentSize.value - containerSize.value\n\n      if (isRtl.value) {\n        if (scrollOffset.value > 0 || !isOverflowing.value) {\n          scrollOffset.value = 0\n        } else if (scrollOffset.value <= -maxScrollOffset) {\n          scrollOffset.value = -maxScrollOffset\n        }\n      } else {\n        if (scrollOffset.value < 0 || !isOverflowing.value) {\n          scrollOffset.value = 0\n        } else if (scrollOffset.value >= maxScrollOffset) {\n          scrollOffset.value = maxScrollOffset\n        }\n      }\n\n      disableTransition.value = false\n    }\n\n    function onScroll () {\n      containerRef.value && (containerRef.value.scrollLeft = 0)\n    }\n\n    const isFocused = ref(false)\n    function onFocusin (e: FocusEvent) {\n      isFocused.value = true\n\n      if (!isOverflowing.value || !contentRef.value) return\n\n      // Focused element is likely to be the root of an item, so a\n      // breadth-first search will probably find it in the first iteration\n      for (const el of e.composedPath()) {\n        for (const item of contentRef.value.children) {\n          if (item === el) {\n            scrollOffset.value = calculateUpdatedOffset({\n              selectedElement: item as HTMLElement,\n              containerSize: containerSize.value,\n              contentSize: contentSize.value,\n              isRtl: isRtl.value,\n              currentScrollOffset: scrollOffset.value,\n              isHorizontal: isHorizontal.value,\n            })\n            return\n          }\n        }\n      }\n    }\n\n    function onFocusout (e: FocusEvent) {\n      isFocused.value = false\n    }\n\n    function onFocus (e: FocusEvent) {\n      if (\n        !isFocused.value &&\n        !(e.relatedTarget && contentRef.value?.contains(e.relatedTarget as Node))\n      ) focus()\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      if (!contentRef.value) return\n\n      if (e.key === (isHorizontal.value ? 'ArrowRight' : 'ArrowDown')) {\n        focus('next')\n      } else if (e.key === (isHorizontal.value ? 'ArrowLeft' : 'ArrowUp')) {\n        focus('prev')\n      } else if (e.key === 'Home') {\n        focus('first')\n      } else if (e.key === 'End') {\n        focus('last')\n      }\n    }\n\n    function focus (location?: 'next' | 'prev' | 'first' | 'last') {\n      if (!contentRef.value) return\n\n      if (!location) {\n        contentRef.value.querySelector('[tabindex]')\n        const focusable = [...contentRef.value.querySelectorAll(\n          'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n        )].filter(el => !el.hasAttribute('disabled')) as HTMLElement[]\n        focusable[0]?.focus()\n      } else if (location === 'next') {\n        const el = contentRef.value.querySelector(':focus')?.nextElementSibling as HTMLElement | undefined\n        if (el) el.focus()\n        else focus('first')\n      } else if (location === 'prev') {\n        const el = contentRef.value.querySelector(':focus')?.previousElementSibling as HTMLElement | undefined\n        if (el) el.focus()\n        else focus('last')\n      } else if (location === 'first') {\n        (contentRef.value.firstElementChild as HTMLElement)?.focus()\n      } else if (location === 'last') {\n        (contentRef.value.lastElementChild as HTMLElement)?.focus()\n      }\n    }\n\n    function scrollTo (location: 'prev' | 'next') {\n      const sign = isRtl.value ? -1 : 1\n      const newAbosluteOffset = sign * scrollOffset.value +\n        (location === 'prev' ? -1 : 1) * containerSize.value\n\n      scrollOffset.value = sign * clamp(newAbosluteOffset, 0, contentSize.value - containerSize.value)\n    }\n\n    const contentStyles = computed(() => {\n      const scrollAmount = scrollOffset.value <= 0\n        ? bias(-scrollOffset.value)\n        : scrollOffset.value > contentSize.value - containerSize.value\n          ? -(contentSize.value - containerSize.value) + bias(contentSize.value - containerSize.value - scrollOffset.value)\n          : -scrollOffset.value\n\n      return {\n        transform: `translate${isHorizontal.value ? 'X' : 'Y'}(${scrollAmount}px)`,\n        transition: disableTransition.value ? 'none' : '',\n        willChange: disableTransition.value ? 'transform' : '',\n      }\n    })\n\n    const slotProps = computed(() => ({\n      next: group.next,\n      prev: group.prev,\n      select: group.select,\n      isSelected: group.isSelected,\n    }))\n\n    const hasAffixes = computed(() => {\n      switch (props.showArrows) {\n        // Always show arrows on desktop & mobile\n        case 'always': return true\n\n        // Always show arrows on desktop\n        case 'desktop': return mobile.value\n\n        // Show arrows on mobile when overflowing.\n        // This matches the default 2.2 behavior\n        case true: return isOverflowing.value || Math.abs(scrollOffset.value) > 0\n\n        // Always show on mobile\n        case 'mobile': return (\n          mobile.value ||\n          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)\n        )\n\n        // https://material.io/components/tabs#scrollable-tabs\n        // Always show arrows when\n        // overflowed on desktop\n        default: return (\n          !mobile.value &&\n          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)\n        )\n      }\n    })\n\n    const hasPrev = computed(() => {\n      return hasAffixes.value && scrollOffset.value > 0\n    })\n\n    const hasNext = computed(() => {\n      if (!hasAffixes.value) return false\n\n      // Check one scroll ahead to know the width of right-most item\n      return contentSize.value > Math.abs(scrollOffset.value) + containerSize.value\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-slide-group',\n          {\n            'v-slide-group--vertical': !isHorizontal.value,\n            'v-slide-group--has-affixes': hasAffixes.value,\n            'v-slide-group--is-overflowing': isOverflowing.value,\n          },\n        ]}\n        tabindex={ (isFocused.value || group.selected.value.length) ? -1 : 0 }\n        onFocus={ onFocus }\n      >\n        { hasAffixes.value && (\n          <div\n            class={[\n              'v-slide-group__prev',\n              { 'v-slide-group__prev--disabled': !hasPrev.value },\n            ]}\n            onClick={ () => scrollTo('prev') }\n          >\n            { slots.prev?.(slotProps.value) ?? (\n              <VFadeTransition>\n                <VIcon icon={ props.prevIcon }></VIcon>\n              </VFadeTransition>\n            ) }\n          </div>\n        ) }\n\n        <div\n          ref={ containerRef }\n          class=\"v-slide-group__container\"\n          onScroll={ onScroll }\n        >\n          <div\n            ref={ contentRef }\n            class=\"v-slide-group__content\"\n            style={ contentStyles.value }\n            onTouchstartPassive={ onTouchstart }\n            onTouchmovePassive={ onTouchmove }\n            onTouchendPassive={ onTouchend }\n            onFocusin={ onFocusin }\n            onFocusout={ onFocusout }\n            onKeydown={ onKeydown }\n          >\n            { slots.default?.(slotProps.value) }\n          </div>\n        </div>\n\n        { hasAffixes.value && (\n          <div\n            class={[\n              'v-slide-group__next',\n              { 'v-slide-group__next--disabled': !hasNext.value },\n            ]}\n            onClick={ () => scrollTo('next') }\n          >\n            { slots.next?.(slotProps.value) ?? (\n              <VFadeTransition>\n                <VIcon icon={ props.nextIcon }></VIcon>\n              </VFadeTransition>\n            ) }\n          </div>\n        ) }\n      </props.tag>\n    ))\n\n    return {\n      selected: group.selected,\n      scrollTo,\n      scrollOffset,\n      focus,\n    }\n  },\n})\n\nexport type VSlideGroup = InstanceType<typeof VSlideGroup>\n"],"file":"VSlideGroup.mjs"}
+{"version":3,"file":"VSlideGroup.mjs","names":["VFadeTransition","VIcon","makeGroupProps","useGroup","makeTagProps","useDisplay","useResizeObserver","useRtl","IconValue","bias","calculateCenteredOffset","calculateUpdatedOffset","clamp","defineComponent","useRender","computed","ref","watch","watchEffect","VSlideGroupSymbol","Symbol","for","VSlideGroup","name","props","centerActive","Boolean","direction","type","String","default","symbol","nextIcon","prevIcon","showArrows","validator","v","includes","selectedClass","emits","value","setup","slots","isRtl","mobile","group","isOverflowing","scrollOffset","containerSize","contentSize","isHorizontal","resizeRef","containerRef","contentRect","containerRect","contentRef","sizeProperty","firstSelectedIndex","selected","length","items","findIndex","item","id","lastSelectedIndex","selectedElement","children","currentScrollOffset","firstOverflow","disableTransition","startTouch","startOffset","onTouchstart","e","touches","onTouchmove","onTouchend","maxScrollOffset","onScroll","scrollLeft","isFocused","onFocusin","el","composedPath","onFocusout","onFocus","relatedTarget","contains","focus","onKeydown","key","location","querySelector","focusable","querySelectorAll","filter","hasAttribute","nextElementSibling","previousElementSibling","firstElementChild","lastElementChild","scrollTo","sign","newAbosluteOffset","contentStyles","scrollAmount","transform","transition","willChange","slotProps","next","prev","select","isSelected","hasAffixes","Math","abs","hasPrev","hasNext"],"sources":["../../../src/components/VSlideGroup/VSlideGroup.tsx"],"sourcesContent":["// Styles\nimport './VSlideGroup.sass'\n\n// Components\nimport { VFadeTransition } from '@/components/transitions'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeTagProps } from '@/composables/tag'\nimport { useDisplay } from '@/composables'\nimport { useResizeObserver } from '@/composables/resizeObserver'\nimport { useRtl } from '@/composables/rtl'\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { bias, calculateCenteredOffset, calculateUpdatedOffset } from './helpers'\nimport { clamp, defineComponent, useRender } from '@/util'\nimport { computed, ref, watch, watchEffect } from 'vue'\n\n// Types\nimport type { GroupProvide } from '@/composables/group'\nimport type { InjectionKey } from 'vue'\n\nexport const VSlideGroupSymbol: InjectionKey<GroupProvide> = Symbol.for('vuetify:v-slide-group')\n\nexport const VSlideGroup = defineComponent({\n  name: 'VSlideGroup',\n\n  props: {\n    centerActive: Boolean,\n    direction: {\n      type: String,\n      default: 'horizontal',\n    },\n    symbol: {\n      type: null,\n      default: VSlideGroupSymbol,\n    },\n    nextIcon: {\n      type: IconValue,\n      default: '$next',\n    },\n    prevIcon: {\n      type: IconValue,\n      default: '$prev',\n    },\n    showArrows: {\n      type: [Boolean, String],\n      validator: (v: any) => (\n        typeof v === 'boolean' || [\n          'always',\n          'desktop',\n          'mobile',\n        ].includes(v)\n      ),\n    },\n    ...makeTagProps(),\n    ...makeGroupProps({\n      selectedClass: 'v-slide-group-item--active',\n    }),\n  },\n\n  emits: {\n    'update:modelValue': (value: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { isRtl } = useRtl()\n    const { mobile } = useDisplay()\n    const group = useGroup(props, props.symbol)\n    const isOverflowing = ref(false)\n    const scrollOffset = ref(0)\n    const containerSize = ref(0)\n    const contentSize = ref(0)\n    const isHorizontal = computed(() => props.direction === 'horizontal')\n\n    const { resizeRef: containerRef, contentRect: containerRect } = useResizeObserver()\n    const { resizeRef: contentRef, contentRect } = useResizeObserver()\n\n    watchEffect(() => {\n      if (!containerRect.value || !contentRect.value) return\n\n      const sizeProperty = isHorizontal.value ? 'width' : 'height'\n\n      containerSize.value = containerRect.value[sizeProperty]\n      contentSize.value = contentRect.value[sizeProperty]\n\n      isOverflowing.value = containerSize.value + 1 < contentSize.value\n    })\n\n    const firstSelectedIndex = computed(() => {\n      if (!group.selected.value.length) return -1\n\n      return group.items.value.findIndex(item => item.id === group.selected.value[0])\n    })\n\n    const lastSelectedIndex = computed(() => {\n      if (!group.selected.value.length) return -1\n\n      return group.items.value.findIndex(item => item.id === group.selected.value[group.selected.value.length - 1])\n    })\n\n    watch(group.selected, () => {\n      if (firstSelectedIndex.value < 0 || !contentRef.value) return\n\n      // TODO: Is this too naive? Should we store element references in group composable?\n      const selectedElement = contentRef.value.children[lastSelectedIndex.value] as HTMLElement\n\n      if (firstSelectedIndex.value === 0 || !isOverflowing.value) {\n        scrollOffset.value = 0\n      } else if (props.centerActive) {\n        scrollOffset.value = calculateCenteredOffset({\n          selectedElement,\n          containerSize: containerSize.value,\n          contentSize: contentSize.value,\n          isRtl: isRtl.value,\n          isHorizontal: isHorizontal.value,\n        })\n      } else if (isOverflowing.value) {\n        scrollOffset.value = calculateUpdatedOffset({\n          selectedElement,\n          containerSize: containerSize.value,\n          contentSize: contentSize.value,\n          isRtl: isRtl.value,\n          currentScrollOffset: scrollOffset.value,\n          isHorizontal: isHorizontal.value,\n        })\n      }\n    })\n\n    let firstOverflow = true\n    watch(isOverflowing, () => {\n      if (!firstOverflow || !contentRef.value || firstSelectedIndex.value < 0) return\n\n      firstOverflow = false\n\n      // TODO: Is this too naive? Should we store element references in group composable?\n      const selectedElement = contentRef.value.children[firstSelectedIndex.value] as HTMLElement\n\n      scrollOffset.value = calculateCenteredOffset({\n        selectedElement,\n        containerSize: containerSize.value,\n        contentSize: contentSize.value,\n        isRtl: isRtl.value,\n        isHorizontal: isHorizontal.value,\n      })\n    })\n\n    const disableTransition = ref(false)\n\n    let startTouch = 0\n    let startOffset = 0\n\n    function onTouchstart (e: TouchEvent) {\n      const sizeProperty = isHorizontal.value ? 'clientX' : 'clientY'\n      startOffset = scrollOffset.value\n      startTouch = e.touches[0][sizeProperty]\n      disableTransition.value = true\n    }\n\n    function onTouchmove (e: TouchEvent) {\n      if (!isOverflowing.value) return\n\n      const sizeProperty = isHorizontal.value ? 'clientX' : 'clientY'\n      scrollOffset.value = startOffset + startTouch - e.touches[0][sizeProperty]\n    }\n\n    function onTouchend (e: TouchEvent) {\n      const maxScrollOffset = contentSize.value - containerSize.value\n\n      if (isRtl.value) {\n        if (scrollOffset.value > 0 || !isOverflowing.value) {\n          scrollOffset.value = 0\n        } else if (scrollOffset.value <= -maxScrollOffset) {\n          scrollOffset.value = -maxScrollOffset\n        }\n      } else {\n        if (scrollOffset.value < 0 || !isOverflowing.value) {\n          scrollOffset.value = 0\n        } else if (scrollOffset.value >= maxScrollOffset) {\n          scrollOffset.value = maxScrollOffset\n        }\n      }\n\n      disableTransition.value = false\n    }\n\n    function onScroll () {\n      containerRef.value && (containerRef.value.scrollLeft = 0)\n    }\n\n    const isFocused = ref(false)\n    function onFocusin (e: FocusEvent) {\n      isFocused.value = true\n\n      if (!isOverflowing.value || !contentRef.value) return\n\n      // Focused element is likely to be the root of an item, so a\n      // breadth-first search will probably find it in the first iteration\n      for (const el of e.composedPath()) {\n        for (const item of contentRef.value.children) {\n          if (item === el) {\n            scrollOffset.value = calculateUpdatedOffset({\n              selectedElement: item as HTMLElement,\n              containerSize: containerSize.value,\n              contentSize: contentSize.value,\n              isRtl: isRtl.value,\n              currentScrollOffset: scrollOffset.value,\n              isHorizontal: isHorizontal.value,\n            })\n            return\n          }\n        }\n      }\n    }\n\n    function onFocusout (e: FocusEvent) {\n      isFocused.value = false\n    }\n\n    function onFocus (e: FocusEvent) {\n      if (\n        !isFocused.value &&\n        !(e.relatedTarget && contentRef.value?.contains(e.relatedTarget as Node))\n      ) focus()\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      if (!contentRef.value) return\n\n      if (e.key === (isHorizontal.value ? 'ArrowRight' : 'ArrowDown')) {\n        focus('next')\n      } else if (e.key === (isHorizontal.value ? 'ArrowLeft' : 'ArrowUp')) {\n        focus('prev')\n      } else if (e.key === 'Home') {\n        focus('first')\n      } else if (e.key === 'End') {\n        focus('last')\n      }\n    }\n\n    function focus (location?: 'next' | 'prev' | 'first' | 'last') {\n      if (!contentRef.value) return\n\n      if (!location) {\n        contentRef.value.querySelector('[tabindex]')\n        const focusable = [...contentRef.value.querySelectorAll(\n          'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n        )].filter(el => !el.hasAttribute('disabled')) as HTMLElement[]\n        focusable[0]?.focus()\n      } else if (location === 'next') {\n        const el = contentRef.value.querySelector(':focus')?.nextElementSibling as HTMLElement | undefined\n        if (el) el.focus()\n        else focus('first')\n      } else if (location === 'prev') {\n        const el = contentRef.value.querySelector(':focus')?.previousElementSibling as HTMLElement | undefined\n        if (el) el.focus()\n        else focus('last')\n      } else if (location === 'first') {\n        (contentRef.value.firstElementChild as HTMLElement)?.focus()\n      } else if (location === 'last') {\n        (contentRef.value.lastElementChild as HTMLElement)?.focus()\n      }\n    }\n\n    function scrollTo (location: 'prev' | 'next') {\n      const sign = isRtl.value ? -1 : 1\n      const newAbosluteOffset = sign * scrollOffset.value +\n        (location === 'prev' ? -1 : 1) * containerSize.value\n\n      scrollOffset.value = sign * clamp(newAbosluteOffset, 0, contentSize.value - containerSize.value)\n    }\n\n    const contentStyles = computed(() => {\n      const scrollAmount = scrollOffset.value <= 0\n        ? bias(-scrollOffset.value)\n        : scrollOffset.value > contentSize.value - containerSize.value\n          ? -(contentSize.value - containerSize.value) + bias(contentSize.value - containerSize.value - scrollOffset.value)\n          : -scrollOffset.value\n\n      return {\n        transform: `translate${isHorizontal.value ? 'X' : 'Y'}(${scrollAmount}px)`,\n        transition: disableTransition.value ? 'none' : '',\n        willChange: disableTransition.value ? 'transform' : '',\n      }\n    })\n\n    const slotProps = computed(() => ({\n      next: group.next,\n      prev: group.prev,\n      select: group.select,\n      isSelected: group.isSelected,\n    }))\n\n    const hasAffixes = computed(() => {\n      switch (props.showArrows) {\n        // Always show arrows on desktop & mobile\n        case 'always': return true\n\n        // Always show arrows on desktop\n        case 'desktop': return !mobile.value\n\n        // Show arrows on mobile when overflowing.\n        // This matches the default 2.2 behavior\n        case true: return isOverflowing.value || Math.abs(scrollOffset.value) > 0\n\n        // Always show on mobile\n        case 'mobile': return (\n          mobile.value ||\n          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)\n        )\n\n        // https://material.io/components/tabs#scrollable-tabs\n        // Always show arrows when\n        // overflowed on desktop\n        default: return (\n          !mobile.value &&\n          (isOverflowing.value || Math.abs(scrollOffset.value) > 0)\n        )\n      }\n    })\n\n    const hasPrev = computed(() => {\n      return hasAffixes.value && scrollOffset.value > 0\n    })\n\n    const hasNext = computed(() => {\n      if (!hasAffixes.value) return false\n\n      // Check one scroll ahead to know the width of right-most item\n      return contentSize.value > Math.abs(scrollOffset.value) + containerSize.value\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-slide-group',\n          {\n            'v-slide-group--vertical': !isHorizontal.value,\n            'v-slide-group--has-affixes': hasAffixes.value,\n            'v-slide-group--is-overflowing': isOverflowing.value,\n          },\n        ]}\n        tabindex={ (isFocused.value || group.selected.value.length) ? -1 : 0 }\n        onFocus={ onFocus }\n      >\n        { hasAffixes.value && (\n          <div\n            class={[\n              'v-slide-group__prev',\n              { 'v-slide-group__prev--disabled': !hasPrev.value },\n            ]}\n            onClick={ () => scrollTo('prev') }\n          >\n            { slots.prev?.(slotProps.value) ?? (\n              <VFadeTransition>\n                <VIcon icon={ props.prevIcon }></VIcon>\n              </VFadeTransition>\n            ) }\n          </div>\n        ) }\n\n        <div\n          ref={ containerRef }\n          class=\"v-slide-group__container\"\n          onScroll={ onScroll }\n        >\n          <div\n            ref={ contentRef }\n            class=\"v-slide-group__content\"\n            style={ contentStyles.value }\n            onTouchstartPassive={ onTouchstart }\n            onTouchmovePassive={ onTouchmove }\n            onTouchendPassive={ onTouchend }\n            onFocusin={ onFocusin }\n            onFocusout={ onFocusout }\n            onKeydown={ onKeydown }\n          >\n            { slots.default?.(slotProps.value) }\n          </div>\n        </div>\n\n        { hasAffixes.value && (\n          <div\n            class={[\n              'v-slide-group__next',\n              { 'v-slide-group__next--disabled': !hasNext.value },\n            ]}\n            onClick={ () => scrollTo('next') }\n          >\n            { slots.next?.(slotProps.value) ?? (\n              <VFadeTransition>\n                <VIcon icon={ props.nextIcon }></VIcon>\n              </VFadeTransition>\n            ) }\n          </div>\n        ) }\n      </props.tag>\n    ))\n\n    return {\n      selected: group.selected,\n      scrollTo,\n      scrollOffset,\n      focus,\n    }\n  },\n})\n\nexport type VSlideGroup = InstanceType<typeof VSlideGroup>\n"],"mappings":"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"}

package/lib/components/VSlideGroup/VSlideGroup.sass

@@ -1,4 +1,3 @@
-@forward './variables'
 @use 'sass:math'
 @use 'sass:map'
 @use '../../styles/settings'
@@ -9,10 +8,6 @@
 .v-slide-group
   display: flex
 
-.v-slide-item
-  display: inline-flex
-  flex: 0 1 auto
-
 // Element
 .v-slide-group__next,
 .v-slide-group__prev

package/lib/components/VSlideGroup/VSlideGroupItem.mjs

@@ -18,7 +18,9 @@ export const VSlideGroupItem = defineComponent({
 
       return (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, {
         isSelected: slideGroupItem.isSelected.value,
-        select: slideGroupItem.select
+        select: slideGroupItem.select,
+        toggle: slideGroupItem.toggle,
+        selectedClass: slideGroupItem.selectedClass.value
       });
     };
   }

package/lib/components/VSlideGroup/VSlideGroupItem.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VSlideGroup/VSlideGroupItem.tsx"],"names":["makeGroupItemProps","useGroupItem","VSlideGroupSymbol","defineComponent","VSlideGroupItem","name","props","setup","slots","slideGroupItem","default","isSelected","value","select"],"mappings":"AAAA;SACSA,kB,EAAoBC,Y;SACpBC,iB,6BAET;;SACSC,e;AAET,OAAO,MAAMC,eAAe,GAAGD,eAAe,CAAC;AAC7CE,EAAAA,IAAI,EAAE,iBADuC;AAG7CC,EAAAA,KAAK,EAAE,EACL,GAAGN,kBAAkB;AADhB,GAHsC;;AAO7CO,EAAAA,KAAK,CAAED,KAAF,QAAoB;AAAA,QAAX;AAAEE,MAAAA;AAAF,KAAW;AACvB,UAAMC,cAAc,GAAGR,YAAY,CAACK,KAAD,EAAQJ,iBAAR,CAAnC;AAEA,WAAO;AAAA;;AAAA,+BAAMM,KAAK,CAACE,OAAZ,qBAAM,oBAAAF,KAAK,EAAW;AAC3BG,QAAAA,UAAU,EAAEF,cAAc,CAACE,UAAf,CAA0BC,KADX;AAE3BC,QAAAA,MAAM,EAAEJ,cAAc,CAACI;AAFI,OAAX,CAAX;AAAA,KAAP;AAID;;AAd4C,CAAD,CAAvC","sourcesContent":["// Composables\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { VSlideGroupSymbol } from './VSlideGroup'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\nexport const VSlideGroupItem = defineComponent({\n  name: 'VSlideGroupItem',\n\n  props: {\n    ...makeGroupItemProps(),\n  },\n\n  setup (props, { slots }) {\n    const slideGroupItem = useGroupItem(props, VSlideGroupSymbol)\n\n    return () => slots.default?.({\n      isSelected: slideGroupItem.isSelected.value,\n      select: slideGroupItem.select,\n    })\n  },\n})\n"],"file":"VSlideGroupItem.mjs"}
+{"version":3,"file":"VSlideGroupItem.mjs","names":["makeGroupItemProps","useGroupItem","VSlideGroupSymbol","defineComponent","VSlideGroupItem","name","props","setup","slots","slideGroupItem","default","isSelected","value","select","toggle","selectedClass"],"sources":["../../../src/components/VSlideGroup/VSlideGroupItem.tsx"],"sourcesContent":["// Composables\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { VSlideGroupSymbol } from './VSlideGroup'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\nexport const VSlideGroupItem = defineComponent({\n  name: 'VSlideGroupItem',\n\n  props: {\n    ...makeGroupItemProps(),\n  },\n\n  setup (props, { slots }) {\n    const slideGroupItem = useGroupItem(props, VSlideGroupSymbol)\n\n    return () => slots.default?.({\n      isSelected: slideGroupItem.isSelected.value,\n      select: slideGroupItem.select,\n      toggle: slideGroupItem.toggle,\n      selectedClass: slideGroupItem.selectedClass.value,\n    })\n  },\n})\n"],"mappings":"AAAA;SACSA,kB,EAAoBC,Y;SACpBC,iB,6BAET;;SACSC,e;AAET,OAAO,MAAMC,eAAe,GAAGD,eAAe,CAAC;EAC7CE,IAAI,EAAE,iBADuC;EAG7CC,KAAK,EAAE,EACL,GAAGN,kBAAkB;EADhB,CAHsC;;EAO7CO,KAAK,CAAED,KAAF,QAAoB;IAAA,IAAX;MAAEE;IAAF,CAAW;IACvB,MAAMC,cAAc,GAAGR,YAAY,CAACK,KAAD,EAAQJ,iBAAR,CAAnC;IAEA,OAAO;MAAA;;MAAA,yBAAMM,KAAK,CAACE,OAAZ,qBAAM,oBAAAF,KAAK,EAAW;QAC3BG,UAAU,EAAEF,cAAc,CAACE,UAAf,CAA0BC,KADX;QAE3BC,MAAM,EAAEJ,cAAc,CAACI,MAFI;QAG3BC,MAAM,EAAEL,cAAc,CAACK,MAHI;QAI3BC,aAAa,EAAEN,cAAc,CAACM,aAAf,CAA6BH;MAJjB,CAAX,CAAX;IAAA,CAAP;EAMD;;AAhB4C,CAAD,CAAvC"}

package/lib/components/VSlideGroup/helpers.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VSlideGroup/helpers.ts"],"names":["bias","val","c","x","Math","abs","sign","calculateUpdatedOffset","selectedElement","containerSize","contentSize","isRtl","currentScrollOffset","isHorizontal","clientSize","clientWidth","clientHeight","offsetStart","offsetLeft","offsetTop","adjustedOffsetStart","totalSize","itemOffset","additionalOffset","max","min","calculateCenteredOffset","offsetCentered"],"mappings":"AAAA,OAAO,SAASA,IAAT,CAAeC,GAAf,EAA4B;AACjC,QAAMC,CAAC,GAAG,KAAV;AACA,QAAMC,CAAC,GAAGC,IAAI,CAACC,GAAL,CAASJ,GAAT,CAAV;AACA,SAAOG,IAAI,CAACE,IAAL,CAAUL,GAAV,KAAkBE,CAAC,IAAI,CAAC,IAAID,CAAJ,GAAQ,CAAT,KAAe,IAAIC,CAAnB,IAAwB,CAA5B,CAAnB,CAAP;AACD;AAED,OAAO,SAASI,sBAAT,OAcI;AAAA,MAd6B;AACtCC,IAAAA,eADsC;AAEtCC,IAAAA,aAFsC;AAGtCC,IAAAA,WAHsC;AAItCC,IAAAA,KAJsC;AAKtCC,IAAAA,mBALsC;AAMtCC,IAAAA;AANsC,GAc7B;AACT,QAAMC,UAAU,GAAGD,YAAY,GAAGL,eAAe,CAACO,WAAnB,GAAiCP,eAAe,CAACQ,YAAhF;AACA,QAAMC,WAAW,GAAGJ,YAAY,GAAGL,eAAe,CAACU,UAAnB,GAAgCV,eAAe,CAACW,SAAhF;AACA,QAAMC,mBAAmB,GAAGT,KAAK,GAAID,WAAW,GAAGO,WAAd,GAA4BH,UAAhC,GAA8CG,WAA/E;;AAEA,MAAIN,KAAJ,EAAW;AACTC,IAAAA,mBAAmB,GAAG,CAACA,mBAAvB;AACD;;AAED,QAAMS,SAAS,GAAGZ,aAAa,GAAGG,mBAAlC;AACA,QAAMU,UAAU,GAAGR,UAAU,GAAGM,mBAAhC;AACA,QAAMG,gBAAgB,GAAGT,UAAU,GAAG,GAAtC;;AAEA,MAAIM,mBAAmB,IAAIR,mBAA3B,EAAgD;AAC9CA,IAAAA,mBAAmB,GAAGR,IAAI,CAACoB,GAAL,CAASJ,mBAAmB,GAAGG,gBAA/B,EAAiD,CAAjD,CAAtB;AACD,GAFD,MAEO,IAAIF,SAAS,IAAIC,UAAjB,EAA6B;AAClCV,IAAAA,mBAAmB,GAAGR,IAAI,CAACqB,GAAL,CAASb,mBAAmB,IAAIS,SAAS,GAAGC,UAAZ,GAAyBC,gBAA7B,CAA5B,EAA4Eb,WAAW,GAAGD,aAA1F,CAAtB;AACD;;AAED,SAAOE,KAAK,GAAG,CAACC,mBAAJ,GAA0BA,mBAAtC;AACD;AAED,OAAO,SAASc,uBAAT,QAYI;AAAA,MAZ8B;AACvClB,IAAAA,eADuC;AAEvCC,IAAAA,aAFuC;AAGvCC,IAAAA,WAHuC;AAIvCC,IAAAA,KAJuC;AAKvCE,IAAAA;AALuC,GAY9B;AACT,QAAMC,UAAU,GAAGD,YAAY,GAAGL,eAAe,CAACO,WAAnB,GAAiCP,eAAe,CAACQ,YAAhF;AACA,QAAMC,WAAW,GAAGJ,YAAY,GAAGL,eAAe,CAACU,UAAnB,GAAgCV,eAAe,CAACW,SAAhF;;AAEA,MAAIR,KAAJ,EAAW;AACT,UAAMgB,cAAc,GAAGjB,WAAW,GAAGO,WAAd,GAA4BH,UAAU,GAAG,CAAzC,GAA6CL,aAAa,GAAG,CAApF;AACA,WAAO,CAACL,IAAI,CAACqB,GAAL,CAASf,WAAW,GAAGD,aAAvB,EAAsCL,IAAI,CAACoB,GAAL,CAAS,CAAT,EAAYG,cAAZ,CAAtC,CAAR;AACD,GAHD,MAGO;AACL,UAAMA,cAAc,GAAGV,WAAW,GAAGH,UAAU,GAAG,CAA3B,GAA+BL,aAAa,GAAG,CAAtE;AACA,WAAOL,IAAI,CAACqB,GAAL,CAASf,WAAW,GAAGD,aAAvB,EAAsCL,IAAI,CAACoB,GAAL,CAAS,CAAT,EAAYG,cAAZ,CAAtC,CAAP;AACD;AACF","sourcesContent":["export function bias (val: number) {\n  const c = 0.501\n  const x = Math.abs(val)\n  return Math.sign(val) * (x / ((1 / c - 2) * (1 - x) + 1))\n}\n\nexport function calculateUpdatedOffset ({\n  selectedElement,\n  containerSize,\n  contentSize,\n  isRtl,\n  currentScrollOffset,\n  isHorizontal,\n}: {\n  selectedElement: HTMLElement\n  containerSize: number\n  contentSize: number\n  isRtl: boolean\n  currentScrollOffset: number\n  isHorizontal: boolean\n}): number {\n  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight\n  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop\n  const adjustedOffsetStart = isRtl ? (contentSize - offsetStart - clientSize) : offsetStart\n\n  if (isRtl) {\n    currentScrollOffset = -currentScrollOffset\n  }\n\n  const totalSize = containerSize + currentScrollOffset\n  const itemOffset = clientSize + adjustedOffsetStart\n  const additionalOffset = clientSize * 0.4\n\n  if (adjustedOffsetStart <= currentScrollOffset) {\n    currentScrollOffset = Math.max(adjustedOffsetStart - additionalOffset, 0)\n  } else if (totalSize <= itemOffset) {\n    currentScrollOffset = Math.min(currentScrollOffset - (totalSize - itemOffset - additionalOffset), contentSize - containerSize)\n  }\n\n  return isRtl ? -currentScrollOffset : currentScrollOffset\n}\n\nexport function calculateCenteredOffset ({\n  selectedElement,\n  containerSize,\n  contentSize,\n  isRtl,\n  isHorizontal,\n}: {\n  selectedElement: HTMLElement\n  containerSize: number\n  contentSize: number\n  isRtl: boolean\n  isHorizontal: boolean\n}): number {\n  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight\n  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop\n\n  if (isRtl) {\n    const offsetCentered = contentSize - offsetStart - clientSize / 2 - containerSize / 2\n    return -Math.min(contentSize - containerSize, Math.max(0, offsetCentered))\n  } else {\n    const offsetCentered = offsetStart + clientSize / 2 - containerSize / 2\n    return Math.min(contentSize - containerSize, Math.max(0, offsetCentered))\n  }\n}\n"],"file":"helpers.mjs"}
+{"version":3,"file":"helpers.mjs","names":["bias","val","c","x","Math","abs","sign","calculateUpdatedOffset","selectedElement","containerSize","contentSize","isRtl","currentScrollOffset","isHorizontal","clientSize","clientWidth","clientHeight","offsetStart","offsetLeft","offsetTop","adjustedOffsetStart","totalSize","itemOffset","additionalOffset","max","min","calculateCenteredOffset","offsetCentered"],"sources":["../../../src/components/VSlideGroup/helpers.ts"],"sourcesContent":["export function bias (val: number) {\n  const c = 0.501\n  const x = Math.abs(val)\n  return Math.sign(val) * (x / ((1 / c - 2) * (1 - x) + 1))\n}\n\nexport function calculateUpdatedOffset ({\n  selectedElement,\n  containerSize,\n  contentSize,\n  isRtl,\n  currentScrollOffset,\n  isHorizontal,\n}: {\n  selectedElement: HTMLElement\n  containerSize: number\n  contentSize: number\n  isRtl: boolean\n  currentScrollOffset: number\n  isHorizontal: boolean\n}): number {\n  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight\n  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop\n  const adjustedOffsetStart = isRtl ? (contentSize - offsetStart - clientSize) : offsetStart\n\n  if (isRtl) {\n    currentScrollOffset = -currentScrollOffset\n  }\n\n  const totalSize = containerSize + currentScrollOffset\n  const itemOffset = clientSize + adjustedOffsetStart\n  const additionalOffset = clientSize * 0.4\n\n  if (adjustedOffsetStart <= currentScrollOffset) {\n    currentScrollOffset = Math.max(adjustedOffsetStart - additionalOffset, 0)\n  } else if (totalSize <= itemOffset) {\n    currentScrollOffset = Math.min(currentScrollOffset - (totalSize - itemOffset - additionalOffset), contentSize - containerSize)\n  }\n\n  return isRtl ? -currentScrollOffset : currentScrollOffset\n}\n\nexport function calculateCenteredOffset ({\n  selectedElement,\n  containerSize,\n  contentSize,\n  isRtl,\n  isHorizontal,\n}: {\n  selectedElement: HTMLElement\n  containerSize: number\n  contentSize: number\n  isRtl: boolean\n  isHorizontal: boolean\n}): number {\n  const clientSize = isHorizontal ? selectedElement.clientWidth : selectedElement.clientHeight\n  const offsetStart = isHorizontal ? selectedElement.offsetLeft : selectedElement.offsetTop\n\n  if (isRtl) {\n    const offsetCentered = contentSize - offsetStart - clientSize / 2 - containerSize / 2\n    return -Math.min(contentSize - containerSize, Math.max(0, offsetCentered))\n  } else {\n    const offsetCentered = offsetStart + clientSize / 2 - containerSize / 2\n    return Math.min(contentSize - containerSize, Math.max(0, offsetCentered))\n  }\n}\n"],"mappings":"AAAA,OAAO,SAASA,IAAT,CAAeC,GAAf,EAA4B;EACjC,MAAMC,CAAC,GAAG,KAAV;EACA,MAAMC,CAAC,GAAGC,IAAI,CAACC,GAAL,CAASJ,GAAT,CAAV;EACA,OAAOG,IAAI,CAACE,IAAL,CAAUL,GAAV,KAAkBE,CAAC,IAAI,CAAC,IAAID,CAAJ,GAAQ,CAAT,KAAe,IAAIC,CAAnB,IAAwB,CAA5B,CAAnB,CAAP;AACD;AAED,OAAO,SAASI,sBAAT,OAcI;EAAA,IAd6B;IACtCC,eADsC;IAEtCC,aAFsC;IAGtCC,WAHsC;IAItCC,KAJsC;IAKtCC,mBALsC;IAMtCC;EANsC,CAc7B;EACT,MAAMC,UAAU,GAAGD,YAAY,GAAGL,eAAe,CAACO,WAAnB,GAAiCP,eAAe,CAACQ,YAAhF;EACA,MAAMC,WAAW,GAAGJ,YAAY,GAAGL,eAAe,CAACU,UAAnB,GAAgCV,eAAe,CAACW,SAAhF;EACA,MAAMC,mBAAmB,GAAGT,KAAK,GAAID,WAAW,GAAGO,WAAd,GAA4BH,UAAhC,GAA8CG,WAA/E;;EAEA,IAAIN,KAAJ,EAAW;IACTC,mBAAmB,GAAG,CAACA,mBAAvB;EACD;;EAED,MAAMS,SAAS,GAAGZ,aAAa,GAAGG,mBAAlC;EACA,MAAMU,UAAU,GAAGR,UAAU,GAAGM,mBAAhC;EACA,MAAMG,gBAAgB,GAAGT,UAAU,GAAG,GAAtC;;EAEA,IAAIM,mBAAmB,IAAIR,mBAA3B,EAAgD;IAC9CA,mBAAmB,GAAGR,IAAI,CAACoB,GAAL,CAASJ,mBAAmB,GAAGG,gBAA/B,EAAiD,CAAjD,CAAtB;EACD,CAFD,MAEO,IAAIF,SAAS,IAAIC,UAAjB,EAA6B;IAClCV,mBAAmB,GAAGR,IAAI,CAACqB,GAAL,CAASb,mBAAmB,IAAIS,SAAS,GAAGC,UAAZ,GAAyBC,gBAA7B,CAA5B,EAA4Eb,WAAW,GAAGD,aAA1F,CAAtB;EACD;;EAED,OAAOE,KAAK,GAAG,CAACC,mBAAJ,GAA0BA,mBAAtC;AACD;AAED,OAAO,SAASc,uBAAT,QAYI;EAAA,IAZ8B;IACvClB,eADuC;IAEvCC,aAFuC;IAGvCC,WAHuC;IAIvCC,KAJuC;IAKvCE;EALuC,CAY9B;EACT,MAAMC,UAAU,GAAGD,YAAY,GAAGL,eAAe,CAACO,WAAnB,GAAiCP,eAAe,CAACQ,YAAhF;EACA,MAAMC,WAAW,GAAGJ,YAAY,GAAGL,eAAe,CAACU,UAAnB,GAAgCV,eAAe,CAACW,SAAhF;;EAEA,IAAIR,KAAJ,EAAW;IACT,MAAMgB,cAAc,GAAGjB,WAAW,GAAGO,WAAd,GAA4BH,UAAU,GAAG,CAAzC,GAA6CL,aAAa,GAAG,CAApF;IACA,OAAO,CAACL,IAAI,CAACqB,GAAL,CAASf,WAAW,GAAGD,aAAvB,EAAsCL,IAAI,CAACoB,GAAL,CAAS,CAAT,EAAYG,cAAZ,CAAtC,CAAR;EACD,CAHD,MAGO;IACL,MAAMA,cAAc,GAAGV,WAAW,GAAGH,UAAU,GAAG,CAA3B,GAA+BL,aAAa,GAAG,CAAtE;IACA,OAAOL,IAAI,CAACqB,GAAL,CAASf,WAAW,GAAGD,aAAvB,EAAsCL,IAAI,CAACoB,GAAL,CAAS,CAAT,EAAYG,cAAZ,CAAtC,CAAP;EACD;AACF"}

package/lib/components/VSlideGroup/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"index.mjs"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/VSlideGroup/index.ts"],"sourcesContent":["export * from './VSlideGroup'\nexport * from './VSlideGroupItem'\n"],"mappings":""}

package/lib/components/VSlider/VSlider.css

@@ -1,9 +1,12 @@
-.v-slider input {
+.v-slider .v-slider__container input {
   cursor: default;
   padding: 0;
   width: 100%;
   display: none;
 }
+.v-slider .v-input__append, .v-slider .v-input__prepend {
+  padding: 0;
+}
 
 .v-slider__container {
   position: relative;
@@ -22,6 +25,7 @@
 }
 
 .v-slider.v-input--horizontal {
+  align-items: center;
   margin-left: 8px;
   margin-right: 8px;
 }
@@ -32,6 +36,7 @@
 }
 
 .v-slider.v-input--vertical {
+  justify-content: center;
   margin-top: 12px;
   margin-bottom: 12px;
 }
@@ -44,5 +49,5 @@
 }
 
 .v-slider--has-labels .v-input__control {
-  margin-bottom: 12.5px;
+  margin-bottom: 4px;
 }

package/lib/components/VSlider/VSlider.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VSlider/VSlider.tsx"],"names":["VInput","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","makeSliderProps","useSlider","useProxiedModel","defineComponent","computed","ref","filterInputProps","makeVInputProps","VSlider","name","props","modelValue","type","Number","String","default","emits","value","v","setup","attrs","slots","thumbContainerRef","min","max","mousePressed","roundValue","onSliderMousedown","onSliderTouchstart","trackContainerRef","position","hasLabels","readonly","handleSliderMouseUp","newValue","model","handleMouseMove","getActiveThumb","$el","undefined","parseFloat","isFocused","focus","blur","trackStop","inputProps","_","disabled","id","elevation"],"mappings":"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","sourcesContent":["// Styles\nimport './VSlider.sass'\n\n// Components\nimport { VInput } from '../VInput'\nimport { VSliderThumb } from './VSliderThumb'\nimport { VSliderTrack } from './VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { makeSliderProps, useSlider } from './slider'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Helpers\nimport { defineComponent } from '@/util'\n\n// Types\nimport { computed, ref } from 'vue'\nimport { filterInputProps, makeVInputProps } from '../VInput/VInput'\n\nexport const VSlider = defineComponent({\n  name: 'VSlider',\n\n  props: {\n    ...makeFocusProps(),\n    ...makeSliderProps(),\n    ...makeVInputProps(),\n\n    modelValue: {\n      type: [Number, String],\n      default: 0,\n    },\n  },\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const thumbContainerRef = ref()\n\n    const {\n      min,\n      max,\n      mousePressed,\n      roundValue,\n      onSliderMousedown,\n      onSliderTouchstart,\n      trackContainerRef,\n      position,\n      hasLabels,\n      readonly,\n    } = useSlider({\n      props,\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleSliderMouseUp: newValue => model.value = roundValue(newValue),\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleMouseMove: newValue => model.value = roundValue(newValue),\n      getActiveThumb: () => thumbContainerRef.value?.$el,\n    })\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      v => {\n        const value = typeof v === 'string' ? parseFloat(v) : v == null ? min.value : v\n\n        return roundValue(value)\n      },\n    )\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStop = computed(() => position(model.value))\n\n    return () => {\n      const [inputProps, _] = filterInputProps(props)\n\n      return (\n        <VInput\n          class={[\n            'v-slider',\n            {\n              'v-slider--has-labels': !!slots['tick-label'] || hasLabels.value,\n              'v-slider--focused': isFocused.value,\n              'v-slider--pressed': mousePressed.value,\n              'v-slider--disabled': props.disabled,\n            },\n          ]}\n          { ...inputProps }\n          focused={ isFocused.value }\n        >\n          {{\n            ...slots,\n            default: ({ id }) => (\n              <div\n                class=\"v-slider__container\"\n                onMousedown={ !readonly.value ? onSliderMousedown : undefined }\n                onTouchstartPassive={ !readonly.value ? onSliderTouchstart : undefined }\n              >\n                <input\n                  id={ id.value }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ 0 }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ thumbContainerRef }\n                  focused={ isFocused.value }\n                  min={ min.value }\n                  max={ max.value }\n                  modelValue={ model.value }\n                  onUpdate:modelValue={ v => (model.value = v) }\n                  position={ trackStop.value }\n                  elevation={ props.elevation }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n              </div>\n            ),\n          }}\n        </VInput>\n      )\n    }\n  },\n})\n\nexport type VSlider = InstanceType<typeof VSlider>\n"],"file":"VSlider.mjs"}
+{"version":3,"file":"VSlider.mjs","names":["VInput","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","makeSliderProps","useSlider","useProxiedModel","defineComponent","computed","ref","filterInputProps","makeVInputProps","VSlider","name","props","modelValue","type","Number","String","default","emits","value","v","setup","attrs","slots","thumbContainerRef","min","max","mousePressed","roundValue","onSliderMousedown","onSliderTouchstart","trackContainerRef","position","hasLabels","readonly","handleSliderMouseUp","newValue","model","handleMouseMove","getActiveThumb","$el","undefined","parseFloat","isFocused","focus","blur","trackStop","inputProps","_","disabled","id","elevation"],"sources":["../../../src/components/VSlider/VSlider.tsx"],"sourcesContent":["// Styles\nimport './VSlider.sass'\n\n// Components\nimport { VInput } from '../VInput'\nimport { VSliderThumb } from './VSliderThumb'\nimport { VSliderTrack } from './VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { makeSliderProps, useSlider } from './slider'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Helpers\nimport { defineComponent } from '@/util'\n\n// Types\nimport { computed, ref } from 'vue'\nimport { filterInputProps, makeVInputProps } from '../VInput/VInput'\n\nexport const VSlider = defineComponent({\n  name: 'VSlider',\n\n  props: {\n    ...makeFocusProps(),\n    ...makeSliderProps(),\n    ...makeVInputProps(),\n\n    modelValue: {\n      type: [Number, String],\n      default: 0,\n    },\n  },\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const thumbContainerRef = ref()\n\n    const {\n      min,\n      max,\n      mousePressed,\n      roundValue,\n      onSliderMousedown,\n      onSliderTouchstart,\n      trackContainerRef,\n      position,\n      hasLabels,\n      readonly,\n    } = useSlider({\n      props,\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleSliderMouseUp: newValue => model.value = roundValue(newValue),\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleMouseMove: newValue => model.value = roundValue(newValue),\n      getActiveThumb: () => thumbContainerRef.value?.$el,\n    })\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      v => {\n        const value = typeof v === 'string' ? parseFloat(v) : v == null ? min.value : v\n\n        return roundValue(value)\n      },\n    )\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStop = computed(() => position(model.value))\n\n    return () => {\n      const [inputProps, _] = filterInputProps(props)\n\n      return (\n        <VInput\n          class={[\n            'v-slider',\n            {\n              'v-slider--has-labels': !!slots['tick-label'] || hasLabels.value,\n              'v-slider--focused': isFocused.value,\n              'v-slider--pressed': mousePressed.value,\n              'v-slider--disabled': props.disabled,\n            },\n          ]}\n          { ...inputProps }\n          focused={ isFocused.value }\n        >\n          {{\n            ...slots,\n            default: ({ id }) => (\n              <div\n                class=\"v-slider__container\"\n                onMousedown={ !readonly.value ? onSliderMousedown : undefined }\n                onTouchstartPassive={ !readonly.value ? onSliderTouchstart : undefined }\n              >\n                <input\n                  id={ id.value }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ 0 }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ thumbContainerRef }\n                  focused={ isFocused.value }\n                  min={ min.value }\n                  max={ max.value }\n                  modelValue={ model.value }\n                  onUpdate:modelValue={ v => (model.value = v) }\n                  position={ trackStop.value }\n                  elevation={ props.elevation }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n              </div>\n            ),\n          }}\n        </VInput>\n      )\n    }\n  },\n})\n\nexport type VSlider = InstanceType<typeof VSlider>\n"],"mappings":"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"}

package/lib/components/VSlider/VSlider.sass

@@ -1,5 +1,3 @@
-// Imports
-@forward './variables'
 @use 'sass:map'
 @use 'sass:selector'
 @use '../../styles/settings'
@@ -8,11 +6,15 @@
 
 // Block
 .v-slider
-  input
-    cursor: default
+  .v-slider__container
+    input
+      cursor: default
+      padding: 0
+      width: 100%
+      display: none
+
+  .v-input__append, .v-input__prepend
     padding: 0
-    width: 100%
-    display: none
 
 // Elements
 .v-slider__container
@@ -32,6 +34,7 @@
 
 // Modifiers
 .v-slider.v-input--horizontal
+  align-items: center
   margin-left: $slider-horizontal-left
   margin-right: $slider-horizontal-right
 
@@ -41,6 +44,7 @@
     align-items: center
 
 .v-slider.v-input--vertical
+  justify-content: center
   margin-top: $slider-vertical-margin-top
   margin-bottom: $slider-vertical-margin-bottom
 
@@ -51,4 +55,4 @@
   pointer-events: none
 
 .v-slider--has-labels .v-input__control
-  margin-bottom: $slider-tick-label-margin-bottom * .5
+  margin-bottom: $slider-tick-label-margin-top * .5

package/lib/components/VSlider/VSliderThumb.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"names":["VScaleTransition","VSliderSymbol","useElevation","Ripple","useTextColor","computed","inject","convertToUnit","defineComponent","keyValues","VSliderThumb","name","directives","props","focused","Boolean","max","type","Number","required","min","modelValue","position","emits","v","setup","slots","emit","slider","Error","thumbColor","step","vertical","disabled","thumbSize","thumbLabel","direction","readonly","elevation","isReversed","horizontalDirection","mousePressed","decimals","textColorClasses","textColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","value","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","Math","onKeydown","newValue","positionPercentage","inset","elevationClasses","undefined","toFixed"],"mappings":"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","sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VScaleTransition } from '../transitions'\nimport { VSliderSymbol } from './slider'\nimport { useElevation } from '@/composables/elevation'\n\n// Directives\nimport Ripple from '@/directives/ripple'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, defineComponent, keyValues } from '@/util'\n\nexport const VSliderThumb = defineComponent({\n  name: 'VSliderThumb',\n\n  directives: { Ripple },\n\n  props: {\n    focused: Boolean,\n    max: {\n      type: Number,\n      required: true,\n    },\n    min: {\n      type: Number,\n      required: true,\n    },\n    modelValue: {\n      type: Number,\n      required: true,\n    },\n    position: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      thumbColor,\n      step,\n      vertical,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      readonly,\n      elevation,\n      isReversed,\n      horizontalDirection,\n      mousePressed,\n      decimals,\n    } = slider\n\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (props.max - props.min) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = isReversed.value ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        value = value + (direction * _step * multipliers.value[multiplier])\n      } else if (e.key === home) {\n        value = props.min\n      } else if (e.key === end) {\n        value = props.max\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    return () => {\n      const positionPercentage = convertToUnit(vertical.value ? 100 - props.position : props.position, '%')\n      const inset = vertical.value ? 'block' : 'inline'\n      const { elevationClasses } = useElevation(computed(() => !disabled.value ? elevation.value : undefined))\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n          ]}\n          style={{\n            [`inset-${inset}-start`]: `calc(${positionPercentage} - var(--v-slider-thumb-size) / 2)`,\n            '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            direction: !vertical.value ? horizontalDirection.value : undefined,\n          }}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-valuemin={ props.min }\n          aria-valuemax={ props.max }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={{\n              ...textColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[true, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                ]}\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    }\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"file":"VSliderThumb.mjs"}
+{"version":3,"file":"VSliderThumb.mjs","names":["VScaleTransition","VSliderSymbol","useElevation","Ripple","useTextColor","computed","inject","convertToUnit","defineComponent","keyValues","VSliderThumb","name","directives","props","focused","Boolean","max","type","Number","required","min","modelValue","position","emits","v","setup","slots","emit","slider","Error","thumbColor","step","vertical","disabled","thumbSize","thumbLabel","direction","readonly","elevation","isReversed","horizontalDirection","mousePressed","decimals","textColorClasses","textColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","value","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","Math","onKeydown","newValue","positionPercentage","inset","elevationClasses","undefined","toFixed"],"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VScaleTransition } from '../transitions'\nimport { VSliderSymbol } from './slider'\nimport { useElevation } from '@/composables/elevation'\n\n// Directives\nimport Ripple from '@/directives/ripple'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, defineComponent, keyValues } from '@/util'\n\nexport const VSliderThumb = defineComponent({\n  name: 'VSliderThumb',\n\n  directives: { Ripple },\n\n  props: {\n    focused: Boolean,\n    max: {\n      type: Number,\n      required: true,\n    },\n    min: {\n      type: Number,\n      required: true,\n    },\n    modelValue: {\n      type: Number,\n      required: true,\n    },\n    position: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      thumbColor,\n      step,\n      vertical,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      readonly,\n      elevation,\n      isReversed,\n      horizontalDirection,\n      mousePressed,\n      decimals,\n    } = slider\n\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (props.max - props.min) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = isReversed.value ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        value = value + (direction * _step * multipliers.value[multiplier])\n      } else if (e.key === home) {\n        value = props.min\n      } else if (e.key === end) {\n        value = props.max\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    return () => {\n      const positionPercentage = convertToUnit(vertical.value ? 100 - props.position : props.position, '%')\n      const inset = vertical.value ? 'block' : 'inline'\n      const { elevationClasses } = useElevation(computed(() => !disabled.value ? elevation.value : undefined))\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n          ]}\n          style={{\n            [`inset-${inset}-start`]: `calc(${positionPercentage} - var(--v-slider-thumb-size) / 2)`,\n            '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            direction: !vertical.value ? horizontalDirection.value : undefined,\n          }}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-valuemin={ props.min }\n          aria-valuemax={ props.max }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={{\n              ...textColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[true, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                ]}\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    }\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"mappings":"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"}

package/lib/components/VSlider/VSliderThumb.sass

@@ -1,5 +1,3 @@
-// Imports
-@forward './variables'
 @use 'sass:map'
 @use 'sass:selector'
 @use 'sass:math'

package/lib/components/VSlider/VSliderTrack.css

@@ -77,7 +77,7 @@
   height: inherit;
 }
 .v-slider.v-input--horizontal .v-slider-track__tick {
-  margin-block-start: calc(var(--v-slider-track-size) / 2 + 1px);
+  margin-top: calc(calc(var(--v-slider-track-size) + 2px) / 2);
 }
 .v-slider.v-input--horizontal .v-slider-track__tick.v-locale--is-rtl, .v-locale--is-rtl .v-slider.v-input--horizontal .v-slider-track__tick {
   transform: translate(calc(var(--v-slider-tick-size) / 2), calc(var(--v-slider-tick-size) / -2));
@@ -101,7 +101,7 @@
   transform: translateX(100%);
 }
 .v-slider.v-input--horizontal .v-slider-track__tick .v-slider-track__tick-label {
-  bottom: calc((var(--v-slider-track-size) / -2) - 25px);
+  margin-top: calc(var(--v-slider-track-size) / 2 + 8px);
 }
 .v-slider.v-input--horizontal .v-slider-track__tick .v-slider-track__tick-label.v-locale--is-ltr, .v-locale--is-ltr .v-slider.v-input--horizontal .v-slider-track__tick .v-slider-track__tick-label {
   transform: translateX(-50%);
@@ -114,7 +114,7 @@
   height: 100%;
   display: flex;
   justify-content: center;
-  width: calc(var(--v-slider-track-size, 2px) + 2px);
+  width: calc(var(--v-slider-track-size) + 2px);
   touch-action: pan-x;
 }
 .v-slider.v-input--vertical .v-slider-track__background {
@@ -127,17 +127,17 @@
   height: 100%;
 }
 .v-slider.v-input--vertical .v-slider-track__tick {
-  margin-inline-start: calc(var(--v-slider-track-size) / 2 + 1px);
+  margin-inline-start: calc(calc(var(--v-slider-track-size) + 2px) / 2);
   transform: translate(calc(var(--v-slider-tick-size) / -2), calc(var(--v-slider-tick-size) / 2));
 }
 .v-slider.v-input--vertical .v-slider-track__tick.v-locale--is-rtl, .v-locale--is-rtl .v-slider.v-input--vertical .v-slider-track__tick {
   transform: translate(calc(var(--v-slider-tick-size) / 2), calc(var(--v-slider-tick-size) / 2));
 }
 .v-slider.v-input--vertical .v-slider-track__tick:last-child {
-  inset-block-end: calc(0% + var(--v-slider-tick-size) + 1px);
+  bottom: calc(0% + var(--v-slider-tick-size) + 1px);
 }
 .v-slider.v-input--vertical .v-slider-track__tick .v-slider-track__tick-label {
-  margin-inline-start: calc(var(--v-slider-track-size) + 20px);
+  margin-inline-start: calc(var(--v-slider-track-size) / 2 + 12px);
   transform: translateY(-50%);
 }
 

package/lib/components/VSlider/VSliderTrack.mjs

@@ -72,14 +72,15 @@ export const VSliderTrack = defineComponent({
       return ticks.map((tick, index) => {
         var _slots$tickLabel, _slots$tickLabel2;
 
-        const directionProperty = vertical.value ? 'inset-block-end' : 'margin-inline-start';
+        const directionProperty = vertical.value ? 'bottom' : 'margin-inline-start';
+        const directionValue = tick.position > 0 && tick.position < 100 ? convertToUnit(tick.position, '%') : undefined;
         return _createVNode("div", {
           "key": tick.value,
           "class": ['v-slider-track__tick', {
             'v-slider-track__tick--filled': tick.position >= props.start && tick.position <= props.stop
           }],
           "style": {
-            [directionProperty]: tick.position > 0 && tick.position < 100 && convertToUnit(tick.position, '%')
+            [directionProperty]: directionValue
           }
         }, [(tick.label || slots['tick-label']) && _createVNode("div", {
           "class": "v-slider-track__tick-label"