@bildvitta/quasar-ui-asteroid 3.17.0-beta.19 → 3.17.0-beta.20

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 (314) hide show
  1. package/package.json +1 -1
  2. package/src/asteroid.js +4 -4
  3. package/src/components/actions/QasActions.vue +81 -81
  4. package/src/components/actions/QasActions.yml +34 -34
  5. package/src/components/actions-menu/QasActionsMenu.vue +251 -251
  6. package/src/components/actions-menu/QasActionsMenu.yml +89 -89
  7. package/src/components/actions-menu/composables/use-delete.js +30 -30
  8. package/src/components/actions-menu/composables/use-double-split-actions.js +42 -42
  9. package/src/components/actions-menu/composables/use-options-actions.js +27 -27
  10. package/src/components/actions-menu/composables/use-single-action.js +17 -17
  11. package/src/components/actions-menu/composables/use-single-split-actions.js +35 -35
  12. package/src/components/actions-menu/composables/use-tooltips.js +43 -43
  13. package/src/components/actions-menu/utils/get-label.js +3 -3
  14. package/src/components/actions-menu/utils/set-click-handler.js +6 -6
  15. package/src/components/alert/QasAlert.test.js +43 -43
  16. package/src/components/alert/QasAlert.vue +110 -110
  17. package/src/components/alert/QasAlert.yml +39 -39
  18. package/src/components/app-bar/QasAppBar.vue +119 -119
  19. package/src/components/app-bar/QasAppBar.yml +44 -44
  20. package/src/components/app-menu/QasAppMenu.vue +392 -392
  21. package/src/components/app-menu/QasAppMenu.yml +73 -73
  22. package/src/components/app-menu/composables/use-app-menu-dropdown.js +71 -71
  23. package/src/components/app-menu/composables/use-app-user.js +49 -49
  24. package/src/components/app-menu/composables/use-development-badge.js +23 -23
  25. package/src/components/app-menu/private/PvAppMenuDropdown.vue +71 -71
  26. package/src/components/app-menu/private/PvAppMenuHelpChat.vue +222 -222
  27. package/src/components/app-user/QasAppUser.vue +281 -281
  28. package/src/components/app-user/QasAppUser.yml +56 -56
  29. package/src/components/avatar/QasAvatar.vue +95 -95
  30. package/src/components/avatar/QasAvatar.yml +38 -38
  31. package/src/components/avatar/enums/AvatarColors.js +10 -10
  32. package/src/components/badge/QasBadge.vue +87 -87
  33. package/src/components/badge/QasBadge.yml +55 -55
  34. package/src/components/board-generator/QasBoardGenerator.vue +712 -712
  35. package/src/components/board-generator/QasBoardGenerator.yml +167 -167
  36. package/src/components/box/QasBox.vue +51 -51
  37. package/src/components/box/QasBox.yml +29 -29
  38. package/src/components/breakline/QasBreakline.vue +38 -38
  39. package/src/components/breakline/QasBreakline.yml +25 -25
  40. package/src/components/btn/QasBtn.vue +148 -148
  41. package/src/components/btn/QasBtn.yml +48 -48
  42. package/src/components/btn-dropdown/QasBtnDropdown.vue +146 -146
  43. package/src/components/btn-dropdown/QasBtnDropdown.yml +59 -59
  44. package/src/components/card/QasCard.vue +132 -132
  45. package/src/components/card/QasCard.yml +44 -44
  46. package/src/components/card-image/QasCardImage.vue +95 -95
  47. package/src/components/card-image/QasCardImage.yml +48 -48
  48. package/src/components/chart-view/QasChartView.vue +441 -441
  49. package/src/components/chart-view/QasChartView.yml +109 -109
  50. package/src/components/chart-view/config/charts/bar.js +45 -45
  51. package/src/components/chart-view/config/charts/doughnut.js +43 -43
  52. package/src/components/chart-view/config/charts/index.js +9 -9
  53. package/src/components/chart-view/config/charts/line.js +57 -57
  54. package/src/components/chart-view/config/defaults/colors.js +19 -19
  55. package/src/components/chart-view/config/defaults/font.js +5 -5
  56. package/src/components/chart-view/config/defaults/index.js +2 -2
  57. package/src/components/chart-view/config/index.js +3 -3
  58. package/src/components/chart-view/config/plugins/index.js +3 -3
  59. package/src/components/chart-view/config/plugins/legend.js +9 -9
  60. package/src/components/chart-view/config/plugins/tooltip.js +15 -15
  61. package/src/components/chart-view/config/plugins/zoom.js +31 -31
  62. package/src/components/checkbox/QasCheckbox.vue +150 -150
  63. package/src/components/checkbox/QasCheckbox.yml +36 -36
  64. package/src/components/copy/QasCopy.vue +46 -41
  65. package/src/components/copy/QasCopy.yml +23 -20
  66. package/src/components/date/QasDate.vue +600 -600
  67. package/src/components/date/QasDate.yml +69 -69
  68. package/src/components/date/enums/DateMaskOptions.js +6 -6
  69. package/src/components/date-time-input/QasDateTimeInput.vue +269 -269
  70. package/src/components/date-time-input/QasDateTimeInput.yml +64 -64
  71. package/src/components/debugger/QasDebugger.vue +31 -31
  72. package/src/components/debugger/QasDebugger.yml +10 -10
  73. package/src/components/delete/QasDelete.vue +100 -100
  74. package/src/components/delete/QasDelete.yml +60 -60
  75. package/src/components/dialog/QasDialog.vue +217 -217
  76. package/src/components/dialog/QasDialog.yml +117 -117
  77. package/src/components/dialog/composables/use-cancel.js +40 -40
  78. package/src/components/dialog/composables/use-dynamic-components.js +86 -86
  79. package/src/components/dialog/composables/use-ok.js +45 -45
  80. package/src/components/dialog-router/QasDialogRouter.vue +86 -86
  81. package/src/components/dialog-router/QasDialogRouter.yml +23 -23
  82. package/src/components/drawer/QasDrawer.vue +118 -118
  83. package/src/components/drawer/QasDrawer.yml +58 -58
  84. package/src/components/empty-result-text/QasEmptyResultText.vue +18 -18
  85. package/src/components/empty-result-text/QasEmptyResultText.yml +14 -14
  86. package/src/components/expansion-item/QasExpansionItem.vue +291 -291
  87. package/src/components/expansion-item/QasExpansionItem.yml +76 -76
  88. package/src/components/field/QasField.vue +220 -220
  89. package/src/components/field/QasField.yml +36 -36
  90. package/src/components/filters/QasFilters.vue +472 -472
  91. package/src/components/filters/QasFilters.yml +171 -171
  92. package/src/components/filters/private/PvFiltersButton.vue +101 -101
  93. package/src/components/form-generator/QasFormGenerator.vue +274 -261
  94. package/src/components/form-generator/QasFormGenerator.yml +109 -109
  95. package/src/components/form-view/QasFormView.vue +484 -484
  96. package/src/components/form-view/QasFormView.yml +253 -253
  97. package/src/components/gallery/QasGallery.vue +243 -243
  98. package/src/components/gallery/QasGallery.yml +188 -188
  99. package/src/components/gallery/composables/use-delete.js +54 -54
  100. package/src/components/gallery/private/PvGalleryCarouselDialog.vue +92 -92
  101. package/src/components/gallery/private/PvGalleryDeleteDialog.vue +54 -54
  102. package/src/components/gallery-card/QasGalleryCard.vue +153 -153
  103. package/src/components/gallery-card/QasGalleryCard.yml +61 -61
  104. package/src/components/grabbable/QasGrabbable.vue +185 -185
  105. package/src/components/grabbable/QasGrabbable.yml +26 -26
  106. package/src/components/grid-generator/QasGridGenerator.vue +210 -210
  107. package/src/components/grid-generator/QasGridGenerator.yml +127 -127
  108. package/src/components/grid-item/QasGridItem.vue +89 -89
  109. package/src/components/grid-item/QasGridItem.yml +22 -22
  110. package/src/components/header/QasHeader.vue +152 -152
  111. package/src/components/header/QasHeader.yml +50 -50
  112. package/src/components/infinite-scroll/QasInfiniteScroll.vue +168 -168
  113. package/src/components/infinite-scroll/QasInfiniteScroll.yml +78 -78
  114. package/src/components/info/QasInfo.vue +155 -155
  115. package/src/components/info/QasInfo.yml +34 -34
  116. package/src/components/input/QasInput.vue +252 -252
  117. package/src/components/input/QasInput.yml +65 -65
  118. package/src/components/label/QasLabel.vue +61 -61
  119. package/src/components/label/QasLabel.yml +44 -44
  120. package/src/components/layout/QasLayout.vue +101 -101
  121. package/src/components/layout/QasLayout.yml +46 -46
  122. package/src/components/layout/private/PvLayoutNotificationCard.vue +86 -86
  123. package/src/components/layout/private/PvLayoutNotificationsDrawer.vue +140 -140
  124. package/src/components/list-items/QasListItems.vue +125 -125
  125. package/src/components/list-items/QasListItems.yml +71 -71
  126. package/src/components/list-view/QasListView.vue +302 -302
  127. package/src/components/list-view/QasListView.yml +169 -169
  128. package/src/components/map/QasMap.vue +75 -75
  129. package/src/components/map/QasMap.yml +33 -33
  130. package/src/components/nested-fields/QasNestedFields.vue +584 -584
  131. package/src/components/nested-fields/QasNestedFields.yml +296 -296
  132. package/src/components/numeric-input/QasNumericInput.vue +206 -206
  133. package/src/components/numeric-input/QasNumericInput.yml +85 -85
  134. package/src/components/option-group/QasOptionGroup.vue +54 -54
  135. package/src/components/option-group/QasOptionGroup.yml +30 -30
  136. package/src/components/page-header/QasPageHeader.vue +143 -143
  137. package/src/components/page-header/QasPageHeader.yml +42 -42
  138. package/src/components/pagination/QasPagination.vue +71 -71
  139. package/src/components/pagination/QasPagination.yml +4 -4
  140. package/src/components/password-input/QasPasswordInput.vue +110 -110
  141. package/src/components/password-input/QasPasswordInput.yml +111 -111
  142. package/src/components/password-strength-checker/QasPasswordStrengthChecker.vue +71 -71
  143. package/src/components/password-strength-checker/QasPasswordStrengthChecker.yml +103 -103
  144. package/src/components/profile/QasProfile.vue +98 -98
  145. package/src/components/profile/QasProfile.yml +60 -60
  146. package/src/components/radio/QasRadio.vue +62 -62
  147. package/src/components/radio/QasRadio.yml +11 -11
  148. package/src/components/resizer/QasResizer.vue +90 -90
  149. package/src/components/resizer/QasResizer.yml +24 -24
  150. package/src/components/search-box/QasSearchBox.vue +294 -294
  151. package/src/components/search-box/QasSearchBox.yml +154 -154
  152. package/src/components/search-input/QasSearchInput.vue +106 -106
  153. package/src/components/search-input/QasSearchInput.yml +48 -48
  154. package/src/components/select/QasSelect.vue +514 -514
  155. package/src/components/select/QasSelect.yml +157 -157
  156. package/src/components/select-list/QasSelectList.vue +238 -238
  157. package/src/components/select-list/QasSelectList.yml +108 -108
  158. package/src/components/select-list/private/PvSelectListCheckbox.vue +31 -31
  159. package/src/components/select-list-dialog/QasSelectListDialog.vue +395 -395
  160. package/src/components/select-list-dialog/QasSelectListDialog.yml +108 -108
  161. package/src/components/signature-pad/QasSignaturePad.vue +122 -122
  162. package/src/components/signature-pad/QasSignaturePad.yml +53 -53
  163. package/src/components/signature-uploader/QasSignatureUploader.vue +164 -164
  164. package/src/components/signature-uploader/QasSignatureUploader.yml +37 -37
  165. package/src/components/single-view/QasSingleView.vue +175 -175
  166. package/src/components/single-view/QasSingleView.yml +131 -131
  167. package/src/components/sortable/QasSortable.vue +151 -151
  168. package/src/components/sortable/QasSortable.yml +65 -65
  169. package/src/components/status/QasStatus.test.js +11 -11
  170. package/src/components/status/QasStatus.vue +29 -29
  171. package/src/components/status/QasStatus.yml +10 -10
  172. package/src/components/stepper/QasStepper.vue +152 -152
  173. package/src/components/stepper/QasStepper.yml +35 -35
  174. package/src/components/stepper-form-view/QasStepperFormView.vue +84 -84
  175. package/src/components/stepper-form-view/QasStepperFormView.yml +58 -58
  176. package/src/components/table-generator/QasTableGenerator.vue +416 -416
  177. package/src/components/table-generator/QasTableGenerator.yml +94 -94
  178. package/src/components/tabs-generator/QasTabsGenerator.vue +196 -196
  179. package/src/components/tabs-generator/QasTabsGenerator.yml +53 -53
  180. package/src/components/text-truncate/QasTextTruncate.vue +274 -274
  181. package/src/components/text-truncate/QasTextTruncate.yml +60 -60
  182. package/src/components/timeline/QasTimeline.vue +140 -140
  183. package/src/components/timeline/QasTimeline.yml +36 -36
  184. package/src/components/toggle/QasToggle.vue +14 -14
  185. package/src/components/toggle/QasToggle.yml +5 -5
  186. package/src/components/toggle-visibility/QasToggleVisibility.vue +79 -79
  187. package/src/components/toggle-visibility/QasToggleVisibility.yml +30 -30
  188. package/src/components/transfer/QasTransfer.vue +239 -239
  189. package/src/components/transfer/QasTransfer.yml +60 -60
  190. package/src/components/tree-generator/QasTreeForm.vue +62 -62
  191. package/src/components/tree-generator/QasTreeGenerator.vue +488 -488
  192. package/src/components/tree-generator/QasTreeGenerator.yml +81 -81
  193. package/src/components/uploader/QasUploader.vue +645 -645
  194. package/src/components/uploader/QasUploader.yml +192 -192
  195. package/src/components/uploader/private/PvUploaderGalleryCard.vue +357 -357
  196. package/src/components/welcome/QasWelcome.vue +125 -125
  197. package/src/components/welcome/QasWelcome.yml +23 -23
  198. package/src/components/welcome/private/PvWelcomeShortcutCard.vue +58 -58
  199. package/src/components/whatsapp-link/QasWhatsappLink.vue +34 -34
  200. package/src/components/whatsapp-link/QasWhatsappLink.yml +18 -18
  201. package/src/composables/index.js +8 -8
  202. package/src/composables/private/index.js +3 -3
  203. package/src/composables/private/use-generator.js +174 -174
  204. package/src/composables/private/use-toggle-visibility.js +48 -48
  205. package/src/composables/private/use-view.js +186 -186
  206. package/src/composables/use-context.js +15 -15
  207. package/src/composables/use-form.js +32 -32
  208. package/src/composables/use-history.js +46 -46
  209. package/src/composables/use-notifications.js +114 -114
  210. package/src/composables/use-query-cache.js +60 -60
  211. package/src/composables/use-screen.js +42 -42
  212. package/src/css/base/font-face.scss +28 -28
  213. package/src/css/base/index.scss +1 -1
  214. package/src/css/components/base.scss +12 -12
  215. package/src/css/components/button.scss +116 -116
  216. package/src/css/components/checkbox.scss +14 -14
  217. package/src/css/components/editor.scss +7 -7
  218. package/src/css/components/field.scss +88 -88
  219. package/src/css/components/index.scss +10 -10
  220. package/src/css/components/item.scss +52 -52
  221. package/src/css/components/radio.scss +18 -18
  222. package/src/css/components/scrollbar.scss +20 -20
  223. package/src/css/components/tabs.scss +3 -3
  224. package/src/css/components/toggle.scss +13 -13
  225. package/src/css/mixins/index.scss +3 -3
  226. package/src/css/mixins/set-brand.scss +15 -15
  227. package/src/css/mixins/set-button.scss +26 -26
  228. package/src/css/mixins/set-typography.scss +8 -8
  229. package/src/css/plugins/index.scss +2 -2
  230. package/src/css/plugins/loading.scss +5 -5
  231. package/src/css/plugins/notify.scss +100 -100
  232. package/src/css/utils/background.scss +34 -34
  233. package/src/css/utils/border-radius.scss +29 -29
  234. package/src/css/utils/border.scss +42 -42
  235. package/src/css/utils/container.scss +36 -36
  236. package/src/css/utils/fonts.scss +5 -5
  237. package/src/css/utils/index.scss +10 -10
  238. package/src/css/utils/line-height.scss +19 -19
  239. package/src/css/utils/opacity.scss +5 -5
  240. package/src/css/utils/scroll.scss +21 -21
  241. package/src/css/utils/text.scss +15 -15
  242. package/src/css/utils/unset.scss +8 -8
  243. package/src/css/variables/button.scss +4 -4
  244. package/src/css/variables/index.scss +6 -6
  245. package/src/css/variables/scrollbar.scss +11 -11
  246. package/src/css/variables/separator.scss +2 -2
  247. package/src/css/variables/shadow.scss +3 -3
  248. package/src/css/variables/spacing.scss +98 -98
  249. package/src/css/variables/typography.scss +149 -149
  250. package/src/directives/Test.js +13 -13
  251. package/src/enums/Align.js +7 -7
  252. package/src/enums/Spacing.js +98 -98
  253. package/src/enums/Status.js +33 -33
  254. package/src/helpers/add-counter-suffix.js +3 -3
  255. package/src/helpers/base-64-to-blob.js +21 -21
  256. package/src/helpers/camelize-fields-name.js +15 -15
  257. package/src/helpers/construct-object.js +29 -29
  258. package/src/helpers/copy-to-clipboard.js +15 -15
  259. package/src/helpers/destroy-nested-children-by-key.js +33 -33
  260. package/src/helpers/download-file.js +21 -21
  261. package/src/helpers/filter-list-by-handle.js +31 -31
  262. package/src/helpers/filter-object-to-array.js +29 -29
  263. package/src/helpers/filter-object.js +34 -34
  264. package/src/helpers/filters.js +163 -163
  265. package/src/helpers/find-children-by-key.js +14 -14
  266. package/src/helpers/get-greatest-common-divisor.js +16 -16
  267. package/src/helpers/get-normalized-options.js +20 -20
  268. package/src/helpers/get-placeholder.js +19 -19
  269. package/src/helpers/get-required-label.js +3 -3
  270. package/src/helpers/get-slot-children-text.js +15 -15
  271. package/src/helpers/handle-process.js +13 -13
  272. package/src/helpers/images.js +28 -28
  273. package/src/helpers/index.js +25 -25
  274. package/src/helpers/is-empty.js +3 -3
  275. package/src/helpers/is-local-development.js +3 -3
  276. package/src/helpers/private/gutter-validator.js +15 -15
  277. package/src/helpers/private/has-parent-by-class-name.js +15 -15
  278. package/src/helpers/promise-handler.js +40 -40
  279. package/src/helpers/rules.js +7 -7
  280. package/src/helpers/set-scroll-on-grab.js +128 -128
  281. package/src/index.cjs.js +1 -1
  282. package/src/index.esm.js +4 -4
  283. package/src/index.scss +38 -38
  284. package/src/index.umd.js +2 -2
  285. package/src/mixins/context.js +8 -8
  286. package/src/mixins/delete.js +48 -48
  287. package/src/mixins/dialog-router.js +17 -17
  288. package/src/mixins/form.js +11 -11
  289. package/src/mixins/generator.js +94 -94
  290. package/src/mixins/index.js +17 -17
  291. package/src/mixins/password.js +86 -86
  292. package/src/mixins/search-filter.js +354 -354
  293. package/src/mixins/view.js +156 -156
  294. package/src/pages/ErrorComponent.vue +74 -74
  295. package/src/pages/Forbidden.vue +29 -29
  296. package/src/pages/NotFound.vue +29 -29
  297. package/src/pages/ServerError.vue +29 -29
  298. package/src/pages/Unauthorized.vue +29 -29
  299. package/src/plugins/delete/Delete.js +107 -107
  300. package/src/plugins/delete/Delete.yml +75 -75
  301. package/src/plugins/dialog/Dialog.js +14 -14
  302. package/src/plugins/dialog/Dialog.yml +10 -10
  303. package/src/plugins/index.js +13 -13
  304. package/src/plugins/notify-error/NotifyError.js +13 -13
  305. package/src/plugins/notify-error/NotifyError.yml +11 -11
  306. package/src/plugins/notify-success/NotifySuccess.js +13 -13
  307. package/src/plugins/notify-success/NotifySuccess.yml +11 -11
  308. package/src/plugins/screen/Screen.js +35 -35
  309. package/src/plugins/screen/Screen.yml +16 -16
  310. package/src/shared/date-config.js +26 -26
  311. package/src/shared/fuse-config.js +4 -4
  312. package/src/shared/notify-config.js +7 -7
  313. package/src/vue-plugin/third-party-component-handler.js +29 -29
  314. package/src/vue-plugin.js +282 -282
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bildvitta/quasar-ui-asteroid",
3
3
  "description": "Asteroid",
