quasar 2.15.0 → 2.15.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (523) hide show
  1. package/dist/api/AddressbarColor.json +1 -1
  2. package/dist/api/BottomSheet.json +1 -1
  3. package/dist/api/ClosePopup.json +1 -1
  4. package/dist/api/Cookies.json +1 -1
  5. package/dist/api/Dark.json +1 -1
  6. package/dist/api/Dialog.json +1 -1
  7. package/dist/api/Intersection.json +1 -1
  8. package/dist/api/Loading.json +1 -1
  9. package/dist/api/LoadingBar.json +1 -1
  10. package/dist/api/LocalStorage.json +1 -1
  11. package/dist/api/Morph.json +1 -1
  12. package/dist/api/Mutation.json +1 -1
  13. package/dist/api/Notify.json +1 -1
  14. package/dist/api/Platform.json +1 -1
  15. package/dist/api/QAjaxBar.json +1 -1
  16. package/dist/api/QAvatar.json +1 -1
  17. package/dist/api/QBadge.json +1 -1
  18. package/dist/api/QBanner.json +1 -1
  19. package/dist/api/QBar.json +1 -1
  20. package/dist/api/QBreadcrumbs.json +1 -1
  21. package/dist/api/QBreadcrumbsEl.json +1 -1
  22. package/dist/api/QBtn.json +1 -1
  23. package/dist/api/QBtnDropdown.json +1 -1
  24. package/dist/api/QBtnToggle.json +1 -1
  25. package/dist/api/QCard.json +1 -1
  26. package/dist/api/QCardActions.json +1 -1
  27. package/dist/api/QCardSection.json +1 -1
  28. package/dist/api/QCarousel.json +1 -1
  29. package/dist/api/QCarouselControl.json +1 -1
  30. package/dist/api/QCarouselSlide.json +1 -1
  31. package/dist/api/QChatMessage.json +1 -1
  32. package/dist/api/QCheckbox.json +1 -1
  33. package/dist/api/QChip.json +1 -1
  34. package/dist/api/QCircularProgress.json +1 -1
  35. package/dist/api/QColor.json +1 -1
  36. package/dist/api/QDate.json +1 -1
  37. package/dist/api/QDialog.json +1 -1
  38. package/dist/api/QDrawer.json +1 -1
  39. package/dist/api/QEditor.json +1 -1
  40. package/dist/api/QExpansionItem.json +1 -1
  41. package/dist/api/QFab.json +1 -1
  42. package/dist/api/QFabAction.json +1 -1
  43. package/dist/api/QField.json +1 -1
  44. package/dist/api/QFile.json +1 -1
  45. package/dist/api/QFooter.json +1 -1
  46. package/dist/api/QHeader.json +1 -1
  47. package/dist/api/QIcon.json +1 -1
  48. package/dist/api/QImg.json +1 -1
  49. package/dist/api/QInfiniteScroll.json +1 -1
  50. package/dist/api/QInnerLoading.json +1 -1
  51. package/dist/api/QInput.json +1 -1
  52. package/dist/api/QIntersection.json +1 -1
  53. package/dist/api/QItem.json +1 -1
  54. package/dist/api/QKnob.json +1 -1
  55. package/dist/api/QLayout.json +1 -1
  56. package/dist/api/QLinearProgress.json +1 -1
  57. package/dist/api/QList.json +1 -1
  58. package/dist/api/QMarkupTable.json +1 -1
  59. package/dist/api/QMenu.json +1 -1
  60. package/dist/api/QNoSsr.json +1 -1
  61. package/dist/api/QOptionGroup.json +1 -1
  62. package/dist/api/QPage.json +1 -1
  63. package/dist/api/QPageScroller.json +1 -1
  64. package/dist/api/QPageSticky.json +1 -1
  65. package/dist/api/QPagination.json +1 -1
  66. package/dist/api/QParallax.json +1 -1
  67. package/dist/api/QPopupEdit.json +1 -1
  68. package/dist/api/QPopupProxy.json +1 -1
  69. package/dist/api/QPullToRefresh.json +1 -1
  70. package/dist/api/QRadio.json +1 -1
  71. package/dist/api/QRange.json +1 -1
  72. package/dist/api/QRating.json +1 -1
  73. package/dist/api/QResizeObserver.json +1 -1
  74. package/dist/api/QResponsive.json +1 -1
  75. package/dist/api/QRouteTab.json +1 -1
  76. package/dist/api/QScrollArea.json +1 -1
  77. package/dist/api/QScrollObserver.json +1 -1
  78. package/dist/api/QSelect.json +1 -1
  79. package/dist/api/QSeparator.json +1 -1
  80. package/dist/api/QSkeleton.json +1 -1
  81. package/dist/api/QSlideItem.json +1 -1
  82. package/dist/api/QSlideTransition.json +1 -1
  83. package/dist/api/QSlider.json +1 -1
  84. package/dist/api/QSpinner.json +1 -1
  85. package/dist/api/QSpinnerAudio.json +1 -1
  86. package/dist/api/QSpinnerBall.json +1 -1
  87. package/dist/api/QSpinnerBars.json +1 -1
  88. package/dist/api/QSpinnerBox.json +1 -1
  89. package/dist/api/QSpinnerClock.json +1 -1
  90. package/dist/api/QSpinnerComment.json +1 -1
  91. package/dist/api/QSpinnerCube.json +1 -1
  92. package/dist/api/QSpinnerDots.json +1 -1
  93. package/dist/api/QSpinnerFacebook.json +1 -1
  94. package/dist/api/QSpinnerGears.json +1 -1
  95. package/dist/api/QSpinnerGrid.json +1 -1
  96. package/dist/api/QSpinnerHearts.json +1 -1
  97. package/dist/api/QSpinnerHourglass.json +1 -1
  98. package/dist/api/QSpinnerInfinity.json +1 -1
  99. package/dist/api/QSpinnerIos.json +1 -1
  100. package/dist/api/QSpinnerOrbit.json +1 -1
  101. package/dist/api/QSpinnerOval.json +1 -1
  102. package/dist/api/QSpinnerPie.json +1 -1
  103. package/dist/api/QSpinnerPuff.json +1 -1
  104. package/dist/api/QSpinnerRadio.json +1 -1
  105. package/dist/api/QSpinnerRings.json +1 -1
  106. package/dist/api/QSpinnerTail.json +1 -1
  107. package/dist/api/QSplitter.json +1 -1
  108. package/dist/api/QStep.json +1 -1
  109. package/dist/api/QStepper.json +1 -1
  110. package/dist/api/QTab.json +1 -1
  111. package/dist/api/QTabPanel.json +1 -1
  112. package/dist/api/QTabPanels.json +1 -1
  113. package/dist/api/QTable.json +1 -1
  114. package/dist/api/QTabs.json +1 -1
  115. package/dist/api/QTd.json +1 -1
  116. package/dist/api/QTh.json +1 -1
  117. package/dist/api/QTime.json +1 -1
  118. package/dist/api/QTimeline.json +1 -1
  119. package/dist/api/QTimelineEntry.json +1 -1
  120. package/dist/api/QToggle.json +1 -1
  121. package/dist/api/QTooltip.json +1 -1
  122. package/dist/api/QTr.json +1 -1
  123. package/dist/api/QTree.json +1 -1
  124. package/dist/api/QUploader.json +1 -1
  125. package/dist/api/QVideo.json +1 -1
  126. package/dist/api/QVirtualScroll.json +1 -1
  127. package/dist/api/Ripple.json +1 -1
  128. package/dist/api/Screen.json +1 -1
  129. package/dist/api/Scroll.json +1 -1
  130. package/dist/api/ScrollFire.json +1 -1
  131. package/dist/api/SessionStorage.json +1 -1
  132. package/dist/api/TouchHold.json +1 -1
  133. package/dist/api/TouchPan.json +1 -1
  134. package/dist/api/TouchRepeat.json +1 -1
  135. package/dist/api/TouchSwipe.json +1 -1
  136. package/dist/icon-set/bootstrap-icons.umd.prod.js +1 -1
  137. package/dist/icon-set/eva-icons.umd.prod.js +1 -1
  138. package/dist/icon-set/fontawesome-v5-pro.umd.prod.js +1 -1
  139. package/dist/icon-set/fontawesome-v5.umd.prod.js +1 -1
  140. package/dist/icon-set/fontawesome-v6-pro.umd.prod.js +1 -1
  141. package/dist/icon-set/fontawesome-v6.umd.prod.js +1 -1
  142. package/dist/icon-set/ionicons-v4.umd.prod.js +1 -1
  143. package/dist/icon-set/line-awesome.umd.prod.js +1 -1
  144. package/dist/icon-set/material-icons-outlined.umd.prod.js +1 -1
  145. package/dist/icon-set/material-icons-round.umd.prod.js +1 -1
  146. package/dist/icon-set/material-icons-sharp.umd.prod.js +1 -1
  147. package/dist/icon-set/material-icons.umd.prod.js +1 -1
  148. package/dist/icon-set/material-symbols-outlined.umd.prod.js +1 -1
  149. package/dist/icon-set/material-symbols-rounded.umd.prod.js +1 -1
  150. package/dist/icon-set/material-symbols-sharp.umd.prod.js +1 -1
  151. package/dist/icon-set/mdi-v3.umd.prod.js +1 -1
  152. package/dist/icon-set/mdi-v4.umd.prod.js +1 -1
  153. package/dist/icon-set/mdi-v5.umd.prod.js +1 -1
  154. package/dist/icon-set/mdi-v6.umd.prod.js +1 -1
  155. package/dist/icon-set/mdi-v7.umd.prod.js +1 -1
  156. package/dist/icon-set/svg-bootstrap-icons.umd.prod.js +1 -1
  157. package/dist/icon-set/svg-eva-icons.umd.prod.js +1 -1
  158. package/dist/icon-set/svg-fontawesome-v5.umd.prod.js +1 -1
  159. package/dist/icon-set/svg-fontawesome-v6.umd.prod.js +1 -1
  160. package/dist/icon-set/svg-ionicons-v4.umd.prod.js +1 -1
  161. package/dist/icon-set/svg-ionicons-v5.umd.prod.js +1 -1
  162. package/dist/icon-set/svg-ionicons-v6.umd.prod.js +1 -1
  163. package/dist/icon-set/svg-line-awesome.umd.prod.js +1 -1
  164. package/dist/icon-set/svg-material-icons-outlined.umd.prod.js +1 -1
  165. package/dist/icon-set/svg-material-icons-round.umd.prod.js +1 -1
  166. package/dist/icon-set/svg-material-icons-sharp.umd.prod.js +1 -1
  167. package/dist/icon-set/svg-material-icons.umd.prod.js +1 -1
  168. package/dist/icon-set/svg-material-symbols-outlined.umd.prod.js +1 -1
  169. package/dist/icon-set/svg-material-symbols-rounded.umd.prod.js +1 -1
  170. package/dist/icon-set/svg-material-symbols-sharp.umd.prod.js +1 -1
  171. package/dist/icon-set/svg-mdi-v6.umd.prod.js +1 -1
  172. package/dist/icon-set/svg-mdi-v7.umd.prod.js +1 -1
  173. package/dist/icon-set/svg-themify.umd.prod.js +1 -1
  174. package/dist/icon-set/themify.umd.prod.js +1 -1
  175. package/dist/lang/ar-TN.umd.prod.js +1 -1
  176. package/dist/lang/ar.umd.prod.js +1 -1
  177. package/dist/lang/az-Latn.umd.prod.js +1 -1
  178. package/dist/lang/bg.umd.prod.js +1 -1
  179. package/dist/lang/bn.umd.prod.js +1 -1
  180. package/dist/lang/ca.umd.prod.js +1 -1
  181. package/dist/lang/cs.umd.prod.js +1 -1
  182. package/dist/lang/da.umd.prod.js +1 -1
  183. package/dist/lang/de-CH.umd.prod.js +1 -1
  184. package/dist/lang/de-DE.umd.prod.js +1 -1
  185. package/dist/lang/de.umd.prod.js +1 -1
  186. package/dist/lang/el.umd.prod.js +1 -1
  187. package/dist/lang/en-GB.umd.prod.js +1 -1
  188. package/dist/lang/en-US.umd.prod.js +1 -1
  189. package/dist/lang/eo.umd.prod.js +1 -1
  190. package/dist/lang/es.umd.prod.js +1 -1
  191. package/dist/lang/et.umd.prod.js +1 -1
  192. package/dist/lang/eu.umd.prod.js +1 -1
  193. package/dist/lang/fa-IR.umd.prod.js +1 -1
  194. package/dist/lang/fa.umd.prod.js +1 -1
  195. package/dist/lang/fi.umd.prod.js +1 -1
  196. package/dist/lang/fr.umd.prod.js +1 -1
  197. package/dist/lang/gn.umd.prod.js +1 -1
  198. package/dist/lang/he.umd.prod.js +1 -1
  199. package/dist/lang/hi.umd.prod.js +1 -1
  200. package/dist/lang/hr.umd.prod.js +1 -1
  201. package/dist/lang/hu.umd.prod.js +1 -1
  202. package/dist/lang/id.umd.prod.js +1 -1
  203. package/dist/lang/is.umd.prod.js +1 -1
  204. package/dist/lang/it.umd.prod.js +1 -1
  205. package/dist/lang/ja.umd.prod.js +1 -1
  206. package/dist/lang/kk.umd.prod.js +1 -1
  207. package/dist/lang/km.umd.prod.js +1 -1
  208. package/dist/lang/ko-KR.umd.prod.js +1 -1
  209. package/dist/lang/kur-CKB.umd.prod.js +1 -1
  210. package/dist/lang/lt.umd.prod.js +1 -1
  211. package/dist/lang/lu.umd.prod.js +1 -1
  212. package/dist/lang/lv.umd.prod.js +1 -1
  213. package/dist/lang/mk.umd.prod.js +1 -1
  214. package/dist/lang/ml.umd.prod.js +1 -1
  215. package/dist/lang/mm.umd.prod.js +1 -1
  216. package/dist/lang/ms-MY.umd.prod.js +1 -1
  217. package/dist/lang/ms.umd.prod.js +1 -1
  218. package/dist/lang/my.umd.prod.js +1 -1
  219. package/dist/lang/nb-NO.umd.prod.js +1 -1
  220. package/dist/lang/nl.umd.prod.js +1 -1
  221. package/dist/lang/pl.umd.prod.js +1 -1
  222. package/dist/lang/pt-BR.umd.prod.js +1 -1
  223. package/dist/lang/pt.umd.prod.js +1 -1
  224. package/dist/lang/ro.umd.prod.js +1 -1
  225. package/dist/lang/ru.umd.prod.js +1 -1
  226. package/dist/lang/sk.umd.prod.js +1 -1
  227. package/dist/lang/sl.umd.prod.js +1 -1
  228. package/dist/lang/sm.umd.prod.js +1 -1
  229. package/dist/lang/sr-CYR.umd.prod.js +1 -1
  230. package/dist/lang/sr.umd.prod.js +1 -1
  231. package/dist/lang/sv.umd.prod.js +1 -1
  232. package/dist/lang/ta.umd.prod.js +1 -1
  233. package/dist/lang/th.umd.prod.js +1 -1
  234. package/dist/lang/tl.umd.prod.js +1 -1
  235. package/dist/lang/tr.umd.prod.js +1 -1
  236. package/dist/lang/ug.umd.prod.js +1 -1
  237. package/dist/lang/uk.umd.prod.js +1 -1
  238. package/dist/lang/uz-Cyrl.umd.prod.js +1 -1
  239. package/dist/lang/uz-Latn.umd.prod.js +1 -1
  240. package/dist/lang/vi.umd.prod.js +1 -1
  241. package/dist/lang/zh-CN.umd.prod.js +1 -1
  242. package/dist/lang/zh-TW.umd.prod.js +1 -1
  243. package/dist/quasar.cjs.prod.js +12 -12
  244. package/dist/quasar.css +53 -53
  245. package/dist/quasar.esm.js +82 -51
  246. package/dist/quasar.esm.prod.js +10 -10
  247. package/dist/quasar.prod.css +1 -1
  248. package/dist/quasar.rtl.css +65 -65
  249. package/dist/quasar.rtl.prod.css +1 -1
  250. package/dist/quasar.sass +37 -37
  251. package/dist/quasar.umd.js +80 -50
  252. package/dist/quasar.umd.prod.js +6 -6
  253. package/dist/transforms/import-map.json +1 -1
  254. package/dist/types/composables.d.ts +5 -0
  255. package/dist/types/index.d.ts +325 -235
  256. package/dist/types/tsconfig.json +1 -1
  257. package/dist/vetur/quasar-attributes.json +1 -1
  258. package/dist/web-types/web-types.json +1 -1
  259. package/package.json +21 -44
  260. package/src/api-file-example.json +5 -5
  261. package/src/api.extends.json +18 -18
  262. package/src/body.js +1 -1
  263. package/src/components/ajax-bar/QAjaxBar.json +5 -5
  264. package/src/components/avatar/QAvatar.json +1 -1
  265. package/src/components/avatar/QAvatar.test.js +146 -0
  266. package/src/components/badge/QBadge.json +2 -2
  267. package/src/components/badge/QBadge.test.js +167 -0
  268. package/src/components/banner/QBanner.test.js +123 -0
  269. package/src/components/bar/QBar.test.js +55 -0
  270. package/src/components/breadcrumbs/QBreadcrumbs.json +7 -7
  271. package/src/components/breadcrumbs/QBreadcrumbs.test.js +123 -0
  272. package/src/components/breadcrumbs/QBreadcrumbsEl.json +4 -4
  273. package/src/components/breadcrumbs/QBreadcrumbsEl.test.js +134 -0
  274. package/src/components/btn/QBtn.js +1 -1
  275. package/src/components/btn/QBtn.json +1 -1
  276. package/src/components/btn/QBtn.test.js +350 -0
  277. package/src/components/btn/use-btn.json +13 -13
  278. package/src/components/btn/use-btn.test.js +590 -0
  279. package/src/components/btn-dropdown/QBtnDropdown.json +14 -14
  280. package/src/components/btn-toggle/QBtnToggle.json +6 -6
  281. package/src/components/card/QCard.json +2 -2
  282. package/src/components/card/QCardActions.json +3 -3
  283. package/src/components/card/QCardSection.json +2 -2
  284. package/src/components/carousel/QCarousel.json +9 -9
  285. package/src/components/carousel/QCarouselControl.json +5 -5
  286. package/src/components/carousel/QCarouselSlide.json +4 -7
  287. package/src/components/chat/QChatMessage.json +9 -9
  288. package/src/components/checkbox/use-checkbox.json +13 -13
  289. package/src/components/chip/QChip.js +1 -1
  290. package/src/components/chip/QChip.json +6 -8
  291. package/src/components/chip/QChip.test.js +534 -0
  292. package/src/components/circular-progress/QCircularProgress.json +8 -8
  293. package/src/components/color/QColor.js +2 -2
  294. package/src/components/color/QColor.json +8 -10
  295. package/src/components/date/QDate.json +31 -30
  296. package/src/components/date/use-datetime.json +3 -3
  297. package/src/components/dialog/QDialog.json +13 -13
  298. package/src/components/dialog/QDialog.test.js +390 -0
  299. package/src/components/dialog/test/DialogWrapper.vue +17 -0
  300. package/src/components/drawer/QDrawer.js +1 -1
  301. package/src/components/drawer/QDrawer.json +8 -12
  302. package/src/components/editor/QEditor.json +31 -45
  303. package/src/components/expansion-item/QExpansionItem.js +1 -1
  304. package/src/components/expansion-item/QExpansionItem.json +14 -14
  305. package/src/components/fab/QFab.json +4 -4
  306. package/src/components/fab/QFabAction.json +3 -5
  307. package/src/components/fab/use-fab.json +10 -12
  308. package/src/components/field/QField.json +5 -5
  309. package/src/components/file/QFile.json +9 -11
  310. package/src/components/footer/QFooter.js +1 -1
  311. package/src/components/footer/QFooter.json +3 -5
  312. package/src/components/form/QForm.json +1 -3
  313. package/src/components/form/QFormChildMixin.json +1 -3
  314. package/src/components/header/QHeader.json +4 -6
  315. package/src/components/icon/QIcon.json +2 -2
  316. package/src/components/img/QImg.js +1 -1
  317. package/src/components/img/QImg.json +45 -59
  318. package/src/components/infinite-scroll/QInfiniteScroll.json +3 -3
  319. package/src/components/inner-loading/QInnerLoading.json +5 -7
  320. package/src/components/input/QInput.json +10 -10
  321. package/src/components/input/use-mask.json +1 -1
  322. package/src/components/intersection/QIntersection.js +2 -2
  323. package/src/components/intersection/QIntersection.json +7 -7
  324. package/src/components/item/QItem.json +5 -5
  325. package/src/components/item/QList.json +2 -2
  326. package/src/components/knob/QKnob.js +1 -1
  327. package/src/components/knob/QKnob.json +6 -6
  328. package/src/components/layout/QLayout.js +1 -1
  329. package/src/components/layout/QLayout.json +3 -5
  330. package/src/components/linear-progress/QLinearProgress.json +2 -2
  331. package/src/components/markup-table/QMarkupTable.json +3 -3
  332. package/src/components/menu/QMenu.json +8 -8
  333. package/src/components/no-ssr/QNoSsr.json +3 -3
  334. package/src/components/option-group/QOptionGroup.json +11 -13
  335. package/src/components/page/QPage.json +2 -2
  336. package/src/components/page-scroller/QPageScroller.json +3 -3
  337. package/src/components/page-sticky/QPageSticky.json +4 -4
  338. package/src/components/pagination/QPagination.json +20 -20
  339. package/src/components/parallax/QParallax.json +5 -5
  340. package/src/components/popup-edit/QPopupEdit.json +17 -19
  341. package/src/components/popup-proxy/QPopupProxy.json +2 -2
  342. package/src/components/pull-to-refresh/QPullToRefresh.js +1 -1
  343. package/src/components/radio/QRadio.json +5 -5
  344. package/src/components/range/QRange.json +3 -7
  345. package/src/components/rating/QRating.json +16 -19
  346. package/src/components/resize-observer/QResizeObserver.json +2 -2
  347. package/src/components/scroll-area/QScrollArea.js +1 -1
  348. package/src/components/scroll-area/QScrollArea.json +12 -12
  349. package/src/components/scroll-observer/QScrollObserver.json +4 -4
  350. package/src/components/select/QSelect.js +0 -0
  351. package/src/components/select/QSelect.json +55 -59
  352. package/src/components/select/__tests__/QSelect.cy.js +21 -1
  353. package/src/components/separator/QSeparator.json +3 -5
  354. package/src/components/skeleton/QSkeleton.json +14 -16
  355. package/src/components/slide-item/QSlideItem.js +1 -1
  356. package/src/components/slide-item/QSlideItem.json +2 -2
  357. package/src/components/slide-transition/QSlideTransition.json +1 -1
  358. package/src/components/slider/QSlider.json +2 -4
  359. package/src/components/slider/use-slider.js +1 -1
  360. package/src/components/slider/use-slider.json +18 -22
  361. package/src/components/spinner/QSpinner.json +1 -1
  362. package/src/components/spinner/QSpinnerAudio.json +1 -1
  363. package/src/components/spinner/QSpinnerBall.json +1 -1
  364. package/src/components/spinner/QSpinnerBars.json +1 -1
  365. package/src/components/spinner/QSpinnerBox.json +1 -1
  366. package/src/components/spinner/QSpinnerClock.json +1 -1
  367. package/src/components/spinner/QSpinnerComment.json +1 -1
  368. package/src/components/spinner/QSpinnerCube.json +1 -1
  369. package/src/components/spinner/QSpinnerDots.json +1 -1
  370. package/src/components/spinner/QSpinnerFacebook.json +1 -1
  371. package/src/components/spinner/QSpinnerGears.json +1 -1
  372. package/src/components/spinner/QSpinnerGrid.json +1 -1
  373. package/src/components/spinner/QSpinnerHearts.json +1 -1
  374. package/src/components/spinner/QSpinnerHourglass.json +1 -1
  375. package/src/components/spinner/QSpinnerInfinity.json +1 -1
  376. package/src/components/spinner/QSpinnerIos.json +1 -1
  377. package/src/components/spinner/QSpinnerOrbit.json +1 -1
  378. package/src/components/spinner/QSpinnerOval.json +1 -1
  379. package/src/components/spinner/QSpinnerPie.json +1 -1
  380. package/src/components/spinner/QSpinnerPuff.json +1 -1
  381. package/src/components/spinner/QSpinnerRadio.json +1 -1
  382. package/src/components/spinner/QSpinnerRings.json +1 -1
  383. package/src/components/spinner/QSpinnerTail.json +1 -1
  384. package/src/components/splitter/QSplitter.js +1 -1
  385. package/src/components/splitter/QSplitter.json +14 -14
  386. package/src/components/stepper/QStep.json +4 -10
  387. package/src/components/stepper/QStepper.json +1 -3
  388. package/src/components/stepper/StepHeader.js +1 -1
  389. package/src/components/table/QTable.js +1 -1
  390. package/src/components/table/QTable.json +113 -126
  391. package/src/components/table/QTd.json +1 -1
  392. package/src/components/table/QTh.json +1 -1
  393. package/src/components/table/QTr.json +1 -1
  394. package/src/components/tabs/QRouteTab.json +1 -1
  395. package/src/components/tabs/QTab.json +6 -13
  396. package/src/components/tabs/QTabs.json +8 -8
  397. package/src/components/tabs/use-tab.js +1 -1
  398. package/src/components/time/QTime.js +1 -1
  399. package/src/components/time/QTime.json +10 -22
  400. package/src/components/timeline/QTimeline.json +4 -4
  401. package/src/components/timeline/QTimelineEntry.json +11 -11
  402. package/src/components/tooltip/QTooltip.json +17 -20
  403. package/src/components/tree/QTree.json +26 -26
  404. package/src/components/uploader/QUploader.json +4 -4
  405. package/src/components/uploader/xhr-uploader-plugin.json +12 -12
  406. package/src/components/video/QVideo.json +15 -19
  407. package/src/components/virtual-scroll/QVirtualScroll.json +7 -10
  408. package/src/components/virtual-scroll/use-virtual-scroll.json +9 -8
  409. package/src/composables/private/use-anchor.json +6 -6
  410. package/src/composables/private/use-field.json +8 -11
  411. package/src/composables/private/use-file.js +1 -1
  412. package/src/composables/private/use-file.json +6 -8
  413. package/src/composables/private/use-form.json +1 -1
  414. package/src/composables/private/use-form.test.js +93 -0
  415. package/src/composables/private/use-fullscreen.json +1 -3
  416. package/src/composables/private/use-key-composition.js +1 -1
  417. package/src/composables/private/use-panel.child.json +1 -3
  418. package/src/composables/private/use-panel.js +1 -1
  419. package/src/composables/private/use-panel.json +12 -12
  420. package/src/composables/private/use-portal.js +16 -1
  421. package/src/composables/private/use-ratio.json +4 -3
  422. package/src/composables/private/use-ratio.test.js +27 -0
  423. package/src/composables/private/use-router-link.json +6 -6
  424. package/src/composables/private/use-size.json +1 -1
  425. package/src/composables/private/use-size.test.js +22 -0
  426. package/src/composables/private/use-transition.json +3 -3
  427. package/src/composables/private/use-validate.json +6 -6
  428. package/src/composables/use-hydration.js +1 -1
  429. package/src/composables/use-id.js +1 -1
  430. package/src/composables/use-id.test.js +55 -0
  431. package/src/composables/use-interval.js +36 -0
  432. package/src/composables/use-meta.js +1 -1
  433. package/src/composables/use-timeout.js +4 -1
  434. package/src/composables.js +2 -0
  435. package/src/css/index.sass +6 -6
  436. package/src/directives/{ClosePopup.js → close-popup/ClosePopup.js} +4 -4
  437. package/src/directives/{ClosePopup.json → close-popup/ClosePopup.json} +5 -5
  438. package/src/directives/{Intersection.js → intersection/Intersection.js} +3 -3
  439. package/src/directives/{Intersection.json → intersection/Intersection.json} +4 -6
  440. package/src/directives/{Morph.js → morph/Morph.js} +2 -2
  441. package/src/directives/{Morph.json → morph/Morph.json} +20 -20
  442. package/src/directives/{Mutation.js → mutation/Mutation.js} +2 -2
  443. package/src/directives/{Mutation.json → mutation/Mutation.json} +10 -12
  444. package/src/directives/{Ripple.js → ripple/Ripple.js} +6 -6
  445. package/src/directives/{Ripple.json → ripple/Ripple.json} +7 -13
  446. package/src/directives/{Scroll.js → scroll/Scroll.js} +4 -4
  447. package/src/directives/{Scroll.json → scroll/Scroll.json} +2 -2
  448. package/src/directives/{ScrollFire.js → scroll-fire/ScrollFire.js} +6 -6
  449. package/src/directives/{ScrollFire.json → scroll-fire/ScrollFire.json} +1 -1
  450. package/src/directives/{TouchHold.js → touch-hold/TouchHold.js} +5 -5
  451. package/src/directives/{TouchHold.json → touch-hold/TouchHold.json} +6 -6
  452. package/src/directives/{TouchPan.js → touch-pan/TouchPan.js} +6 -6
  453. package/src/directives/{TouchPan.json → touch-pan/TouchPan.json} +4 -4
  454. package/src/directives/{TouchRepeat.js → touch-repeat/TouchRepeat.js} +6 -6
  455. package/src/directives/{TouchRepeat.json → touch-repeat/TouchRepeat.json} +4 -4
  456. package/src/directives/{TouchSwipe.js → touch-swipe/TouchSwipe.js} +6 -6
  457. package/src/directives/{TouchSwipe.json → touch-swipe/TouchSwipe.json} +4 -4
  458. package/src/directives.js +11 -11
  459. package/src/history.js +1 -1
  460. package/src/install-quasar.js +3 -3
  461. package/src/plugins/{AddressbarColor.js → addressbar/AddressbarColor.js} +3 -3
  462. package/src/plugins/{AddressbarColor.json → addressbar/AddressbarColor.json} +1 -1
  463. package/src/plugins/{AppFullscreen.js → app-fullscreen/AppFullscreen.js} +2 -2
  464. package/src/plugins/{AppVisibility.js → app-visibility/AppVisibility.js} +2 -2
  465. package/src/plugins/{BottomSheet.js → bottom-sheet/BottomSheet.js} +2 -2
  466. package/src/plugins/{BottomSheet.json → bottom-sheet/BottomSheet.json} +10 -10
  467. package/src/{components/dialog-bottom-sheet/BottomSheet.js → plugins/bottom-sheet/component/BottomSheetComponent.js} +10 -10
  468. package/src/plugins/{Cookies.json → cookies/Cookies.json} +14 -16
  469. package/src/plugins/{Dark.js → dark/Dark.js} +1 -1
  470. package/src/plugins/{Dark.json → dark/Dark.json} +3 -3
  471. package/src/plugins/{Dialog.js → dialog/Dialog.js} +2 -2
  472. package/src/plugins/{Dialog.json → dialog/Dialog.json} +15 -15
  473. package/src/{components/dialog-plugin/DialogPlugin.js → plugins/dialog/component/DialogPluginComponent.js} +14 -14
  474. package/src/plugins/{Loading.js → loading/Loading.js} +7 -6
  475. package/src/plugins/{Loading.json → loading/Loading.json} +15 -15
  476. package/src/plugins/{LoadingBar.js → loading-bar/LoadingBar.js} +6 -6
  477. package/src/plugins/{LoadingBar.json → loading-bar/LoadingBar.json} +1 -1
  478. package/src/plugins/{LocalStorage.js → local-storage/LocalStorage.js} +2 -2
  479. package/src/plugins/{Meta.js → meta/Meta.js} +2 -2
  480. package/src/plugins/{Notify.js → notify/Notify.js} +11 -10
  481. package/src/plugins/{Notify.json → notify/Notify.json} +52 -68
  482. package/src/plugins/{Platform.js → platform/Platform.js} +3 -9
  483. package/src/plugins/{Platform.json → platform/Platform.json} +6 -10
  484. package/src/plugins/{Screen.js → screen/Screen.js} +4 -4
  485. package/src/plugins/{Screen.json → screen/Screen.json} +6 -12
  486. package/src/plugins/{SessionStorage.js → session-storage/SessionStorage.js} +2 -2
  487. package/src/plugins.js +15 -15
  488. package/src/utils/create-meta-mixin.js +1 -1
  489. package/src/utils/open-url.js +1 -1
  490. package/src/utils/prevent-scroll.js +1 -1
  491. package/src/utils/private/escape-key.js +1 -1
  492. package/src/utils/private/focusout.js +1 -1
  493. package/src/utils/private/global-dialog.json +2 -2
  494. package/src/utils/private/position-engine.js +1 -1
  495. package/src/utils/private/selection.js +1 -1
  496. package/src/utils/private/web-storage.json +8 -10
  497. package/src/components/avatar/__tests__/QAvatar.cy.js +0 -120
  498. package/src/components/badge/__tests__/QBadge.cy.js +0 -148
  499. package/src/components/banner/__tests__/QBanner.cy.js +0 -106
  500. package/src/components/bar/__tests__/QBar.cy.js +0 -45
  501. package/src/components/breadcrumbs/__tests__/QBreadcrumbs.cy.js +0 -111
  502. package/src/components/breadcrumbs/__tests__/QBreadcrumbsEl.cy.js +0 -87
  503. package/src/components/btn/__tests__/QBtn.cy.js +0 -128
  504. package/src/components/btn/__tests__/use-btn.cy.js +0 -517
  505. package/src/components/chip/__tests__/QChip.cy.js +0 -480
  506. package/src/components/dialog/__tests__/DialogWrapper.vue +0 -33
  507. package/src/components/dialog/__tests__/QDialog.cy.js +0 -543
  508. package/src/components/tabs/__tests__/QRouteTab.cy.js +0 -9
  509. /package/src/components/breadcrumbs/{__tests__ → test}/BasicBreadcrumbs.vue +0 -0
  510. /package/src/components/breadcrumbs/{__tests__ → test}/BreadcrumbWithSeparatorSlot.vue +0 -0
  511. /package/src/components/spinner/{__spinner-mixin.json → spinner.json} +0 -0
  512. /package/src/directives/{Morph.sass → morph/Morph.sass} +0 -0
  513. /package/src/directives/{Ripple.sass → ripple/Ripple.sass} +0 -0
  514. /package/src/plugins/{AppFullscreen.json → app-fullscreen/AppFullscreen.json} +0 -0
  515. /package/src/plugins/{AppVisibility.json → app-visibility/AppVisibility.json} +0 -0
  516. /package/src/{components/dialog-bottom-sheet/BottomSheet.sass → plugins/bottom-sheet/component/BottomSheetComponent.sass} +0 -0
  517. /package/src/plugins/{Cookies.js → cookies/Cookies.js} +0 -0
  518. /package/src/{components/dialog-plugin/DialogPlugin.sass → plugins/dialog/component/DialogPluginComponent.sass} +0 -0
  519. /package/src/plugins/{Loading.sass → loading/Loading.sass} +0 -0
  520. /package/src/plugins/{LocalStorage.json → local-storage/LocalStorage.json} +0 -0
  521. /package/src/plugins/{Meta.json → meta/Meta.json} +0 -0
  522. /package/src/plugins/{Notify.sass → notify/Notify.sass} +0 -0
  523. /package/src/plugins/{SessionStorage.json → session-storage/SessionStorage.json} +0 -0
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/file"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms; If not specified, it takes the value of 'for' prop, if it exists","examples":["car_id","car_id"],"category":"behavior"},"multiple":{"type":"Boolean","desc":"Allow multiple file uploads","category":"behavior"},"accept":{"type":"String","desc":"Comma separated list of unique file type specifiers. Maps to 'accept' attribute of native input type=file element","examples":[".jpg, .pdf, image/*","image/jpeg, .pdf"],"category":"behavior"},"capture":{"type":"String","desc":"Optionally, specify that a new file should be captured, and which device should be used to capture that new media of a type defined by the 'accept' prop. Maps to 'capture' attribute of native input type=file element","values":["user","environment"],"category":"behavior"},"max-file-size":{"type":["Number","String"],"desc":"Maximum size of individual file in bytes","examples":[1024,1048576],"category":"behavior"},"max-total-size":{"type":["Number","String"],"desc":"Maximum size of all files combined in bytes","category":"behavior"},"max-files":{"type":["Number","String"],"desc":"Maximum number of files to contain","category":"behavior"},"filter":{"type":"Function","desc":"Custom filter for added files; Only files that pass this filter will be added to the queue and uploaded; For best performance, reference it from your scope and do not define it inline","params":{"files":{"type":["FileList","Array"],"desc":"Candidate files to be added to queue"}},"returns":{"type":"Array","desc":"Filtered files to be added to queue"},"examples":[":filter=\"files => files.filter(file => file.size === 1024)\""],"category":"behavior"},"model-value":{"desc":"Model of the component; Must be FileList or Array if using 'multiple' prop; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["File","FileList","Array","null","undefined"],"examples":["v-model=\"myModel\""]},"error":{"type":["Boolean","null"],"default":null,"desc":"Does field have validation errors?","category":"behavior","required":false},"error-message":{"type":"String","desc":"Validation error message (gets displayed only if 'error' is set to 'true')","examples":["Username must have at least 5 characters"],"category":"content"},"no-error-icon":{"type":"Boolean","desc":"Hide error icon when there is an error","category":"content"},"rules":{"type":"Array","tsType":"ValidationRule","desc":"Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules","examples":[":rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"",":rules=\"[ 'fulltime' ]\"",":rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\""],"category":"behavior"},"reactive-rules":{"type":"Boolean","desc":"By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it","category":"behavior"},"lazy-rules":{"type":["Boolean","String"],"desc":"If set to boolean true then it checks validation status against the 'rules' only after field loses focus for first time; If set to 'ondemand' then it will trigger only when component's validate() method is manually called or when the wrapper QForm submits itself","values":["(Boolean) true","(Boolean) false","ondemand"],"category":"behavior"},"label":{"type":"String","desc":"A text label that will “float” up above the input field, once the field gets focus","examples":["Username"],"category":"content"},"stack-label":{"type":"Boolean","desc":"Label will be always shown above the field regardless of field content (if any)","category":"content"},"hint":{"type":"String","desc":"Helper (hint) text which gets placed below your wrapped form component","examples":["Fill in between 3 and 12 characters"],"category":"content"},"hide-hint":{"type":"Boolean","desc":"Hide the helper (hint) text when field doesn't have focus","category":"content"},"prefix":{"type":"String","desc":"Prefix","examples":["$"],"category":"content"},"suffix":{"type":"String","desc":"Suffix","examples":["@gmail.com"],"category":"content"},"label-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the label from the Quasar Color Palette; Overrides the 'color' prop; The difference from 'color' prop is that the label will always have this color, even when field is not focused","examples":["primary","teal","teal-10"],"category":"style"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"bg-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"loading":{"type":"Boolean","desc":"Signals the user a process is in progress by displaying a spinner; Spinner can be customized by using the 'loading' slot.","category":"behavior|content"},"clearable":{"type":"Boolean","desc":"Appends clearable icon when a value (not undefined or null) is set; When clicked, model becomes null","category":"behavior|content"},"clear-icon":{"type":"String","desc":"Custom icon to use for the clear button when using along with 'clearable' prop","examples":["close"],"category":"content"},"filled":{"type":"Boolean","desc":"Use 'filled' design for the field","category":"style"},"outlined":{"type":"Boolean","desc":"Use 'outlined' design for the field","category":"style"},"borderless":{"type":"Boolean","desc":"Use 'borderless' design for the field","category":"style"},"standout":{"type":["Boolean","String"],"desc":"Use 'standout' design for the field; Specifies classes to be applied when focused (overriding default ones)","examples":["standout","standout=\"bg-primary text-white\""],"category":"style"},"label-slot":{"type":"Boolean","desc":"Enables label slot; You need to set it to force use of the 'label' slot if the 'label' prop is not set","category":"content"},"bottom-slots":{"type":"Boolean","desc":"Enables bottom slots ('error', 'hint', 'counter')","category":"content"},"hide-bottom-space":{"type":"Boolean","desc":"Do not reserve space for hint/error/counter anymore when these are not used; As a result, it also disables the animation for those; It also allows the hint/error area to stretch vertically based on its content","category":"style"},"counter":{"type":"Boolean","desc":"Show an automatic counter on bottom right","category":"content"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"square":{"type":"Boolean","desc":"Remove border-radius so borders are squared; Overrides 'rounded' prop","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"item-aligned":{"type":"Boolean","desc":"Match inner content alignment to that of QItem","category":"style"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"},"autofocus":{"type":"Boolean","desc":"Focus field on initial component render","category":"behavior"},"for":{"type":"String","desc":"Used to specify the 'id' of the control and also the 'for' attribute of the label that wraps it; If no 'name' prop is specified, then it is used for this attribute as well","examples":["myFieldsId"],"category":"behavior"},"append":{"type":"Boolean","desc":"Append file(s) to current model rather than replacing them; Has effect only when using 'multiple' mode","category":"behavior"},"display-value":{"type":["Number","String"],"desc":"Override default selection string, if not using 'file' or 'selected' scoped slots and if not using 'use-chips' prop","examples":["Options: x, y, z"],"category":"selection"},"use-chips":{"type":"Boolean","desc":"Use QChip to show picked files","category":"selection"},"counter-label":{"type":"Function","desc":"Label for the counter; The 'counter' prop is necessary to enable this one","params":{"props":{"type":"Object","desc":"Object containing counter label information","definition":{"totalSize":{"type":"String","required":true,"desc":"The total size of files in human readable format","examples":["1.42MB"]},"filesNumber":{"type":"Number","required":true,"desc":"Number of picked files"},"maxFiles":{"type":["Number","String"],"required":true,"desc":"Maximum number of files (same as 'max-files' prop, if specified); When 'max-files' is not specified, this has 'void 0' as value"}}}},"returns":{"type":"String","desc":"String to display for the counter label"},"examples":[":counter-label=\"counterLabelFn\""],"category":"behavior"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["0","100"],"category":"general"},"input-class":{"type":["String","Array","Object"],"tsType":"VueClassProp","desc":"Class definitions to be attributed to the underlying selection container","examples":["my-special-class",":input-class=\"{ 'my-special-class': <condition> }\""],"category":"style"},"input-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Style definitions to be attributed to the underlying selection container","examples":["background-color: #ff0000",":input-style=\"{ backgroundColor: '#ff0000' }\""],"category":"style"}},"slots":{"default":{"desc":"Field main content"},"prepend":{"desc":"Prepend inner field; Suggestions: QIcon, QBtn"},"append":{"desc":"Append to inner field; Suggestions: QIcon, QBtn"},"before":{"desc":"Prepend outer field; Suggestions: QIcon, QBtn"},"after":{"desc":"Append outer field; Suggestions: QIcon, QBtn"},"label":{"desc":"Slot for label; Used only if 'label-slot' prop is set or the 'label' prop is set; When it is used the text in the 'label' prop is ignored"},"error":{"desc":"Slot for errors; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"hint":{"desc":"Slot for hint text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"counter":{"desc":"Slot for counter text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"loading":{"desc":"Override default spinner when component is in loading mode; Use in conjunction with 'loading' prop"},"file":{"desc":"Override default node to render a file from the user picked list","scope":{"index":{"type":"Number","desc":"Selection index"},"file":{"type":"File","desc":"File object"},"ref":{"type":"Component","tsType":"QFile","desc":"Reference to the QFile component"}}},"selected":{"desc":"Override default selection slot; Suggestion: QChip","scope":{"files":{"type":["FileList","Array"],"desc":"Array of File objects"},"ref":{"type":"Component","tsType":"QFile","desc":"Reference to the QFile component"}}}},"events":{"rejected":{"desc":"Emitted after files are picked and some do not pass the validation props (accept, max-file-size, max-total-size, filter, etc)","params":{"rejectedEntries":{"type":"Array","tsType":"QRejectedEntry","desc":"Array of { failedPropValidation: string, file: File } Objects for files that do not pass the validation"}}},"clear":{"desc":"When using the 'clearable' property, this event is emitted when the clear icon is clicked","params":{"value":{"type":"Any","desc":"The previous value before clearing it"}}},"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true}}}},"methods":{"pickFiles":{"desc":"Trigger file pick; Must be called as a direct consequence of user interaction (eg. in a click handler), due to browsers security policy","params":{"evt":{"type":"Event","desc":"JS event object"}}},"addFiles":{"desc":"Add files programmatically","params":{"files":{"type":["FileList","Array"],"desc":"Array of files (instances of File)","required":true}}},"resetValidation":{"desc":"Reset validation status"},"validate":{"desc":"Trigger a validation","params":{"value":{"type":"Any","desc":"Optional value to validate against"}},"returns":{"type":["Boolean","Promise<boolean>"],"desc":"True/false if no async rules, otherwise a Promise with the outcome (true -> validation was a success, false -> invalid models detected)","examples":["true","validate().then(outcome => { ... })"]}},"focus":{"desc":"Focus component"},"blur":{"desc":"Blur component (lose focus)"},"removeAtIndex":{"desc":"Remove file located at specific index in the model","params":{"index":{"type":"Number","desc":"Index at which to remove selection","required":true}}},"removeFile":{"desc":"Remove specified file from the model","params":{"file":{"type":"File","desc":"File to remove (instance of File)","required":true}}},"getNativeElement":{"desc":"DEPRECATED; Access 'nativeEl' directly; Gets the native input DOM Element","returns":{"type":"Element","tsType":"QFileNativeElement","desc":"The underlying native input DOM Element"}}},"computedProps":{"hasError":{"type":"Boolean","desc":"Whether the component is in error state"},"nativeEl":{"type":"Element","tsType":"QFileNativeElement","desc":"The native input DOM Element","addedIn":"v2.10.1"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/file"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms; If not specified, it takes the value of 'for' prop, if it exists","examples":["'car_id'","'car_id'"],"category":"behavior"},"multiple":{"type":"Boolean","desc":"Allow multiple file uploads","category":"behavior"},"accept":{"type":"String","desc":"Comma separated list of unique file type specifiers. Maps to 'accept' attribute of native input type=file element","examples":["'.jpg, .pdf, image/*'","'image/jpeg, .pdf'"],"category":"behavior"},"capture":{"type":"String","desc":"Optionally, specify that a new file should be captured, and which device should be used to capture that new media of a type defined by the 'accept' prop. Maps to 'capture' attribute of native input type=file element","values":["'user'","'environment'"],"category":"behavior"},"max-file-size":{"type":["Number","String"],"desc":"Maximum size of individual file in bytes","examples":["1024","'1048576'"],"category":"behavior"},"max-total-size":{"type":["Number","String"],"desc":"Maximum size of all files combined in bytes","category":"behavior"},"max-files":{"type":["Number","String"],"desc":"Maximum number of files to contain","category":"behavior"},"filter":{"type":"Function","desc":"Custom filter for added files; Only files that pass this filter will be added to the queue and uploaded; For best performance, reference it from your scope and do not define it inline","params":{"files":{"type":["Array","FileList"],"desc":"Candidate files to be added to queue"}},"returns":{"type":"Array","desc":"Filtered files to be added to queue"},"examples":["files => files.filter(file => file.size === 1024)"],"category":"behavior"},"model-value":{"desc":"Model of the component; Must be FileList or Array if using 'multiple' prop; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["File","FileList","Array","null","undefined"],"examples":["# v-model=\"myModel\""]},"error":{"type":["Boolean","null"],"default":"null","desc":"Does field have validation errors?","category":"behavior","required":false},"error-message":{"type":"String","desc":"Validation error message (gets displayed only if 'error' is set to 'true')","examples":["'Username must have at least 5 characters'"],"category":"content"},"no-error-icon":{"type":"Boolean","desc":"Hide error icon when there is an error","category":"content"},"rules":{"type":"Array","tsType":"ValidationRule","desc":"Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules","examples":["[ val => val.length <= 3 || 'Please use maximum 3 characters' ]","[ 'fulltime' ]","[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]"],"category":"behavior"},"reactive-rules":{"type":"Boolean","desc":"By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it","category":"behavior"},"lazy-rules":{"type":["Boolean","String"],"desc":"If set to boolean true then it checks validation status against the 'rules' only after field loses focus for first time; If set to 'ondemand' then it will trigger only when component's validate() method is manually called or when the wrapper QForm submits itself","values":["true","false","'ondemand'"],"category":"behavior"},"label":{"type":"String","desc":"A text label that will “float” up above the input field, once the field gets focus","examples":["'Username'"],"category":"content"},"stack-label":{"type":"Boolean","desc":"Label will be always shown above the field regardless of field content (if any)","category":"content"},"hint":{"type":"String","desc":"Helper (hint) text which gets placed below your wrapped form component","examples":["'Fill in between 3 and 12 characters'"],"category":"content"},"hide-hint":{"type":"Boolean","desc":"Hide the helper (hint) text when field doesn't have focus","category":"content"},"prefix":{"type":"String","desc":"Prefix","examples":["'$'"],"category":"content"},"suffix":{"type":"String","desc":"Suffix","examples":["'@gmail.com'"],"category":"content"},"label-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the label from the Quasar Color Palette; Overrides the 'color' prop; The difference from 'color' prop is that the label will always have this color, even when field is not focused","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"bg-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"loading":{"type":"Boolean","desc":"Signals the user a process is in progress by displaying a spinner; Spinner can be customized by using the 'loading' slot.","category":"behavior|content"},"clearable":{"type":"Boolean","desc":"Appends clearable icon when a value (not undefined or null) is set; When clicked, model becomes null","category":"behavior|content"},"clear-icon":{"type":"String","desc":"Custom icon to use for the clear button when using along with 'clearable' prop","examples":["'close'"],"category":"content"},"filled":{"type":"Boolean","desc":"Use 'filled' design for the field","category":"style"},"outlined":{"type":"Boolean","desc":"Use 'outlined' design for the field","category":"style"},"borderless":{"type":"Boolean","desc":"Use 'borderless' design for the field","category":"style"},"standout":{"type":["Boolean","String"],"desc":"Use 'standout' design for the field; Specifies classes to be applied when focused (overriding default ones)","examples":["true","'bg-primary text-white'"],"category":"style"},"label-slot":{"type":"Boolean","desc":"Enables label slot; You need to set it to force use of the 'label' slot if the 'label' prop is not set","category":"content"},"bottom-slots":{"type":"Boolean","desc":"Enables bottom slots ('error', 'hint', 'counter')","category":"content"},"hide-bottom-space":{"type":"Boolean","desc":"Do not reserve space for hint/error/counter anymore when these are not used; As a result, it also disables the animation for those; It also allows the hint/error area to stretch vertically based on its content","category":"style"},"counter":{"type":"Boolean","desc":"Show an automatic counter on bottom right","category":"content"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"square":{"type":"Boolean","desc":"Remove border-radius so borders are squared; Overrides 'rounded' prop","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"item-aligned":{"type":"Boolean","desc":"Match inner content alignment to that of QItem","category":"style"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"},"autofocus":{"type":"Boolean","desc":"Focus field on initial component render","category":"behavior"},"for":{"type":"String","desc":"Used to specify the 'id' of the control and also the 'for' attribute of the label that wraps it; If no 'name' prop is specified, then it is used for this attribute as well","examples":["'myFieldsId'"],"category":"behavior"},"append":{"type":"Boolean","desc":"Append file(s) to current model rather than replacing them; Has effect only when using 'multiple' mode","category":"behavior"},"display-value":{"type":["Number","String"],"desc":"Override default selection string, if not using 'file' or 'selected' scoped slots and if not using 'use-chips' prop","examples":["'Options: x, y, z'"],"category":"selection"},"use-chips":{"type":"Boolean","desc":"Use QChip to show picked files","category":"selection"},"counter-label":{"type":"Function","desc":"Label for the counter; The 'counter' prop is necessary to enable this one","params":{"props":{"type":"Object","desc":"Object containing counter label information","definition":{"totalSize":{"type":"String","required":true,"desc":"The total size of files in human readable format","examples":["'1.42MB'"]},"filesNumber":{"type":"Number","required":true,"desc":"Number of picked files"},"maxFiles":{"type":["Number","String"],"required":true,"desc":"Maximum number of files (same as 'max-files' prop, if specified); When 'max-files' is not specified, this has 'void 0' as value"}}}},"returns":{"type":"String","desc":"String to display for the counter label"},"examples":["(totalSize, filesNumber, maxFiles) => `${ filesNumber }${ maxFiles !== void 0 ? ' / ' + maxFiles : '' } (${ totalSize })`"],"category":"behavior"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["100","'0'"],"category":"general"},"input-class":{"type":["String","Array","Object"],"tsType":"VueClassProp","desc":"Class definitions to be attributed to the underlying selection container","examples":["'my-special-class'","{ 'my-special-class': <condition> }"],"category":"style"},"input-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Style definitions to be attributed to the underlying selection container","examples":["'background-color: #ff0000'","{ backgroundColor: '#ff0000' }"],"category":"style"}},"slots":{"default":{"desc":"Field main content"},"prepend":{"desc":"Prepend inner field; Suggestions: QIcon, QBtn"},"append":{"desc":"Append to inner field; Suggestions: QIcon, QBtn"},"before":{"desc":"Prepend outer field; Suggestions: QIcon, QBtn"},"after":{"desc":"Append outer field; Suggestions: QIcon, QBtn"},"label":{"desc":"Slot for label; Used only if 'label-slot' prop is set or the 'label' prop is set; When it is used the text in the 'label' prop is ignored"},"error":{"desc":"Slot for errors; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"hint":{"desc":"Slot for hint text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"counter":{"desc":"Slot for counter text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"loading":{"desc":"Override default spinner when component is in loading mode; Use in conjunction with 'loading' prop"},"file":{"desc":"Override default node to render a file from the user picked list","scope":{"index":{"type":"Number","desc":"Selection index"},"file":{"type":"File","desc":"File object"},"ref":{"type":"Component","tsType":"QFile","desc":"Reference to the QFile component"}}},"selected":{"desc":"Override default selection slot; Suggestion: QChip","scope":{"files":{"type":["Array","FileList"],"desc":"Array of File objects"},"ref":{"type":"Component","tsType":"QFile","desc":"Reference to the QFile component"}}}},"events":{"rejected":{"desc":"Emitted after files are picked and some do not pass the validation props (accept, max-file-size, max-total-size, filter, etc)","params":{"rejectedEntries":{"type":"Array","tsType":"QRejectedEntry","desc":"Array of { failedPropValidation: string, file: File } Objects for files that do not pass the validation"}}},"clear":{"desc":"When using the 'clearable' property, this event is emitted when the clear icon is clicked","params":{"value":{"type":"Any","desc":"The previous value before clearing it"}}},"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true}}}},"methods":{"pickFiles":{"desc":"Trigger file pick; Must be called as a direct consequence of user interaction (eg. in a click handler), due to browsers security policy","params":{"evt":{"type":"Event","desc":"JS event object"}}},"addFiles":{"desc":"Add files programmatically","params":{"files":{"type":["Array","FileList"],"desc":"Array of files (instances of File)","required":true}}},"resetValidation":{"desc":"Reset validation status"},"validate":{"desc":"Trigger a validation","params":{"value":{"type":"Any","desc":"Optional value to validate against"}},"returns":{"type":["Boolean","Promise<boolean>"],"desc":"True/false if no async rules, otherwise a Promise with the outcome (true -> validation was a success, false -> invalid models detected)","examples":["true","validate().then(outcome => { ... })"]}},"focus":{"desc":"Focus component"},"blur":{"desc":"Blur component (lose focus)"},"removeAtIndex":{"desc":"Remove file located at specific index in the model","params":{"index":{"type":"Number","desc":"Index at which to remove selection","required":true}}},"removeFile":{"desc":"Remove specified file from the model","params":{"file":{"type":"File","desc":"File to remove (instance of File)","required":true}}},"getNativeElement":{"desc":"DEPRECATED; Access 'nativeEl' directly; Gets the native input DOM Element","returns":{"type":"Element","tsType":"QFileNativeElement","desc":"The underlying native input DOM Element"}}},"computedProps":{"hasError":{"type":"Boolean","desc":"Whether the component is in error state"},"nativeEl":{"type":"Element","tsType":"QFileNativeElement","desc":"The native input DOM Element","addedIn":"v2.10.1"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/header-and-footer"},"props":{"model-value":{"desc":"Model of the component defining if it is shown or hidden to the user; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":false,"syncable":true,"category":"model","type":"Boolean","default":true,"examples":["v-model=\"footerState\""]},"reveal":{"type":"Boolean","desc":"Enable 'reveal' mode; Takes into account user scroll to temporarily show/hide footer","category":"behavior"},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"elevated":{"type":"Boolean","desc":"Adds a default shadow to the footer","category":"style"},"height-hint":{"type":["Number","String"],"desc":"When using SSR, you can optionally hint of the height (in pixels) of the QFooter","default":50,"category":"behavior","required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component; Suggestion: QToolbar"}},"events":{"reveal":{"desc":"Emitted when 'reveal' state gets changed","params":{"value":{"type":"Boolean","desc":"New 'reveal' state"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/header-and-footer"},"props":{"model-value":{"desc":"Model of the component defining if it is shown or hidden to the user; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":false,"syncable":true,"category":"model","type":"Boolean","default":"true","examples":["# v-model=\"footerState\""]},"reveal":{"type":"Boolean","desc":"Enable 'reveal' mode; Takes into account user scroll to temporarily show/hide footer","category":"behavior"},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"elevated":{"type":"Boolean","desc":"Adds a default shadow to the footer","category":"style"},"height-hint":{"type":["Number","String"],"desc":"When using SSR, you can optionally hint of the height (in pixels) of the QFooter","default":"50","category":"behavior","required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component; Suggestion: QToolbar"}},"events":{"reveal":{"desc":"Emitted when 'reveal' state gets changed","params":{"value":{"type":"Boolean","desc":"New 'reveal' state"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/header-and-footer"},"props":{"model-value":{"desc":"Model of the component defining if it is shown or hidden to the user; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":false,"syncable":true,"category":"model","type":"Boolean","default":true,"examples":["v-model=\"headerState\""]},"reveal":{"type":"Boolean","desc":"Enable 'reveal' mode; Takes into account user scroll to temporarily show/hide header","category":"behavior"},"reveal-offset":{"type":"Number","desc":"Amount of scroll (in pixels) that should trigger a 'reveal' state change","default":250,"category":"behavior","required":false},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"elevated":{"type":"Boolean","desc":"Adds a default shadow to the header","category":"style"},"height-hint":{"type":["Number","String"],"desc":"When using SSR, you can optionally hint of the height (in pixels) of the QHeader","default":50,"category":"behavior","required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component; Suggestion: QToolbar"}},"events":{"reveal":{"desc":"Emitted when 'reveal' state gets changed","params":{"value":{"type":"Boolean","desc":"New 'reveal' state"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/header-and-footer"},"props":{"model-value":{"desc":"Model of the component defining if it is shown or hidden to the user; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":false,"syncable":true,"category":"model","type":"Boolean","default":"true","examples":["# v-model=\"headerState\""]},"reveal":{"type":"Boolean","desc":"Enable 'reveal' mode; Takes into account user scroll to temporarily show/hide header","category":"behavior"},"reveal-offset":{"type":"Number","desc":"Amount of scroll (in pixels) that should trigger a 'reveal' state change","default":"250","category":"behavior","required":false},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"elevated":{"type":"Boolean","desc":"Adds a default shadow to the header","category":"style"},"height-hint":{"type":["Number","String"],"desc":"When using SSR, you can optionally hint of the height (in pixels) of the QHeader","default":"50","category":"behavior","required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component; Suggestion: QToolbar"}},"events":{"reveal":{"desc":"Emitted when 'reveal' state gets changed","params":{"value":{"type":"Boolean","desc":"New 'reveal' state"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/icon"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["16px","2rem","xs","md"],"category":"style"},"tag":{"type":"String","desc":"HTML tag to render, unless no icon is supplied or it's an svg icon","examples":["div","span","div","i"],"category":"content","default":"i","required":false},"name":{"type":"String","desc":"Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)","examples":["map","ion-add","img:https://cdn.quasar.dev/logo-v2/svg/logo.svg","img:path/to/some_image.png"],"category":"model"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"left":{"type":"Boolean","desc":"Useful if icon is on the left side of something: applies a standard margin on the right side of Icon","category":"content"},"right":{"type":"Boolean","desc":"Useful if icon is on the right side of something: applies a standard margin on the left side of Icon","category":"content"}},"slots":{"default":{"desc":"Suggestions: QTooltip or QMenu"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/icon"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style"},"tag":{"type":"String","desc":"HTML tag to render, unless no icon is supplied or it's an svg icon","examples":["'div'","'span'","'div'","'i'"],"category":"content","default":"'i'","required":false},"name":{"type":"String","desc":"Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)","examples":["'map'","'ion-add'","'img:https://cdn.quasar.dev/logo-v2/svg/logo.svg'","'img:path/to/some_image.png'"],"category":"model"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"left":{"type":"Boolean","desc":"Useful if icon is on the left side of something: applies a standard margin on the right side of Icon","category":"content"},"right":{"type":"Boolean","desc":"Useful if icon is on the right side of something: applies a standard margin on the left side of Icon","category":"content"}},"slots":{"default":{"desc":"Suggestions: QTooltip or QMenu"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/img"},"props":{"ratio":{"type":["String","Number"],"desc":"Force the component to maintain an aspect ratio","examples":[":ratio=\"4/3\"",":ratio=\"16/9\"","ratio=\"1\"","(Number format) :ratio=\"16/9\"","(String format) ratio=\"1\""],"category":"style"},"src":{"type":"String","desc":"Path to image","transformAssetUrls":true,"examples":["(public folder) src=\"img/something.png\"","(assets folder) src=\"~assets/my-img.gif\"","(relative path format) :src=\"require('./my_img.jpg')\"","(URL) src=\"https://picsum.photos/500/300\""],"category":"model"},"srcset":{"type":"String","desc":"Same syntax as <img> srcset attribute","link":"https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images#Resolution_switching_Different_sizes","examples":["elva-fairy-320w.jpg 320w, elva-fairy-480w.jpg 480w"],"category":"model"},"sizes":{"type":"String","desc":"Same syntax as <img> sizes attribute","link":"https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images#Resolution_switching_Different_sizes","examples":["(max-width: 320px) 280px, (max-width: 480px) 440px, 800px"],"category":"model"},"placeholder-src":{"type":"String","desc":"While waiting for your image to load, you can use a placeholder image","transformAssetUrls":true,"examples":["(public folder) placeholder-src=\"img/some-placeholder.png\"","(assets folder) placeholder-src=\"~assets/my-placeholder.gif\"","(relative path format) :placeholder-src=\"require('./placeholder.jpg')\"","(URL) placeholder-src=\"https://picsum.photos/500/300\""],"category":"model"},"error-src":{"type":"String","desc":"In case your image fails to load, you can use an error image","transformAssetUrls":true,"examples":["(public folder) error-src=\"img/some-placeholder.png\"","(assets folder) error-src=\"~assets/my-placeholder.gif\"","(relative path format) :error-src=\"require('./placeholder.jpg')\"","(URL) error-src=\"https://picsum.photos/500/300\""],"category":"model","addedIn":"v2.15"},"initial-ratio":{"type":["String","Number"],"desc":"Use it when not specifying 'ratio' but still wanting an initial aspect ratio","default":"16/9","examples":["(Number format) :initial-ratio=\"16/9\"","(String format) initial-ratio=\"1\""],"category":"style","required":false},"width":{"type":"String","desc":"Forces image width; Must also include the unit (px or %)","examples":["280px","70%"],"category":"style"},"height":{"type":"String","desc":"Forces image height; Must also include the unit (px or %)","examples":["280px","70%"],"category":"style"},"loading":{"type":"String","desc":"Lazy or immediate load; Same syntax as <img> loading attribute","default":"lazy","values":["lazy","eager"],"category":"behavior","required":false},"loading-show-delay":{"type":["Number","String"],"desc":"Delay showing the spinner when image changes; Gives time for the browser to load the image from cache to prevent flashing the spinner unnecessarily; Value should represent milliseconds","default":0,"examples":["500","caption-lines=\"1000\""],"category":"behavior","addedIn":"v2.14.6","required":false},"crossorigin":{"type":"String","desc":"Same syntax as <img> crossorigin attribute","values":["anonymous","use-credentials"],"category":"behavior"},"decoding":{"type":"String","desc":"Same syntax as <img> decoding attribute","values":["sync","async","auto"],"category":"behavior"},"referrerpolicy":{"type":"String","desc":"Same syntax as <img> referrerpolicy attribute","values":["no-referrer","no-referrer-when-downgrade","origin","origin-when-cross-origin","same-origin","strict-origin","strict-origin-when-cross-origin","unsafe-url"],"category":"behavior"},"fetchpriority":{"type":"String","desc":"Provides a hint of the relative priority to use when fetching the image","default":"auto","values":["high","low","auto"],"category":"behavior","addedIn":"v2.6.6","required":false},"fit":{"type":"String","desc":"How the image will fit into the container; Equivalent of the object-fit prop; Can be coordinated with 'position' prop","default":"cover","values":["cover","fill","contain","none","scale-down"],"category":"style","required":false},"position":{"type":"String","desc":"The alignment of the image into the container; Equivalent of the object-position CSS prop","default":"50% 50%","examples":["0 0","20px 50px"],"category":"style","required":false},"alt":{"type":"String","desc":"Specifies an alternate text for the image, if the image cannot be displayed","examples":["Two cats"],"category":"miscellaneous"},"draggable":{"type":"Boolean","desc":"Adds the native 'draggable' attribute","category":"miscellaneous"},"img-class":{"type":"String","desc":"CSS classes to be attributed to the native img element","examples":["my-special-class"],"category":"style"},"img-style":{"type":"Object","tsType":"VueStyleObjectProp","desc":"Apply CSS to the native img element","examples":[":img-style=\"{ transform: 'rotate(45deg)' }\" "],"category":"style"},"spinner-color":{"type":"String","tsType":"NamedColor","desc":"Color name for default Spinner (unless using a 'loading' slot)","examples":["primary","teal","teal-10"],"category":"style"},"spinner-size":{"type":"String","desc":"Size in CSS units, including unit name, for default Spinner (unless using a 'loading' slot)","examples":["16px","2rem"],"category":"style"},"no-spinner":{"type":"Boolean","desc":"Do not display the default spinner while waiting for the image to be loaded; It is overriden by the 'loading' slot when one is present","category":"behavior"},"no-native-menu":{"type":"Boolean","desc":"Disables the native context menu for the image","category":"behavior"},"no-transition":{"type":"Boolean","desc":"Disable default transition when switching between old and new image","category":"behavior"}},"slots":{"default":{"desc":"Default slot can be used for captions. See examples"},"loading":{"desc":"While image is loading, this slot is being displayed on top of the component; Suggestions: a spinner or text"},"error":{"desc":"Optional slot to be used when image could not be loaded; make sure you assign a min-height and min-width to the component through CSS"}},"events":{"load":{"desc":"Emitted when image has been loaded by the browser","params":{"src":{"type":"String","desc":"URL of image that has been loaded; useful when using 'srcset' and/or 'sizes'","examples":["https://some-site.net/some-img.gif"]}}},"error":{"desc":"Emitted when browser could not load the image","params":{"evt":{"type":"Event","desc":"JS Event object (same as the browser's native 'error' event)"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/img"},"props":{"ratio":{"type":["String","Number"],"desc":"Force the component to maintain an aspect ratio","examples":["1","'1.7778'","# :ratio=\"4/3\"","# :ratio=\"16/9\"","# (Number format) :ratio=\"16/9\"","# (String format) ratio=\"1\""],"category":"style"},"src":{"type":"String","desc":"Path to image","transformAssetUrls":true,"examples":["# (public folder) src=\"img/something.png\"","# (assets folder) src=\"~assets/my-img.gif\"","# (relative path format) :src=\"require('./my_img.jpg')\"","# (URL) src=\"https://picsum.photos/500/300\""],"category":"model"},"srcset":{"type":"String","desc":"Same syntax as <img> srcset attribute","link":"https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images#Resolution_switching_Different_sizes","examples":["'elva-fairy-320w.jpg 320w, elva-fairy-480w.jpg 480w'"],"category":"model"},"sizes":{"type":"String","desc":"Same syntax as <img> sizes attribute","link":"https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images#Resolution_switching_Different_sizes","examples":["'(max-width: 320px) 280px, (max-width: 480px) 440px, 800px'"],"category":"model"},"placeholder-src":{"type":"String","desc":"While waiting for your image to load, you can use a placeholder image","transformAssetUrls":true,"examples":["# (public folder) placeholder-src=\"img/some-placeholder.png\"","# (assets folder) placeholder-src=\"~assets/my-placeholder.gif\"","# (relative path format) :placeholder-src=\"require('./placeholder.jpg')\"","# (URL) placeholder-src=\"https://picsum.photos/500/300\""],"category":"model"},"error-src":{"type":"String","desc":"In case your image fails to load, you can use an error image","transformAssetUrls":true,"examples":["# (public folder) error-src=\"img/some-placeholder.png\"","# (assets folder) error-src=\"~assets/my-placeholder.gif\"","# (relative path format) :error-src=\"require('./placeholder.jpg')\"","# (URL) error-src=\"https://picsum.photos/500/300\""],"category":"model","addedIn":"v2.15"},"initial-ratio":{"type":["String","Number"],"desc":"Use it when not specifying 'ratio' but still wanting an initial aspect ratio","default":"1.77778","examples":["# (Number format) :initial-ratio=\"16/9\"","# (String format) initial-ratio=\"1\""],"category":"style","required":false},"width":{"type":"String","desc":"Forces image width; Must also include the unit (px or %)","examples":["'280px'","'70%'"],"category":"style"},"height":{"type":"String","desc":"Forces image height; Must also include the unit (px or %)","examples":["'280px'","'70%'"],"category":"style"},"loading":{"type":"String","desc":"Lazy or immediate load; Same syntax as <img> loading attribute","default":"'lazy'","values":["'lazy'","'eager'"],"category":"behavior","required":false},"loading-show-delay":{"type":["Number","String"],"desc":"Delay showing the spinner when image changes; Gives time for the browser to load the image from cache to prevent flashing the spinner unnecessarily; Value should represent milliseconds","default":"0","examples":["500","'700'"],"category":"behavior","addedIn":"v2.14.6","required":false},"crossorigin":{"type":"String","desc":"Same syntax as <img> crossorigin attribute","values":["'anonymous'","'use-credentials'"],"category":"behavior"},"decoding":{"type":"String","desc":"Same syntax as <img> decoding attribute","values":["'sync'","'async'","'auto'"],"category":"behavior"},"referrerpolicy":{"type":"String","desc":"Same syntax as <img> referrerpolicy attribute","values":["'no-referrer'","'no-referrer-when-downgrade'","'origin'","'origin-when-cross-origin'","'same-origin'","'strict-origin'","'strict-origin-when-cross-origin'","'unsafe-url'"],"category":"behavior"},"fetchpriority":{"type":"String","desc":"Provides a hint of the relative priority to use when fetching the image","default":"'auto'","values":["'high'","'low'","'auto'"],"category":"behavior","addedIn":"v2.6.6","required":false},"fit":{"type":"String","desc":"How the image will fit into the container; Equivalent of the object-fit prop; Can be coordinated with 'position' prop","default":"'cover'","values":["'cover'","'fill'","'contain'","'none'","'scale-down'"],"category":"style","required":false},"position":{"type":"String","desc":"The alignment of the image into the container; Equivalent of the object-position CSS prop","default":"'50% 50%'","examples":["'0 0'","'20px 50px'"],"category":"style","required":false},"alt":{"type":"String","desc":"Specifies an alternate text for the image, if the image cannot be displayed","examples":["'Two cats'"],"category":"miscellaneous"},"draggable":{"type":"Boolean","desc":"Adds the native 'draggable' attribute","category":"miscellaneous"},"img-class":{"type":"String","desc":"CSS classes to be attributed to the native img element","examples":["'my-special-class'"],"category":"style"},"img-style":{"type":"Object","tsType":"VueStyleObjectProp","desc":"Apply CSS to the native img element","examples":["{ transform: 'rotate(45deg)' }"],"category":"style"},"spinner-color":{"type":"String","tsType":"NamedColor","desc":"Color name for default Spinner (unless using a 'loading' slot)","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"spinner-size":{"type":"String","desc":"Size in CSS units, including unit name, for default Spinner (unless using a 'loading' slot)","examples":["'16px'","'2rem'"],"category":"style"},"no-spinner":{"type":"Boolean","desc":"Do not display the default spinner while waiting for the image to be loaded; It is overriden by the 'loading' slot when one is present","category":"behavior"},"no-native-menu":{"type":"Boolean","desc":"Disables the native context menu for the image","category":"behavior"},"no-transition":{"type":"Boolean","desc":"Disable default transition when switching between old and new image","category":"behavior"}},"slots":{"default":{"desc":"Default slot can be used for captions. See examples"},"loading":{"desc":"While image is loading, this slot is being displayed on top of the component; Suggestions: a spinner or text"},"error":{"desc":"Optional slot to be used when image could not be loaded; make sure you assign a min-height and min-width to the component through CSS"}},"events":{"load":{"desc":"Emitted when image has been loaded by the browser","params":{"src":{"type":"String","desc":"URL of image that has been loaded; useful when using 'srcset' and/or 'sizes'","examples":["'https://some-site.net/some-img.gif'"]}}},"error":{"desc":"Emitted when browser could not load the image","params":{"evt":{"type":"Event","desc":"JS Event object (same as the browser's native 'error' event)"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/infinite-scroll"},"props":{"offset":{"type":"Number","desc":"Offset (pixels) to bottom of Infinite Scroll container from which the component should start loading more content in advance","default":500,"category":"behavior","required":false},"debounce":{"type":["String","Number"],"desc":"Debounce amount (in milliseconds)","default":100,"category":"behavior","required":false},"initial-index":{"type":"Number","desc":"Initialize the pagination index (used for the @load event)","default":0,"category":"behavior","required":false},"scroll-target":{"type":["Element","String"],"desc":"CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one","examples":[":scroll-target=\"$refs.scrollTarget\"","scroll-target=\".scroll-target-class\"","scroll-target=\"#scroll-target-id\"","scroll-target=\"body\""],"category":"behavior"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"reverse":{"type":"Boolean","desc":"Scroll area should behave like a messenger - starting scrolled to bottom and loading when reaching the top","category":"behavior"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"},"loading":{"desc":"Slot displaying something while loading content; Example: QSpinner"}},"events":{"load":{"desc":"Emitted when Infinite Scroll needs to load more data","params":{"index":{"type":"Number","desc":"The index parameter can be used to make some sort of pagination on the content you load. It takes numeric values starting with 1 and incrementing with each call"},"done":{"type":"Function","desc":"Function to call when you made all necessary updates. DO NOT forget to call it otherwise your loading message will continue to be displayed","params":{"stop":{"type":"Boolean","desc":"Stops QInfiniteScroll if it's Boolean 'true'; Specify it in case there's nothing more to load"}},"returns":null}}}},"methods":{"poll":{"desc":"Checks scroll position and loads more content if necessary"},"trigger":{"desc":"Tells Infinite Scroll to load more content, regardless of the scroll position"},"reset":{"desc":"Resets calling index to 0"},"stop":{"desc":"Stops working, regardless of scroll position"},"resume":{"desc":"Starts working. Checks scroll position upon call and if trigger is hit, it loads more content"},"setIndex":{"desc":"Overwrite the current pagination index","params":{"newIndex":{"type":"Number","desc":"New pagination index","required":true}}},"updateScrollTarget":{"desc":"Updates the scroll target; Useful when the parent elements change so that the scrolling target also changes"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/infinite-scroll"},"props":{"offset":{"type":"Number","desc":"Offset (pixels) to bottom of Infinite Scroll container from which the component should start loading more content in advance","default":"500","category":"behavior","required":false},"debounce":{"type":["String","Number"],"desc":"Debounce amount (in milliseconds)","default":"100","category":"behavior","required":false},"initial-index":{"type":"Number","desc":"Initialize the pagination index (used for the @load event)","default":"0","category":"behavior","required":false},"scroll-target":{"type":["Element","String"],"desc":"CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one","examples":[".scroll-target-class","#scroll-target-id","$refs.scrollTarget","body"],"category":"behavior"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"reverse":{"type":"Boolean","desc":"Scroll area should behave like a messenger - starting scrolled to bottom and loading when reaching the top","category":"behavior"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"},"loading":{"desc":"Slot displaying something while loading content; Example: QSpinner"}},"events":{"load":{"desc":"Emitted when Infinite Scroll needs to load more data","params":{"index":{"type":"Number","desc":"The index parameter can be used to make some sort of pagination on the content you load. It takes numeric values starting with 1 and incrementing with each call"},"done":{"type":"Function","desc":"Function to call when you made all necessary updates. DO NOT forget to call it otherwise your loading message will continue to be displayed","params":{"stop":{"type":"Boolean","desc":"Stops QInfiniteScroll if it's Boolean 'true'; Specify it in case there's nothing more to load"}},"returns":null}}}},"methods":{"poll":{"desc":"Checks scroll position and loads more content if necessary"},"trigger":{"desc":"Tells Infinite Scroll to load more content, regardless of the scroll position"},"reset":{"desc":"Resets calling index to 0"},"stop":{"desc":"Stops working, regardless of scroll position"},"resume":{"desc":"Starts working. Checks scroll position upon call and if trigger is hit, it loads more content"},"setIndex":{"desc":"Overwrite the current pagination index","params":{"newIndex":{"type":"Number","desc":"New pagination index","required":true}}},"updateScrollTarget":{"desc":"Updates the scroll target; Useful when the parent elements change so that the scrolling target also changes"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/inner-loading"},"props":{"transition-show":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["fade","slide-down"],"category":"transition","default":"fade","required":false},"transition-hide":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["fade","slide-down"],"category":"transition","default":"fade","required":false},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":300,"category":"transition","required":false},"size":{"type":"String","desc":"Size in CSS units, including unit name, or standard size name (xs|sm|md|lg|xl), for the inner Spinner (unless using the default slot)","examples":["16px","2rem","xs","md"],"category":"style","default":"42px","required":false},"showing":{"type":"Boolean","desc":"State - loading or not","category":"state"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette for the inner Spinner (unless using the default slot)","examples":["primary","teal","teal-10"],"category":"style"},"label":{"type":"String","desc":"Add a label; Gets overriden when using the default slot","examples":["Please wait..."],"category":"label","addedIn":"v2.2"},"label-class":{"type":"String","desc":"Add CSS class(es) to the label; Works along the 'label' prop only","examples":["text-red q-mt-xl"],"category":"label","addedIn":"v2.2"},"label-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Apply custom style to the label; Works along the 'label' prop only","examples":["font-size: 28px",":label-style=\"{ color: '#ff0000' }\""],"category":"label","addedIn":"v2.2"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false}},"slots":{"default":{"desc":"Default slot is used for replacing default Spinner; Suggestions: a spinner or text"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/inner-loading"},"props":{"transition-show":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["'fade'","'slide-down'"],"category":"transition","default":"'fade'","required":false},"transition-hide":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["'fade'","'slide-down'"],"category":"transition","default":"'fade'","required":false},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":"300","category":"transition","required":false},"size":{"type":"String","desc":"Size in CSS units, including unit name, or standard size name (xs|sm|md|lg|xl), for the inner Spinner (unless using the default slot)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style","default":"'42px'","required":false},"showing":{"type":"Boolean","desc":"State - loading or not","category":"state"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette for the inner Spinner (unless using the default slot)","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"label":{"type":"String","desc":"Add a label; Gets overriden when using the default slot","examples":["'Please wait...'"],"category":"label","addedIn":"v2.2"},"label-class":{"type":"String","desc":"Add CSS class(es) to the label; Works along the 'label' prop only","examples":["'text-red q-mt-xl'"],"category":"label","addedIn":"v2.2"},"label-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Apply custom style to the label; Works along the 'label' prop only","examples":["'font-size: 28px'","{ color: '#ff0000' }"],"category":"label","addedIn":"v2.2"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false}},"slots":{"default":{"desc":"Default slot is used for replacing default Spinner; Suggestions: a spinner or text"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/input"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms; If not specified, it takes the value of 'for' prop, if it exists","examples":["car_id","car_id"],"category":"behavior"},"mask":{"type":"String","desc":"Custom mask or one of the predefined mask names","examples":["###-##","date","datetime","time","fulltime","phone","card"],"category":"behavior"},"fill-mask":{"type":["Boolean","String"],"desc":"Fills string with specified characters (or underscore if value is not string) to fill mask's length","examples":["true","'0'","'_'"],"category":"behavior"},"reverse-fill-mask":{"type":"Boolean","desc":"Fills string from the right side of the mask","category":"behavior"},"unmasked-value":{"type":"Boolean","desc":"Model will be unmasked (won't contain tokens/separation characters)","category":"behavior"},"model-value":{"desc":"Model of the component; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["String","Number","null","undefined"],"examples":["v-model=\"myText\""]},"error":{"type":["Boolean","null"],"default":null,"desc":"Does field have validation errors?","category":"behavior","required":false},"error-message":{"type":"String","desc":"Validation error message (gets displayed only if 'error' is set to 'true')","examples":["Username must have at least 5 characters"],"category":"content"},"no-error-icon":{"type":"Boolean","desc":"Hide error icon when there is an error","category":"content"},"rules":{"type":"Array","tsType":"ValidationRule","desc":"Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules","examples":[":rules=\"[ val => val.length <= 3 || 'Please use maximum 3 characters' ]\"",":rules=\"[ 'fulltime' ]\"",":rules=\"[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]\""],"category":"behavior"},"reactive-rules":{"type":"Boolean","desc":"By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it","category":"behavior"},"lazy-rules":{"type":["Boolean","String"],"desc":"If set to boolean true then it checks validation status against the 'rules' only after field loses focus for first time; If set to 'ondemand' then it will trigger only when component's validate() method is manually called or when the wrapper QForm submits itself","values":["(Boolean) true","(Boolean) false","ondemand"],"category":"behavior"},"label":{"type":"String","desc":"A text label that will “float” up above the input field, once the field gets focus","examples":["Username"],"category":"content"},"stack-label":{"type":"Boolean","desc":"Label will be always shown above the field regardless of field content (if any)","category":"content"},"hint":{"type":"String","desc":"Helper (hint) text which gets placed below your wrapped form component","examples":["Fill in between 3 and 12 characters"],"category":"content"},"hide-hint":{"type":"Boolean","desc":"Hide the helper (hint) text when field doesn't have focus","category":"content"},"prefix":{"type":"String","desc":"Prefix","examples":["$"],"category":"content"},"suffix":{"type":"String","desc":"Suffix","examples":["@gmail.com"],"category":"content"},"label-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the label from the Quasar Color Palette; Overrides the 'color' prop; The difference from 'color' prop is that the label will always have this color, even when field is not focused","examples":["primary","teal","teal-10"],"category":"style"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"bg-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"loading":{"type":"Boolean","desc":"Signals the user a process is in progress by displaying a spinner; Spinner can be customized by using the 'loading' slot.","category":"behavior|content"},"clearable":{"type":"Boolean","desc":"Appends clearable icon when a value (not undefined or null) is set; When clicked, model becomes null","category":"behavior|content"},"clear-icon":{"type":"String","desc":"Custom icon to use for the clear button when using along with 'clearable' prop","examples":["close"],"category":"content"},"filled":{"type":"Boolean","desc":"Use 'filled' design for the field","category":"style"},"outlined":{"type":"Boolean","desc":"Use 'outlined' design for the field","category":"style"},"borderless":{"type":"Boolean","desc":"Use 'borderless' design for the field","category":"style"},"standout":{"type":["Boolean","String"],"desc":"Use 'standout' design for the field; Specifies classes to be applied when focused (overriding default ones)","examples":["standout","standout=\"bg-primary text-white\""],"category":"style"},"label-slot":{"type":"Boolean","desc":"Enables label slot; You need to set it to force use of the 'label' slot if the 'label' prop is not set","category":"content"},"bottom-slots":{"type":"Boolean","desc":"Enables bottom slots ('error', 'hint', 'counter')","category":"content"},"hide-bottom-space":{"type":"Boolean","desc":"Do not reserve space for hint/error/counter anymore when these are not used; As a result, it also disables the animation for those; It also allows the hint/error area to stretch vertically based on its content","category":"style"},"counter":{"type":"Boolean","desc":"Show an automatic counter on bottom right","category":"content"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"square":{"type":"Boolean","desc":"Remove border-radius so borders are squared; Overrides 'rounded' prop","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"item-aligned":{"type":"Boolean","desc":"Match inner content alignment to that of QItem","category":"style"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"},"autofocus":{"type":"Boolean","desc":"Focus field on initial component render","category":"behavior"},"for":{"type":"String","desc":"Used to specify the 'id' of the control and also the 'for' attribute of the label that wraps it; If no 'name' prop is specified, then it is used for this attribute as well","examples":["myFieldsId"],"category":"behavior"},"shadow-text":{"type":"String","desc":"Text to be displayed as shadow at the end of the text in the control; Does NOT applies to type=file","examples":["rest of the fill value"],"category":"content"},"type":{"type":"String","desc":"Input type","default":"text","values":["text","password","textarea","email","search","tel","file","number","url","time","date","datetime-local"],"category":"general","required":false},"debounce":{"type":["String","Number"],"desc":"Debounce amount (in milliseconds) when updating model","category":"model"},"maxlength":{"type":["String","Number"],"desc":"Specify a max length of model","category":"model"},"autogrow":{"type":"Boolean","desc":"Make field autogrow along with its content (uses a textarea)","category":"content"},"input-class":{"type":["String","Array","Object"],"tsType":"VueClassProp","desc":"Class definitions to be attributed to the underlying input tag","examples":["my-special-class",":input-class=\"{ 'my-special-class': <condition> }\""],"category":"style"},"input-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Style definitions to be attributed to the underlying input tag","examples":["background-color: #ff0000",":input-style=\"{ backgroundColor: '#ff0000' }\""],"category":"style"}},"slots":{"default":{"desc":"Field main content"},"prepend":{"desc":"Prepend inner field; Suggestions: QIcon, QBtn"},"append":{"desc":"Append to inner field; Suggestions: QIcon, QBtn"},"before":{"desc":"Prepend outer field; Suggestions: QIcon, QBtn"},"after":{"desc":"Append outer field; Suggestions: QIcon, QBtn"},"label":{"desc":"Slot for label; Used only if 'label-slot' prop is set or the 'label' prop is set; When it is used the text in the 'label' prop is ignored"},"error":{"desc":"Slot for errors; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"hint":{"desc":"Slot for hint text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"counter":{"desc":"Slot for counter text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"loading":{"desc":"Override default spinner when component is in loading mode; Use in conjunction with 'loading' prop"}},"events":{"clear":{"desc":"When using the 'clearable' property, this event is emitted when the clear icon is clicked","params":{"value":{"type":"Any","desc":"The previous value before clearing it"}}},"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":["String","Number","null"],"desc":"New model value","required":true}}},"focus":{"desc":"Emitted when component gets focused","params":{"evt":{"type":"Event","desc":"JS event object"}}},"blur":{"desc":"Emitted when component loses focus","params":{"evt":{"type":"Event","desc":"JS event object"}}}},"methods":{"resetValidation":{"desc":"Reset validation status"},"validate":{"desc":"Trigger a validation","params":{"value":{"type":"Any","desc":"Optional value to validate against"}},"returns":{"type":["Boolean","Promise<boolean>"],"desc":"True/false if no async rules, otherwise a Promise with the outcome (true -> validation was a success, false -> invalid models detected)","examples":["true","validate().then(outcome => { ... })"]}},"focus":{"desc":"Focus underlying input tag"},"blur":{"desc":"Lose focus on underlying input tag"},"select":{"desc":"Select input text"},"getNativeElement":{"desc":"DEPRECATED; Access 'nativeEl' directly instead; Get the native input/textarea DOM Element","returns":{"type":"Element","tsType":"QInputNativeElement","desc":"The underlying native input/textarea DOM Element"}}},"computedProps":{"hasError":{"type":"Boolean","desc":"Whether the component is in error state"},"nativeEl":{"type":"Element","tsType":"QInputNativeElement","desc":"The native input/textarea DOM Element","addedIn":"v2.10.1"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/input"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms; If not specified, it takes the value of 'for' prop, if it exists","examples":["'car_id'","'car_id'"],"category":"behavior"},"mask":{"type":"String","desc":"Custom mask or one of the predefined mask names","examples":["'###-##'","'date'","'datetime'","'time'","'fulltime'","'phone'","'card'"],"category":"behavior"},"fill-mask":{"type":["Boolean","String"],"desc":"Fills string with specified characters (or underscore if value is not string) to fill mask's length","examples":["true","'0'","'_'"],"category":"behavior"},"reverse-fill-mask":{"type":"Boolean","desc":"Fills string from the right side of the mask","category":"behavior"},"unmasked-value":{"type":"Boolean","desc":"Model will be unmasked (won't contain tokens/separation characters)","category":"behavior"},"model-value":{"desc":"Model of the component; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["String","Number","null","undefined"],"examples":["# v-model=\"myText\""]},"error":{"type":["Boolean","null"],"default":"null","desc":"Does field have validation errors?","category":"behavior","required":false},"error-message":{"type":"String","desc":"Validation error message (gets displayed only if 'error' is set to 'true')","examples":["'Username must have at least 5 characters'"],"category":"content"},"no-error-icon":{"type":"Boolean","desc":"Hide error icon when there is an error","category":"content"},"rules":{"type":"Array","tsType":"ValidationRule","desc":"Array of Functions/Strings; If String, then it must be a name of one of the embedded validation rules","examples":["[ val => val.length <= 3 || 'Please use maximum 3 characters' ]","[ 'fulltime' ]","[ (val, rules) => rules.email(val) || 'Please enter a valid email address' ]"],"category":"behavior"},"reactive-rules":{"type":"Boolean","desc":"By default a change in the rules does not trigger a new validation until the model changes; If set to true then a change in the rules will trigger a validation; Has a performance penalty, so use it only when you really need it","category":"behavior"},"lazy-rules":{"type":["Boolean","String"],"desc":"If set to boolean true then it checks validation status against the 'rules' only after field loses focus for first time; If set to 'ondemand' then it will trigger only when component's validate() method is manually called or when the wrapper QForm submits itself","values":["true","false","'ondemand'"],"category":"behavior"},"label":{"type":"String","desc":"A text label that will “float” up above the input field, once the field gets focus","examples":["'Username'"],"category":"content"},"stack-label":{"type":"Boolean","desc":"Label will be always shown above the field regardless of field content (if any)","category":"content"},"hint":{"type":"String","desc":"Helper (hint) text which gets placed below your wrapped form component","examples":["'Fill in between 3 and 12 characters'"],"category":"content"},"hide-hint":{"type":"Boolean","desc":"Hide the helper (hint) text when field doesn't have focus","category":"content"},"prefix":{"type":"String","desc":"Prefix","examples":["'$'"],"category":"content"},"suffix":{"type":"String","desc":"Suffix","examples":["'@gmail.com'"],"category":"content"},"label-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the label from the Quasar Color Palette; Overrides the 'color' prop; The difference from 'color' prop is that the label will always have this color, even when field is not focused","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"bg-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"loading":{"type":"Boolean","desc":"Signals the user a process is in progress by displaying a spinner; Spinner can be customized by using the 'loading' slot.","category":"behavior|content"},"clearable":{"type":"Boolean","desc":"Appends clearable icon when a value (not undefined or null) is set; When clicked, model becomes null","category":"behavior|content"},"clear-icon":{"type":"String","desc":"Custom icon to use for the clear button when using along with 'clearable' prop","examples":["'close'"],"category":"content"},"filled":{"type":"Boolean","desc":"Use 'filled' design for the field","category":"style"},"outlined":{"type":"Boolean","desc":"Use 'outlined' design for the field","category":"style"},"borderless":{"type":"Boolean","desc":"Use 'borderless' design for the field","category":"style"},"standout":{"type":["Boolean","String"],"desc":"Use 'standout' design for the field; Specifies classes to be applied when focused (overriding default ones)","examples":["true","'bg-primary text-white'"],"category":"style"},"label-slot":{"type":"Boolean","desc":"Enables label slot; You need to set it to force use of the 'label' slot if the 'label' prop is not set","category":"content"},"bottom-slots":{"type":"Boolean","desc":"Enables bottom slots ('error', 'hint', 'counter')","category":"content"},"hide-bottom-space":{"type":"Boolean","desc":"Do not reserve space for hint/error/counter anymore when these are not used; As a result, it also disables the animation for those; It also allows the hint/error area to stretch vertically based on its content","category":"style"},"counter":{"type":"Boolean","desc":"Show an automatic counter on bottom right","category":"content"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"square":{"type":"Boolean","desc":"Remove border-radius so borders are squared; Overrides 'rounded' prop","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"item-aligned":{"type":"Boolean","desc":"Match inner content alignment to that of QItem","category":"style"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"},"autofocus":{"type":"Boolean","desc":"Focus field on initial component render","category":"behavior"},"for":{"type":"String","desc":"Used to specify the 'id' of the control and also the 'for' attribute of the label that wraps it; If no 'name' prop is specified, then it is used for this attribute as well","examples":["'myFieldsId'"],"category":"behavior"},"shadow-text":{"type":"String","desc":"Text to be displayed as shadow at the end of the text in the control; Does NOT applies to type=file","examples":["'rest of the fill value'"],"category":"content"},"type":{"type":"String","desc":"Input type","default":"'text'","values":["'text'","'password'","'textarea'","'email'","'search'","'tel'","'file'","'number'","'url'","'time'","'date'","'datetime-local'"],"category":"general","required":false},"debounce":{"type":["String","Number"],"desc":"Debounce amount (in milliseconds) when updating model","category":"model"},"maxlength":{"type":["String","Number"],"desc":"Specify a max length of model","category":"model"},"autogrow":{"type":"Boolean","desc":"Make field autogrow along with its content (uses a textarea)","category":"content"},"input-class":{"type":["String","Array","Object"],"tsType":"VueClassProp","desc":"Class definitions to be attributed to the underlying input tag","examples":["'my-special-class'","{ 'my-special-class': <condition> }"],"category":"style"},"input-style":{"type":["String","Array","Object"],"tsType":"VueStyleProp","desc":"Style definitions to be attributed to the underlying input tag","examples":["'background-color: #ff0000'","{ backgroundColor: '#ff0000' }"],"category":"style"}},"slots":{"default":{"desc":"Field main content"},"prepend":{"desc":"Prepend inner field; Suggestions: QIcon, QBtn"},"append":{"desc":"Append to inner field; Suggestions: QIcon, QBtn"},"before":{"desc":"Prepend outer field; Suggestions: QIcon, QBtn"},"after":{"desc":"Append outer field; Suggestions: QIcon, QBtn"},"label":{"desc":"Slot for label; Used only if 'label-slot' prop is set or the 'label' prop is set; When it is used the text in the 'label' prop is ignored"},"error":{"desc":"Slot for errors; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"hint":{"desc":"Slot for hint text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"counter":{"desc":"Slot for counter text; Enabled only if 'bottom-slots' prop is used; Suggestion: <div>"},"loading":{"desc":"Override default spinner when component is in loading mode; Use in conjunction with 'loading' prop"}},"events":{"clear":{"desc":"When using the 'clearable' property, this event is emitted when the clear icon is clicked","params":{"value":{"type":"Any","desc":"The previous value before clearing it"}}},"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":["String","Number","null"],"desc":"New model value","required":true}}},"focus":{"desc":"Emitted when component gets focused","params":{"evt":{"type":"Event","desc":"JS event object"}}},"blur":{"desc":"Emitted when component loses focus","params":{"evt":{"type":"Event","desc":"JS event object"}}}},"methods":{"resetValidation":{"desc":"Reset validation status"},"validate":{"desc":"Trigger a validation","params":{"value":{"type":"Any","desc":"Optional value to validate against"}},"returns":{"type":["Boolean","Promise<boolean>"],"desc":"True/false if no async rules, otherwise a Promise with the outcome (true -> validation was a success, false -> invalid models detected)","examples":["true","validate().then(outcome => { ... })"]}},"focus":{"desc":"Focus underlying input tag"},"blur":{"desc":"Lose focus on underlying input tag"},"select":{"desc":"Select input text"},"getNativeElement":{"desc":"DEPRECATED; Access 'nativeEl' directly instead; Get the native input/textarea DOM Element","returns":{"type":"Element","tsType":"QInputNativeElement","desc":"The underlying native input/textarea DOM Element"}}},"computedProps":{"hasError":{"type":"Boolean","desc":"Whether the component is in error state"},"nativeEl":{"type":"Element","tsType":"QInputNativeElement","desc":"The native input/textarea DOM Element","addedIn":"v2.10.1"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/intersection"},"props":{"tag":{"type":"String","desc":"HTML tag to use","examples":["div","span","div","span","blockquote"],"category":"content","default":"div","required":false},"once":{"type":"Boolean","desc":"Get triggered only once","category":"behavior"},"ssr-prerender":{"type":"Boolean","desc":"Pre-render content on server side if using SSR (use it to pre-render above the fold content)","category":"behavior"},"root":{"type":["Element","null"],"default":null,"desc":"[Intersection API root prop] Lets you define an alternative to the viewport as your root (through its DOM element); It is important to keep in mind that root needs to be an ancestor of the observed element","examples":["$refs.myTable.$el","getElementById(\"myTable\")"],"category":"behavior","required":false},"margin":{"type":"String","desc":"[Intersection API rootMargin prop] Allows you to specify the margins for the root, effectively allowing you to either grow or shrink the area used for intersections","examples":["-20px 0px","10px 20px 30px 40px"],"category":"behavior"},"threshold":{"type":["Array","Number"],"desc":"[Intersection API threshold prop] Threshold(s) at which to trigger, specified as a ratio, or list of ratios, of (visible area / total area) of the observed element","examples":["[ 0, 0.25, 0.5, 0.75, 1 ]",":threshold=\"1\""],"category":"behavior"},"transition":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["fade","slide-down"],"category":"behavior"},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":300,"category":"behavior","addedIn":"v2.3.1","required":false},"disable":{"type":"Boolean","desc":"Disable visibility observable (content will remain as it was, visible or hidden)","category":"behavior"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"},"hidden":{"desc":"Slot for content to render when component is not on screen; Example: a text that the user can search for with the browser's search function","addedIn":"v2.12.0"}},"events":{"visibility":{"desc":"Fires when visibility changes","params":{"isVisible":{"type":"Boolean","desc":"Visibility status (true/false)"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/intersection"},"props":{"tag":{"type":"String","desc":"HTML tag to use","examples":["'div'","'span'","'div'","'span'","'blockquote'"],"category":"content","default":"'div'","required":false},"once":{"type":"Boolean","desc":"Get triggered only once","category":"behavior"},"ssr-prerender":{"type":"Boolean","desc":"Pre-render content on server side if using SSR (use it to pre-render above the fold content)","category":"behavior"},"root":{"type":["Element","null"],"default":"null","desc":"[Intersection API root prop] Lets you define an alternative to the viewport as your root (through its DOM element); It is important to keep in mind that root needs to be an ancestor of the observed element","examples":["document.getElementById('myTable')","$refs.myTable.$el"],"category":"behavior","required":false},"margin":{"type":"String","desc":"[Intersection API rootMargin prop] Allows you to specify the margins for the root, effectively allowing you to either grow or shrink the area used for intersections","examples":["'-20px 0px'","'10px 20px 30px 40px'"],"category":"behavior"},"threshold":{"type":["Array","Number"],"desc":"[Intersection API threshold prop] Threshold(s) at which to trigger, specified as a ratio, or list of ratios, of (visible area / total area) of the observed element","examples":["[ 0, 0.25, 0.5, 0.75, 1 ]","1"],"category":"behavior"},"transition":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["'fade'","'slide-down'"],"category":"behavior"},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":"300","category":"behavior","addedIn":"v2.3.1","required":false},"disable":{"type":"Boolean","desc":"Disable visibility observable (content will remain as it was, visible or hidden)","category":"behavior"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"},"hidden":{"desc":"Slot for content to render when component is not on screen; Example: a text that the user can search for with the browser's search function","addedIn":"v2.12.0"}},"events":{"visibility":{"desc":"Fires when visibility changes","params":{"isVisible":{"type":"Boolean","desc":"Visibility status (true/false)"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/list-and-list-items"},"props":{"to":{"type":["String","Object"],"desc":"Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used","examples":["/home/dashboard",":to=\"{ name: 'my-route-name' }\""],"category":"navigation"},"exact":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'exact' property; Superseded by 'href' prop if used","category":"navigation"},"replace":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used","category":"navigation"},"active-class":{"type":"String","desc":"Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used","examples":["my-active-class"],"category":"navigation"},"exact-active-class":{"type":"String","desc":"Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used","examples":["my-exact-active-class"],"category":"navigation"},"href":{"type":"String","desc":"Native <a> link href attribute; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props","examples":["https://quasar.dev"],"category":"navigation","addedIn":"v2.4"},"target":{"type":"String","desc":"Native <a> link target attribute; Use it only along with 'href' prop; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props","examples":["_blank","_self","_parent","_top"],"category":"navigation","addedIn":"v2.4"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"active":{"type":["Boolean","null"],"default":null,"desc":"Put item into 'active' state","category":"state","required":false},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"clickable":{"type":"Boolean","desc":"Is QItem clickable? If it's the case, then it will add hover effects and emit 'click' events","category":"state"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"inset-level":{"type":"Number","desc":"Apply an inset; Useful when avatar/left side is missing but you want to align content with other items that do have a left side, or when you're building a menu","examples":[":inset-level=\"1\""],"category":"content"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["0","100"],"category":"general"},"tag":{"type":"String","desc":"HTML tag to render; Suggestion: use 'label' when encapsulating a QCheckbox/QRadio/QToggle so that when user clicks/taps on the whole item it will trigger a model change for the mentioned components","examples":["div","span","a","label","div"],"category":"content","default":"div","required":false},"manual-focus":{"type":"Boolean","desc":"Put item into a manual focus state; Enables 'focused' prop which will determine if item is focused or not, rather than relying on native hover/focus states","category":"state"},"focused":{"type":"Boolean","desc":"Determines focus state, ONLY if 'manual-focus' is enabled / set to true","category":"state"}},"slots":{"default":{"desc":"This is where QItem's content goes"}},"events":{"click":{"desc":"Emitted when the component is clicked","params":{"evt":{"type":"Event","desc":"JS event object; If you are using route navigation ('to'/'replace' props) and you want to cancel navigation then call evt.preventDefault() synchronously in your event handler"},"go":{"type":"Function","desc":"Available ONLY if you are using route navigation ('to'/'replace' props); When you need to control the time at which the component should trigger the route navigation then call evt.preventDefault() synchronously and then call this function at your convenience; Useful if you have async work to be done before the actual route navigation or if you want to redirect somewhere else","required":false,"addedIn":"v2.9","params":{"opts":{"type":"Object","desc":"Optional options","required":false,"definition":{"to":{"type":["String","Object"],"desc":"Equivalent to Vue Router <router-link> 'to' property; Specify it explicitly otherwise it will be set with same value as component's 'to' prop","required":false,"examples":["/home/dashboard","{ name: 'my-route-name' }"]},"replace":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'replace' property; Specify it explicitly otherwise it will be set with same value as component's 'replace' prop","required":false},"returnRouterError":{"type":"Boolean","desc":"Return the router error, if any; Otherwise the returned Promise will always fulfill","required":false}}}},"returns":{"type":"Promise<any>","desc":"Returns the router's navigation promise"}}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/list-and-list-items"},"props":{"to":{"type":["String","Object"],"desc":"Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used","examples":["'/home/dashboard'","{ name: 'my-route-name' }"],"category":"navigation"},"exact":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'exact' property; Superseded by 'href' prop if used","category":"navigation"},"replace":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used","category":"navigation"},"active-class":{"type":"String","desc":"Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used","examples":["'my-active-class'"],"category":"navigation"},"exact-active-class":{"type":"String","desc":"Equivalent to Vue Router <router-link> 'active-class' property; Superseded by 'href' prop if used","examples":["'my-exact-active-class'"],"category":"navigation"},"href":{"type":"String","desc":"Native <a> link href attribute; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props","examples":["'https://quasar.dev'"],"category":"navigation","addedIn":"v2.4"},"target":{"type":"String","desc":"Native <a> link target attribute; Use it only along with 'href' prop; Has priority over the 'to'/'exact'/'replace'/'active-class'/'exact-active-class' props","examples":["'_blank'","'_self'","'_parent'","'_top'"],"category":"navigation","addedIn":"v2.4"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"active":{"type":["Boolean","null"],"default":"null","desc":"Put item into 'active' state","category":"state","required":false},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"clickable":{"type":"Boolean","desc":"Is QItem clickable? If it's the case, then it will add hover effects and emit 'click' events","category":"state"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"inset-level":{"type":"Number","desc":"Apply an inset; Useful when avatar/left side is missing but you want to align content with other items that do have a left side, or when you're building a menu","examples":["1"],"category":"content"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["100","'0'"],"category":"general"},"tag":{"type":"String","desc":"HTML tag to render; Suggestion: use 'label' when encapsulating a QCheckbox/QRadio/QToggle so that when user clicks/taps on the whole item it will trigger a model change for the mentioned components","examples":["'div'","'span'","'a'","'label'","'div'"],"category":"content","default":"'div'","required":false},"manual-focus":{"type":"Boolean","desc":"Put item into a manual focus state; Enables 'focused' prop which will determine if item is focused or not, rather than relying on native hover/focus states","category":"state"},"focused":{"type":"Boolean","desc":"Determines focus state, ONLY if 'manual-focus' is enabled / set to true","category":"state"}},"slots":{"default":{"desc":"This is where QItem's content goes"}},"events":{"click":{"desc":"Emitted when the component is clicked","params":{"evt":{"type":"Event","desc":"JS event object; If you are using route navigation ('to'/'replace' props) and you want to cancel navigation then call evt.preventDefault() synchronously in your event handler"},"go":{"type":"Function","desc":"Available ONLY if you are using route navigation ('to'/'replace' props); When you need to control the time at which the component should trigger the route navigation then call evt.preventDefault() synchronously and then call this function at your convenience; Useful if you have async work to be done before the actual route navigation or if you want to redirect somewhere else","required":false,"addedIn":"v2.9","params":{"opts":{"type":"Object","desc":"Optional options","required":false,"definition":{"to":{"type":["String","Object"],"desc":"Equivalent to Vue Router <router-link> 'to' property; Specify it explicitly otherwise it will be set with same value as component's 'to' prop","required":false,"examples":["'/home/dashboard'","{ name: 'my-route-name' }"]},"replace":{"type":"Boolean","desc":"Equivalent to Vue Router <router-link> 'replace' property; Specify it explicitly otherwise it will be set with same value as component's 'replace' prop","required":false},"returnRouterError":{"type":"Boolean","desc":"Return the router error, if any; Otherwise the returned Promise will always fulfill","required":false}}}},"returns":{"type":"Promise<any>","desc":"Returns the router's navigation promise"}}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/knob"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL","examples":["car_id"],"category":"behavior"},"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["16px","2rem","xs","md"],"category":"style"},"model-value":{"desc":"Any number to indicate the given value of the knob. Either use this property (along with a listener for 'update:modelValue' event) OR use the v-model directive","required":true,"syncable":true,"category":"model","type":"Number","examples":["v-model=\"myValue\""]},"min":{"type":"Number","desc":"The minimum value that the model (the knob value) should start at","category":"model"},"max":{"type":"Number","desc":"The maximum value that the model (the knob value) should go to","category":"model"},"inner-min":{"type":"Number","desc":"Inner minimum value of the model; Use in case you need the model value to be inside of the track's min-max values; Needs to be higher or equal to 'min' prop; Defaults to 'min' prop","category":"model","addedIn":"v2.5.4"},"inner-max":{"type":"Number","desc":"Inner maximum value of the model; Use in case you need the model value to be inside of the track's min-max values; Needs to be lower or equal to 'max' prop; Defaults to 'max' prop","category":"model","addedIn":"v2.5.4"},"step":{"type":"Number","default":1,"desc":"A number representing steps in the value of the model, while adjusting the knob","category":"model","required":false},"reverse":{"type":"Boolean","desc":"Reverses the direction of progress","category":"behavior"},"instant-feedback":{"type":"Boolean","desc":"No animation when model changes","category":"behavior"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"center-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the center part of the component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"track-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the track of the component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"font-size":{"type":"String","desc":"Size of text in CSS units, including unit name. Suggestion: use 'em' units to sync with component size","default":"0.25em","examples":["1em","16px","2rem"],"category":"style","required":false},"thickness":{"type":"Number","default":0.2,"desc":"Thickness of progress arc as a ratio (0.0 < x < 1.0) of component size","category":"style","required":false},"angle":{"type":"Number","desc":"Angle to rotate progress arc by","default":0,"category":"content","required":false},"show-value":{"type":"Boolean","desc":"Enables the default slot and uses it (if available), otherwise it displays the 'value' prop as text; Make sure the text has enough space to be displayed inside the component","category":"content|behavior"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["0","100"],"category":"general"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Number","desc":"New model value","required":true}}},"change":{"desc":"Fires at the end of a knob's adjustment and offers the value of the model","params":{"value":{"type":"Number","desc":"New model value"}}},"drag-value":{"desc":"The value of the model while dragging is still in progress","params":{"value":{"type":"Number","desc":"New model value"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/knob"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL","examples":["'car_id'"],"category":"behavior"},"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style"},"model-value":{"desc":"Any number to indicate the given value of the knob. Either use this property (along with a listener for 'update:modelValue' event) OR use the v-model directive","required":true,"syncable":true,"category":"model","type":"Number","examples":["# v-model=\"myValue\""]},"min":{"type":"Number","desc":"The minimum value that the model (the knob value) should start at","category":"model"},"max":{"type":"Number","desc":"The maximum value that the model (the knob value) should go to","category":"model"},"inner-min":{"type":"Number","desc":"Inner minimum value of the model; Use in case you need the model value to be inside of the track's min-max values; Needs to be higher or equal to 'min' prop; Defaults to 'min' prop","category":"model","addedIn":"v2.5.4"},"inner-max":{"type":"Number","desc":"Inner maximum value of the model; Use in case you need the model value to be inside of the track's min-max values; Needs to be lower or equal to 'max' prop; Defaults to 'max' prop","category":"model","addedIn":"v2.5.4"},"step":{"type":"Number","default":"1","desc":"A number representing steps in the value of the model, while adjusting the knob","category":"model","required":false},"reverse":{"type":"Boolean","desc":"Reverses the direction of progress","category":"behavior"},"instant-feedback":{"type":"Boolean","desc":"No animation when model changes","category":"behavior"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"center-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the center part of the component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"track-color":{"type":"String","tsType":"NamedColor","desc":"Color name for the track of the component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"font-size":{"type":"String","desc":"Size of text in CSS units, including unit name. Suggestion: use 'em' units to sync with component size","default":"'0.25em'","examples":["'1em'","'16px'","'2rem'"],"category":"style","required":false},"thickness":{"type":"Number","default":"0.2","desc":"Thickness of progress arc as a ratio (0.0 < x < 1.0) of component size","category":"style","required":false},"angle":{"type":"Number","desc":"Angle to rotate progress arc by","default":"0","category":"content","required":false},"show-value":{"type":"Boolean","desc":"Enables the default slot and uses it (if available), otherwise it displays the 'value' prop as text; Make sure the text has enough space to be displayed inside the component","category":"content|behavior"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["100","'0'"],"category":"general"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Number","desc":"New model value","required":true}}},"change":{"desc":"Fires at the end of a knob's adjustment and offers the value of the model","params":{"value":{"type":"Number","desc":"New model value"}}},"drag-value":{"desc":"The value of the model while dragging is still in progress","params":{"value":{"type":"Number","desc":"New model value"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/layout"},"props":{"view":{"type":"String","desc":"Defines how your layout components (header/footer/drawer) should be placed on screen; See docs examples","default":"hhh lpr fff","examples":["hHh lpR fFf"],"category":"content","required":false},"container":{"type":"Boolean","desc":"Containerize the layout which means it changes the default behavior of expanding to the whole window; Useful (but not limited to) for when using on a QDialog","category":"content"}},"slots":{"default":{"desc":"Suggestion: QHeader, QFooter, QDrawer, QPageContainer"}},"events":{"resize":{"desc":"Emitted when layout size (height, width) changes","params":{"size":{"type":"Object","desc":"New size","definition":{"height":{"type":"Number","required":true,"desc":"Layout height"},"width":{"type":"Number","required":true,"desc":"Layout width"}}}}},"scroll":{"desc":"Emitted when user scrolls within layout","params":{"details":{"type":"Object","desc":"Scroll details","definition":{"position":{"type":"Number","required":true,"desc":"Scroll offset from top (vertical)"},"direction":{"type":"String","required":true,"desc":"Direction of scroll","values":["up","down"]},"directionChanged":{"type":"Boolean","required":true,"desc":"Has scroll direction changed since event was last emitted?"},"delta":{"type":"Number","required":true,"desc":"Vertical delta distance since event was last emitted"},"inflectionPoint":{"type":"Number","required":true,"desc":"Scroll offset from top (vertical)"}}}}},"scroll-height":{"desc":"Emitted when the scroll size of layout changes","params":{"height":{"type":"Number","desc":"New scroll height of layout"}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/layout/layout"},"props":{"view":{"type":"String","desc":"Defines how your layout components (header/footer/drawer) should be placed on screen; See docs examples","default":"'hhh lpr fff'","examples":["'hHh lpR fFf'"],"category":"content","required":false},"container":{"type":"Boolean","desc":"Containerize the layout which means it changes the default behavior of expanding to the whole window; Useful (but not limited to) for when using on a QDialog","category":"content"}},"slots":{"default":{"desc":"Suggestion: QHeader, QFooter, QDrawer, QPageContainer"}},"events":{"resize":{"desc":"Emitted when layout size (height, width) changes","params":{"size":{"type":"Object","desc":"New size","definition":{"height":{"type":"Number","required":true,"desc":"Layout height"},"width":{"type":"Number","required":true,"desc":"Layout width"}}}}},"scroll":{"desc":"Emitted when user scrolls within layout","params":{"details":{"type":"Object","desc":"Scroll details","definition":{"position":{"type":"Number","required":true,"desc":"Scroll offset from top (vertical)"},"direction":{"type":"String","required":true,"desc":"Direction of scroll","values":["'up'","'down'"]},"directionChanged":{"type":"Boolean","required":true,"desc":"Has scroll direction changed since event was last emitted?"},"delta":{"type":"Number","required":true,"desc":"Vertical delta distance since event was last emitted"},"inflectionPoint":{"type":"Number","required":true,"desc":"Scroll offset from top (vertical)"}}}}},"scroll-height":{"desc":"Emitted when the scroll size of layout changes","params":{"height":{"type":"Number","desc":"New scroll height of layout"}}}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/linear-progress"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["16px","2rem","xs","md"],"category":"style"},"value":{"type":"Number","desc":"Progress value (0.0 < x < 1.0)","default":0,"category":"model","required":false},"buffer":{"type":"Number","desc":"Optional buffer value (0.0 < x < 1.0)","category":"behavior"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"track-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component's track from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"reverse":{"type":"Boolean","desc":"Reverse direction of progress","category":"behavior"},"stripe":{"type":"Boolean","desc":"Draw stripes; For determinate state only (for performance reasons)","category":"content"},"indeterminate":{"type":"Boolean","desc":"Put component into indeterminate mode","category":"behavior"},"query":{"type":"Boolean","desc":"Put component into query mode","category":"behavior"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"instant-feedback":{"type":"Boolean","desc":"No transition when model changes","category":"behavior"},"animation-speed":{"type":["String","Number"],"desc":"Animation speed (in milliseconds, without unit)","examples":[500,"1200"],"category":"style","default":2100,"addedIn":"v2.3","required":false}},"slots":{"default":{"desc":"Suggestion: QTooltip"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/linear-progress"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style"},"value":{"type":"Number","desc":"Progress value (0.0 < x < 1.0)","default":"0","category":"model","required":false},"buffer":{"type":"Number","desc":"Optional buffer value (0.0 < x < 1.0)","category":"behavior"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"track-color":{"type":"String","tsType":"NamedColor","desc":"Color name for component's track from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"reverse":{"type":"Boolean","desc":"Reverse direction of progress","category":"behavior"},"stripe":{"type":"Boolean","desc":"Draw stripes; For determinate state only (for performance reasons)","category":"content"},"indeterminate":{"type":"Boolean","desc":"Put component into indeterminate mode","category":"behavior"},"query":{"type":"Boolean","desc":"Put component into query mode","category":"behavior"},"rounded":{"type":"Boolean","desc":"Applies a small standard border-radius for a squared shape of the component","category":"style"},"instant-feedback":{"type":"Boolean","desc":"No transition when model changes","category":"behavior"},"animation-speed":{"type":["String","Number"],"desc":"Animation speed (in milliseconds, without unit)","examples":["500","'1200'"],"category":"style","default":"2100","addedIn":"v2.3","required":false}},"slots":{"default":{"desc":"Suggestion: QTooltip"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/list-and-list-items"},"props":{"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"separator":{"type":"Boolean","desc":"Applies a separator between contained items","category":"content"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"padding":{"type":"Boolean","desc":"Applies a material design-like padding on top and bottom","category":"content"},"tag":{"type":"String","desc":"HTML tag to use","examples":["div","span","div","ul","ol"],"category":"content","default":"div","addedIn":"v2.10.1","required":false}},"slots":{"default":{"desc":"This is where the content goes; Suggestion: QItem, QExpansionItem, ..."}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/list-and-list-items"},"props":{"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"separator":{"type":"Boolean","desc":"Applies a separator between contained items","category":"content"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"padding":{"type":"Boolean","desc":"Applies a material design-like padding on top and bottom","category":"content"},"tag":{"type":"String","desc":"HTML tag to use","examples":["'div'","'span'","'div'","'ul'","'ol'"],"category":"content","default":"'div'","addedIn":"v2.10.1","required":false}},"slots":{"default":{"desc":"This is where the content goes; Suggestion: QItem, QExpansionItem, ..."}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/markup-table"},"props":{"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"flat":{"type":"Boolean","desc":"Applies a 'flat' design (no default shadow)","category":"style"},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"square":{"type":"Boolean","desc":"Removes border-radius so borders are squared","category":"style"},"separator":{"type":"String","desc":"Use a separator/border between rows, columns or all cells","default":"horizontal","values":["horizontal","vertical","cell","none"],"examples":["cell"],"category":"content","required":false},"wrap-cells":{"type":"Boolean","desc":"Wrap text within table cells","category":"content"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/markup-table"},"props":{"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"flat":{"type":"Boolean","desc":"Applies a 'flat' design (no default shadow)","category":"style"},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"square":{"type":"Boolean","desc":"Removes border-radius so borders are squared","category":"style"},"separator":{"type":"String","desc":"Use a separator/border between rows, columns or all cells","default":"'horizontal'","values":["'horizontal'","'vertical'","'cell'","'none'"],"examples":["'cell'"],"category":"content","required":false},"wrap-cells":{"type":"Boolean","desc":"Wrap text within table cells","category":"content"}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/menu"},"props":{"transition-show":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["fade","slide-down"],"category":"transition","default":"fade","required":false},"transition-hide":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["fade","slide-down"],"category":"transition","default":"fade","required":false},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":300,"category":"transition","required":false},"target":{"type":["Boolean","String","Element"],"desc":"Configure a target element to trigger component toggle; 'true' means it enables the parent DOM element, 'false' means it disables attaching events to any DOM elements; By using a String (CSS selector) or a DOM element it attaches the events to the specified DOM element (if it exists)","default":true,"values":["(Boolean) true","(Boolean) false","(CSS selector)","(DOM Element)"],"examples":[":target=\"false\"",":target=\"$refs.target\"","target=\".my-parent\"","target=\"#target-id\""],"category":"behavior","required":false},"no-parent-event":{"type":"Boolean","desc":"Skips attaching events to the target DOM element (that trigger the element to get shown)","category":"behavior"},"context-menu":{"type":"Boolean","desc":"Allows the component to behave like a context menu, which opens with a right mouse click (or long tap on mobile)","category":"behavior"},"model-value":{"type":"Boolean","desc":"Model of the component defining shown/hidden state; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive","category":"model"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"fit":{"type":"Boolean","desc":"Allows the menu to match at least the full width of its target","category":"position"},"cover":{"type":"Boolean","desc":"Allows the menu to cover its target. When used, the 'self' and 'fit' props are no longer effective","category":"position"},"anchor":{"type":"String","desc":"Two values setting the starting position or anchor point of the menu relative to its target","values":["top left","top middle","top right","top start","top end","center left","center middle","center right","center start","center end","bottom left","bottom middle","bottom right","bottom start","bottom end"],"category":"position"},"self":{"type":"String","desc":"Two values setting the menu's own position relative to its target","values":["top left","top middle","top right","top start","top end","center left","center middle","center right","center start","center end","bottom left","bottom middle","bottom right","bottom start","bottom end"],"category":"position"},"offset":{"type":"Array","desc":"An array of two numbers to offset the menu horizontally and vertically in pixels","examples":["[8, 8]","[5, 10]"],"category":"position"},"scroll-target":{"type":["Element","String"],"desc":"CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one","examples":[":scroll-target=\"$refs.scrollTarget\"","scroll-target=\".scroll-target-class\"","scroll-target=\"#scroll-target-id\"","scroll-target=\"body\""],"category":"behavior"},"touch-position":{"type":"Boolean","desc":"Allows for the target position to be set by the mouse position, when the target of the menu is either clicked or touched","category":"behavior"},"persistent":{"type":"Boolean","desc":"Allows the menu to not be dismissed by a click/tap outside of the menu or by hitting the ESC key; Also, an app route change won't dismiss it","category":"behavior"},"no-route-dismiss":{"type":"Boolean","desc":"Changing route app won't dismiss the popup; No need to set it if 'persistent' prop is also set","category":"behavior"},"auto-close":{"type":"Boolean","desc":"Allows any click/tap in the menu to close it; Useful instead of attaching events to each menu item that should close the menu on click/tap","category":"behavior"},"separate-close-popup":{"type":"Boolean","desc":"Separate from parent menu, marking it as a separate closing point for v-close-popup (without this, chained menus close all together)","category":"behavior"},"square":{"type":"Boolean","desc":"Forces content to have squared borders","category":"style"},"no-refocus":{"type":"Boolean","desc":"(Accessibility) When Menu gets hidden, do not refocus on the DOM element that previously had focus","category":"behavior"},"no-focus":{"type":"Boolean","desc":"(Accessibility) When Menu gets shown, do not switch focus on it","category":"behavior"},"max-height":{"type":["String","null"],"desc":"The maximum height of the menu; Size in CSS units, including unit name","examples":["16px","2rem"],"category":"style","default":null,"required":false},"max-width":{"type":["String","null"],"desc":"The maximum width of the menu; Size in CSS units, including unit name","examples":["16px","2rem"],"category":"style","default":null,"required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}},"events":{"update:model-value":{"desc":"Emitted when showing/hidden state changes; Is also used by v-model","params":{"value":{"type":"Boolean","desc":"New state (showing/hidden)"}}},"show":{"desc":"Emitted after component has triggered show()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"before-show":{"desc":"Emitted when component triggers show() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"hide":{"desc":"Emitted after component has triggered hide()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"before-hide":{"desc":"Emitted when component triggers hide() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"escape-key":{"desc":"Emitted when ESC key is pressed; Does not get emitted if Menu is 'persistent'"}},"methods":{"show":{"desc":"Triggers component to show","params":{"evt":{"type":"Event","desc":"JS event object","required":false}}},"hide":{"desc":"Triggers component to hide","params":{"evt":{"type":"Event","desc":"JS event object","required":false}}},"toggle":{"params":{"evt":{"type":"Event","desc":"JS event object","required":false}},"desc":"Triggers component to toggle between show/hide"},"updatePosition":{"desc":"There are some custom scenarios for which Quasar cannot automatically reposition the menu without significant performance drawbacks so the optimal solution is for you to call this method when you need it"},"focus":{"desc":"Focus menu; if you have content with autofocus attribute, it will directly focus it"}},"computedProps":{"contentEl":{"type":"Element","desc":"The DOM Element of the rendered content","addedIn":"v2.10.1"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/menu"},"props":{"transition-show":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["'fade'","'slide-down'"],"category":"transition","default":"'fade'","required":false},"transition-hide":{"type":"String","desc":"One of Quasar's embedded transitions","examples":["'fade'","'slide-down'"],"category":"transition","default":"'fade'","required":false},"transition-duration":{"type":["String","Number"],"desc":"Transition duration (in milliseconds, without unit)","default":"300","category":"transition","required":false},"target":{"type":["Boolean","String","Element"],"desc":"Configure a target element to trigger component toggle; 'true' means it enables the parent DOM element, 'false' means it disables attaching events to any DOM elements; By using a String (CSS selector) or a DOM element it attaches the events to the specified DOM element (if it exists)","default":"true","values":["true","false","# CSS selector","# DOM Element"],"examples":["false",".my-parent","#target-id","$refs.target"],"category":"behavior","required":false},"no-parent-event":{"type":"Boolean","desc":"Skips attaching events to the target DOM element (that trigger the element to get shown)","category":"behavior"},"context-menu":{"type":"Boolean","desc":"Allows the component to behave like a context menu, which opens with a right mouse click (or long tap on mobile)","category":"behavior"},"model-value":{"type":"Boolean","desc":"Model of the component defining shown/hidden state; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive","category":"model"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"fit":{"type":"Boolean","desc":"Allows the menu to match at least the full width of its target","category":"position"},"cover":{"type":"Boolean","desc":"Allows the menu to cover its target. When used, the 'self' and 'fit' props are no longer effective","category":"position"},"anchor":{"type":"String","desc":"Two values setting the starting position or anchor point of the menu relative to its target","values":["'top left'","'top middle'","'top right'","'top start'","'top end'","'center left'","'center middle'","'center right'","'center start'","'center end'","'bottom left'","'bottom middle'","'bottom right'","'bottom start'","'bottom end'"],"category":"position"},"self":{"type":"String","desc":"Two values setting the menu's own position relative to its target","values":["'top left'","'top middle'","'top right'","'top start'","'top end'","'center left'","'center middle'","'center right'","'center start'","'center end'","'bottom left'","'bottom middle'","'bottom right'","'bottom start'","'bottom end'"],"category":"position"},"offset":{"type":"Array","desc":"An array of two numbers to offset the menu horizontally and vertically in pixels","examples":["[8, 8]","[5, 10]"],"category":"position"},"scroll-target":{"type":["Element","String"],"desc":"CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one","examples":[".scroll-target-class","#scroll-target-id","$refs.scrollTarget","body"],"category":"behavior"},"touch-position":{"type":"Boolean","desc":"Allows for the target position to be set by the mouse position, when the target of the menu is either clicked or touched","category":"behavior"},"persistent":{"type":"Boolean","desc":"Allows the menu to not be dismissed by a click/tap outside of the menu or by hitting the ESC key; Also, an app route change won't dismiss it","category":"behavior"},"no-route-dismiss":{"type":"Boolean","desc":"Changing route app won't dismiss the popup; No need to set it if 'persistent' prop is also set","category":"behavior"},"auto-close":{"type":"Boolean","desc":"Allows any click/tap in the menu to close it; Useful instead of attaching events to each menu item that should close the menu on click/tap","category":"behavior"},"separate-close-popup":{"type":"Boolean","desc":"Separate from parent menu, marking it as a separate closing point for v-close-popup (without this, chained menus close all together)","category":"behavior"},"square":{"type":"Boolean","desc":"Forces content to have squared borders","category":"style"},"no-refocus":{"type":"Boolean","desc":"(Accessibility) When Menu gets hidden, do not refocus on the DOM element that previously had focus","category":"behavior"},"no-focus":{"type":"Boolean","desc":"(Accessibility) When Menu gets shown, do not switch focus on it","category":"behavior"},"max-height":{"type":["String","null"],"desc":"The maximum height of the menu; Size in CSS units, including unit name","examples":["'16px'","'2rem'"],"category":"style","default":"null","required":false},"max-width":{"type":["String","null"],"desc":"The maximum width of the menu; Size in CSS units, including unit name","examples":["'16px'","'2rem'"],"category":"style","default":"null","required":false}},"slots":{"default":{"desc":"Default slot in the devland unslotted content of the component"}},"events":{"update:model-value":{"desc":"Emitted when showing/hidden state changes; Is also used by v-model","params":{"value":{"type":"Boolean","desc":"New state (showing/hidden)"}}},"show":{"desc":"Emitted after component has triggered show()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"before-show":{"desc":"Emitted when component triggers show() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"hide":{"desc":"Emitted after component has triggered hide()","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"before-hide":{"desc":"Emitted when component triggers hide() but before it finishes doing it","params":{"evt":{"type":"Event","desc":"JS event object","required":true}}},"escape-key":{"desc":"Emitted when ESC key is pressed; Does not get emitted if Menu is 'persistent'"}},"methods":{"show":{"desc":"Triggers component to show","params":{"evt":{"type":"Event","desc":"JS event object","required":false}}},"hide":{"desc":"Triggers component to hide","params":{"evt":{"type":"Event","desc":"JS event object","required":false}}},"toggle":{"params":{"evt":{"type":"Event","desc":"JS event object","required":false}},"desc":"Triggers component to toggle between show/hide"},"updatePosition":{"desc":"There are some custom scenarios for which Quasar cannot automatically reposition the menu without significant performance drawbacks so the optimal solution is for you to call this method when you need it"},"focus":{"desc":"Focus menu; if you have content with autofocus attribute, it will directly focus it"}},"computedProps":{"contentEl":{"type":"Element","desc":"The DOM Element of the rendered content","addedIn":"v2.10.1"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/no-ssr"},"props":{"tag":{"type":"String","desc":"HTML tag to use","examples":["div","span","div","span","blockquote"],"category":"content","default":"div","required":false},"placeholder":{"type":"String","desc":"Text to display on server-side render (unless using 'placeholder' slot)","examples":["This is server-side only"],"category":"content"}},"slots":{"default":{"desc":"Default slot is used to render content on client-side"},"placeholder":{"desc":"Slot used as placeholder on server-side render, which gets replaced by the default slot on client-side; overrides 'placeholder' prop"}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/no-ssr"},"props":{"tag":{"type":"String","desc":"HTML tag to use","examples":["'div'","'span'","'div'","'span'","'blockquote'"],"category":"content","default":"'div'","required":false},"placeholder":{"type":"String","desc":"Text to display on server-side render (unless using 'placeholder' slot)","examples":["'This is server-side only'"],"category":"content"}},"slots":{"default":{"desc":"Default slot is used to render content on client-side"},"placeholder":{"desc":"Slot used as placeholder on server-side render, which gets replaced by the default slot on client-side; overrides 'placeholder' prop"}}}
@@ -1 +1 @@
1
- {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/option-group"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["16px","2rem","xs","md"],"category":"style"},"model-value":{"desc":"Model of the component; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":"Any","examples":["v-model=\"group\""]},"options":{"type":"Array","desc":"Array of objects with value, label, and disable (optional) props. The binary components will be created according to this array; Props from QToggle, QCheckbox or QRadio can also be added as key/value pairs to control the components singularly","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["Option 1","Option 2","Option 3"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["op1","op2","op3"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}},"examples":[":options=\"[ { label: 'Option 1', value: 'op1' }, { label: 'Option 2', value: 'op2' }, { label: 'Option 3', value: 'op3', disable: true } ]\""],"category":"model"},"name":{"type":"String","desc":"Used to specify the name of the controls; Useful if dealing with forms submitted directly to a URL","examples":["car_id"],"category":"behavior"},"type":{"type":"String","desc":"The type of input component to be used","values":["radio","checkbox","toggle"],"default":"radio","category":"content","required":false},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["primary","teal","teal-10"],"category":"style"},"keep-color":{"type":"Boolean","desc":"Should the color (if specified any) be kept when input components are unticked?","category":"behavior"},"dark":{"type":["Boolean","null"],"default":null,"desc":"Notify the component that the background is a dark color","category":"style","required":false},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"left-label":{"type":"Boolean","desc":"Label (if any specified) should be displayed on the left side of the input components","category":"content"},"inline":{"type":"Boolean","desc":"Show input components as inline-block rather than each having their own row","category":"content"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"}},"slots":{"label":{"desc":"Generic slot for all labels","scope":{"...self":{"type":"Object","desc":"The corresponding option entry from the 'options' prop","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["Option 1","Option 2","Option 3"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["op1","op2","op3"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}}}},"addedIn":"v2.2"},"label-[name]":{"desc":"Slot to define the specific label for the option at '[name]' where name is a 0-based index; Overrides the generic 'label' slot if used","scope":{"...self":{"type":"Object","desc":"The corresponding option entry from the 'options' prop","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["Option 1","Option 2","Option 3"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["op1","op2","op3"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}}}},"addedIn":"v2.2"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true}}}}}
1
+ {"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/option-group"},"props":{"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style"},"model-value":{"desc":"Model of the component; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":"Any","examples":["# v-model=\"group\""]},"options":{"type":"Array","desc":"Array of objects with value, label, and disable (optional) props. The binary components will be created according to this array; Props from QToggle, QCheckbox or QRadio can also be added as key/value pairs to control the components singularly","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["'Option 1'","'Option 2'","'Option 3'"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["'op1'","'op2'","'op3'"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}},"examples":["[ { label: 'Option 1', value: 'op1' }, { label: 'Option 2', value: 'op2' }, { label: 'Option 3', value: 'op3', disable: true } ]"],"category":"model"},"name":{"type":"String","desc":"Used to specify the name of the controls; Useful if dealing with forms submitted directly to a URL","examples":["'car_id'"],"category":"behavior"},"type":{"type":"String","desc":"The type of input component to be used","values":["'radio'","'checkbox'","'toggle'"],"default":"'radio'","category":"content","required":false},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"keep-color":{"type":"Boolean","desc":"Should the color (if specified any) be kept when input components are unticked?","category":"behavior"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"left-label":{"type":"Boolean","desc":"Label (if any specified) should be displayed on the left side of the input components","category":"content"},"inline":{"type":"Boolean","desc":"Show input components as inline-block rather than each having their own row","category":"content"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"}},"slots":{"label":{"desc":"Generic slot for all labels","scope":{"...self":{"type":"Object","desc":"The corresponding option entry from the 'options' prop","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["'Option 1'","'Option 2'","'Option 3'"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["'op1'","'op2'","'op3'"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}}}},"addedIn":"v2.2"},"label-[name]":{"desc":"Slot to define the specific label for the option at '[name]' where name is a 0-based index; Overrides the generic 'label' slot if used","scope":{"...self":{"type":"Object","desc":"The corresponding option entry from the 'options' prop","definition":{"label":{"type":"String","desc":"Label to display along the component","required":true,"examples":["'Option 1'","'Option 2'","'Option 3'"]},"value":{"type":"Any","desc":"Value of the option that will be used by the component model","required":true,"examples":["'op1'","'op2'","'op3'"]},"disable":{"type":"Boolean","desc":"If true, the option will be disabled"},"...props":{"type":"Any","desc":"Any other props from QToggle, QCheckbox, or QRadio","examples":["val=\"car\"",":true-value=\"trueValue\"","checked-icon=\"visibility\""]}}}},"addedIn":"v2.2"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true}}}}}