一个为 Vue JS 2.0 打造的 Material 风格的组件库
一个为 Vue JS 2.0 打造的 Material 风格的组件库
🔧
Bug Fixes
Assets
3
v2.4.0 Endurance
The latest release (Endurance) brings multiple bug fixes, features, and quality of life changes to the Vuetify. Long awaited features such as the plain property for v-btn
, new slots for v-carousel
, and support for a globally defined icon component. In addition, we added support for 2 new locales, Azerbaijani and Central Kurdish, improved accessibility in the v-menu
component, and new typography css classes.
We resolved numerous issues related to components and features we are building in Vuetify 3 right now! If you haven't yet, check out John's talk from Vue Conf Toronto Online 2020 with more information about what to expect with the upcoming release. Keep an eye out for updates pertaining to Titan in the coming weeks.
If you have questions regarding v3, connect with us in the Vuetify Discord.
-John Leider-
Supporting Vuetify
Vuetify is an open source MIT project that has been made possible due to the generous contributions by sponsors and backers. If you are interested in supporting this project, please consider:
- Becoming a sponsor on Github
- Supporting the Core Team on Open Collective
- Becoming a sponsor on Patreon (supports the author)
- Becoming a subscriber on Tidelift
- Make a one-time payment with Paypal
- Direct support from Vuetify
📖
Table of Contents
#Release Introduction
#Important Links
#Documentation Updates
#Release Notes
#I need help!
Have questions? Check out our Frequently Asked Questions or join our Discord community.
❗️
Important Links
Vuetify Store
Documentation
Report a Bug
Community Discord
Twitter
🤚
FAQ
- Where is the Vuetify documentation?
- The framework documentation is located at https://vuetifyjs.com/
- Where is the upgrade guide?
- There are currently no steps required to update your application
💯
Release notes
v2.3.23 - v2.4.0
🔧
Bug Fixes
- Grid: collapse vertical gutters (d0f25fc), closes #11408
- Inputs: reset value to null instead of undefined (#12373) (8e5554d), closes #7429
- VChip: add close button aria-label (#12384) (9cd505d)
🚀
Features
- Locale: add Azerbaijani locale (#12084) (a2267b2)
- Locale: add Central Kurdish locale (#12100) (e121bc2)
- Styles: added text-pre-line utility class (53cc6de)
- Transitions: add dialog-top-transition (#12751) (09ddab5)
- Typography: add
text-pre
helper class (7a03376) - Typography: add
text-pre-wrap
utility class (#11772) (bf78f62), closes #11761 - Typography: improve
<code>
styles (7877bef) - VAppBar: don't truncate title with
shrink-on-scroll
(#12516) (8c5ee02), closes #12514 - VBtn: add new styling property plain (#12814) (bae707c), closes #3026
- VCalendar: add support for object categories (#12518) (806864c)
- VCalendar: update parser to return full category (#12638) (e2200c3)
- VColorPicker: add
hideSliders
prop (#12618) (e35d79b), closes #11138 - VDataTable: add
cellClass
property to headers (#11775) (8d06d45) - VDataTable:
index
prop initem*
slots (#12605) (9daeb16), closes #10646 - VDataTable:
isMobile
prop in scoped slots (#12604) (e1720a8), closes #11330 - VDatePicker:
show-adjacent-months
prop (#12603) (8f1cf64), closes #12237 - VIcon: specify a global default icon component (#12244) (41fd082), closes #7821
- VItemGroup: add tag prop to component (#12771) (e3378fc), closes #11392
- VMenu: add jump to first/last item keyboard navigation (#12348) (181d337)
- VResponsive: add contentClass prop (71b8854), closes #10982
- VSnackbar: keep snackbar open while mouseover (#12599) (8808d98), closes #12494
- VTextField: add
counter
scoped slot (#12634) (ed46cfb), closes #9548 - VTextField: only show placeholder on focus if label is set (#12635) (ff500ba), closes #12499
- VWindow,VCarousel:
prev
andnext
slots (#12602) (a0140b0), closes #3235
v2.4.0
🔧
Bug Fixes
🚀
Features
- Styles: added text-pre-line utility class (53cc6de)
- Transitions: add dialog-top-transition (#12751) (09ddab5)
- VBtn: add new styling property plain (#12814) (bae707c), closes #3026
- VCalendar: update parser to return full category (#12638) (e2200c3)
- VItemGroup: add tag prop to component (#12771) (e3378fc), closes #11392
- VResponsive: add contentClass prop (71b8854), closes #10982
- VTextField: add
counter
scoped slot (#12634) (ed46cfb), closes #9548
v2.4.0-beta.0
🔧
Bug Fixes
- Inputs: reset value to null instead of undefined (#12373) (8e5554d), closes #7429
- VChip: add close button aria-label (#12384) (9cd505d)
🚀
Features
- Locale: add Azerbaijani locale (#12084) (a2267b2)
- Locale: add Central Kurdish locale (#12100) (e121bc2)
- Typography: add
text-pre
helper class (7a03376) - Typography: add
text-pre-wrap
utility class (#11772) (bf78f62), closes #11761 - Typography: improve
<code>
styles (7877bef) - VAppBar: don't truncate title with
shrink-on-scroll
(#12516) (8c5ee02), closes #12514 - VCalendar: add support for object categories (#12518) (806864c)
- VColorPicker: add
hideSliders
prop (#12618) (e35d79b), closes #11138 - VDataTable: add
cellClass
property to headers (#11775) (8d06d45) - VDataTable:
index
prop initem*
slots (#12605) (9daeb16), closes #10646 - VDataTable:
isMobile
prop in scoped slots (#12604) (e1720a8), closes #11330 - VDatePicker:
show-adjacent-months
prop (#12603) (8f1cf64), closes #12237 - VIcon: specify a global default icon component (#12244) (41fd082), closes #7821
- VMenu: add jump to first/last item keyboard navigation (#12348) (181d337)
- VSnackbar: keep snackbar open while mouseover (#12599) (8808d98), closes #12494
- VTextField: only show placeholder on focus if label is set (#12635) (ff500ba), closes #12499
- VWindow,VCarousel:
prev
andnext
slots (#12602) (a0140b0), closes #3235
🆘
I need help!
If you are stuck and need help, don't fret! We have a very large and dedicated community that is able to provide help 24/7. Come to the #release-migration channel.
Assets
3
🔧
Bug Fixes
- VCalendar: resolve wrong relative day span for 4day (#12687) (d9138f5), closes #12666
- VCarousel: stop event propagation for prev/next buttons (#12678) (07eb09e)
- VDivider: vertical v-divider is not displayed when inside div and inline (#12735) (985ef44), closes #8656
- VTextField: add padding-top custom variable to details (#12661) (47e190e), closes #12660
- VTextField: hide-details auto animation (#12554) (07ef4e1)
- VWindow: fix wrong reverse animation logic for only 2 items (#12685) (be00b92), closes
#12672
Assets
3
🔧
Bug Fixes
- VCarousel: incorrect transition direction when using touch (#12357) (2160daf), closes #11280
- VDataFooter: show custom footer.page-text on empty data tables (#12651) (d9d3cb3)
- VRating: add icon aria-label (#12345) (1be735c), closes #11590
- VTabsItems: keep rounded corners during animations (#11983) (107bd32)
- VTooltip: don't add role:button to activator (#12428) (ec15822), closes #12360
Assets
3
📖
Documentation
🐛
Bug Reporting
https://issues.vuetifyjs.com
https://community.vuetifyjs.com in the #release-migration channel
Potential breaking changes for evaluation:
- Reset/clear on inputs should now change the value to
null
instead ofundefined
for better JSON compatibility. Make sure this always happens and we haven't left anyundefined
in. This change may break implementations needing to differ between empty and cleared, let us know on discord if that's the case. - If both
label
andplaceholder
are set, placeholder will now only be shown on focus instead of pushing the label up - Snackbar timeout resets on mouseover
🔧
Bug Fixes
- Inputs: reset value to null instead of undefined (#12373) (8e5554d), closes #7429
- VChip: add close button aria-label (#12384) (9cd505d)
🚀
Features
- Locale: add Azerbaijani locale (#12084) (a2267b2)
- Locale: add Central Kurdish locale (#12100) (e121bc2)
- Typography: add
text-pre
helper class (7a03376) - Typography: add
text-pre-wrap
utility class (#11772) (bf78f62), closes #11761 - Typography: improve
<code>
styles (7877bef) - VAppBar: don't truncate title with
shrink-on-scroll
(#12516) (8c5ee02), closes #12514 - VCalendar: add support for object categories (#12518) (806864c)
- VColorPicker: add
hideSliders
prop (#12618) (e35d79b), closes #11138 - VDataTable: add
cellClass
property to headers (#11775) (8d06d45) - VDataTable:
index
prop initem*
slots (#12605) (9daeb16), closes #10646 - VDataTable:
isMobile
prop in scoped slots (#12604) (e1720a8), closes #11330 - VDatePicker:
show-adjacent-months
prop (#12603) (8f1cf64), closes #12237 - VIcon: specify a global default icon component (#12244) (41fd082), closes #7821
- VMenu: add jump to first/last item keyboard navigation (#12348) (181d337)
- VSnackbar: keep snackbar open while mouseover (#12599) (8808d98), closes #12494
- VTextField: only show placeholder on focus if label is set (#12635) (ff500ba), closes #12499
- VWindow,VCarousel:
prev
andnext
slots (#12602) (a0140b0), closes #3235
Assets
3
🔧
Bug Fixes
- locale: improve japanese translations (#12535) (6c80202)
- VBanner: remove bottom-border on outlined banner (#12548) (49e25bb), closes #12172
- VColorPicker: extractColor util (#12305) (e7f63c5), closes #12574, #12183
- VDataFooter: translate itemsPerPageText (#12259) (bcfe8ef), closes #12012
- VFileInput: file-input-slot dense min-height (#12570) (3e65162), closes #11300
- VInput: use $label-letter-spacing variable (#12546) (915fbaa), closes #12250
- VMenu: open-on-hover does not close on-content-click (#12566) (389d023), closes #12412
- VRadio: do not use cursor pointer if disabled (#12058) (42c79b7), closes #12023
- VRadioGroup: label styles (#12382) (c61093f)
- VSimpleTable: add border radius to first and last row (#12553) (36080ca), closes #12550
- VTabs: resize slider when icons-and-text prop changes (#12525) (aac7c54), closes #12524
- VTextField: add background color to line on focus (#12556) (3e78556)
- VToolbar: v-toolbar sass variables typo (#12547) (11c746e), closes #12222
- SASS variable renamed from $toolbar-promient-padding -> $toolbar-prominent-padding
Assets
3
🔧
Bug Fixes
- types: export Vuetify as a class (3a0bd24), closes #12511
- VDialog: close on esc when eager is not set (0e31691), closes #11257
- VDialog: refocus previous element when dialog is closed (700fd42), closes #7907
- VSelect: do not deduplicate headers or dividers (4a855cd), closes #12517
- VTextField: count non-string types (#12475) (5dec772), closes #12451
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- locales: update language for th-Thai 18n translation (#12338) (b0913ae)
- VAutocomplete: don't try to set data on an empty clipboard event (8e8c360), closes #11187
- VCombobox: don't try to get data from an empty clipboard event (7106472), closes #11187
- VDataTable: add padding for mobile rows (#11865) (ec2b4b9), closes #8411 #11325
- VIcon: don't apply fill styles to component icons (eaf2f1b), closes #12378 #12148
- VIcon: set svg dimensions in style instead of attributes (#12319) (3576aa5), closes #12372 #12148
- VSelect: do not highlight search text without an item match (#12163) (148ecf5), closes #10843
- VSelect: do not open menu if clicking on selection item (#12343) (dcfbca6), closes #11824
- VTextField: show label slot when filled prop is used (#12371) (d7d77a3), closes #11533
Assets
3
Reverts
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- framework: use $ssrContext instead of options.ssrContext (5da64d2), closes #11935
- selection-controls: refactor click event handling (f055c36), closes #5968 #9408
- VAlert: pass events through to root element (05e7d22), closes #11929
- VEditDialog: return returnValue on save (#11740) (2620930), closes #11736
- VExpandTransition: include collapsed margins in calculated height (046d4e0)
- VIcon: add top and left to pseudo class for IE11 (a3d0cf7), closes #11686
- VSnackbar: remove transparent background with text/outlined props (3dbd910), closes #11835
- VSlideGroup: prevent thrashing DOM when available space < width (0f3f4b5), closes #11122
🔄
Reverts
Assets
3
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- _reset.css: add removed overflow to html (6663607)
- locales: update hu-Hungarian 1i8n translations (#11719) (ed17793)
- VImg: render gradient when src isn't provided (c0fa6d5), closes #11729
- VImg: stop polling for size when loading fails (be907b5), closes #11026
- VMain: add existing v-content classes for backwards compatibility (#11659) (31912d7)
- VSelect: attach menu scroll handler when loading items async (d9bb128), closes #11675
- VSelect: ensure VMenu's content has scroll listener added (#11725) (a406dd4), closes #11737
- VVirtualscroll: calculate child on mounted instead of created (#11712) (f3c8aa5), closes #11707
Assets
3
🔧
Bug Fixes
- _reset.scss: hide clear icon for search inputs (eeb7492)
- typography: partially revert changes made in e83a203 (8c650e4), closes #11629
- VAutocomplete: select last item when pressing backspace without a prior selection (524c1e8), closes #11639
- VSlideGroup: revert deprecation of show-arrows true (1085c02), closes #11620
- VVirtualScroll: provide correct item index to default slot (#11643) (4dbaec1), closes #11622
Assets
3
Assets
3
🔧
Bug Fixes
- validatable: change logic for disabled and readonly inputs (7e78d75), closes #11504
- VDataTable: update child combinator selectors for dense & fixed-header props (#11568) (93a8aac), closes #11566 #11567
- VSimpleTable: change css selector for fixed-header dense tables (1ec7de8), closes #11525
- VSimpleTable: reset table line-height and adjust td dense height (d634514)
🚀
Features
Assets
3
🔧
Bug Fixes
Assets
3
Assets
3
🔧
Bug Fixes
- locales: SK localization fixes and additions (#11497) (29f8bb5)
- spacing: set negative margin baseline to -4px (#11453) (3d2332c)
🚀
Features
- directives: expose all options to templates (#10905) (30f67e1), closes #4654
- theme: add new option to disable variation generation (6f037e8)
- VRipple: hide effect for touch scroll events (#7887) (#10596) (ca7605c)
- VAvatar: integrate roundable mixin (#11435) (e80e7e5)
- VCalendar: general improvements & category view (#11198) (f5adad0), closes #8667 #11080 #11093 #11133 #11182
- VCalendar: show week numbers in month-view (#10928) (8820b68), closes #9117
- VDataTable: add groupable property to header items (#11361) (622cf8a), closes #10889
- VSnackbar: add applicationable support (#11448) (2a2203a), closes #4468
Assets
3
🔧
Bug Fixes
🚀
Features
- VFileInput: add new prop hide-input (#11031) (0b256c9), closes #10886
- VParallax: add srcset support (e72e78f), closes #1535
- allow all console messages to be disabled (#10909) (7f99918), closes #10888
- Spacing: add support for 16 sizes of margin/padding (bbfe878), closes #10675
- VDatePicker: prev/next month/year icon aria label (#10366) (9c2a8b5), closes #9694
- VForm: add form level disabled prop (#10325) (ccf25e8), closes #1707
Assets
3
📖
Documentation
🔧
Bug Fixes
- VDatePicker, VDataTable: incorrect date picker styling when in data table (#11325) (3fcc67e), closes #7384
- VSimpleCheckbox: pass listeners to component (#11358) (d937f5b), closes #11345
- VVirtualScroller: properly key children to avoid re-render (#11327) (14ce2f1)
🚀
Features
- VDataTable: add item-class property (#11254) (7d1489a), closes #8643
- VSheet: refactor style propagation (#11335) (cbaf955)
Developer Notes
This release has a large refactor for v-sheet
and components that extend it. The refactor does not cover every component as some use-cases will added as separate PRs or in v3.0.
Changes made:
v-sheet
- default border radius is now 0v-list
- default border radius is now 0
John Leider
Assets
3
🔧
Bug Fixes
- VCheckbox,VRadio: ripple color for colored selection control (#11299) (4b849fa), closes #11290
- VDataTable: close multi-sort select when clicking on mobile (#11332) (6f8d84a), closes #10735
- VDataTable: respect mustSort property in options prop (#11334) (248300f), closes #10244
- VGrid: offset in RTL mode (#11359) (db52c0a), closes #6317
- VTreeview: disabled items should be ignored when selecting parent (#11232) (3184f7e), closes #8244
- VTreeview: emit opened nodes when using load-children (#11339) (4a0916f), closes #9693
- VTreeview: independent children should be selectable when parent is disabled (#11233) (06a7af3), closes #10770 #10990
Assets
3
🔧
Bug Fixes
- typography: conditionally remove important from utility mapping (c11ae35)
- VDatePicker: set proper tableDate if showCurrent is set (#11305) (6aa01a7), closes #6714
🚀
Features
- a11y: add visually hidden css utility classes (#11258) (9e4c3c8), closes #10914
- VDatePicker: add native events on day/month/year (#11126) (e706660), closes #5598
- VPicker: add new flat and elevation props (#10362) (e557759), closes #6006
- VProgressLinear: add new reverse prop (#11259) (b4e16c6), closes #11245
Assets
3
📖
Documentation
🚀
Features
- rounded: add border-radius helper classes (82dbdbf)
- typography: add break-point functionality to new type classes (#11033) (e83a203)
🖱
Developer notes
Typography has been updated to match current MD type spec. The following classes have been deprecated and will be removed in version 3.
.display-4
is now.text-h1
.display-3
is now.text-h2
.display-2
is now.text-h3
.display-1
is now.text-h4
.headline
is now.text-h5
.title
is now.text-h6
Assets
3
🔧
Bug Fixes
🚀
Features
Assets
3
📖
Documentation
🐛
Bug Reporting
https://issues.vuetifyjs.com
https://community.vuetifyjs.com in the #release-migration channel
🔧
Bug Fixes
- Locale: add missing pagination objects to fi/sk (aae297b)
🚀
Features
- directives: add color directive (#10866) (bf3799b)
- framework: create new decoration helper classes (#11035) (bf3fad2)
- kbd/code: update colors/style, added new variables (47042cd)
- locale: add Finnish translation (#10381) (0ce1a66)
- locale: add Slovak translation (#10328) (59b8422)
- VAlert: add closeIcon prop (#11124) (ec151b3)
- VDataIterator: emit the page-count event from VData (#10588) (db98a1e)
- VDataTable: add contexmenu:row event for data table (#10989) (26c9ec9), closes #9382
- VImg: add themeable support (#11034) (5e13729)
- VImg: remove error logging (755dc3d), closes #6755
- VLazy: add measurable mixin (a3a4e67)
- VPagination: add a11y support (#9926) (042a4bd), closes #9849
Assets
3
🔧
Bug Fixes
- i18n: remove untranslated string from ru.ts (#10945) (c092083)
- overlayable: overlay must be removed if quickly deactivated (#10975) (63eb1be), closes #8625 #9588
- VBtn: add hover effect radius inheritance (#10956) (001af08), closes #10671
- VIcon: add missing width attribute when rendering svg icons (#10942) (2112add), closes #10938
- VPagination: add interesectable support (f245833), closes #2434
- VSelect: add Y offset to menu to match material guidelines (#10940) (3586847), closes #10859
- VTextField: adjust margin and css target for dense field prepend/append icons (6603b05), closes #11011
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- VAppBar: inverted scroll not hiding the app bar in an edge case (#10656) (151ae74), closes #10590
- VDataTable: groups should be sorted according to groupDesc (#10771) (6471332), closes #10627
- VDataTable: show correct aria-labels for sorting (#9638) (e3ea39d), closes #4975
- VImg: correctly pass options to intersect directive (#10855) (2133162), closes #10848
- VNavigationDrawer: dynamic expand-on-hover (#10903) (a4fe6f5), closes #10862
- VProgressLinear: use both horizontal and vertical repeat (#10876) (583c811), closes #10852
- VSelect: normalize dense height (#10892) (1890bec), closes #10877
- VSimpleTable: set max width to 100% (#10707) (905fc45), closes #8993
Assets
3
🔧
Bug Fixes
- locale: german translation of
carousel.ariaLabel.delimiter
(#10789) (02df247) - VAutocomplete: prefix overlap with placeholder (#10781) (02723e5), closes #10538
- VCard: add !default flag to elevation variable (7746da6), closes #10869
- VDataTable: pagination event fires twice in a row (#10769) (cfee1b4), closes #10715
- VInput: show bottom border when loading prop is null (0f9b034), closes #10828
- VNavigationDrawer: change closed navigation drawer visibility (#10824) (0a0f44d), closes #10821
- VNavigationDrawer: scrolling in temporary hide-overlay (#10759) (8c99fee), closes #10758
- VSelect: emit click event (#10853) (be86aac), closes #10839
- VSelect: incorrect dense height (#10694) (07fa3da), closes #10635
- VSlider: readonly should apply only to slider control (#10768) (e089a7c), closes #10684
- VTextField: incorrectly displayed counter with hide-details=auto (#10705) (0e57814), closes #10701
- VTreeview: respect selection-type when rebuilding tree (#10653) (10087bb), closes #8720
- VTreeview.sass: center vertically treeview items on IE11 (#10816) (f39a93d), closes #10534
Assets
3
🔄
Reverts
Assets
3
Assets
3
🔧
Bug Fixes
- VAutocomplete: check for inital search input prop (#10642) (e09c916), closes #9757 #9757 #9757
- VDataIterator: emit page-count event (#10652) (4d04771), closes #8886
- VDataTable: emit pagination event when filtering (#10651) (7856dba), closes #10212
- VRangeSlider: add unique id for inputs elements (#10654) (1244991), closes #6843 #6843
Assets
3
🔧
Bug Fixes
- VDatatable: remove extra border from expanded row (#10321) (b44ef23), closes #6429
- VSelect: resolve bug in Safari/Edge/IE with event order disparity (#10620) (49cb28b), closes #10609
- VSelect: skip items without text in keyboard lookup (333588d), closes #8671
- VTextField: prevent IE11 error with mask delimiters (977e586), closes #8917
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- VAutocomplete: change onClick to not reopen menu (#10158) (10abc11), closes #6564
- VDataTable: group-by column should be included in search (#10591) (a40e8d3), closes #10392
- VDataTable: group-by should use correct slot (#10592) (065e93c), closes #10289
- VDataTable: Loading Progress bar pushes content down (#10169) (6bb6238)
- VDataTable: remove hover on empty (no data) wrapper (#10600) (c978f11)
- VIcon: change default icon svg size to match regular icon (#10507) (2045295)
- VMenu: allow more than 1 content node (#10525) (5d8d487), closes #10522
- VSimpleTable: bottom border of tbody th (#10594) (c014bdc)
- VSlideGroup: add display none to immediate child (#10567) (bb69192), closes #10310
- VTimePicker: show 12 hr time in title in ampm mode (#10364) (279af0e), closes #9572
🔄
Reverts
Assets
3
🔧
Bug Fixes
- VDataIterator: add missing isMobile property to custom item slot scope (#10345) (f4b4f0a), closes #8394 #9436
- VDialog: allow more than 1 content node (cc17fe1)
- VDialog: show transition on close (1491914), closes #10506
- VList: use tag prop (fb062bf), closes #10529
- VTooltip: lazy without transition (2e55652)
Assets
3
🔧
Bug Fixes
- SelectionControls: fix mouse events on field (40557a6), closes #10479
- VAutocomplete: avoid scrolling screen when pressing down (4fce059)
- VSelect: allow blur from outside click (47b2535)
- VSelect: bind scroll listener to menu content (972d188), closes #10485
- VSelect: expose clickable icons to screen readers (#10489) (cee1404)
- VSelect: properly handle up and down arrows when focused (f72db83), closes #8361
- VSelect/VMenu: remove duplicate IDs, add aria-activedescendant (#10226) (b2e5691), closes #9680 #7385
Assets
3
Notes from the Author
This patch resolves multiple a11y issues with <v-icon>
that were introduced in 86133ea. This update added tabindex to <v-icon>
when its being used as a interactive element (a bound click listener or using the link prop). While it resolved the issue, the icon wasn't responding to the enter key. This fix resolves those issues and consequently a few other ones. <v-treeview>
now has keyboard support by using tab to cycle between branches and pressing enter to expand them:
As defined in the Material Specification, active icons should have an increased opacity when active and focused: In practice, it is not very easy to follow. While we have maintained the originally intended opacity of an active/focused icon, a circular outline (very similar to <v-btn>
with the icon prop) was added to better emphasize the change. Reference: https://material.io/design/iconography/system-icons.html#color
If you have any questions, feel free to reach out to me in Discord
—John
🔧
Bug Fixes
- bootable: don't generate lazy content until it's rendered (#8823) (2b975f5), closes #8712 #8712
- SelectionControls: adjust focus and hover styles (1e66229)
- SelectionControls: remove color from transition-property (2f499d2)
- SelectionControls: remove duplicate import (2beb81b)
- VCheckbox: spacing issue with dense (#10407) (7aa8aa0), closes #10336
- VDateTable: events alignment on current date (#10367) (fc2eaa5), closes #8182
- VIcon: use a button element for clickable icons (#10439) (1596e55), closes #10265 #10391 #10398
- VListGroup: remove empty div child selector (60844a3), closes #8823
- VMenu: remove events from old element when activator changes (0a6946a), closes #10430
- VMessages/VCounter: resolve layout jump caused by incorrect line-height (5c8be69)
- VPicker: content position in landscape / rtl mode (#10371) (92e77a2), closes #9258
- VRadioGroup: apply legend style changes only when using row (f0ceca0), closes #10403
- VRating: remove tabindex from icons (6e6d6b8), closes #10379
- VSelect: get menu content when needed (bd2278f), closes #8823
- VTextField: apply different color logic for solo-inverted fields (afa2647), closes #8827
- VTextField: remove inherit border-color and scope styles (47c986a), closes #10388
- VTimePicker: AM/PM farsi translation and margins in RTL mode (#10399) (a6761a9)
- VTimePicker: increase clock click accuracy (#10400) (50ed3ef), closes #7299
- VTimePicker: missing end circle in clock hand (#10415) (755c5b8)
- VTimePicker: missing update:period event when ampm clicked in title (3a510e8), closes #7027
- VTreeview: do not set indeterminate on new leafs (adbb374), closes #8256
Assets
3
🔧
Bug Fixes
Assets
3
Notes from the Author
To help bring the framework styles better in line with what Material Design dictates, the default application background color for both light and dark variants has been fixed. In addition, multiple components were updated to properly match the dark theme specification.
Affected styles:
Light Theme
application background color
- #FAFAFA -> #FFFFFF
Dark Theme
application background color
- #303030 -> #121212v-app-bar
- #212121 -> #272727v-bottom-navigation
- #424242 -> #2E2E2Ev-card
- #424242 -> #2E2E2Ev-navigation-drawer
- #424242 -> #363636v-toolbar
- #212121 -> #272727
You can revert to the previous values by setting up a SASS Variables variables.s(a|c)ss
file with the following snippet:
// styles/variables.scss
$material-dark: (
'app-bar': #212121,
'bottom-navigation': #424242,
'background': #303030,
'cards': #424242,
'navigation-drawer': #424242,
'toolbar': #212121
);
$material-light: ('background': #FAFAFA);
There is also a new SASS variable that contains the color value for each elevation outlined on the Material Design Specification for dark variants.
$material-dark-elevation-colors: (
'0': #000000,
'1': #1E1E1E,
'2': #222222,
'3': #252525,
'4': #272727,
'6': #2C2C2C,
'8': #2E2E2E,
'12': #333333,
'16': #363636,
'24': #373737
);
If you have any additional questions, please reach out to me in the Release Migration channel of the community.
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- activatable: stop activator event listener propagation (be58395), closes #3333
- application-service: overwrite location sizes when registering (59a6bbf), closes #9797
- detachable: change detach target (6d001c7), closes #9906
- framework: update colors to match spec (103becb)
- SelectionControls: change selection-control disabled color (f6ef33c), closes #9280
- SelectionControls: properly align slotted labels (840f0ce), closes #10214
- VBanner: hook up missing color support (8f1ed83), closes #10216
- VBottomSheet: remove min-width and update flex (22cf5a1), closes #10261
- VChip: remove user-selection when used as link (603496e), closes #9737
- VCombobox: do not add search to list when selecting items with keyboard (#9866) (78aa42f), closes #6697 vuetifyjs/vuetify#8841 /github.com/vuetifyjs/vuetify/pull/9866/files/ba3f8a40b327e7509272530fe40ffe726f016a02#r359313120
- VDialog: remove unnecessary event.stopPropagation (9ca0519), closes #10167
- VFileInput: filter out values that are not instance of File (ebdb4f6), closes #10281
- VFileInput: remove input from normal document flow (7fa2e79), closes #8931
- VFileInput: set value to undefined by default and on clear (19bdb4c), closes #10287
- VIcon: apply default tabindex if click listener present (86133ea), closes #10265
- VInput: apply correct placeholder color (f6d0d61), closes #10221
- VListGroup: allow user to hide prepend-icon in subgroup (172724e), closes #8980
- VMenu: remove unnecessary event.stopPropagation (5af2cd1), closes #6654
- VNavigationDrawer: apply a better default mini width (d80e01f), closes #2830
- VNavigationDrawer: hide navigation drawer labels visually (#10250) (a28d03e), closes #9741
- VOverlay: enable touch interaction (3365cac)
- VRadioGroup: use correct element tags for a11y (75f6197), closes #9851
- VResponsive: apply rtl margin styles (#10269) (196bcdb), closes #10268
- VSelect: emit keydown event (6bf9eff), closes #10240
- VSlider: prevent default when pressing slider dot (7d2e162), closes #7241
- VSnackbar: a11y and appearance improvements (#10263) (80b1568), closes #10047 #10047
- VSparkline: avoid computing path total length if only 1 value provided (f57b7a7), closes #9426
- VStepper: fix styles in RTL (#10145) (879adcc), closes #10098
- VTextField: legend position with reverse and outlined prop (#10278) (55cbdbb), closes #10277
Assets
3
🔧
Bug Fixes
- css-reset: add missing comma for style declaration (3a347a1), closes #9521
- form-controls: fix disabled styles (#10191) (b4ad01a), closes #9488 #10154
- presets: export interfaces (#10161) (843a875)
- VAlert: fix transition irregularities (5f35eff), closes #9033
- validatable: properly handle boolean false as fn return (2ac7392), closes #9976
- validatable: validate on blur after value has persisted (33132a2), closes #10174
- VCalendar: wait for animation frame before updating events (b9809d2), closes #10168
- VCheckbox: properly style checkbox icon with fa iconfont (2af8c6d), closes #10157
- VChip: prevent navigation on close icon click (c486693), closes #10166
- VChip: scope close icon styles (4f151bb), closes #9451
- VChipGroup: remove unnecessary color declaration for v-icon (2cbf929), closes #9604
- VDataTable: fix default table header color (#10171) (7d5d5be)
- VDatePicker: restore event border radius to 50% (9e4cfa9)
- VDialog: prevent scroll on mobile devices (#10149) (183d79b), closes #10086
- VItemGroup: update toggled item when the items array changes (85f963e), closes #9854
- VItemGroup: update value when using mandatory and multiple (f4bc5bd), closes #10077
- VListItemAvatar: apply correct margin according to spec (97fc2de), closes #9789
- VRangeSlider: resolve infinite loop when using NaN values (35a654c), closes #9818
- VRating: check if half-increments prop is used alongside rtl (ddf3aec), closes #10093
- VSelect: disable menu when readonly (ba5cc58), closes #9960
- VSkeletonLoader: don't call the default slot if not used (e0f3f08), closes #10201
- VSkeletonLoader: properly animate incoming content after loading (9ac1158), closes #9459
- VSpeedDial: apply a baseline z-index (1c42ed1), closes #10194
- VStepper: adjust svg size to match icon font-size (bc55564), closes #8665
- VStepper: allow numeric 0 value (996a37f), closes #10096
- VTabs: correct width of v-tab's bar and content with vertical (df502ff), closes #10031
- VTextarea: adjust height for smaller rows and dense (792f183), closes #9346
- VTextField/VTextarea: change styles to match specification (8242e05), closes #4639
- VWindow: apply correct transition when using the reverse prop (51d61d2), closes #10182
🔄
Reverts
Assets
3
🔧
Bug Fixes
- helpers: check if source property is object in mergeDeep fn (5a4578c), closes #10100
- VBadge: oblong circle when using v-icon (a5b9cbc), closes #10054
- VExpansionPanel: remove rounded corners with tile and accordion (30b8b9e), closes #9643
- VSlider: avoid unnecessary input event (2f9b28f), closes #10018
Assets
3
📜
Documentation
🔧
Bug Fixes
- icons: add support for font awesome svg icons (#8092) (c4b7225), closes
#8016 - VNavigationDrawer: set proper border width (9bc631a)
🚀
Features
- presets: add new service (#9894) (5c0a67c)
- VCalendar: redo event overlap logic (#9974) (20a7a1a), closes #8826 #8928 #8620 #8396 #8792 #8937 #8565 #8400
- VCard: increase hover effect when focusing (#8143) (5dc3345)
- VDatatable: add isOpen to group.header slot parameters (#9721) (bb26a2e)
- VExpansionPanels: implement flat, tile, hover, and color props (#9643) (39d7e1e), closes #8939
- VInput: auto hiding details if no messages/counter (#7472) (7a9080a), closes #7434
- VTabs: add new bar-background-color variable (72f46dc)
- VTextField: add $text-field-filled-border-radius sass variable (d1a0189)
How to use presets
For the official documentation on presets, you can navigate here. It is still in progress and will receive updates over the next few days.
Update your vuetify-cli-plugin to the latest beta.
yarn add vue-cli-plugin-vuetify@^2.0.3-beta -D
## OR
npm install vue-cli-plugin-vuetify@^2.0.3-beta --dev
Pick an available preset (only basil/crane available atm).
vue add vuetify-preset-{preset}
You can monitor the available presets here: https://github.com/vuetifyjs/vue-cli-plugin-vuetify/tree/feat/add-material-presets/packages
Assets
3
🔧
Bug Fixes
🚀
Features
Assets
3
📖
Documentation
🔧
Bug Fixes
- VTabs: update to better match md2 spec (a49f2c8)
- VTreeview: incorrect alignment of nodes (#9640) (6e368ed), closes #8212
🚀
Features
- colorable: add support for CSS custom props (#9637) (ac58e80)
- sass: create more preset variables (#9766) (2c901ba)
- types: expose public interfaces for props and slots (#9763) (b03b507)
- VBadge: refactor for v2.2 (#9328) (b7fe7c2), closes #8245
- VData: custom grouping functions (#9253) (87f22c2)
- VDataTable: expose expand/select functionality (#9642) (587edf9), closes #8008
- VDataTable: hide sort by select on mobile if not needed (#9215) (665ebe3), closes #9209
- VIcon: add font awesome duotone support (#9170) (629b595), closes #8398
- VImg: add themeable support (#9805) (5d180dd)
- VLazy: add tag prop (00fb555), closes #9191
- VSelect: add prop for disabling keyboard lookup (#9297) (b0a7c30), closes #9271
- VTextField: add customizable counter value (#8802) (9aa761e), closes #8788
- VThemeProvider: add new component (#9804) (2dba817)
Assets
3
🔧
Bug Fixes
- styles: add missing ltr() rules (#9649) (8f772a7), closes #7586
- VBtn: add missing sass variable for text-transform (9cd96a8), closes #8619
- VBtn: normalize width behavior (426dd02), closes #8699
- VImg: resolve NaN value when computing normalizedSrc (8d110bf)
- VItemGroup: apply maximum width for use in flex containers (6362eec), closes #8752
- VListItem: only apply user-select style when using a link (fbc8ed8), closes #8648
- VTextField: fix style cascading when combinging multiple style props (fc7b05a), closes #8586
- VTextField: remove unnecessary margin on filled inputs (130fa8e)
Assets
3
🔧
Bug Fixes
- grid: allow binding style strings (3279945), closes #8328
- locale: update Russian translation (#9563) (bbae296)
- locale: update Ukrainian translation (#9562) (ddb90b1)
- types: add missing component declarations (#9652) (50e66da),
closes #9364 - VBtn: keep border of outlined button when focused (cad50e2), closes #9603
- VColorPicker: allow null as initial value (#9616) (2246e6b),
closes #9472 - VDataTable: revert to non locale sensitive number sort (a54a21d), closes #9515
- VImg: remove observer once init (1700d57), closes #9490
- VMenu: only use the activator slot in getActivator if it exists (0c6175f)
- VMenu: prefer the activator slot over a click event (baeb7ba), closes #6906
Reverts
Assets
3
🔧
Bug Fixes
⚠️
BREAKING CHANGES
A low impact security vulnerability was identified with the v-messages
component. Using the value prop, it was possible to perform an XSS attack.
NOTICE
If you are not using HTML for the props rules, messages, hint, success-messages or error-messages, you do not need to do anything.
All values for v-message
are now escaped. This primarily affects inputs as they use v-message
for rule and hint output. To accommodate this change, a scoped slot has been added for users who
need to customize the styling of messages as they will no longer render html.
Components this fix impacts:
v-autocomplete
v-checkbox
v-combobox
v-file-input
v-input
v-messages
v-overflow-btn
v-radio-group
v-select
v-slider
v-switch
v-textarea
v-text-field
<!-- v2.1.7 -->
<v-text-field :rules="['<em>Foo<em>']" />
<!-- v2.1.8 -->
<v-text-field :rules="['Foo']">
<template v-slot:message="{ message, key }">
<em :key="key">{{ message }}</em>
</template>
</v-text-field>
If you have any questions, please reach out to us in our community, https://community.vuetifyjs.com
Assets
3
🔧
Bug Fixes
- locale: update Norwegian translation (#9455) (051399a)
- VCalendar: escape html of event name (#9387) (283d601)
- VDataTable: adjust filter & sort functions to use Intl.Collator (#7805) (43adae8), closes #3672 #4622
- VDialog: fix close on outside click with persist and hide-overlay (#9304) (ba99a45), closes #8697 #8697
- VFileInput: trigger onInput after value has changed (#9091) (507f1b0), closes #9045
- VImg: do not lazy load if intersection observer is not supported (22e23e2), closes #9412
- VLazy: properly show transition on activation (ac7136d)
- VSwitch/VCheckbox: color not applied if value is 0/false (#9431) (9856ca7)
Assets
3
🔧
Bug Fixes
- theme: use new vue-meta api (#9268) (6d829ef)
- VAlert: remove pointer events from psuedo element (1958333), closes #9407
- VListItem: fix to misplaced small icon in dense list (#9395) (f5b5e98)
- VPagination: max length (#9423) (1394b6c)
- VRangeSlider: allow handles on same value (#9218) (3ab0f67), closes #8756
- VSkeletonLoader: properly cascade border-radius (74bc901)
- VTextField: dense filled & outlined (#9403) (2283635)
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- activatable: get activator element from event or nested component (#9294) (4b73dd2), closes #8846
- locale: fix ko translation of noDataText (#9305) (058b1fe)
- locale: update Thai translation. (#9292) (5d5241c)
- VAutocomplete: default broswer autocomplete to disabled (3387708)
- VDatePicker: fix min date (#9097) (45c07c5), closes #9039
- VDatePicker: improve range performance (#9128) (349ae88), closes #9120
- VTextArea: fix clear icon overlapped by the scrollbar (#9190) (1c21d76), closes #8910
Assets
3
🔧
Bug Fixes
- bind-attrs: fix transition-group animation (#9224) (356034a), closes #9171
- locale: update japanese translation (#9238) (d7b8e5a)
- types: fix lang option name in preset (#9169) (06d17cf)
- VAutocomplete: disable browser autocomplete by default (#9246) (c01f564), closes #8395
- VAutocomplete: move eventlisteners to focus watcher (#9273) (6d77ea0), closes #9204
- VBtnToggle: allow individual v-btn color override (#9250) (9fc9393), closes #9226
- VImg: properly update image on src change (6eb5e6e), closes #9210
- VProgressLinear: invalid background position in RTL mode (#8421) (a870dfa), closes #8419
- VSelect: remove reference to missing variable (73e08a8), closes #8417
- VStepper: Increase selector priority .v-icon (#9262) (d650e7e), closes vuetifyjs/vuetify#9261
- VTimePicker: reset margin on full width (#9139) (b983ea5), closes #9119 #9141
Assets
3
🔧
Bug Fixes
Assets
3
🚀
Features
- locale: add Czech translation (#8228) (8ec6f05)
- locale: add Lithuanian translation (#8605) (6216517)
- overlayable added color and opacity props (#8861) (fc7697d), closes #8301
- VAutocomplete: make items copy-pasteable (#7759) (c72f902), closes #6226
- VBtn: add retainFocusOnClick property (#9046) (14a0acd)
- VBtnToggle: add new variants (#7582) (33f031a), closes #4325
- VCard: add new shaped prop (18d732d)
- VCol: add justify-self property (1ba5f82)
- VDataFooter: added page-text prop (#8511) (d00534f), closes #8110
- VDataIterator: propagate and add toggle-select-all event (#8975) (c9b00db), closes #8974
- VDatePicker: pick date range (#8891) (64867ba), closes #1646
- VDataTable: added filterable property to header items (#8439) (00c6a73), closes #8242
- VImg: add lazy loading functionality (0df5f42)
- VInput: add dense prop (#8810) (5bfc87e), closes #1846
- VIntersect: add new directive (#9071) (9aee2d6)
- VLazy: add new component (86590b4)
- VListItem: add selectable prop (#8622) (b6c4f15), closes #8464
- VSelect: emit selected listIndex event (#7828) (b795145), closes #7808
- VSkeletonLoader: add new component (#9037) (160c7e8)
- VSnackbar: add border-radius sass variable (5b7341e)
- VTimePicker: am/pm i18n. (#9032) (0b8fa7c)
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- SelectionControls: better scope css selector for input (d7d1ae3), closes #8523
- VCheckbox: wait for dom to process before changing indeterminate state (7080ed4), closes #8270
- VDialog: check if element is already focused on focusin event (fa0a893), closes #8459
- VDialog/VMenu/VTooltip: make all activators inline elements (b40fa43), closes #6951
- VPagination: display length if maxButtons is less than 1 (7f7391d), closes #8558
- VTabs: only indent tabs if overflowing (dc2850f), closes #8540
- VTabs: properly position slider after resize, fix align-with-title prop (a8c3f2a), closes #8621 #8653
- VTextField: better scope hover styles for outlined text-fields (9ddb4db), closes #8546
🔄
Reverts
Assets
3
🔧
Bug Fixes
- VCarousel: pass mandatory prop to the delimiters (#8639) (6c086cb), closes #8273
- VDataFooter: disable last page button if there's no items (#8590) (2277942), closes #8577
- VDataTable: default to first itemsPerPage option (#8578) (cb045a2), closes #8184
- VDataTable: page resets when server-items-length is zero (#8594) (39f9d8b), closes #8359
- VDataTable: use convertToUnit in table header width styles (#8592) (4a52142), closes #8591
- VTabs: slider hides behind the colored tab (#8600) (f74b70a), closes #8596
- VTextField: remove !important flag for bg-color (#8652) (83e1c9a)
Assets
3
🔧
Bug Fixes
Assets
3
v2.0.9
Assets
3
v2.0.9
Assets
3
Assets
3
🔧
Bug Fixes
- locale: fix polish translation of dataTable.sortBy (4f5d329)
- VAlert: adjust dismissable button margins, decrease size (d3bfccb)
- VBtn/VToolbar: better scope default v-btn size (c3812fa), closes #8035
- VCardActions: update icon boundary when using v-btn (6517b58), closes #8042
- VListGroup: fade hover/focus effect when active (a9283e7), closes #8115
- VNavigationDrawer: display overlay over v-app-bar (6255bf5), closes #8040
- VProgressLinear: make progress not overlapped by buffer (b36e27f), closes #8114
- VRating: flip in RTL (d0eb357), closes #7381
- VSpeedDial: fix transition for tooltips (e8dbd0b), closes #8159
- VSpeedDial: make speed dial list non-clickable when it's closing (c158d04), closes #8203
- VTabs: prevent prop style bleed for nested tabs (8f126b8), closes #8303
- VTextField: recalculate prefix on prop change (f9049b3), closes #8268
Assets
3
🔧
Bug Fixes
- icons: use correct fa4 radioOn icon (d14dcc9), closes #8201
- locale: complete hebrew translation (e711fbf)
- theme: fix vue-meta theme on page navigation (#8234) (9324ec7), closes #7879
- VBtnToggle : fix borders between buttons (#8024) (4934e1e)
- VCalendar: end date and ripple errors (#8189) (bd793e9), closes #8096 #8175
- VCarousel: correct prev/next buttons size (#8122) (823cb2c)
- VDataTable: allow custom header icons (#7918) (e6c448f), closes #7647
- VDataTable, VSimpleTable: add missing rtl styles (#8200) (5a45ecf)
- VDialog: fix dialog error when clicking on overlay (#8246) (400542f), closes #8240
- VFileInput: fix rogue change events (#8193) (3568df3), closes #8167
- VList/VListGroup: add missing rtl margins and paddings (v2.0) (#7861) (e1ba658), closes #8125
- VListGroup: remove unnecessary css from header (055c246), closes #8222
- VProgressCircular: center inner content vertically and horizontally (4288072), closes #8232
- VSelect: tweak default menu max-height value (#8225) (7932d7a)
- VSimpleTable: fix hover (#8165) (13816f1)
- VSnackbar: properly assign width on mobile devices (c54ccbe), closes #8224
- VSwitch: inset styling in RTL (#8188) (d53c43c), closes #8130
- VTabs: margins in RTL mode (#8123) (e5e5f76)
- VTabs: set correct offset on touchend with rtl (1565a8e), closes #8116
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- framework: add missing components to $_vuetify_subcomponents (#8080) (8aff65a), closes #8047
- goTo: get clientHeight from when target is (854c826), closes #6914
- VAvatar: force v-img to inherit avatar height/width (de68a07), closes #8056
- VBottomNavigation: increase specificity of v-bottom-navigation styles (#8073) (0ffc14c), closes #7998
- VBtn: re-add support for non-fab absolutely positioned buttons (23c8518), closes #7948
- VDataFooter: better handle custom item options (#8029) (8b7a25b), closes #8026
- VDataTable: center and disabled no-data/no-results text (#8106) (63d3e00), closes #8102
- VDataTableHeaderMobile: don't show disabled header in sort select (#8081) (2666cca), closes #8036
- VFileInput: unindent input when icon is empty (#8078) (d1a67ab), closes #8049
- VForm: when validate is manually called, properly validate all inputs (b411be4), closes #7999
- VListItem: update css selector for list-item-avatar styles (a689c03), closes #7930
- VPagination: restrict totalVisible to maxButtons (8195ac7), closes #7947
- VSnackbar: add correct exit animation (0efd2a1), closes #7981
- VSpeedDial: apply even padding on speed-dial list (4091792), closes #8039
- VSystemBar: propagate listeners to root element (c14aae7), closes #7960
- VTabs: add proper indentation for mobile scrollable and align-with-title (f380842), closes #6932
Assets
3
🔧
Bug Fixes
Assets
3
Sorry
If this completely breaks everything and you can't easily fix it, feel free to revert to beta 8 and give me a telling off on Discord
⚠️
BREAKING CHANGES
Install eslint-plugin-vuetify to fix most of these for you
- Spacing helpers have changed to represent the number of 4px intervals from 0-12 (0-48px)
- eg. px-7 is 7 * 4 = 28px
- 3 -> 4
- 4 -> 6
- 5 -> 12
- Most "breakpointed" and "non-breakpointed" helpers have been normalised, eg.
text-xs-center
is nowtext-center
as it applies to all screen widths unless overridden - Children of
.d-flex
no longer have extra flex rules applied. This can be done manually with.flex-grow-1
- Helper classes changed:
scroll-y
->overflow-y-auto
hide-overflow
->overflow-hidden
show-overflow
->overflow-visible
no-wrap
->text-no-wrap
ellipsis
->text-truncate
Use the following regex to update spacing classes:
find: ([\s"][mp][axytblr])-5
replace: $1-12
find: ([\s"][mp][axytblr])-4
replace: $1-6
find: ([\s"][mp][axytblr])-3
replace: $1-4
🔧
Bug Fixes
- Overlayable: do not remove overlay if is still active after transitionend (dc30560), closes #7798
- Selectable: update hasColor data property on value change (818077f), closes #7855
- SelectionControls: tweak styles to properly match spec (7fab4bc)
- VBottomNavigation: decrease specificity of icon margin (85ac7d4), closes #7568
- VBtn: correct md2 fab sizes (f787b46), closes #7785
- VBtn/Tab: normalize vertical alignment (e2fc06b), closes #7832
- VCheckbox: normalize indeterminate behavior with native checkbox input (f7cd045)
- VChip: show ripple (61b0b31), closes #7863
- VDataTable: add theme styles for group header (a8634d6), closes #7853
- VDatePicker: increased css specificity (51e49cf)
- VExpansionPanel: increase specificity for active header icon rotate (8f83745), closes #7809
- VExpansionPanels: increase specificity of accordion style to avoid css leak (78c806a), closes #7809
- VFileInput: properly clear file input (dfc8948), closes #7848
- VIcon: normalize icon styles (3d9dc50)
- VListGroup: add missing click event propagation (204dcc6)
- VSpeedDial: add correct margin between btns inside of the dial list (5146c85)
- VSpeedDial: fix absolute styles and list separation from activator (c7bc9b0)
- VTextarea: recalculate textarea height when row-height changes (489ce4c), closes #7671
- VToolbar/VAppBar: properly show background on all browsers (f6c5cce), closes #7742
- VWindow: hide overflow when using show-arrows-on-hover prop (af003b6), closes #7542
🚀
Features
- Negative margin helper classes:
.pr-n4
appliesmargin-right: -16px
- More responsive helper classes:
.pa-md-6
,justify-lg-center
,order-sm-first
- Easier to use flex utilities:
.flex-grow-1
and.flex-shrink-0
instead of.grow
/.shrink
- New bootstrap-style grid system (#7327) (9c122fe), closes #1434 #5168 #5272 #6020 #7733
Assets
3
🔧
Bug Fixes
- elevatable: allow elevation value of numeric 0 (e690b23)
- validatable: setup proper validation state coloring on all inputs (#7810) (62e8fe0)
- VBtn: adjust style declaration for v-icon color inheritance (0b6784d)
- VCalendar: ellipsis weekday names when overflowed (d400b2c)
- VCard: prevent overflow in flex containers (18b9bf0)
- VExpansionPanel: remove flex style designation to v-item-group children (d526302), closes #7524
- VPagination: remove ul padding from base (1ab51bf)
- VTabs: tabs default color (79016c3)
- VTabs: typo in var name, changed max width to match md specs (47689ca)
- VTextField: remove filled variant border override (7e98189)
🚀
Features
⚠️
BREAKING CHANGES
- validatable: all form inputs default to white when using the dark prop unless the application is set to dark mode
Assets
3
🔧
Bug Fixes
- styles: broken rtl spacing and text-alignment classes (6c79093)
- VApp: add missing theme propagation from $vuetify object (2589d0c)
- VTab: increase specificity of color (a9376db)
- VTabsItems: change inferred theme variant (cf180d4)
⚠️
BREAKING CHANGES
- VApp: the dark and light prop no longer have an effect on application theme variants
<!-- v1.5 src/App.vue -->
<template>
<v-app dark>
...
</v-app>
</template>
// v2.0 src/plugins/vuetify.js
import Vue from 'vue'
import Vuetify from 'vuetify'
Vue.use(Vuetify)
export default new Vuetify({
theme: { dark: true }
})
Assets
3
🔧
Bug Fixes
- VAvatar: ensure text is always aligned properly (cf94c0b)
- VBadge: ensure text is always aligned properly (7f5b257)
- VBreadcrumbs: support aria (0e8ca8f)
- VBtn: add letter-indent to combat off center caused by letter-spacing (606dfd5)
- VBtn: adjust icon margin and size calculation to properly match spec (45df4b3)
- VBtn: fix style application for text/outlined variants (4d995c9)
- VCalendar: proper fix for using next/prev with irregular weekdays (1222e2a), closes #7155
- VCalendar: throw error when no days available (#7675) (032aadc), closes #7155
- VCalendar: update scoped slot names to kebab-case (#7673) (7835965), closes #6704
- VChip: add active prop to replace existing value functionality (f9eadbe), closes #7715
- VCombobox: properly enable auto-select-first (c84c2fb), closes #6607
- VDialog: add missing a11y roles (1ee52bd)
- VDivider: adds a11y attributes (#7708) (83bc365)
- VIcon: add notranslate (0c9b5f3), closes #7689
- VList: add missing - in nav class styles (7eab403)
- VList/Item/Group: improve a11y (#7651) (5928b65)
- VSelect: allow new item creation after one is selected (e809466)
- VSelect: pass attrs through scoped slot (b70434b)
- VSelect/VChip: selected state in input fields (4dabf8b), closes #7719
- VSelectList: move selection listener to simple-checkbox (80d8884), closes #7692
- VSparkline: negative values, labels being cut off (#7664) (30348c8)
- VTabs: ensure v-tabs doesn't force overflow in flex elements (5532ac5), closes #7720
- VTabs: remove swiping propagation for tab touch events (#7607) (9d3937f), closes #6462 #6801
- VTabs: resolve broken link association for a11y (186eec1)
- VTextField: improve text-field prop combination styling (d0e5060), closes #7711
- VToolbar: give proper default tag and allow for a custom one (47d56b2)
⚠️
BREAKING CHANGES
- VChip: the value prop is now active, @input listener is now @active.sync
- VList/Item/Group: the item scoped slot value of
{ tile }
is now{ attrs, on }
. is now bound similar
to the v-menu activator slot
VChip Change
// v1.5
<v-chip :value="true" @input="value = $event">...</v-chip>
// v2.0
<v-chip :active.sync="active">...</v-chip>
VList/Item/Group Change
// v1.5
<v-select>
<template v-slot:item="{ item, tile }">
<v-list-tile v-bind="tile">
...
</v-list-tile>
</template>
</v-select>
// v2.0
<v-select>
<template v-slot:item="{ item, attrs, on }">
<v-list-tile v-bind="attrs" v-on="on">
...
</v-list-tile>
</template>
</v-select>
Assets
3
🔧
Bug Fixes
- normalize component active/hover/focus states (#7519) (3ab588a)
- ripple: add ripple property to denote touch enabled (#7619) (985c634), closes #7605
- VAutocomplete: remove space preventDefault (7583d79)
- VDataTable: disable header sorting if disable-sort is true (#7665) (1809a1c), closes #7657
- VInput: attrs should be applied on input not root element (#7579) (318553a), closes #5412
- VList: pass in measureable styles (#7570) (0fa7e73)
- getObjectValueByPath: improve performance (#7543) (02f5471), closes #7302
- VBtn: ensure .v-btn__content extends full width (aa30554), closes #7580
- VDataTable: added isMobile boolean to body slot props (953a757)
- VDataTable: missing styles for headers (eed1e2f)
- VMenu: avoid potential stack overflow with no clickable tiles (7d3b8e9)
- VSelect: resolve bug in safari/ie11 with event order disparity (5fa6a68), closes #6608 #5913
- VSelect: tab selection (4963f72), closes #5614 #7544
- VSparkline: filled line should not obscure labels (b4fc0bd), closes #7473
- VSparkline: show custom labels when using bars (#7642) (454235d), closes #7584
- VToolbar: reverts fix in #7499 in favor of flex property (8d9b25e)
- VTreeview: propagate item-disabled to child nodes (52b6413)
- VWindowItem: resolve content jumping on transition (not scroll related) (46b563b), closes #6206
🚗
Code Refactoring
- VTextField: remove browser-autocomplete prop (68f85d6)
🚀
Features
- locale: add Norwegian translation (#7587) (b78fe28)
- styles: add rtl/ltr start/end spacing and alignment (#7448) (3a51619), closes #4660
- VCalendar: events improvements (#6475) (964a750), closes #6264, #6307
- VDataTable: add row click event (#7578) (e3e494a), closes #7491
- VSparkline: render negative values in bar mode (f8d180c)
- VTreeview: color prop (#7617) (b60b094), closes #7613
- VTreeview: item-disabled prop (#7618) (ae15ed8)
- VTreeview: rounded/shaped props (#7616) (acfdef7), closes #7614
- VTreeview: add selectionType prop (#7575) (2ecec4a), closes #6903
- include helper json in built dist folder (#7551) (ce8538f)
⚠️
BREAKING CHANGES
- VTextField:
v-select
no longer has a default autocomplete of "on"
Assets
3
v1.5.0-1.5.0-beta.1.0
Assets
3
🔧
Bug Fixes
- framework: prevent duplicated theme stylesheet id (#7443) (6b7e7b1)
- locale: update fa locale (#7439) (70180b8)
- locale: update ru locale (#7437) (dbf4a9e)
- VDataTableHeader: remove icon opacity (bf0a9e4), closes #6647
- VIcon: fix a11y with SVG (1866aca), closes #7428
- VIcon: missing default icons (796a22c)
- VTabs: normal tabs inside vertical tabs are vertical (#7357) (290c353), closes #7355
- VTextarea: apply single-line when using the full-width option (aad5156), closes #7442
- VTextField: add nowrap for prefix/suffix (dd31808), closes #6922
🚀
Features
⚠️
Breaking Changes
As outlined in the beta.0 release, previous deprecations were changed to be breaking changes. This means that you will still receive a warning, but it will NOT be backwards compatible.
Assets
3
🔧
Bug Fixes
- input-controls: properly associate labels with inputs for a11y (7c4a1ad), closes #6178
- locale: update polish translations to 2.0 (2a57376)
- locale: update translation files structure to 2.0 (#7367) (87b1844)
- scripts: invalid path to jest binary in debug:test (509b297), closes #7350
- validatable: VuetifyRuleValidator can return string | bolean (b152757)
- VAppBar: remove width declaration on fixed bar (cf73093)
- VBadge: fix delay on closing badge if transition is disabled (#7287) (98d9a3a)
- VDataIterator: resolve type check error (4c65efd)
- VDataTable: fix header color (#7341) (b040ff3), closes #7334
- VDataTable: header icons should respect icon type (svg/non-svg) (#7342) (f8cfff5), closes #7338
- VGrid: wrap gutter equation in parentheses (6f09b23)
- VList: remove pointer events in &:before hover (c1b0a25), closes #7335
- VListItem: add missing disabled styles (ddc4e65)
- VMessages: update min-height to avoid screen jitter (96f874e)
- VSlider: fixed issue when value is NaN (bf83b6f)
- VSlider: set correct value when using negative min and 0 (928a518), closes #7320
- VTabs: properly set height when provided (1f446b4), closes #7345
- VTextarea: recalculate height on model update (#7363) (94a8344), closes #4683 #6978
- VTextField, VSelect: check the existence of input before focusing (f9139ec), closes #7059
🚀
Features
🔄
Reverts
- VDataIterator: revert selection bool, return bool isSelected (d30c2e8)
Assets
3
🚧
DISCLAIMER
🚧
This is specifically for developers who want to play with the absolute latest and greatest that is coming up in the framework. With the exception of critical bugs, all issues pertaining to the alpha will be closed without question.
🔧
Bug Fixes
- bootable: proper deprecation since eager is not a replacement (#7156) (213d300)
- VListTileTitle: don't cut badge (#7161) (f20cc01), closes #7117
- VTextField: fix color of prefix/suffix when disabled (#7189) (7bc4a08)
🚀
Features
Assets
3
Assets
3
Assets
3
🚧
DISCLAIMER
🚧
This is specifically for developers who want to play with the absolute latest and greatest that is coming up in the framework. With the exception of critical bugs, all issues pertaining to the alpha will be closed without question.
🔧
Bug Fixes
- VListItem: fix for usage with external value (9c4c0f9)
- VSelect: fix entry animation and positioning (ae8f92a)
🚀
Updates
- VStepper: update to v2 (0d92edd)
Assets
3
🔧
Bug Fixes
Assets
3
🔧
Bug Fixes
- locale: update carousel.next/prev translation (#6993) (50874af)
- VBtn: remove font-size overwrite by typography css (#6975) (189cbd2), closes #6974
- VOverflowBtn: remove top border (#6984) (aa14ca8), closes #6960
- VSpeedDial: add check for componentOptions existing on slot (#6905) (58a8725), closes #6901
- VTextField: provide correct margin-top for prefix (#6956) (0160a40), closes #6942
- VTextField: prevent TypeError when color is an empty string (#6982) (fc6a66b), closes #6981
Assets
2
🚧
DISCLAIMER
🚧
This is specifically for developers who want to play with the absolute latest and greatest that is coming up in the framework. With the exception of critical bugs, all issues pertaining to the alpha will be closed without question.
Includes fixes from https://github.com/vuetifyjs/vuetify/releases/tag/v1.5.11
Assets
3
Assets
3
🔧
Bug Fixes
- click-outside: check clicked element instead of position (559c579)
- dependent: don't close if a child's overlay is clicked (dbe3213), closes #5310
- v-messages: increase line-height of inputs messages (#6868) (5f88487)
- VBtn: limit FAB icon transition to direct children (a76ef42)
- VDialog: close when escape is pressed (c64ed2a), closes #6352
- VDialog: focus the first child when tab leaves the dialog (2d5d72b), closes #2538
- VDialog, VMenu: focus activator when closed with esc (cef2d1d)
- VMenu: delay closing when save is called (74e0bd1), closes #5200
- VMenu, VTooltip: detect when activator has position:fixed (#6460) (700bb49), closes #6471 #1551
- VSelect: highlight newly selected item on keypress (495ffaa), closes #6856
- VSelect: keep menu closed when removing chip items. (#6845) (a4761cb), closes #6844
- VuetifyGoToOptions: add missing properties to types (ee1078f)
Assets
3
Assets
3
🚧
DISCLAIMER
🚧
This is specifically for developers who want to play with the absolute latest and greatest that is coming up in the framework. With the exception of critical bugs, all issues pertaining to the alpha will be closed without question.
📖
Documentation
🔧
Bug Fixes
- remove duplicated styles in dev (c53cc0e)
- use actual folder containing file for path transform (5182ee4)
⚠️
Breaking
You must now import both app.styl and main.sass.
// src/plugins/vuetify.js
import 'vuetify/src/stylus/app.styl'
import 'vuetify/src/styles/main.sass'
Assets
3
🚧
DISCLAIMER
🚧
This is specifically for developers who want to play with the absolute latest and greatest that is coming up in the framework. With the exception of critical bugs, all issues pertaining to the alpha will be closed without question.
📖
Documentation
🔧
Bug Fixes
- _variables: remove conflicting sheet variable (070ec41)
- VBadge: fix invalid height when wrapping spans (ae12eaf)
- VBreadcrumbs: remove deprecated method (20cf338)
- VDataTable: add horizontal overflow scroll (bde7c8f)
- VItemGroup: return proper selected values when value is undefined (054edba)
- VItemGroup: select first non-disabled item with mandatory prop (6d1615f)
- VSlider: make sure stars do not wrap (c92e569), closes #6481
- Vuetify: reintroduced browser installation of Vuetify (7892e0a)
- VWindow: select first non-disabled window-item when using touch swipe (1938ee7), closes #5000
7b2e19f
Compare