Skip to content

Releases: quasarframework/quasar

v0.12.0

30 Dec 20:24
Compare
Choose a tag to compare

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:

screenshot from 2016-12-30 18 58 49

Uploading:
screenshot from 2016-12-30 19 21 47

Failure example:
screenshot from 2016-12-30 19 04 01

v0.11.0

28 Dec 00:54
Compare
Choose a tag to compare

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

14 Dec 10:22
Compare
Choose a tag to compare

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

13 Dec 17:32
Compare
Choose a tag to compare

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

11 Dec 11:47
Compare
Choose a tag to compare
  • 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

screenshot from 2016-12-07 10 31 54

  • 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

26 Nov 22:13
Compare
Choose a tag to compare

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

24 Oct 15:32
Compare
Choose a tag to compare

Fixes

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

v0.8.0 with Vue2

23 Oct 19:04
Compare
Choose a tag to compare

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"

18 Sep 12:23
Compare
Choose a tag to compare

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...

v0.6.0

23 Aug 14:03
Compare
Choose a tag to compare

Breaking Changes

  • Dropdown has been renamed to Popover which is much more appropiate for what it does.
    Simply rename <quasar-dropdown> to <quasar-popover> and read the Popover docs
  • Removed Dialog with Ranges. It turned out to not be so useful and with the new Range component it becomes not enough configurable.

New

  • Context Menu component specific for mobile (now differs from the one on a desktop)
  • "Chip" Label type
  • Chips Input Textbox component
  • Stepper component
  • Utils.uid() generates unique UID
  • #19 Include Quasar sources in npm packages so you can easily extend components
  • Added 'white' to color list - available to all components that can be colored
  • CSS class "timeline-title" added
  • CSS class "caption" for <p> tags now has top margin also

Fixes

  • #18 Dropdown (now Popover): v-on:click events inside quasar-dropdown doesn't work
  • #20 Back button on Modal should close it
  • #15 Rewritten Range to support new features:
    • "step" property
    • colored styles
    • step markers
    • "snap" property
    • "label" property
  • #26 Need a way to close thumbnails for Image Gallery
  • #25 Slider on fullscreen doesn't go away when on fullscreen
  • Enhanced Tabs reactivity