v0.13.0

Removed Velocity as a dependency. As a result your app bundle will be smaller with 44KB, which is a nice improvement. If you are using within your app you need to require/import it yourself.

New

• Tooltip offset prop
• Modal
  • Option for positioning on edges
  • Add toggle() method
  • Do nothing when closing already closed Modal
• Image Gallery Slider - new method "goToSlide(index)"
• Progress component now has optional buffering too
• Disabled Drawer open by swipe on iOS platform (not theme) because it interferes with Safari's page back/forward swipe feature
• DataTable:
  • #296 ability to hide header
  • Cell format() now receives the row as second parameter
• Knob new prop readonly
• DatetimeRange supports full-width CSS class
• Input Datetime now supports 'default-selection' prop
• Stepper:
  • #307 Allow action to take place before jumping to next step (thanks to @zh012 )
  • New 'step' event (thanks to @fsgiudice )
  • Coloring and step icon
• Toast:
  • on large screen does not has a minimum width anymore
  • ability to call Toasts before DOM is ready
  • improved fault tolerance over setDefaults() method
• Ability for Collapsibles to act as Accordion (opening one closes the others in the group)
• Autocomplete has new event: "selected" when a suggestion is selected (thanks to @wilcorrea )
• Accessibility
  • For some Form components
  • For Dialog, Action Sheet & Buttons
    • Highlight focus state
    • Dialog should focus on first input or last button when it gets displayed
    • Be able to navigate with TAB key between inputs/buttons
• #329 Ability to set Drawer backdrop opacity
• Popover new "fit" prop - sets min-width on Popover same as width of container
• Improvements for Rating component
• Utils.animate()
• Smoother q-transition slide animations

Performance

• Removed usage of Velocity for Drawer & slightly improved its performance
• Removed usage of Velocity for Slider component
• Slight improvement on execution speed for q-transition

Fixes

• #316 [ios] Not detecting Cordova correctly
• #340 Datetime with min/max - can't set date after reaching one limit and hitting previous/next month
• #313 Modal overlay / scroll issue on iOS
• #343 Clicking a modal close button multiple times quickly will send you back a page
• #300 Datetime input does not auto updates when min/max changes
• #303 Drawer should be hidden on small AND MEDIUM
• #317 [firefox] Numeric component has browser validation error if not specifying step="any" (thanks to @Vaerum )
• #332 DialogSelect component errors out with Number as option value
• #333 q-numeric with undefined v-model shows 1
• #344 [cordova] Drawer closes when keyboard appears due to resize event
• Scroll Layout content to top on Modal open
• Various Layout toolbar fixes (including one from @blvz )
• #273 [vue-devtools] QSelect - _this.model.includes is not a function
• #214 Card component flashes (blinking)
• #350 Range Component does not allow vertical scrolling if touch event starts on it
• #347 Range Component remains active if dragging mouse pointer out of window
• #352 [chrome] On certain scenarios, first Tooltip or Popover that gets opened is opened in a slightly wrong position
• #353 [ios] Non fixed/absolute positioned FABs show wrong positioned overlay
• #355 Popovers & Tooltips need position update on window resize
• #356 [ios] Tooltips don't show up

Deprecations

State component has been deprecated and will be removed soon. Use simple Vue v-if directive instead.

v0.12.0

Minor Breaking Changes

• #281 Datatable - Allow global search without tapping/clicking the filter icon
  • config.filter has been removed.
  • Instead, use filter: true for each column (in the column definition) to allow DataTable to make the column filterable.

New

• File Upload component (thanks to @murbanowicz for starting this; see screenshots at the bottom)
• Datetime Range component
• Internationalization is now ready (through props that can replace current default labels)
• CSS class animate-bounce
• v-back-to-top Vue directive
• #232 Dialog - Prevent close
• Utils.dom.setScrollPosition (scrollTargetElement, offset[, duration])
• Utils.format.humanSize (size) - turns numbers in kB, MB etc

Fixes

