quasar 2.2.2 → 2.2.3

package/src/components/stepper/QStepper.js

@@ -1,10 +1,11 @@
-import { h, defineComponent, computed, provide, getCurrentInstance } from 'vue'
+import { h, computed, provide, getCurrentInstance } from 'vue'
 
 import StepHeader from './StepHeader.js'
 
 import useDark, { useDarkProps } from '../../composables/private/use-dark.js'
 import usePanel, { usePanelProps, usePanelEmits } from '../../composables/private/use-panel.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { stepperKey } from '../../utils/private/symbols.js'
 import { hSlot, hMergeSlot, hDir } from '../../utils/private/render.js'
 
@@ -19,7 +20,7 @@ function camelizeProps (props) {
   return acc
 }
 
-export default defineComponent({
+export default createComponent({
   name: 'QStepper',
 
   props: {

package/src/components/stepper/QStepperNavigation.js

@@ -1,8 +1,9 @@
-import { h, defineComponent } from 'vue'
+import { h } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QStepperNavigation',
 
   setup (_, { slots }) {

package/src/components/stepper/StepHeader.js

@@ -1,9 +1,11 @@
-import { h, defineComponent, ref, computed, withDirectives, getCurrentInstance } from 'vue'
+import { h, ref, computed, withDirectives, getCurrentInstance } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
 import Ripple from '../../directives/Ripple.js'
 
-export default defineComponent({
+import { createComponent } from '../../utils/private/create.js'
+
+export default createComponent({
   name: 'StepHeader',
 
   props: {

package/src/components/tab-panels/QTabPanel.js

@@ -1,9 +1,11 @@
-import { h, defineComponent } from 'vue'
+import { h } from 'vue'
 
 import { usePanelChildProps } from '../../composables/private/use-panel.js'
+
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTabPanel',
 
   props: usePanelChildProps,

package/src/components/tab-panels/QTabPanels.js

@@ -1,11 +1,12 @@
-import { defineComponent, computed, getCurrentInstance } from 'vue'
+import { computed, getCurrentInstance } from 'vue'
 
 import useDark, { useDarkProps } from '../../composables/private/use-dark.js'
 import usePanel, { usePanelProps, usePanelEmits } from '../../composables/private/use-panel.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hDir } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTabPanels',
 
   props: {

package/src/components/table/QTable.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, ref, computed, watch, getCurrentInstance } from 'vue'
+import { h, ref, computed, watch, getCurrentInstance } from 'vue'
 
 import QTh from './QTh.js'
 
@@ -23,12 +23,14 @@ import { useTableRowSelection, useTableRowSelectionProps, useTableRowSelectionEm
 import { useTableRowExpand, useTableRowExpandProps, useTableRowExpandEmits } from './table-row-expand.js'
 import { useTableColumnSelection, useTableColumnSelectionProps } from './table-column-selection.js'
 
+import { createComponent } from '../../utils/private/create.js'
+
 const bottomClass = 'q-table__bottom row items-center'
 
 const commonVirtPropsObj = {}
 commonVirtPropsList.forEach(p => { commonVirtPropsObj[ p ] = {} })
 
-export default defineComponent({
+export default createComponent({
   name: 'QTable',
 
   props: {

package/src/components/table/QTd.js

@@ -1,8 +1,9 @@
-import { h, defineComponent, computed, getCurrentInstance } from 'vue'
+import { h, computed, getCurrentInstance } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTd',
 
   props: {

package/src/components/table/QTh.js

@@ -1,10 +1,11 @@
-import { h, defineComponent, getCurrentInstance } from 'vue'
+import { h, getCurrentInstance } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot, hUniqueSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTh',
 
   props: {

package/src/components/table/QTr.js

@@ -1,8 +1,9 @@
-import { h, defineComponent, computed } from 'vue'
+import { h, computed } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTr',
 
   props: {

package/src/components/tabs/QRouteTab.js

@@ -1,9 +1,11 @@
-import { defineComponent, computed, watch } from 'vue'
+import { computed, watch } from 'vue'
 
 import useRouterLink, { useRouterLinkProps } from '../../composables/private/use-router-link.js'
 import useTab, { useTabProps, useTabEmits } from './use-tab.js'
 
-export default defineComponent({
+import { createComponent } from '../../utils/private/create.js'
+
+export default createComponent({
   name: 'QRouteTab',
 
   props: {

package/src/components/tabs/QTab.js

@@ -1,8 +1,8 @@
-import { defineComponent } from 'vue'
-
 import useTab, { useTabProps, useTabEmits } from './use-tab.js'
 
-export default defineComponent({
+import { createComponent } from '../../utils/private/create.js'
+
+export default createComponent({
   name: 'QTab',
 
   props: useTabProps,

package/src/components/tabs/QTabs.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, ref, computed, watch, nextTick, onBeforeUnmount, onActivated, getCurrentInstance, provide } from 'vue'
+import { h, ref, computed, watch, nextTick, onBeforeUnmount, onActivated, getCurrentInstance, provide } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
 import QResizeObserver from '../resize-observer/QResizeObserver.js'
@@ -6,6 +6,7 @@ import QResizeObserver from '../resize-observer/QResizeObserver.js'
 import useTick from '../../composables/private/use-tick.js'
 import useTimeout from '../../composables/private/use-timeout.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { noop } from '../../utils/event.js'
 import { hSlot } from '../../utils/private/render.js'
 import { tabsKey } from '../../utils/private/symbols.js'
@@ -22,7 +23,7 @@ function getIndicatorClass (color, top, vertical) {
 const alignValues = [ 'left', 'center', 'right', 'justify' ]
 const emptyFn = () => {}
 
-export default defineComponent({
+export default createComponent({
   name: 'QTabs',
 
   props: {

package/src/components/time/QTime.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, ref, computed, watch, withDirectives, Transition, nextTick, getCurrentInstance } from 'vue'
+import { h, ref, computed, watch, withDirectives, Transition, nextTick, getCurrentInstance } from 'vue'
 
 import QBtn from '../btn/QBtn.js'
 import TouchPan from '../../directives/TouchPan.js'
@@ -7,6 +7,7 @@ import useDark, { useDarkProps } from '../../composables/private/use-dark.js'
 import { useFormProps, useFormAttrs, useFormInject } from '../../composables/private/use-form.js'
 import useDatetime, { useDatetimeProps, useDatetimeEmits, getDayHash } from '../date/use-datetime.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 import { formatDate, __splitDate } from '../../utils/date.js'
 import { position } from '../../utils/event.js'
@@ -36,7 +37,7 @@ function getCurrentTime () {
   }
 }
 
-export default defineComponent({
+export default createComponent({
   name: 'QTime',
 
   props: {

package/src/components/timeline/QTimeline.js

@@ -1,11 +1,12 @@
-import { h, defineComponent, computed, provide, getCurrentInstance } from 'vue'
+import { h, computed, provide, getCurrentInstance } from 'vue'
 
 import useDark, { useDarkProps } from '../../composables/private/use-dark.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 import { timelineKey } from '../../utils/private/symbols.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTimeline',
 
   props: {

package/src/components/timeline/QTimelineEntry.js

@@ -1,11 +1,12 @@
-import { h, defineComponent, computed, inject } from 'vue'
+import { h, computed, inject } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot, hUniqueSlot } from '../../utils/private/render.js'
 import { timelineKey } from '../../utils/private/symbols.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTimelineEntry',
 
   props: {

package/src/components/toggle/QToggle.js

@@ -1,9 +1,12 @@
-import { h, defineComponent, computed } from 'vue'
+import { h, computed } from 'vue'
 
 import QIcon from '../icon/QIcon.js'
+
 import useCheckbox, { useCheckboxProps, useCheckboxEmits } from '../checkbox/use-checkbox.js'
 
-export default defineComponent({
+import { createComponent } from '../../utils/private/create.js'
+
+export default createComponent({
   name: 'QToggle',
 
   props: {

package/src/components/toolbar/QToolbar.js

@@ -1,8 +1,9 @@
-import { h, defineComponent, computed } from 'vue'
+import { h, computed } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QToolbar',
 
   props: {

package/src/components/toolbar/QToolbarTitle.js

@@ -1,8 +1,9 @@
-import { h, defineComponent, computed } from 'vue'
+import { h, computed } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { hSlot } from '../../utils/private/render.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QToolbarTitle',
 
   props: {

package/src/components/tooltip/QTooltip.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, ref, computed, watch, onBeforeUnmount, Transition, getCurrentInstance } from 'vue'
+import { h, ref, computed, watch, onBeforeUnmount, Transition, getCurrentInstance } from 'vue'
 
 import useAnchor, { useAnchorProps } from '../../composables/private/use-anchor.js'
 import useScrollTarget from '../../composables/private/use-scroll-target.js'
@@ -8,6 +8,7 @@ import useTransition, { useTransitionProps } from '../../composables/private/use
 import useTick from '../../composables/private/use-tick.js'
 import useTimeout from '../../composables/private/use-timeout.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { getScrollTarget } from '../../utils/scroll.js'
 import { stopAndPrevent, addEvt, cleanEvt } from '../../utils/event.js'
 import { clearSelection } from '../../utils/private/selection.js'
@@ -17,7 +18,7 @@ import {
   validatePosition, validateOffset, setPosition, parsePosition
 } from '../../utils/private/position-engine.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTooltip',
 
   inheritAttrs: false,

package/src/components/tree/QTree.js

@@ -1,5 +1,5 @@
 import {
-  h, defineComponent, ref, computed, watch,
+  h, ref, computed, watch,
   withDirectives, vShow, nextTick, getCurrentInstance, onBeforeUpdate
 } from 'vue'
 
@@ -10,10 +10,11 @@ import QSpinner from '../spinner/QSpinner.js'
 
 import useDark, { useDarkProps } from '../../composables/private/use-dark.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { stopAndPrevent } from '../../utils/event.js'
 import { shouldIgnoreKey } from '../../utils/private/key-composition.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QTree',
 
   props: {

package/src/components/uploader/QUploaderAddTrigger.js

@@ -1,8 +1,9 @@
-import { defineComponent, inject } from 'vue'
+import { inject } from 'vue'
 
+import { createComponent } from '../../utils/private/create.js'
 import { uploaderKey } from '../../utils/private/symbols.js'
 
-export default defineComponent({
+export default createComponent({
   name: 'QUploaderAddTrigger',
 
   setup () {

package/src/components/video/QVideo.js

@@ -1,8 +1,10 @@
-import { h, defineComponent, computed } from 'vue'
+import { h, computed } from 'vue'
 
 import useRatio, { useRatioProps } from '../../composables/private/use-ratio.js'
 
-export default defineComponent({
+import { createComponent } from '../../utils/private/create.js'
+
+export default createComponent({
   name: 'QVideo',
 
   props: {

package/src/components/virtual-scroll/QVirtualScroll.js

@@ -1,4 +1,4 @@
-import { h, defineComponent, ref, computed, watch, onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
+import { h, ref, computed, watch, onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
 
 import QList from '../item/QList.js'
 import QMarkupTable from '../markup-table/QMarkupTable.js'
@@ -6,6 +6,7 @@ import getTableMiddle from '../table/get-table-middle.js'
 
 import { useVirtualScroll, useVirtualScrollProps } from './use-virtual-scroll.js'
 
+import { createComponent } from '../../utils/private/create.js'
 import { getScrollTarget } from '../../utils/scroll.js'
 import { listenOpts } from '../../utils/event.js'
 import { hMergeSlot } from '../../utils/private/render.js'
@@ -17,7 +18,7 @@ const comps = {
 
 const typeOptions = [ 'list', 'table', '__qtable' ]
 
-export default defineComponent({
+export default createComponent({
   name: 'QVirtualScroll',
 
   props: {

package/src/css/normalize.sass

@@ -160,13 +160,6 @@ progress
 textarea
   overflow: auto
 
-/*
- * Correct the odd appearance of search inputs in Chrome and Safari.
- */
-
-input[type='search']
-  -webkit-appearance: textfield
-
 /*
  * Remove the inner padding and cancel buttons in Chrome on OS X and
  * Safari on OS X.

package/src/directives/ClosePopup.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import { closePortals, getPortalVm } from '../utils/private/portal.js'
 import { isKeyCode } from '../utils/private/key-composition.js'
 import getSSRProps from '../utils/private/noop-ssr-directive-transform.js'
@@ -21,7 +22,7 @@ function getDepth (value) {
   return isNaN(depth) ? 0 : depth
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'close-popup', getSSRProps }
   : {
       name: 'close-popup',
@@ -64,3 +65,4 @@ export default __QUASAR_SSR_SERVER__
         delete el.__qclosepopup
       }
     }
+)

package/src/directives/Intersection.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import { isDeepEqual } from '../utils/private/is.js'
 import getSSRProps from '../utils/private/noop-ssr-directive-transform.js'
 
@@ -66,7 +67,7 @@ function destroy (el) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'intersection', getSSRProps }
   : {
       name: 'intersection',
@@ -88,3 +89,4 @@ export default __QUASAR_SSR_SERVER__
 
       beforeUnmount: destroy
     }
+)

package/src/directives/Morph.js

@@ -1,4 +1,6 @@
+import { createDirective } from '../utils/private/create.js'
 import morph from '../utils/morph.js'
+
 import getSSRProps from './Morph.ssr.js'
 
 const morphGroups = {}
@@ -161,7 +163,7 @@ function updateValue (ctx, value) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'morph', getSSRProps }
   : {
       name: 'morph',
@@ -209,3 +211,4 @@ export default __QUASAR_SSR_SERVER__
         delete el.__qmorph
       }
     }
+)

package/src/directives/Mutation.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import getSSRProps from '../utils/private/noop-ssr-directive-transform.js'
 
 const defaultCfg = {
@@ -34,7 +35,7 @@ function destroy (el) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'mutation', getSSRProps }
   : {
       name: 'mutation',
@@ -61,3 +62,4 @@ export default __QUASAR_SSR_SERVER__
 
       beforeUnmount: destroy
     }
+)

package/src/directives/Ripple.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import { css } from '../utils/dom.js'
 import { position, stop, addEvt, cleanEvt } from '../utils/event.js'
 import { isKeyCode } from '../utils/private/key-composition.js'
@@ -71,7 +72,7 @@ function updateModifiers (ctx, { modifiers, value, arg, instance }) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'ripple', getSSRProps }
   : {
       name: 'ripple',
@@ -139,3 +140,4 @@ export default __QUASAR_SSR_SERVER__
         delete el._qripple
       }
     }
+)

package/src/directives/Scroll.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import { getScrollTarget, getVerticalScrollPosition, getHorizontalScrollPosition } from '../utils/scroll.js'
 import { listenOpts } from '../utils/event.js'
 import getSSRProps from '../utils/private/noop-ssr-directive-transform.js'
@@ -14,7 +15,7 @@ function update (ctx, { value, oldValue }) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'scroll', getSSRProps }
   : {
       name: 'scroll',
@@ -47,3 +48,4 @@ export default __QUASAR_SSR_SERVER__
         delete el.__qscroll
       }
     }
+)

package/src/directives/ScrollFire.js

@@ -1,3 +1,4 @@
+import { createDirective } from '../utils/private/create.js'
 import debounce from '../utils/debounce.js'
 import { height, offset } from '../utils/dom.js'
 import { getScrollTarget } from '../utils/scroll.js'
@@ -19,7 +20,7 @@ function update (ctx, { value, oldValue }) {
   }
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'scroll-fire', getSSRProps }
   : {
       name: 'scroll-fire',
@@ -63,3 +64,4 @@ export default __QUASAR_SSR_SERVER__
         delete el.__qscrollfire
       }
     }
+)

package/src/directives/TouchHold.js

@@ -1,9 +1,11 @@
 import { client } from '../plugins/Platform.js'
+
+import { createDirective } from '../utils/private/create.js'
 import { addEvt, cleanEvt, position, leftClick, stopAndPrevent, noop } from '../utils/event.js'
 import { clearSelection } from '../utils/private/selection.js'
 import getSSRProps from '../utils/private/noop-ssr-directive-transform.js'
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'touch-hold', getSSRProps }
   : {
       name: 'touch-hold',
@@ -157,3 +159,4 @@ export default __QUASAR_SSR_SERVER__
         }
       }
     }
+)

package/src/directives/TouchPan.js

@@ -1,4 +1,6 @@
 import { client } from '../plugins/Platform.js'
+
+import { createDirective } from '../utils/private/create.js'
 import { getModifierDirections, shouldStart } from '../utils/private/touch.js'
 import { addEvt, cleanEvt, position, leftClick, prevent, stop, stopAndPrevent, preventDraggable, noop } from '../utils/event.js'
 import { clearSelection } from '../utils/private/selection.js'
@@ -117,7 +119,7 @@ function getChanges (evt, ctx, isFinal) {
 
 let uid = 0
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'touch-pan', getSSRProps }
   : {
       name: 'touch-pan',
@@ -422,3 +424,4 @@ export default __QUASAR_SSR_SERVER__
         }
       }
     }
+)

package/src/directives/TouchRepeat.js

@@ -1,4 +1,6 @@
 import { client } from '../plugins/Platform.js'
+
+import { createDirective } from '../utils/private/create.js'
 import { addEvt, cleanEvt, position, leftClick, stopAndPrevent, noop } from '../utils/event.js'
 import { clearSelection } from '../utils/private/selection.js'
 import { isKeyCode } from '../utils/private/key-composition.js'
@@ -25,7 +27,7 @@ function shouldEnd (evt, origin) {
     || Math.abs(top - origin.top) >= 7
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'touch-repeat', getSSRProps }
   : {
       name: 'touch-repeat',
@@ -239,3 +241,4 @@ export default __QUASAR_SSR_SERVER__
         }
       }
     }
+)

package/src/directives/TouchSwipe.js

@@ -1,4 +1,6 @@
 import { client } from '../plugins/Platform.js'
+
+import { createDirective } from '../utils/private/create.js'
 import { getModifierDirections, shouldStart } from '../utils/private/touch.js'
 import { addEvt, cleanEvt, position, leftClick, stopAndPrevent, preventDraggable, noop } from '../utils/event.js'
 import { clearSelection } from '../utils/private/selection.js'
@@ -20,7 +22,7 @@ function parseArg (arg) {
   return data
 }
 
-export default __QUASAR_SSR_SERVER__
+export default createDirective(__QUASAR_SSR_SERVER__
   ? { name: 'touch-swipe', getSSRProps }
   : {
       name: 'touch-swipe',
@@ -263,3 +265,4 @@ export default __QUASAR_SSR_SERVER__
         }
       }
     }
+)

package/src/plugins/Notify.js

@@ -1,10 +1,11 @@
-import { h, defineComponent, ref, markRaw, TransitionGroup } from 'vue'
+import { h, ref, markRaw, TransitionGroup } from 'vue'
 
 import QAvatar from '../components/avatar/QAvatar.js'
 import QIcon from '../components/icon/QIcon.js'
 import QBtn from '../components/btn/QBtn.js'
 import QSpinner from '../components/spinner/QSpinner.js'
 
+import { createComponent } from '../utils/private/create.js'
 import { noop } from '../utils/event.js'
 import { createGlobalNode } from '../utils/private/global-nodes.js'
 import { createChildApp } from '../install-quasar.js'
@@ -62,9 +63,9 @@ function logError (error, config) {
 }
 
 function getComponent ($q) {
-  return defineComponent({
+  return createComponent({
     name: 'QNotifications',
-    
+
     // hide App from Vue devtools
     devtools: { hide: true },