Merge branch 'master' into next

Author: J-Sek

packages/api-generator/src/helpers/sass.ts

@@ -14,7 +14,7 @@ function processVariableFile (filePath: string, tagUse: string | string[]) {
           : varArr.join(':')
         varValues[varName] = {
           default: varDefault.replace('!default', '').trim(),
-          ...(tagUse) && { use: tagUse === 'all' || tagUse?.includes(varName) ? 'vuetify' : 'vuetify/settings' },
+          ...{ use: tagUse === 'all' || tagUse?.includes(varName) ? 'vuetify' : 'vuetify/settings' },
         }
       }
     }

packages/api-generator/src/locale/en/generic.json

@@ -50,6 +50,7 @@
     "prependIcon": "Creates a [v-icon](/api/v-icon/) component in the **prepend** slot before default content.",
     "ripple": "Applies the [v-ripple](/directives/ripple) directive.",
     "search": "Text input used to filter items.",
+    "scrollToActive": "Keeps the last active element visible when resizing the scrollable container.",
     "selectedClass": "Configure the active CSS class applied when an item is selected.",
     "size": "Sets the height and width of the component.",
     "subtitle": "Specify a subtitle text for the component.",

packages/docs/package.json

@@ -26,7 +26,7 @@
     "@vue/compiler-dom": "^3.5.13",
     "@vuelidate/core": "^2.0.3",
     "@vuelidate/validators": "^2.0.4",
-    "@vuetify/one": "^2.3.0",
+    "@vuetify/one": "^2.5.1",
     "algoliasearch": "^4.24.0",
     "fflate": "^0.8.2",
     "isomorphic-fetch": "^3.0.0",

packages/docs/src/App.vue

@@ -91,9 +91,7 @@
     }
 
     watchEffect(() => {
-      theme.global.name.value = (
-        user.one.theme === 'system' ? systemTheme.value : user.one.theme
-      )
+      theme.change(user.one.theme === 'system' ? systemTheme.value : user.one.theme)
     })
 
     watch(theme.global.name, themeTransition)

packages/docs/src/data/new-in.json

@@ -51,6 +51,11 @@
       "baseColor": "3.8.0"
     }
   },
