Releases: vuetifyjs/vuetify
v0.9.3
Bug Fixes
- #213 Fixed button icon min-width overtaking width 4b6c426
- Fixed a bug where the first error of a form element would not animate 5afa10e
- #214 Fixed bug where right-sidebar would not properly translate with open on mobile 2c2f8cd
- Fixed bug where
v-btn
would not apply the type property f503ee7 - Fixed bug where
v-btn
would render as an anchor tag 8e4cb18 - #230 Can now use computed classes on
v-avatar
d30e5d5 (thanks @nekosaur) - #231 Added missing stylus variables b606204
- #228 Fixed a bug where slider minimum was not being respected c23390b
- #229 Fixed a bug where
v-slider
would sometimes jump positions when dragging 3a10909 - #226 Fixed a bug where label and hints/errors were not properly aligned with a prepended icon 58b915e
- #234 Fixed
v-avatar
size when used on av-chip
using the small prop 3f61fda - Fixed a bug with
v-text-field
where a numeric 0 would evaluate to false when checking if not empty b6e7b05 - #236 Fixed a bug where
v-menu
would cause inputs to not line up 00e7bbc (thanks @nekosaur) - #252 Fixed bug where {size}-and-up display helpers were not using the proper sizes 5f69147
- #244 Fixed bug where button toggle was not showing a border in some cases 52b5215
- Fixed minor display issue with a prepended icon in
v-text-field
with the multi-line prop 0006777 - Fixed bug with a mis-named property in
v-list
for subheader 1d5567c
Enhancements
v0.9.2
Bug Fixes
A big thanks to @bratberg for creating a NUXT example PR. Added link in documentation
- #210 Autocomplete was not ready for 0.9.0, removed lingering functionality 3097a29
- #160 Updated list styles to properly size when more than just title is provided in a list d18e251
- #198 Added initial border to avoid jump 9c8e2d1
- #201 Added value to rule cb (thanks @nekosaur)
- #92 Fixed initial value not setting properly, introduced after select refactor 9119b1c
- Fixed a bug where text-fields were being improperly styled in tables cf13640
- Updated beforeDestroy hook to avoid console error when using menu c702c30
v0.9.1
Whoops
Added missing commit for modal bug fix.
v0.9.0
Forms for everyone!
This release requires Vue@^2.2
This release was focused on polishing up one of the weakest areas in Vuetify, the forms. In order to not delay the release any further, we have decided to push back Date/Time picker for the next release. Selection control components have also been updated for Vue 2.2 support. You will no longer need to use the value-v
prop when needing to specify the value. This release also contains significant updates to the Menu and corresponding Select components thanks to @prograhammer.
Next up
We are rounding out the last few components before we reach 100% spec. I greatly appreciate all of the passionate developers which have provided feedback and help during the development of Vuetify. From the entire team, we would like to thank you for your continued support.
Performance Improvements
- Sidebar/list patch time has been improved by up to 72%
New Components
- Slider - spec
- Snackbar - spec (thanks @mfferreira)
- Stepper - spec
- Switch - spec
Updated Components
- Select/Menu - fully updated with a vast amount of options and functionality (thanks @prograhammer)
- Chips - added avatar prop for image chips
- All form components now support v-model modifiers,
lazy
,number
andtrim
. (spec) - All form components now have dark/light themes
- All selection controls now have the proper ripple effect
- Added router capabilities to
v-btn
#155 v-footer
is now a functional componentv-list-tile-action
is now a functional component- Added error messaging for all form components
- This is handled by passing an array of callbacks to the
rules
prop. - These callbacks should either return Boolean (true) or a String message.
- This is handled by passing an array of callbacks to the
- Added hint messaging for all form components
- Added support for
true-value
andfalse-value
to switch and checkbox spec - Updated activator for menu to toggle instead of only open #152
v-list-group
will now lazily load its children
Bug Fixes
- Added overflow for modal #184
- Fixed size variations for button icon #185
- Added conditional for modal activator #162
- Updated expansion-panel to property resize when content changes #154
Misc Changes
- Moved background color set to secondary color only on non-fixed sidebars 1628eb6
- Improved non-fixed sidebar styles on mobile 461b599
- Added prop to designate no action on list groups for better alignment 8ec8643
- Added better support for selection controls in lists
Changed Components
- Toasts have been moved from a function to a component,
v-snackbar
v-list-sub-header
is nowv-subheader
v-text-input
is nowv-text-field
Docs
Document sections have been added for <v-subheader>
and <v-divider>
v0.8.10
Small release for bug fixes and minor tweaks
The documentation has been updated with many missing properties from the last large update.
- Alerts now default to their v-model value, which if undefined will hide the alert by default.
- 8f71913 Added missing preventDefault for
tab-item
- 00a4d63 Added missing toolbar disabled style
- #142 Fixed a bug where tooltips on buttons were not working properly. Added back text-transform stylus variable. 5bed86a 6e5dbf1
- #143 Modal click-outside can now be disabled with
persistent
a7a071c - #141 Added append/replace prop support for all router-links. Added
nuxt-link
support 874eb29
v0.8.9
Bug fixes and button style tweaks
Updated button styles to better match MD spec for active states.
- #129 Fixed checkbox value not updating 03191d7
- #119 Fixed tabs following url after refresh 7b97d30
- #133 Fixed toolbar active class 2b3f583 (thanks @cailloumajor)
- Fixed a bug with v-click not properly applying 47cf0f7 (thanks @miquels)
- #138 Fixed outline styles 3595818
- #134 Added disabled prop to
v-tab-item
c0c7c31 - Fixed a bug where an expansion list state would not properly update 272f546
- Added more accurate method of applying event listeners fc392be
v0.8.8
I would like to give a special thanks to the individuals have dedicated a lot of their personal time to help the development of this project. @prograhammer and @fontzer were pivotal in today's release and it would not have been possible without their efforts.
The Tides of Change
With this update, you will see large changes throughout the entire library. Buttons has received a complete refactor. While other components have received tweaks, bug fixes and even name changes. Due to the massive amount of changes (183 commits), I will not be detailing the individual commits for bug fixes and changes, but instead, giving some insight to the design decisions and how to update your project.
Developer Insight
As Vuetify has grown in popularity, size and complexity, I have had the pleasure to work with and help numerous developers as we continue to support this framework.
Through these experiences, there has been a few points of confusion that have been recurring. The items
prop that appears on many components and the Event Bus. two of the features I created with the intent of making it even simpler to setup components and communicate with them, were the cause of most of developers frustrations.
For some users, the simplicity of the items prop allowed them to do powerful things with only an array. For others, it complicated the ability to perform simple actions like capturing when a modal closed. Individuals were being forced to learn about an arbitrary glue in order to leverage their applications. It was difficult to debug and was ultimately proving to be more of a hamper than helper.
So we went back to the drawing board. The first option we tried was moving to Vuex as a hard dependency. This worked beautifully and really helped reason about the code for debugging in a way that was not possible before. Not soon after we finished the implementation, we stepped back and picked it apart. The event communication between components was limited to a very small subset of components and started to seem like an unneeded addition. Then came complications of creating functionality to allow the new Vuex system to work without a build process.
Not happy with the overall feel of making Vuetify even more opinionated, we challenged ourselves again. Make every component operate with no event management and still function in drop-in html templates, webpack builds and SSR. As the pieces started coming together, the overall feel of being able to control the components began to feel very fluid. All state controlling was moved to v-model, a familiar Vue feature everyone is used to using. This allowed the developer to use the component as normal, or hook in to control the state, or even just watch that state in order to perform an action.
With two of the biggest issues solved, the final problem to tackle was items props. After much deliberation, it was decided to remove them entirely. Vuetify regularly reuses itself in components, often containing multiple layers, ex. (sidebar contains a list, list tiles can contain icons). This led to the need to chain props down for ease of use. A lot of components were artificially inflated in order to support the dual use of slot or items.
Now with the only supported use being the slot of a component, the ability to manipulate any component at any level in the chain is like you would expect it to be. This will cause an increase to the markup that is present in your views, but will ultimately lead to an easier to control application as it grows in complexity.
Moving Forward
I would like to thank everyone who has pressed on through the constant changes and refactors. Your support is extremely important and the main reason we have spent countless hours this release something we are confident in. It is essential to me for this framework to be done right, and sometimes that means scratching out what you've done.
With that being said, this should be the last extreme API changes before release. Only component refactors and name changes should hinder your current projects. I have outlined the prospected changes in upcoming patches in the wiki.
Upgrading from v0.8.7
- Items prop is now gone from all components. Instead you will have to explicitly define the markup in the component slot. The docs have been update and now use 1 to 1 examples. What you see on the page is what is listed in the source.
- Dropdown has been renamed to Menu
- Dropdown directive removed, activator is now a slot located inside the menu
- Dropdown items should instead use
v-list
with list items - Navbar renamed to Toolbar
- Slider renamed to Carousel
- Collapsible renamed to
v-expansion-panel
- Collapsible header and body removed. Instead use
v-expansion-panel-content
- Modal directive has been removed, activator is now a slot located inside the modal
- Sidebar directive has been removed. If you need to control the state of the sidebar, use v-model.
- Tabs has been simplified,
v-tabs
,v-tab-item
andv-tab-content
. - Toolbar groups have been removed. If you need this functionality, use a Menu. Example here
- Event bus has been removed, ensure all references are removed as well
- Vuetify init function in main App mounted hook is no longer needed
New Features
- New components,
v-btn-dropdown
,v-btn-toggle
,v-app-bar
. - Menu (dropdown) has been completed refactored
- Button has been completed refactored
- Added
sidebar-under-toolbar
prop to Sidebar. This will position a fixed sidebar under the toolbar - Added disabled prop to Pagination
- ID requirements have been removed from Sidebar, Menu and Modal
- Lowered package size to 59kb (drop of 20kb)
Bug Fixes
v0.8.7
Another Large Update
With this release, the focus was on refactoring lists to meet Material Design spec, finish up the progress-linear
component, and add additional api options for the sidebar by integrating lists. Some extra effort has been put into the docs regarding lists and as time permits, I intend to flesh out other sections just as much.
Breaking Changes
In refactoring the lists, I decided to move their functionality to the sidebar. Is is technically an expansion list
and it made since to provide the additional functionality. Other components will be receiving name changes in the future, so to help with knowing some of the upcoming changes, I have updated the wiki on this repo, outlining the prospected changes coming in future releases. For more information, visit the roadmap wiki.
If you are using the items
prop, the new available options are:
{
href: 'javascript:;',
title: false,
subtitle: false,
avatar: false,
router: false,
ripple: false,
action: false,
disabled: false,
tag: false,
items: []
}
text
is now title, icon
is now avatar. By default, lists generated by an items array will generate the list tile in this order: avatar, content (title/subtitle) and action. To shift the action to the left, use the unshift
option on the sidebar.
If you were explicitly using sidebar, sidebar-items, etc, you will need to use the new list markup. For additional information, please see the lists documentation or the sidebar documentation.
Lists have been refactored and include all new semantic components, for additional information, read below or check the documentation.
New Components
- Added the
progress-linear
component. documentation - Added the
divider
component. Documentation is not complete, but available options are listed in the lists documentation - Added functional component
v-table-overflow
for tables that need overflow-x (removed overflow-x from cards)
Refactored Components
- Lists has received a complete overhaul and is now 100% within material design spec. documentation
- Sidebar now uses lists and is merely a wrapper to provide some additional functionality.
Improvements
- Changed
v-navbar-side-icon
icon to menu - Removed overflow-x from cards which was used for tables. Tables now have a special overflow wrapper, see above.
- Cleaned up checkbox styles a041437
- Sidebar now determines item active state based upon route url. This provides better performance and debugging. If you do not use vue-router to manage your routes, you will need to manually apply the active classes to items.
Bug Fixes
- Fixed bug where
v-tabs-tabs
was still using the oldv-tab
markup during auto generation. 23aa971 - #92 Fixed bug where select was not auto populating for models with values on mount. bcbf7cd
- #93 Added check for tabs length. There is still a bug with the tab locator not resizing. 2d78f56
- Fixed a bug where
v-sidebar
was not properly calling done after animation completion for groups.
v0.8.6
Large Update
Accompanying the v0.8.6 release, the documentation has received a complete overhaul. All examples now contain the specific markup used in a dropdown. The Parameters section of each component has been moved to an API section, which utilizes the recently updated v-tabs
component.
Breaking Changes
<v-tab>
is now<v-tab-item>
. This change was to make all itemable implementing components share the same name structure
New Features
- Added
<table>
styles. This is not the Material Design data table component, that is coming soon - Added styles for
<blockquote>
,<kbd>
and<var>
elements - New
v-sidebar-header
component. Can be used manually, or by adding an object to your items array. Example{ header: 'My Header' }
- You can now override the default transitions and transition-origin for components
Improvements
- All Transitions have been refactored and will now be considerably smoother
- Tabs have been refactored to meet Material Design spec
<v-navbar-item>
,<v-sidebar-item>
,<v-dropdown-item>
and<v-tab-item>
now share the same API through the<itemable>
mixin- The
<v-navbar>
has received an overhaul and now supports parent items, similar to<v-sidebar>
<v-navbar>
,<v-sidebar>
and<v-tabs-tabs>
now contain cascading properties. You can define router, ripple or group-class at any level and it will chain down- Components that use activators, i.e.
<v-sidebar>
and<v-dropdown>
can now have more than 1 bound activator - Improved
<v-tooltip>
directive styles and animation - Activator directives, i.e.
v-sidebar:sidebar
orv-dropdown:dropdown
can now be defined dynamically through the value property.v-sidebar="{ value: 'sidebar' }"
- Updated heading styles to match Material Design spec
- Updated grid and added a new xl breakpoint. This will work by adding xl{number} to the
v-col
component. Example<v-col xs12 md6 lg4 xl3></v-col>
- Changed mobile break point for
v-sidebar
to 992. Added property to change this setting on the sidebar component. - Added closed and opened events for all toggleable components, i.e.
<v-modal>
,<v-sidebar>
- Updated
<v-slider>
so that you can now have more than 1 on a page - Removed Object.assign from
<directiveConfig>
helper function to allow Safari 8 support - #71 Added collapsible open icon indicator
- #82 Added required property to
<v-text-input>
Bug Fixes
- 7b722cd Fixed bug where Material Icons were not working in psuedo elements on Edge
- 6a4446c Fixed bug where right sidebar was not properly translating
- #34 Added ability to change color
- #65 Removed on-click declaration
- #69 Changed event method for
<v-modal>
- #77 Updated misnamed stylus variable
- #80 Added explicit event emit for on blur
- #83 Fixed bug where select was not maintaining the selected values
v0.8.5
Due to some unforeseen bugs, v0.8.5 features have been moved back to v0.8.6.