• #286 Unable to remove cookies using Cookies.remove()
• #284 Hardcoded english in DataTable
• #287 Drawer - Bug on Open
• #253 Pull To refresh scroll not smoothly on ios
• #290 [ios] Numeric component value partially hidden (thanks to @caex )
• #289 Tabs "route" prop should support Object too (besides a String)
• #291 v-scroll directive fails to update correctly when parameters change

File Uploader component

Some screenshots with the new component:

Uploading:

Failure example:

v0.11.0

New

• Compatibility with Vue 2.1.7+ (there was a second recent breaking change introduced in Vue 2.1.7).
• Autocomplete component
• Select with List Items
• ListItem component
• #257 Being able to use Google Fonts CDN
• #203 CSS class for Tabs to justify align on desktop too (justified)
• #224 Dialog - styling buttons
• #260 DataTable: Enhanced sorting capabilities
• DataTable filter selectbox now uses the new "list" type instead of "radio"
• offset-0 CSS class (for Grid Layout)
• Utils.dom.cssTransform(transformValue)
• Two more platform visibility CSS classes: platform-android-*, platform-ios-*. Examples: platform-android-only, platform-ios-hide -- do not mistake them with theme visibility CSS classes (ios-only, android-hide etc).
• Utils.filter()

Fixes

• #285 close dialog doesn't work in electron
• Slider fullscreen on Electron
• Firefox - Hide the numeric spinner (thanks to @maced0n)
• DataTable sorting for columns with numbers
• DataTable error when no data is available and there are no messages specified (thanks to @tant42)
• #220 [ios] Search Bar Icon
• #264 [ios] Search component input text slightly misaligned
• #269 Datatable bodyStyle for narrow screens
• #217 [ios] Insufficient margin in the Drawer header
• #261 q-numeric with 0.1 step lacks rounding
• #187 [ios] Delay in tabs
• #213 Button type FAB does not float on iOS
• Array.prototype.find() polyfill for IE compatibility

v0.10.3 - Repackaged v0.10.2

Repackaged v0.10.2 to workaround a problem with rollup-plugin-vue compiler and Vue 2.1.5+.
Please use Quasar v0.10.3 with Vue >= 2.1.6

Upgrade to v0.10.3 if you stumble on "_h is not defined" or "_c is not defined" issues.

v0.10.2

Enhancements & fixes

• #242 DataTable - Class/Style formatters similar to value formatter
• #243 DataTable - Firefox issue
• #246 DataTable - Adding/removing columns to/from array doesn't update table
• #247 DataTable - mouse wheel scroll not working on Firefox
• Support for password in a Dialog (thanks to @livioalves)
• Removed max-width for "layout-padding" CSS class

v0.10 - DataTable comes along

• DataTable component (replacing old Grid component from Quasar <= 0.7)
  • Sticky columns
  • Sticky headers
  • Filter (by all columns or by one column)
  • Sorting by columns
  • Cell formatter methods
  • Cell component renderer (through Vue scoped slots)
  • Pagination
  • Column picker
  • Row selection (single or multiple)
  • Responsive (changes view design when width is smaller than 600px to best accommodate small screens)
  • Refresh functionality

• Ajax loading bar (like Youtube)
  • Intercepts Ajax calls regardless of Ajax library you're using.
  • Positioning on top, bottom, right or left
  • Direction support (default or reverse) for all 4 positions
  • Delays showing up with 1s (no reason to bother for calls that take less than 1 second)
  • Custom color support
• Select & Datetime
  • static-label prop
  • labels are rendered as HTML code instead of a simple String

v0.9.1

Behold Quasar v0.9.1 is here. Along stable releases of Webpack2 app template/boilerplate and Electron wrapper.

Breaking Changes

• #164 Smaller component prefix ("q-" instead of "quasar-") for both JS and CSS
  Some examples: instead of <quasar-checkbox> use <q-checkbox>; instead of <quasar-modal> use <q-modal>. Simply make a project-wide replace of 'quasar-' to 'q-' then replace 'q-framework' to 'quasar-framework'.
• Popovers - check documentation
  • no longer require anchor-ref prop. Simply place them under the DOM node / component that you wish to trigger it.
  • anchor-origin & target-origin have been renamed to anchor and self and now take string params instead of objects for convenience
