Back to Vuetify

June 2026 Update

packages/docs/src/pages/en/blog/june-2026-update.md

4.1.816.3 KB
Original Source
<script setup> import { computed } from 'vue' import { useTheme } from 'vuetify' const theme = useTheme() const zerologo = computed(() => { return `https://cdn.vuetifyjs.com/docs/images/one/logos/vzero-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` }) const vuetifylogo = computed(() => { return `https://cdn.vuetifyjs.com/docs/images/one/logos/vuetify-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` }) const onelogo = computed(() => { return `https://cdn.vuetifyjs.com/docs/images/one/logos/vone-logo-${theme.current.value.dark ? 'dark' : 'light'}.png` }) const releasesimg = computed(() => { return `https://cdn.vuetifyjs.com/docs/images/blog/june-2026-update/releases-${theme.current.value.dark ? 'dark' : 'light'}.png` }) const v0img = computed(() => { return `https://cdn.vuetifyjs.com/docs/images/blog/june-2026-update/v0-${theme.current.value.dark ? 'dark' : 'light'}.png` }) </script>

June 2026 Update

June was a stabilization month. v4.1.0 shipped on June 2, with two patch releases after that. Most of the work went into the new overlay location strategy, fixing the placement bugs that only turned up once people were using VDialog in fullscreen mode. June was also when a security incident cost us our Discord server. No package, release, or user data was touched, but the community lost its home for a couple of weeks, and getting it back was a big part of the month. One small thing did come out of the drama — pkg-diff, a fast in-browser tool for diffing NPM packages (more on that below).

{ height=112 }

🖊️ Jacek Czarniecki • 📅 July 8th, 2026

<PromotedEntry />

A month of settling in

Where May was a feature sprint, June was about making that work solid. 52 commits, two dozen fixes, and four releases, with the stable v4.1.0 at the center. The new viewport/static location strategy that shipped with the minor turned out to be the month's main character — real-world usage surfaced a string of placement edge cases (iOS keyboards, calc() sizes, percentage boundaries, closing animations), and the two follow-up patches worked through them one by one. Meanwhile Vuetify0 settled into the beta announced June 2, with its public API frozen and the road to v1 opening up.


Table of Contents


Releases

We shipped four framework releases. v4.0.9 (June 2) was a small patch on the stable v4.0 line — an SSR fix for VProgressLinear, a VNumberInput control-state fix, and a focus-trap scroll fix. The same day, v4.1.0 went stable, finalizing the VSwitch MD3 work and folding in the late-May fixes. From there the month was patches: v4.1.1 (June 8) and v4.1.2 (June 16), each a round of fixes led by the overlay location strategy.

<AppFigure :src="releasesimg" alt="June Releases Banner" title="June Releases Banner" />