4
- "version": "3.17.0-beta.19",
4
+ "version": "3.17.0-beta.20",
5
5
  "author": "Bild & Vitta <systemteam@bild.com.br>",
6
6
  "license": "MIT",
7
7
  "main": "dist/asteroid.cjs.min.js",
package/src/asteroid.js CHANGED
@@ -1,4 +1,4 @@
1
- export * from './helpers'
2
- export * from './mixins'
3
- export * from './vue-plugin'
4
- export * from './composables'
1
+ export * from './helpers'
2
+ export * from './mixins'
3
+ export * from './vue-plugin'
4
+ export * from './composables'
@@ -1,81 +1,81 @@
1
- <template>
2
- <div class="q-mt-sm" :class="classes">
3
- <div v-if="hasTertiarySlot" :class="columnClasses">
4
- <slot name="tertiary" />
5
- </div>
6
-
7
- <div v-if="hasSecondarySlot" :class="columnClasses">
8
- <slot name="secondary" />
9
- </div>
10
-
11
- <div v-if="hasPrimarySlot" :class="columnClasses">
12
- <slot name="primary" />
13
- </div>
14
- </div>
15
- </template>
16
-
17
- <script setup>
18
- import useScreen from '../../composables/use-screen'
19
- import { FlexAlign } from '../../enums/Align'
20
- import { Spacing } from '../../enums/Spacing'
21
-
22
- import { computed, useSlots } from 'vue'
23
-
24
- defineOptions({ name: 'QasActions' })
25
-
26
- const props = defineProps({
27
- align: {
28
- default: FlexAlign.End,
29
- type: String,
30
- validator: value => Object.values(FlexAlign).includes(value)
31
- },
32
-
33
- gutter: {
34
- default: '',
35
- type: String,
36
- validator: value => !value || Object.values(Spacing).includes(value)
37
- },
38
-
39
- useFullWidth: {
40
- type: Boolean
41
- },
42
-
43
- useEqualWidth: {
44
- type: Boolean
45
- }
46
- })
47
-
48
- const slots = useSlots()
49
- const screen = useScreen()
50
-
51
- const defaultGutter = computed(() => {
52
- return props.gutter || (screen.isSmall ? 'md' : 'lg')
53
- })
54
-
55
- const classes = computed(() => {
56
- const isSmallOrFullWidth = screen.isSmall || props.useFullWidth
57
-
58
- return [
59
- !screen.isSmall && 'items-center',
60
-
61
- // alinhamento
62
- `justify-${props.align}`,
63
-
64
- // espaçamento
65
- `q-col-gutter-${defaultGutter.value}`,
66
-
67
- // disposição
68
- isSmallOrFullWidth ? 'column reverse' : 'row'
69
- ]
70
- })
71
-
72
- const columnClasses = computed(() => {
73
- if (props.useEqualWidth) return 'col-12 col-sm-6'
74
-
75
- return props.useFullWidth ? 'full-width' : 'col-12 col-sm-auto'
76
- })
77
-
78
- const hasPrimarySlot = computed(() => !!slots.primary)
79
- const hasSecondarySlot = computed(() => !!slots.secondary)
80
- const hasTertiarySlot = computed(() => !!slots.tertiary)
81
- </script>
1
+ <template>
2
+ <div class="q-mt-sm" :class="classes">
3
+ <div v-if="hasTertiarySlot" :class="columnClasses">
4
+ <slot name="tertiary" />
5
+ </div>
6
+
7
+ <div v-if="hasSecondarySlot" :class="columnClasses">
8
+ <slot name="secondary" />
9
+ </div>
10
+
11
+ <div v-if="hasPrimarySlot" :class="columnClasses">
12
+ <slot name="primary" />
13
+ </div>
14
+ </div>
15
+ </template>
16
+
17
+ <script setup>
18
+ import useScreen from '../../composables/use-screen'
19
+ import { FlexAlign } from '../../enums/Align'
20
+ import { Spacing } from '../../enums/Spacing'
21
+
22
+ import { computed, useSlots } from 'vue'
23
+
24
+ defineOptions({ name: 'QasActions' })
25
+
26
+ const props = defineProps({
27
+ align: {
28
+ default: FlexAlign.End,
29
+ type: String,
30
+ validator: value => Object.values(FlexAlign).includes(value)
31
+ },
32
+
33
+ gutter: {
34
+ default: '',
35
+ type: String,
36
+ validator: value => !value || Object.values(Spacing).includes(value)
37
+ },
38
+
39
+ useFullWidth: {
40
+ type: Boolean
41
+ },
42
+
43
+ useEqualWidth: {
44
+ type: Boolean
45
+ }
46
+ })
47
+
48
+ const slots = useSlots()
49
+ const screen = useScreen()
50
+
51
+ const defaultGutter = computed(() => {
52
+ return props.gutter || (screen.isSmall ? 'md' : 'lg')
53
+ })
54
+
55
+ const classes = computed(() => {
56
+ const isSmallOrFullWidth = screen.isSmall || props.useFullWidth
57
+
58
+ return [
59
+ !screen.isSmall && 'items-center',
60
+
61
+ // alinhamento
62
+ `justify-${props.align}`,
63
+
64
+ // espaçamento
65
+ `q-col-gutter-${defaultGutter.value}`,
66
+
67
+ // disposição
68
+ isSmallOrFullWidth ? 'column reverse' : 'row'
69
+ ]
70
+ })
71
+
72
+ const columnClasses = computed(() => {
73
+ if (props.useEqualWidth) return 'col-12 col-sm-6'
74
+
75
+ return props.useFullWidth ? 'full-width' : 'col-12 col-sm-auto'
76
+ })
77
+
78
+ const hasPrimarySlot = computed(() => !!slots.primary)
79
+ const hasSecondarySlot = computed(() => !!slots.secondary)
80
+ const hasTertiarySlot = computed(() => !!slots.tertiary)
81
+ </script>
@@ -1,34 +1,34 @@
1
- type: component
2
-
3
- meta:
4
- desc: Área de ações para páginas que lidam com botões primários e secundários, como um formulário ou caixa de diálogo.
5
-
6
- props:
7
- align:
8
- desc: Alinhamento dos elementos.
9
- default: end
10
- type: String
11
- examples: [start, end, between, around, center]
12
-
13
- gutter:
14
- desc: Espaçamento entre os elementos.
15
- default: lg
16
- type: String
17
- examples: ['xs', 'sm', 'md', 'lg', 'xl']
18
-
19
- use-full-width:
20
- desc: Deixa as colunas 100%, com col-12.
21
- default: false
22
- type: Boolean
23
-
24
- use-equal-width:
25
- desc: Deixa as colunas 50% no desktop e 100% no mobile, col-12 col-sm-6.
26
- default: false
27
- type: Boolean
28
-
29
- slots:
30
- primary:
31
- desc: 'Slot para ação primaria (ex: botão de salvar), em telas menores que sm, se torna o primeiro elemento.'
32
-
33
- secondary:
34
- desc: 'Slot para ação secundaria (ex: botão de cancelar), em telas menores que sm, se torna o segundo elemento.'
1
+ type: component
2
+
3
+ meta:
4
+ desc: Área de ações para páginas que lidam com botões primários e secundários, como um formulário ou caixa de diálogo.
5
+
6
+ props:
7
+ align:
8
+ desc: Alinhamento dos elementos.
9
+ default: end
10
+ type: String
11
+ examples: [start, end, between, around, center]
12
+
13
+ gutter:
14
+ desc: Espaçamento entre os elementos.
15
+ default: lg
16
+ type: String
17
+ examples: ['xs', 'sm', 'md', 'lg', 'xl']
18
+
19
+ use-full-width:
20
+ desc: Deixa as colunas 100%, com col-12.
21
+ default: false
22
+ type: Boolean
23
+
24
+ use-equal-width:
25
+ desc: Deixa as colunas 50% no desktop e 100% no mobile, col-12 col-sm-6.
26
+ default: false
27
+ type: Boolean
28
+
29
+ slots:
30
+ primary:
31
+ desc: 'Slot para ação primaria (ex: botão de salvar), em telas menores que sm, se torna o primeiro elemento.'
32
+
33
+ secondary:
34
+ desc: 'Slot para ação secundaria (ex: botão de cancelar), em telas menores que sm, se torna o segundo elemento.'