• Drawer links component (q-drawer-link former known as quasar-drawer-link) now has to prop working just as v-link. So it encapsulates exact modifier as a property of the Object.
  Example: <q-drawer-link :to="{path: '/account', exact: true}">...</q-drawer-link>
• Removed $text-color and $background Stylus variables (not required and they stand in the way in some scenarios)
• #173 Center content for "layout-padding" on large windows (thanks to @murbanowicz )
• #212 Removed Textarea default height

New Features

• Dialog has new props:
  • (Boolean) noBackdropDismiss
  • (Boolean) noEscDismiss
  • (Function) onDismiss - function gets called when Dialog is dismissed or closed; good for cleaning up
• Form components with readonly and error state (readonly DOM node attribute and has-error CSS class)
• Range option to always display label (labelAlways prop)
• Tooltip component (replacing v-tooltip directive) - documentation
• Datetime
  • ability to clear selected date
  • placeholder and (floating) label props
  • min & max props
  • allows empty string binded value on render
  • performance improvements
• Modal
  • noBackdropDismiss & noEscDismiss props which disable the ability to close Modal with Escape key or by clicking on the backdrop (thanks @ccoxtn )
• Quasar transition component (former quasar-transition now q-transition)
  • new prop: appear which when used it applies the transition to the initial render of the node too
• v-link directive
  • now supports delay modifier which delays the trigger of the new route for 100ms
  • applies router-link-active CSS class
• v-touch-pan directive has new scroll modifier to also allow scroll
• Improved HTML table element CSS - check documentation
  • horizontal-delimiter and vertical-delimiter classes
  • striped-odd and striped-even classes
  • loose along compact classes
  • Flipped mode (through flipped class) - table header as column on left, rows as columns
  • Responsive mode (through responsive class) - good for narrow screens, check it out
• Double Range new features: drag by range & disable min or max (thanks to @CookieJon ) - check documentation
• #158 Datetime & Selectbox now use a floating label
• Detection if running under Electron
  • new visibility CSS classes: electron-only and electron-hide
  • new Platform.is prop when on Electron: Platform.is.electron
• Collapsible new prop 'icon-toggle` which allows user to toggle open/close state by clicking/tapping only on the Collapsible icon on the right
• quote CSS class
• No longer required to explicitly set theme (with Quasar.theme.set()) before installing to Vue.
• New Utils:
  • scrollbar.width() - determines scrollbar width in pixels
  • colors.rgbToHex() and colors.hexToRgb()

Fixes

• #227 Dialog/ActionSheet are not destroyed in some situations (thanks to @llops )
• #208 Action Sheet Dismiss by backdrop or Escape key should trigger cancel handler
• #153 Drawer links now work with VueRouter "history" mode
• #166 Pull To refresh not allowing scroll
• #168 "error" icon for negative Toast instead of "whatshot"
• Search component
  • allow user to focus field on left side too
  • #178 iOS component alignment
• Drawer's drawer-closer CSS class now stops event propagation to avoid some side-effects
• #205 Touch directive error on unbind (thanks to @joaopaulofilho )

v0.8.2 / v0.8.3

Fixes

• Datetime not taking initial value correctly #138
• Mobile address bar coloring: fixed typo for Windows phones (ffd07a7)

v0.8.0 with Vue2

Quasar is now powered by Vue 2.
Use CLI to generate a new project folder and port your app to Quasar v0.8.0 and Vue 2.

New

• All form components (and not only) now support v-model instead of :model.sync. Please be careful with porting Radio components: they now support v-model and val (instead of value) prop.
• Touch directives: v-swipe, v-pan, v-hold
• Automatic coloring of mobile browser address bar (thanks to @vuchl )
• New CSS animation classes: animate-pop, animate-scale, animate-fade

Changes