Key Improvements

  • Vuetify 4.1 — the first minor of the v4 line went stable on June 2
  • VSwitch — MD3 alignment, a long awaited size prop, and a square nobody asked for, 😂 LOL, quite a mix
  • VCalendar — new interval-highlight for subtle row tint on mouse hover (#22885)
  • VExpansionPanels — improved focus styles and a hover prop to opt-out of the hover effect (#22827)
  • VOverlay — a handful of location fixes after introducing edge snapping (#22921), iOS keyboard attachment (#22923), finished by restoring calc()/min()/vw support for sizing
  • Forced-colors modeVHeatmap and VHighlight now render correctly for people relying on forced high-contrast override

View the complete list of changes in the Full Changelog.

Details:


Spotlight: Vuetify 4.1.0 release { #vuetify-4-1 }

<AppFigure :src="vuetifylogo" alt="Vuetify logo" width="200" height="auto" class="mx-auto mt-4" title="Vuetify Logo" />

May opened v4.1.0 in beta; on June 2 it went stable. The release brought us four new components (VHeatmap, VHighlight, VMonthPicker, VDateRangePicker), already covered in the previous blog post and a broad wave of feature props across data tables, pickers, and overlays.

Details:


Framework Updates

This month was deliberately feature-light — the team waited for feedback from users adopting latest version for new features and improvements.

Bug Fixes

The overlay location strategy introduced in v4.1 was the month's dominant fix theme. It's a powerful feature, and putting it in front of real layouts surfaced the placement edge cases you'd expect — most of them now closed.

ComponentFixVersionPR / commit
VProgressLinearAvoid opacity:NaN when rendering with SSRv4.0.9#22880
VNumberInputKeep both controls enabled when emptyv4.0.9e0133c2
focusTrapPrevent page scroll when capturing focusv4.0.9451e7c3
VSelectClose menu when click lands inside host overlayv4.1.17ed9a54
VSnackbarMore reliable progress barv4.1.15e6fe60
VNumberInputEmit change when using controls and arrowsv4.1.12ab2509
VTooltipAvoid stealing focusv4.1.177d1a8a
VTableApply background and border for fixed-footerv4.1.1ecabcc5
VMenuPrevent focus change during IME inputv4.1.1#21008
VHeatmapKeep legend bar visible in forced-colors modev4.1.158e3e7d
VHighlightSupport forced-colors modev4.1.1067228c
VOverlayStatic location should snap to edges using CSSv4.1.2#22921
VOverlayKeep overlay attached with iOS keyboard openv4.1.2#22923
VOverlayResolve calc/min/vw sizes to pixelsv4.1.2bf105bf
VDialogClear inline styles when enabling fullscreenv4.1.2ea29378
VTreeviewApply hide-actions to group nodesv4.1.2e5555ae
VPaginationPredictable length behavior in flex containerv4.1.2#22912
themeAsync transition should return a Promisev4.1.2904f949

In Development

Deferred to v4.2 — keeping v4.1 tight meant several in-flight initiatives slipped past the minor and now sit against the v4.2.0 milestone. Most are feature PRs that were already open before v4.1 went stable:

  • VTreeview — a set of accessibility improvements: more aria attributes and correct keyboard navigation
  • VSlider — a pill variant to match MD3 (#22699)
  • VBreadcrumbs — improved accessibility and a collapse menu (#22358)
  • VMaskInput — multiple and dynamic mask resolution (#22501)

A side-effect of security focus { #security-focus }

If you somehow missed the deep dive into the incident, a long story short is that Discord failed us by shipping insecure client (2FA is a joke) and having no backup, no "security cooldown" nor tools to recover the server after the takeover. After a shaky two weeks, we had set up a new one and get things back on track. All community members are welcome to re-join.

No Vuetify package, source, release, CI pipeline, or user data was affected. But the team still took the opportunity to rotate the security tokens and strenghten the internal policies. One interesting side-effect of "what if" planning was a new project pkg-diff. It appears despite constant problems around NPM packages security, we had not found even one decent tool to diff packages - some were slow, other limited, so we created our own and since it is computing everything in-browser - arguably better than what NPMX shipped lately, everyone is free to use it :)


Vuetify0 Progress Update { #vuetify0-progress }

<AppFigure :src="zerologo" alt="Vuetify0 logo" width="200" height="auto" class="mx-auto mt-4" title="Vuetify0 Logo" />

June was Vuetify0's first month in beta. The beta was announced on June 2 with the public API frozen, so the work shifted from adding primitives to refining the ones that shipped — edge cases, documentation, and the road to v1.0 in July. With a frozen target now in place, the theme, locale, and date v0 migrations inside the framework have something stable to build against.

<AppFigure :src="v0img" alt="Vuetify0 Progress" title="Vuetify0 June Progress" />

::: success

Adopting Vuetify0 for your business? Teams building production design systems, internal tooling, or product UI on top of v0 can reach out to talk through adoption, partnership, and roadmap input.

:::

Details:


Product Updates

Vuetify One

<AppFigure :src="onelogo" alt="Vuetify One logo" width="200" height="auto" class="mx-auto mt-4" title="Vuetify One Logo" />

The docs picked up a round of housekeeping in June — SEO length limits enforced on page meta titles and descriptions, unified CDN links, and a corrected MD2 typography snippet in the upgrade guide. The Discord invite link across the docs was updated to point at the new community server.

Nuxt Module

The Nuxt Module continued its march toward a stable v1, with Andrei Elkin keeping up the package-resolution and reliability work carried over from May.


What's Next { .mt-4 }

July finishes the year's first arc. Vuetify0 reaches v1.0, ending the beta and giving the framework a stable foundation to migrate onto. Vuetify 4.1 continues its patch cadence, with the rules promotion and more overlay and treeview polish already queued. And with a v0 v1 in hand, the theme, locale, and date migrations move from planning to real work.

Looking Further Ahead { #looking-ahead }

The theme for the rest of the year hasn't changed: finishing what we started.

A clean finish for labs: our roadmap commitments for the remainder of 2026 stay narrowed to one outcome — by November 1st, 2026, labs will be drained. Every component still incubating will either graduate into core or be retired; nothing will be left in an "unfinished" state. June's rules promotion is one more step down that list.

A community-driven issue board: we're building a curated view into the issue board where the community can surface and vote on what matters most, opening a direct line into what we tackle next. More as it takes shape.

A modernized docs experience (later this year): we're planning a significant UX upgrade to the Vuetify docs, porting over features introduced first to the Vuetify0 documentation. For a preview of where we're headed, spend some time in the v0 docs — the navigation, search, and interactive code samples are an early taste of what's coming.

::: warning

Vuetify needs your support. OpenCollective trend slowly picks up and we appreciate every contribution and support for ongoing work on the framework and ecosystem tools. If your team relies on Vuetify, please educate your boss about importance of sponsoring OSS projects like Vuetify. You can point them to Open Collective or GitHub Sponsors. Every contribution keeps Vuetify afloat.

:::

Vuetify is and always will be free and open source. If your team builds on the framework, the v0 beta, the MCP, the CLI, the Nuxt module, the ESLint plugin, or any of the design systems coming behind them, your support directly funds continued development. Vuetify One and GitHub Sponsors are the most direct ways to help.

To everyone who checked in, shared the verified invite, and helped us rebuild the community server after this month's incident — thank you. It meant a lot.

Thank you for being part of the Vuetify community. See you in July!


Stay connected with Vuetify updates through our GitHub repository, Discord community, and follow @vuetifyjs for the latest announcements. The best is yet to come!