+  "VChipGroup": {
+    "props": {
+      "scrollToActive": "3.10.6"
+    }
+  },
   "VColorPicker": {
     "props": {
       "hideEyeDropper": "3.10.0",
@@ -214,7 +219,8 @@
   },
   "VSlideGroup": {
     "props": {
-      "contentClass": "3.9.0"
+      "contentClass": "3.9.0",
+      "scrollToActive": "3.10.6"
     }
   },
   "VSnackbar": {

packages/docs/src/data/page-to-api.json

@@ -57,10 +57,15 @@
   "components/checkboxes": ["VCheckbox", "VCheckboxBtn"],
   "components/chip-groups": ["VChip", "VChipGroup"],
   "components/chips": ["VChip", "VChipGroup"],
+  "components/color-inputs": ["VColorInput", "VColorPicker"],
   "components/color-pickers": ["VColorPicker"],
-  "components/confirm-edit": ["VConfirmEdit"],
   "components/combobox": ["VCombobox"],
+  "components/confirm-edit": ["VConfirmEdit"],
   "components/data-iterators": ["VDataIterator"],
+  "components/date-inputs": ["VDateInput", "VDatePicker"],
+  "components/date-pickers-month": ["VDatePicker"],
+  "components/date-pickers": ["VDatePicker", "VDateInput"],
+  "components/defaults-providers": ["VDefaultsProvider"],
   "components/data-tables": [
     "VDataTable",
     "VDataTableFooter",
@@ -75,11 +80,6 @@
   "components/data-tables/virtual-tables": [
     "VDataTableVirtual"
   ],
-  "components/color-inputs": ["VColorInput", "VColorPicker"],
-  "components/date-inputs": ["VDateInput", "VDatePicker"],
-  "components/date-pickers-month": ["VDatePicker"],
-  "components/date-pickers": ["VDatePicker", "VDateInput"],
-  "components/defaults-providers": ["VDefaultsProvider"],
   "components/dialogs": ["VDialog", "VOverlay"],
   "components/dividers": ["VDivider"],
   "components/empty-states": ["VEmptyState"],
@@ -90,11 +90,14 @@
     "VExpansionPanelTitle"
   ],
   "components/file-inputs": ["VFileInput"],
+  "components/file-upload": ["VFileUpload"],
   "components/floating-action-buttons": ["VFab"],
   "components/footers": ["VFooter"],
   "components/forms": ["VForm"],
   "components/grids": ["VCol", "VContainer", "VRow", "VSpacer"],
+  "components/hotkeys": ["VHotkey"],
   "components/hover": ["VHover"],
+  "components/icon-buttons": ["VIconBtn"],
   "components/icons": ["VIcon"],
   "components/images": ["VImg"],
   "components/infinite-scroller": ["VInfiniteScroll"],
@@ -113,9 +116,11 @@
     "VListImg"
   ],
   "components/locale-providers": ["VLocaleProvider"],
+  "components/mask-inputs": ["VMaskInput"],
   "components/menus": ["VMenu"],
   "components/navigation-drawers": ["VNavigationDrawer"],
   "components/no-ssr": ["VNoSsr"],
+  "components/number-inputs": ["VNumberInput"],
   "components/otp-input": ["VOtpInput"],
   "components/overflow-btns": ["VOverflowBtn"],
   "components/overlays": ["VOverlay"],
@@ -124,18 +129,19 @@
   "components/pie-charts": ["VPie", "VPieSegment", "VPieTooltip"],
   "components/progress-circular": ["VProgressCircular"],
   "components/progress-linear": ["VProgressLinear"],
+  "components/pull-to-refresh": ["VPullToRefresh"],
   "components/radio-buttons": ["VRadio", "VRadioGroup"],
   "components/range-sliders": ["VRangeSlider", "VSlider"],
   "components/ratings": ["VRating"],
   "components/selects": ["VSelect"],
   "components/sheets": ["VSheet"],
-  "components/simple-tables": ["VSimpleTable"],
   "components/skeleton-loaders": ["VSkeletonLoader"],
   "components/slide-groups": ["VSlideGroup", "VSlideGroupItem"],
   "components/sliders": ["VRangeSlider", "VSlider"],
-  "components/snackbars": ["VSnackbar"],
   "components/snackbar-queue": ["VSnackbarQueue", "VSnackbar"],
+  "components/snackbars": ["VSnackbar"],
   "components/sparklines": ["VSparkline"],
+  "components/speed-dials": ["VSpeedDial"],
   "components/steppers": [
     "VStepper",
     "VStepperHeader",
@@ -160,6 +166,7 @@
     "VTreeviewChildren",
     "VTreeviewGroup"
   ],
+  "components/vertical-steppers": ["VStepperVertical", "VStepperVerticalActions", "VStepperVerticalItem"],
   "components/videos": ["VVideo", "VVideoControls", "VVideoVolume"],
   "components/virtual-scroller": ["VVirtualScroll"],
   "components/windows": ["VWindow", "VWindowItem"],

packages/docs/src/examples/v-stepper-vertical/prop-non-linear.vue

@@ -0,0 +1,8 @@
+<template>
+  <v-stepper-vertical
+    :items="['Step 1', 'Step 2', 'Step 3']"
+    :mandatory="false"
+    editable
+    non-linear
+  ></v-stepper-vertical>
+</template>

packages/docs/src/examples/v-tabs/usage.vue

@@ -1,36 +1,104 @@
 <template>
-  <v-card>
-    <v-tabs
-      v-model="tab"
-      bg-color="primary"
-    >
-      <v-tab value="one">Item One</v-tab>
-      <v-tab value="two">Item Two</v-tab>
-      <v-tab value="three">Item Three</v-tab>
-    </v-tabs>
-
-    <v-card-text>
+  <ExamplesUsageExample
+    v-model="model"
+    :code="code"
+    :name="name"
+    :options="options"
+  >
+    <v-card :class="direction === 'vertical' ? 'd-flex' : ''" elevation="4">
+      <v-tabs
+        v-model="tab"
+        v-bind="props"
+      >
+        <v-tab value="one">Item One</v-tab>
+        <v-tab value="two">Item Two</v-tab>
+        <v-tab value="three">Item Three</v-tab>
+      </v-tabs>
+
+      <v-divider :vertical="direction === 'vertical'"></v-divider>
+
       <v-tabs-window v-model="tab">
         <v-tabs-window-item value="one">
-          One
+          <v-sheet class="pa-5" color="purple">One</v-sheet>
         </v-tabs-window-item>
-
         <v-tabs-window-item value="two">
-          Two
+          <v-sheet class="pa-5" color="orange">Two</v-sheet>
         </v-tabs-window-item>
-
         <v-tabs-window-item value="three">
-          Three
+          <v-sheet class="pa-5" color="cyan">Three</v-sheet>
         </v-tabs-window-item>
       </v-tabs-window>
-    </v-card-text>
-  </v-card>
+    </v-card>
+
+    <template v-slot:configuration>
+      <v-select
+        v-model="direction"
+        :items="['horizontal', 'vertical']"
+        label="Direction"
+        mandatory
+      ></v-select>
+      <v-select
+        v-model="color"
+        :items="['primary', 'cyan']"
+        label="Color"
+        clearable
+      ></v-select>
+      <v-select
+        v-model="bgColor"
+        :items="['orange', 'lime-lighten-2']"
+        label="Background"
+        clearable
+      ></v-select>
+      <v-checkbox
+        v-model="hideSlider"
+        color="secondary"
+        label="Hide slider"
+        hide-details
+      ></v-checkbox>
+    </template>
+  </ExamplesUsageExample>
 </template>
 
-<script>
-  export default {
-    data: () => ({
-      tab: null,
-    }),
-  }
+<script setup>
+  const name = 'v-tabs'
+  const tab = shallowRef(0)
+
+  const direction = shallowRef('horizontal')
+  const color = shallowRef('primary')
+  const bgColor = shallowRef(null)
+  const hideSlider = shallowRef(false)
+
+  const props = computed(() => {
+    return {
+      color: color.value || undefined,
+      'bg-color': bgColor.value || undefined,
+      direction: direction.value === 'vertical' ? direction.value : undefined,
+      'hide-slider': hideSlider.value || undefined,
+    }
+  })
+
+  const code = computed(() => {
+    return `
+<v-sheet${direction.value === 'vertical' ? 'class="d-flex"' : ''} elevation="4">
+  <${name}${propsToString(props.value, [], 2)}>
+    <v-tab value="one">Item One</v-tab>
+    <v-tab value="two">Item Two</v-tab>
+    <v-tab value="three">Item Three</v-tab>
+  </${name}>
+
+  <v-divider${direction.value === 'vertical' ? 'vertical' : ''}></v-divider>
+
+  <v-tabs-window v-model="tab">
+    <v-tabs-window-item value="one">
+      <v-sheet class="pa-5" color="purple">One</v-sheet>
+    </v-tabs-window-item>
+    <v-tabs-window-item value="two">
+      <v-sheet class="pa-5" color="orange">Two</v-sheet>
+    </v-tabs-window-item>
+    <v-tabs-window-item value="three">
+      <v-sheet class="pa-5" color="brown">Three</v-sheet>
+    </v-tabs-window-item>
+  </v-tabs-window>
+</v-sheet>`
+  })
 </script>

packages/docs/src/pages/en/blog/index.md

@@ -18,6 +18,14 @@ Latest news, updates, and stories about Vuetify.
 
 <br>
 
+## September 2025 Update
+
+🖊️ John Leider • 📅 October 12th, 2025
+
+September marks significant progress as we assemble the building blocks for Vuetify's next phase. From revolutionary design-to-development workflows with our new Figma UI Kit to foundational v0 composables, September has been about connecting the pieces that will define the future of Vue development. This update includes the release of v3.10.0 (Argo), updated Figma UI Kit, new Vuetify0 composables, and over 60 bug fixes and features... { .text-medium-emphasis }
+
+[Read More](/blog/september-2025-update/) { .text-end }
+
 ## August 2025 Update
 
 🖊️ John Leider • 📅 September 9th, 2025