fix(VListItem): fix avatar-badge spacing

docker-compose.yml

@@ -0,0 +1,8 @@
+services:
+ docs:
+ image: nginx:alpine
+ ports:
+ - ${PORT:-8095}:80
+ volumes:
+ - ./packages/docs/dist:/usr/share/nginx/html
+ - ./packages/docs/build/nginx.conf:/etc/nginx/nginx.conf

lerna.json

@@ -13,5 +13,5 @@
  }
  },
  "npmClient": "pnpm",
- "version": "3.7.2"
+ "version": "3.7.3"
 }

package.json

@@ -70,8 +70,8 @@
  "mkdirp": "^3.0.1",
  "moment": "^2.30.1",
  "rimraf": "^5.0.5",
- "sass": "^1.77.8",
- "sass-embedded": "^1.77.8",
+ "sass": "^1.80.1",
+ "sass-embedded": "^1.80.1",
  "semver": "^7.6.0",
  "shelljs": "^0.8.5",
  "stringify-object": "^5.0.0",

packages/api-generator/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vuetify/api-generator",
- "version": "3.7.2",
+ "version": "3.7.3",
  "private": true,
  "description": "",
  "scripts": {

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

@@ -5,10 +5,9 @@
  "noResize": "Remove resize handle.",
  "persistentPlaceholder": "Forces placeholder to always be visible.",
  "prefix": "Displays prefix text.",
- "rowHeight": "Height value for each row. Requires the use of the **auto-grow** prop.",
  "rows": "Default row count.",
  "suffix": "Displays suffix text.",
- "maxRows": "Specifies the maximum number of row count"
+ "maxRows": "Specifies the maximum number of rows for **auto-grow**."
  },
  "events": {
  "keydown": "Emitted when **any** key is pressed, textarea must be focused.",

packages/docs/auto-imports.d.ts

@@ -14,13 +14,16 @@ declare global {
  const PropType: typeof import('vue')['PropType']
  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
  const anyLanguagePattern: typeof import('./src/utils/routes')['anyLanguagePattern']
+ const cacheManifestEntries: typeof import('./src/utils/pwa')['cacheManifestEntries']
  const camelCase: typeof import('lodash-es')['camelCase']
  const camelize: typeof import('vue')['camelize']
+ const cleanCache: typeof import('./src/utils/pwa')['cleanCache']
  const computed: typeof import('vue')['computed']
  const configureMarkdown: typeof import('./src/utils/markdown-it')['configureMarkdown']
  const copyElementContent: typeof import('./src/utils/helpers')['copyElementContent']
  const createAdProps: typeof import('./src/composables/ad')['createAdProps']
  const createApp: typeof import('vue')['createApp']
+ const createCacheKey: typeof import('./src/utils/pwa')['createCacheKey']
  const createOne: typeof import('@vuetify/one')['createOne']
  const createPinia: typeof import('pinia')['createPinia']
  const customRef: typeof import('vue')['customRef']
@@ -29,12 +32,14 @@ declare global {
  const defineStore: typeof import('pinia')['defineStore']
  const disabledLanguagePattern: typeof import('./src/utils/routes')['disabledLanguagePattern']
  const effectScope: typeof import('vue')['effectScope']
+ const ensureCacheableResponse: typeof import('./src/utils/pwa')['ensureCacheableResponse']
  const eventName: typeof import('./src/utils/helpers')['eventName']
  const genAppMetaInfo: typeof import('./src/utils/metadata')['genAppMetaInfo']
  const genMetaInfo: typeof import('./src/utils/metadata')['genMetaInfo']
  const generatedRoutes: typeof import('./src/utils/routes')['generatedRoutes']
  const getActivePinia: typeof import('pinia')['getActivePinia']
  const getBranch: typeof import('./src/utils/helpers')['getBranch']
+ const getCacheKeyForUrl: typeof import('./src/utils/pwa')['getCacheKeyForUrl']
  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
  const getCurrentScope: typeof import('vue')['getCurrentScope']
  const getDistance: typeof import('./src/utils/helpers')['getDistance']
@@ -58,7 +63,9 @@ declare global {
  const mapWritableState: typeof import('pinia')['mapWritableState']
  const markRaw: typeof import('vue')['markRaw']
  const markdownItRules: typeof import('./src/utils/markdown-it-rules')['default']
+ const matchPrecache: typeof import('./src/utils/pwa')['matchPrecache']
  const mergeProps: typeof import('vue')['mergeProps']
+ const messageSW: typeof import('./src/utils/pwa')['messageSW']
  const nextTick: typeof import('vue')['nextTick']
  const onActivated: typeof import('vue')['onActivated']
  const onBeforeMount: typeof import('vue')['onBeforeMount']
@@ -76,9 +83,11 @@ declare global {
  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
  const onUnmounted: typeof import('vue')['onUnmounted']
  const onUpdated: typeof import('vue')['onUpdated']
+ const openCache: typeof import('./src/utils/pwa')['openCache']
  const preferredLocale: typeof import('./src/utils/routes')['preferredLocale']
  const propsToString: typeof import('./src/utils/helpers')['propsToString']
  const provide: typeof import('vue')['provide']
+ const pwaStore: typeof import('./src/stores/pwa')['pwaStore']
  const reactive: typeof import('vue')['reactive']
  const readonly: typeof import('vue')['readonly']
  const redirectRoutes: typeof import('./src/utils/routes')['redirectRoutes']
@@ -125,6 +134,7 @@ declare global {
  const usePlayground: typeof import('./src/composables/playground')['usePlayground']
  const useProductsStore: typeof import('@vuetify/one')['useProductsStore']
  const usePromotionsStore: typeof import('./src/stores/promotions')['usePromotionsStore']
+ const usePwaStore: typeof import('./src/stores/pwa')['usePwaStore']
  const useQueueStore: typeof import('@vuetify/one')['useQueueStore']
  const useReleasesStore: typeof import('./src/stores/releases')['useReleasesStore']
  const useRoute: typeof import('vue-router')['useRoute']
@@ -164,8 +174,10 @@ declare module 'vue' {
  readonly IS_SERVER: UnwrapRef<typeof import('./src/utils/globals')['IS_SERVER']>
  readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
  readonly anyLanguagePattern: UnwrapRef<typeof import('./src/utils/routes')['anyLanguagePattern']>
+ readonly cacheManifestEntries: UnwrapRef<typeof import('./src/utils/pwa')['cacheManifestEntries']>
  readonly camelCase: UnwrapRef<typeof import('lodash-es')['camelCase']>
  readonly camelize: UnwrapRef<typeof import('vue')['camelize']>
+ readonly cleanCache: UnwrapRef<typeof import('./src/utils/pwa')['cleanCache']>
  readonly computed: UnwrapRef<typeof import('vue')['computed']>
  readonly configureMarkdown: UnwrapRef<typeof import('./src/utils/markdown-it')['configureMarkdown']>
  readonly copyElementContent: UnwrapRef<typeof import('./src/utils/helpers')['copyElementContent']>
@@ -179,6 +191,7 @@ declare module 'vue' {
  readonly defineStore: UnwrapRef<typeof import('pinia')['defineStore']>
  readonly disabledLanguagePattern: UnwrapRef<typeof import('./src/utils/routes')['disabledLanguagePattern']>
  readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+ readonly ensureCacheableResponse: UnwrapRef<typeof import('./src/utils/pwa')['ensureCacheableResponse']>
  readonly eventName: UnwrapRef<typeof import('./src/utils/helpers')['eventName']>
  readonly genAppMetaInfo: UnwrapRef<typeof import('./src/utils/metadata')['genAppMetaInfo']>
  readonly genMetaInfo: UnwrapRef<typeof import('./src/utils/metadata')['genMetaInfo']>
@@ -209,6 +222,7 @@ declare module 'vue' {
  readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
  readonly markdownItRules: UnwrapRef<typeof import('./src/utils/markdown-it-rules')['default']>
  readonly mergeProps: UnwrapRef<typeof import('vue')['mergeProps']>
+ readonly messageSW: UnwrapRef<typeof import('./src/utils/pwa')['messageSW']>
  readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
  readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
  readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
@@ -225,6 +239,7 @@ declare module 'vue' {
  readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
  readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
  readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+ readonly openCache: UnwrapRef<typeof import('./src/utils/pwa')['openCache']>
  readonly preferredLocale: UnwrapRef<typeof import('./src/utils/routes')['preferredLocale']>
  readonly propsToString: UnwrapRef<typeof import('./src/utils/helpers')['propsToString']>
  readonly provide: UnwrapRef<typeof import('vue')['provide']>
@@ -274,6 +289,7 @@ declare module 'vue' {
  readonly usePlayground: UnwrapRef<typeof import('./src/composables/playground')['usePlayground']>
  readonly useProductsStore: UnwrapRef<typeof import('@vuetify/one')['useProductsStore']>
  readonly usePromotionsStore: UnwrapRef<typeof import('./src/stores/promotions')['usePromotionsStore']>
+ readonly usePwaStore: UnwrapRef<typeof import('./src/stores/pwa')['usePwaStore']>
  readonly useQueueStore: UnwrapRef<typeof import('@vuetify/one')['useQueueStore']>
  readonly useReleasesStore: UnwrapRef<typeof import('./src/stores/releases')['useReleasesStore']>
  readonly useRoute: UnwrapRef<typeof import('vue-router')['useRoute']>
@@ -306,8 +322,10 @@ declare module '@vue/runtime-core' {
  readonly IS_SERVER: UnwrapRef<typeof import('./src/utils/globals')['IS_SERVER']>
  readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
  readonly anyLanguagePattern: UnwrapRef<typeof import('./src/utils/routes')['anyLanguagePattern']>
+ readonly cacheManifestEntries: UnwrapRef<typeof import('./src/utils/pwa')['cacheManifestEntries']>
  readonly camelCase: UnwrapRef<typeof import('lodash-es')['camelCase']>
  readonly camelize: UnwrapRef<typeof import('vue')['camelize']>
+ readonly cleanCache: UnwrapRef<typeof import('./src/utils/pwa')['cleanCache']>
  readonly computed: UnwrapRef<typeof import('vue')['computed']>
  readonly configureMarkdown: UnwrapRef<typeof import('./src/utils/markdown-it')['configureMarkdown']>
  readonly copyElementContent: UnwrapRef<typeof import('./src/utils/helpers')['copyElementContent']>
@@ -321,6 +339,7 @@ declare module '@vue/runtime-core' {
  readonly defineStore: UnwrapRef<typeof import('pinia')['defineStore']>
  readonly disabledLanguagePattern: UnwrapRef<typeof import('./src/utils/routes')['disabledLanguagePattern']>
  readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+ readonly ensureCacheableResponse: UnwrapRef<typeof import('./src/utils/pwa')['ensureCacheableResponse']>
  readonly eventName: UnwrapRef<typeof import('./src/utils/helpers')['eventName']>
  readonly genAppMetaInfo: UnwrapRef<typeof import('./src/utils/metadata')['genAppMetaInfo']>
  readonly genMetaInfo: UnwrapRef<typeof import('./src/utils/metadata')['genMetaInfo']>
@@ -351,6 +370,7 @@ declare module '@vue/runtime-core' {
  readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
  readonly markdownItRules: UnwrapRef<typeof import('./src/utils/markdown-it-rules')['default']>
  readonly mergeProps: UnwrapRef<typeof import('vue')['mergeProps']>
+ readonly messageSW: UnwrapRef<typeof import('./src/utils/pwa')['messageSW']>
  readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
  readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
  readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
@@ -367,6 +387,7 @@ declare module '@vue/runtime-core' {
  readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
  readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
  readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+ readonly openCache: UnwrapRef<typeof import('./src/utils/pwa')['openCache']>
  readonly preferredLocale: UnwrapRef<typeof import('./src/utils/routes')['preferredLocale']>
  readonly propsToString: UnwrapRef<typeof import('./src/utils/helpers')['propsToString']>
  readonly provide: UnwrapRef<typeof import('vue')['provide']>
@@ -416,6 +437,7 @@ declare module '@vue/runtime-core' {
  readonly usePlayground: UnwrapRef<typeof import('./src/composables/playground')['usePlayground']>
  readonly useProductsStore: UnwrapRef<typeof import('@vuetify/one')['useProductsStore']>
  readonly usePromotionsStore: UnwrapRef<typeof import('./src/stores/promotions')['usePromotionsStore']>
+ readonly usePwaStore: UnwrapRef<typeof import('./src/stores/pwa')['usePwaStore']>
  readonly useQueueStore: UnwrapRef<typeof import('@vuetify/one')['useQueueStore']>
  readonly useReleasesStore: UnwrapRef<typeof import('./src/stores/releases')['useReleasesStore']>
  readonly useRoute: UnwrapRef<typeof import('vue-router')['useRoute']>

packages/docs/components.d.ts

@@ -76,6 +76,7 @@ declare module 'vue' {
  AppSettingsOptionsBannerOption: typeof import('./src/components/app/settings/options/BannerOption.vue')['default']
  AppSettingsOptionsCodeOption: typeof import('./src/components/app/settings/options/CodeOption.vue')['default']
  AppSettingsOptionsNotificationsOption: typeof import('./src/components/app/settings/options/NotificationsOption.vue')['default']
+ AppSettingsOptionsOfflineOption: typeof import('./src/components/app/settings/options/OfflineOption.vue')['default']
  AppSettingsOptionsPinOption: typeof import('./src/components/app/settings/options/PinOption.vue')['default']
  AppSettingsOptionsQuickbarOption: typeof import('./src/components/app/settings/options/QuickbarOption.vue')['default']
  AppSettingsOptionsRailDrawerOption: typeof import('./src/components/app/settings/options/RailDrawerOption.vue')['default']

packages/docs/package.json

@@ -3,7 +3,7 @@
  "description": "A Vue.js project",
  "private": true,
  "author": "John Leider <[email protected]>",
- "version": "3.7.2",
+ "version": "3.7.3",
  "repository": {
  "type": "git",
  "url": "git+https:/vuetifyjs/vuetify.git",

packages/docs/src/components/app/bar/SettingsToggle.vue

@@ -1,5 +1,21 @@
 <template>
+ <v-progress-circular
+ v-if="pwa.availableOffline && pwa.isUpdating"
+ :model-value="pwa.progress / pwa.progressTotal * 100"
+ class="me-n2"
+ color="primary"
+ size="42"
+ width="1"
+ >
+ <AppBtn
+ id="settings-toggle"
+ :icon="app.settings ? 'mdi-cog' : 'mdi-cog-outline'"
+ color="medium-emphasis"
+ @click="onClick"
+ />
+ </v-progress-circular>
  <AppBtn
+ v-else
  id="settings-toggle"
  :icon="app.settings ? 'mdi-cog' : 'mdi-cog-outline'"
  class="me-n2"
@@ -12,6 +28,7 @@
 
 <script setup>
  const app = useAppStore()
+ const pwa = usePwaStore()
  const { name } = useRoute()
 
  function onClick () {

packages/docs/src/components/app/bar/StoreLink.vue

@@ -2,7 +2,7 @@
  <AppBtn
  color="medium-emphasis"
  href="https://store.vuetifyjs.com/?utm_source=vuetifyjs.com&utm_medium=toolbar"
- icon="mdi-cart-outline"
+ icon="mdi-storefront-outline"
  rel="noopener"
  target="_blank"
  @click="onClick"

packages/docs/src/components/app/search/SearchDialog.vue

@@ -17,6 +17,7 @@
  variant="filled"
  autofocus
  @focus="$event.target.select()"
+ @keydown.down="list?.$el.focus()"
  >
  <template #append-inner>
  <AppBtn size="small" border>
@@ -26,7 +27,6 @@
  </AppTextField>
 
  <v-card-text :class="['px-4 py-0 d-flex flex-wrap justify-center', searchString ? 'align-start' : 'align-center']">
-
  <AppSearchSearchRecent
  v-if="searches.length && !searchString"
  :searches="searches"
@@ -159,7 +159,6 @@
 
  searches.value = array
  }
-
  function onClickResult (result: any) {
  const array = searches.value.slice(0, 6)
 

packages/docs/src/components/app/search/SearchResults.vue

@@ -96,7 +96,7 @@
 
  const app = useAppStore()
 
- const rootEl = ref<VList>()
+ const rootEl = ref<InstanceType<typeof VList>>()
  defineExpose({ rootEl })
 
  function makeBreadcrumbs (hierarchy: any) {

packages/docs/src/components/app/settings/DeveloperMode.vue

@@ -1,29 +1,21 @@
 <template>
- <v-defaults-provider
- :defaults="{
- VIcon: {
- color: user.dev ? 'error' : 'disabled'
- }
- }"
- >
- <v-switch
- v-model="user.dev"
- :messages="t('developer-mode-message')"
- class="ps-1"
- color="error"
- density="comfortable"
- false-icon="$close"
- true-icon="mdi-check"
- inset
+ <AppSettingsSettingsHeader text="developer-mode-message" title="developer-mode">
+ <v-defaults-provider
+ :defaults="{
+ VIcon: {
+ color: user.dev ? 'error' : 'disabled'
+ }
+ }"
  >
- <template #label>
- <div v-text="t('developer-mode')" />
- </template>
- </v-switch>
- </v-defaults-provider>
+ <SettingsSwitch
+ v-model="user.dev"
+ base-color="error"
+ color="error"
+ />
+ </v-defaults-provider>
+ </AppSettingsSettingsHeader>
 </template>
 
 <script setup>
- const { t } = useI18n()
  const user = useUserStore()
 </script>

packages/docs/src/components/app/settings/Drawer.vue

@@ -8,7 +8,7 @@
  temporary
  touchless
  >
- <v-toolbar :title="t('settings')" flat>
+ <v-toolbar :title="t('settings.header')" flat>
  <template #append>
  <v-btn
  icon="mdi-close"
@@ -22,10 +22,6 @@
 
  <v-container class="px-3 py-3">
  <AppSettingsOptions />
-
- <AppSettingsOptionsAdOption v-if="one.isSubscriber" />
-
- <AppSettingsDeveloperMode />
  </v-container>
 
  <template #append>
@@ -36,7 +32,6 @@
 
 <script setup>
  const app = useAppStore()
- const one = useOneStore()
 
  const { t } = useI18n()
  const { isRtl } = useRtl()

packages/docs/src/components/app/settings/Options.vue

@@ -7,18 +7,24 @@
 
  <AppSettingsOptionsThemeOption />
 
+ <AppSettingsOptionsOfflineOption />
+
  <v-divider class="mt-4 mb-3" />
 
- <AppSettingsSettingsHeader
- text="general-message"
- title="general"
- />
  <AppSettingsOptionsPinOption />
 
  <AppSettingsOptionsCodeOption />
 
  <AppSettingsOptionsApiOption />
 
  <AppSettingsOptionsSlashSearchOption />
+
+ <AppSettingsOptionsAdOption v-if="one.isSubscriber" />
+
+ <AppSettingsDeveloperMode />
  </div>
 </template>
+
+<script setup lang="ts">
+ const one = useOneStore()
+</script>