• Removed vue-touch and Hammerjs as dependencies. Also Velocity UI Pack. Slimmer builds!
• spin and blink CSS classes were renamed to animate-spin and animate-blink
• ActionSheet.create() does not require also calling show() on it; "buttons" property was split into "actions" and "dismiss"
• Dialog was completely redone. One of the important changes: you can mix form components now. Added Rating, Chips, Textareas, Numeric as possible form components you can use.
• Modal is now only a component. No more global "Modal.create()"
• Customizable Loading; it also fades in when it gets displayed now
• Tabs have been completely redone due to Vue2 and they have lots of improvements.
• New Datetime methods that can be used with a Vue reference (open(), close()).. check documentation
• Numeric component now opens the numeric keyboard; removed "debounce" property (no longer needed due to a new button contained by the component)
• Collapsibles' props and methods have changed
• Floating action buttons have new properties and methods. Check documentation.
• Infinite Scroll: removed "working" property as it is no longer needed.
• Stepper: removed "redraw()" method (not needed anymore)
• New transition component (<quasar-transition name="slide">) replacing transition="slide" attribute-value
• Popover was completely redone with lots of new features!
• Updates for Drawer (including <quasar-drawer-link> component!)
• Some internationalization work for Datetime
• Events rebuilt around a Vue bus

Fixes

• Various Range fixes
• Utils.debounce() now works with functions receiving parameters
• Error on Cookies.get() function #133

Removed

• Temporarily, Grid component (not Grid CSS) has been removed. Will get reinstated in a few weeks.
• Removed Utils.dom.childOf(). You can use native DOMElement.contains(node).
• Removed v-attr directive (no longer needed)
• Removed left-drawer-opener and right-drawer-opener CSS classes. Check Drawer to see updates
• v-tooltip no longer supports "wrap" modifier. You can however wrap that element yourself.

Regards to @kristianmandrup for his help on this Vue 2 port.

v0.7.0 a.k.a "Polished"

Upgrade to v0.7 Guide

• npm install --save moment
• In your src/app.js file, make sure you have Quasar.theme.set(__THEME) called BEFORE Vue.use(Quasar)

Breaking Changes

• Reworked Lists. Have a good read and update your App's code to the new specs. Total rewrite.
• Reworked HTML table class classes. You now have to add quasar-table CSS classname to a table. Revisit class list.
• Tabs disabled property was changed to disable for consistency with new disabled state for all Form components
• Reworked Select to use Popovers (instead of Dialogs) and added Dialog Select which uses Dialogs. Revisit pages to learn about the changes.
• Removed Keycodes
• Toast total rework. Toasts are now displayed one at a time, but you can build up a queue of them. Highly configurable. Most of the API is still the same, but reworked everything under the covers. You may want to check doc to ensure you're using right.

New

• Improvements on almost all components
• Datetime picker, both Inline and as Input. Each theme has its own component (specific to the respective theme) wrapped within same functionality.
• Double Range
• Knob component
• Progress Button component (buttons with animated progress bars)
• Directive v-go-back
• New Modal methods
• Inline Modal. Write Modal template directly inside your Page's template and access its "data" scope!
• Input textboxes with Stackable and Floating labels are not bound to Lists anymore. You can use them outside of lists too!
• Chips Textboxes placeholder property
• Infinite Scroll functionality (many new methods)
• Smoother Parallax effect. Also new `speed' property (Float 0 to 1 values)
• Disable state for all Form components (and not only!) using disable Boolean property
• New properties for Search component: icon and placeholder
• Ability to disable Pull to Refresh functionality
• Smarter Popover with new functionality.
• New Stepper methods to better control it. Also polished the design.
• Chat coloring bubbles
• Image Gallery Slider now closes Thumbnail view if click/tap outside of it
• Utils.throttle() method
• Utils.dom new methods: childOf(), getScrollTarget(), getScrollPosition()
• Drawer new methods. Also see this request
• ActionSheet, Dialog, Modal, Popover, ... can now be closed by "Escape" key on desktop: #60

Fixes

• Window width related CSS classes doesn't work for some components: #48
• Quasar-select are not useable in drawers: #53
• [ios] Changing route with Drawer opened does not cleans up app container position: #65
• Alignment of breadcrumb arrows: #44
• Many many other fixes...