@bildvitta/quasar-ui-asteroid 3.17.0-beta.27 → 3.17.0-beta.28

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 (318) 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 +290 -290
  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 +61 -87
  33. package/src/components/badge/QasBadge.yml +55 -55
  34. package/src/components/board-generator/QasBoardGenerator.vue +747 -747
  35. package/src/components/board-generator/QasBoardGenerator.yml +221 -221
  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 +494 -494
  49. package/src/components/chart-view/QasChartView.yml +115 -115
  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 +185 -185
  63. package/src/components/checkbox/QasCheckbox.yml +49 -49
  64. package/src/components/copy/QasCopy.vue +46 -46
  65. package/src/components/copy/QasCopy.yml +23 -23
  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 +254 -254
  87. package/src/components/expansion-item/QasExpansionItem.yml +71 -71
  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 -274
  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 +304 -304
  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-filter/QasSelectFilter.vue +65 -65
  157. package/src/components/select-filter/QasSelectFilter.yml +36 -36
  158. package/src/components/select-list/QasSelectList.vue +238 -238
  159. package/src/components/select-list/QasSelectList.yml +108 -108
  160. package/src/components/select-list/private/PvSelectListCheckbox.vue +31 -31
  161. package/src/components/select-list-dialog/QasSelectListDialog.vue +395 -395
  162. package/src/components/select-list-dialog/QasSelectListDialog.yml +108 -108
  163. package/src/components/signature-pad/QasSignaturePad.vue +122 -122
  164. package/src/components/signature-pad/QasSignaturePad.yml +53 -53
  165. package/src/components/signature-uploader/QasSignatureUploader.vue +164 -164
  166. package/src/components/signature-uploader/QasSignatureUploader.yml +37 -37
  167. package/src/components/single-view/QasSingleView.vue +175 -175
  168. package/src/components/single-view/QasSingleView.yml +131 -131
  169. package/src/components/sortable/QasSortable.vue +151 -151
  170. package/src/components/sortable/QasSortable.yml +65 -65
  171. package/src/components/status/QasStatus.test.js +11 -11
  172. package/src/components/status/QasStatus.vue +29 -29
  173. package/src/components/status/QasStatus.yml +10 -10
  174. package/src/components/stepper/QasStepper.vue +199 -199
  175. package/src/components/stepper/QasStepper.yml +35 -35
  176. package/src/components/stepper-form-view/QasStepperFormView.vue +86 -86
  177. package/src/components/stepper-form-view/QasStepperFormView.yml +58 -58
  178. package/src/components/table-generator/QasTableGenerator.vue +416 -416
  179. package/src/components/table-generator/QasTableGenerator.yml +94 -94
  180. package/src/components/tabs-generator/QasTabsGenerator.vue +196 -196
  181. package/src/components/tabs-generator/QasTabsGenerator.yml +53 -53
  182. package/src/components/text-truncate/QasTextTruncate.vue +334 -274
  183. package/src/components/text-truncate/QasTextTruncate.yml +71 -60
  184. package/src/components/timeline/QasTimeline.vue +140 -140
  185. package/src/components/timeline/QasTimeline.yml +36 -36
  186. package/src/components/toggle/QasToggle.vue +14 -14
  187. package/src/components/toggle/QasToggle.yml +5 -5
  188. package/src/components/toggle-visibility/QasToggleVisibility.vue +79 -79
  189. package/src/components/toggle-visibility/QasToggleVisibility.yml +30 -30
  190. package/src/components/transfer/QasTransfer.vue +239 -239
  191. package/src/components/transfer/QasTransfer.yml +60 -60
  192. package/src/components/tree-generator/QasTreeForm.vue +62 -62
  193. package/src/components/tree-generator/QasTreeGenerator.vue +488 -488
  194. package/src/components/tree-generator/QasTreeGenerator.yml +81 -81
  195. package/src/components/uploader/QasUploader.vue +691 -691
  196. package/src/components/uploader/QasUploader.yml +206 -206
  197. package/src/components/uploader/private/PvUploaderGalleryCard.vue +357 -357
  198. package/src/components/welcome/QasWelcome.vue +125 -125
  199. package/src/components/welcome/QasWelcome.yml +23 -23
  200. package/src/components/welcome/private/PvWelcomeShortcutCard.vue +58 -58
  201. package/src/components/whatsapp-link/QasWhatsappLink.vue +34 -34
  202. package/src/components/whatsapp-link/QasWhatsappLink.yml +18 -18
  203. package/src/composables/index.js +10 -10
  204. package/src/composables/private/index.js +3 -3
  205. package/src/composables/private/use-generator.js +189 -174
  206. package/src/composables/private/use-toggle-visibility.js +48 -48
  207. package/src/composables/private/use-view.js +186 -186
  208. package/src/composables/use-context.js +15 -15
  209. package/src/composables/use-default-filters.js +106 -106
  210. package/src/composables/use-form.js +32 -32
  211. package/src/composables/use-history.js +46 -46
  212. package/src/composables/use-notifications.js +128 -128
  213. package/src/composables/use-query-cache.js +60 -60
  214. package/src/composables/use-screen.js +42 -42
  215. package/src/css/base/font-face.scss +28 -28
  216. package/src/css/base/index.scss +1 -1
  217. package/src/css/components/base.scss +12 -12
  218. package/src/css/components/button.scss +116 -116
  219. package/src/css/components/checkbox.scss +14 -14
  220. package/src/css/components/editor.scss +7 -7
  221. package/src/css/components/field.scss +88 -88
  222. package/src/css/components/index.scss +10 -10
  223. package/src/css/components/item.scss +52 -52
  224. package/src/css/components/radio.scss +18 -18
  225. package/src/css/components/scrollbar.scss +20 -20
  226. package/src/css/components/tabs.scss +3 -3
  227. package/src/css/components/toggle.scss +13 -13
  228. package/src/css/mixins/index.scss +3 -3
  229. package/src/css/mixins/set-brand.scss +15 -15
  230. package/src/css/mixins/set-button.scss +26 -26
  231. package/src/css/mixins/set-typography.scss +8 -8
  232. package/src/css/plugins/index.scss +2 -2
  233. package/src/css/plugins/loading.scss +5 -5
  234. package/src/css/plugins/notify.scss +100 -100
  235. package/src/css/utils/background.scss +34 -34
  236. package/src/css/utils/border-radius.scss +29 -29
  237. package/src/css/utils/border.scss +42 -42
  238. package/src/css/utils/container.scss +36 -36
  239. package/src/css/utils/fonts.scss +5 -5
  240. package/src/css/utils/index.scss +10 -10
  241. package/src/css/utils/line-height.scss +19 -19
  242. package/src/css/utils/opacity.scss +5 -5
  243. package/src/css/utils/scroll.scss +21 -21
  244. package/src/css/utils/text.scss +15 -15
  245. package/src/css/utils/unset.scss +8 -8
  246. package/src/css/variables/button.scss +4 -4
  247. package/src/css/variables/index.scss +6 -6
  248. package/src/css/variables/scrollbar.scss +11 -11
  249. package/src/css/variables/separator.scss +2 -2
  250. package/src/css/variables/shadow.scss +3 -3
  251. package/src/css/variables/spacing.scss +98 -98
  252. package/src/css/variables/typography.scss +149 -149
  253. package/src/directives/Test.js +13 -13
  254. package/src/enums/Align.js +7 -7
  255. package/src/enums/Spacing.js +98 -98
  256. package/src/enums/Status.js +33 -33
  257. package/src/helpers/add-counter-suffix.js +3 -3
  258. package/src/helpers/base-64-to-blob.js +21 -21
  259. package/src/helpers/camelize-fields-name.js +15 -15
  260. package/src/helpers/construct-object.js +29 -29
  261. package/src/helpers/copy-to-clipboard.js +15 -15
  262. package/src/helpers/destroy-nested-children-by-key.js +33 -33
  263. package/src/helpers/download-file.js +21 -21
  264. package/src/helpers/filter-list-by-handle.js +31 -31
  265. package/src/helpers/filter-object-to-array.js +29 -29
  266. package/src/helpers/filter-object.js +34 -34
  267. package/src/helpers/filters.js +163 -163
  268. package/src/helpers/find-children-by-key.js +14 -14
  269. package/src/helpers/get-greatest-common-divisor.js +16 -16
  270. package/src/helpers/get-normalized-options.js +20 -20
  271. package/src/helpers/get-placeholder.js +19 -19
  272. package/src/helpers/get-required-label.js +3 -3
  273. package/src/helpers/get-slot-children-text.js +15 -15
  274. package/src/helpers/handle-process.js +13 -13
  275. package/src/helpers/images.js +28 -28
  276. package/src/helpers/index.js +25 -25
  277. package/src/helpers/is-empty.js +3 -3
  278. package/src/helpers/is-local-development.js +3 -3
  279. package/src/helpers/private/gutter-validator.js +15 -15
  280. package/src/helpers/private/has-parent-by-class-name.js +15 -15
  281. package/src/helpers/promise-handler.js +40 -40
  282. package/src/helpers/rules.js +7 -7
  283. package/src/helpers/set-scroll-on-grab.js +128 -128
  284. package/src/index.cjs.js +1 -1
  285. package/src/index.esm.js +4 -4
  286. package/src/index.scss +38 -38
  287. package/src/index.umd.js +2 -2
  288. package/src/mixins/context.js +8 -8
  289. package/src/mixins/delete.js +48 -48
  290. package/src/mixins/dialog-router.js +17 -17
  291. package/src/mixins/form.js +11 -11
  292. package/src/mixins/generator.js +94 -94
  293. package/src/mixins/index.js +17 -17
  294. package/src/mixins/password.js +86 -86
  295. package/src/mixins/search-filter.js +354 -354
  296. package/src/mixins/view.js +156 -156
  297. package/src/pages/ErrorComponent.vue +74 -74
  298. package/src/pages/Forbidden.vue +29 -29
  299. package/src/pages/NotFound.vue +29 -29
  300. package/src/pages/ServerError.vue +29 -29
  301. package/src/pages/Unauthorized.vue +29 -29
  302. package/src/plugins/delete/Delete.js +107 -107
  303. package/src/plugins/delete/Delete.yml +75 -75
  304. package/src/plugins/dialog/Dialog.js +14 -14
  305. package/src/plugins/dialog/Dialog.yml +10 -10
  306. package/src/plugins/index.js +13 -13
  307. package/src/plugins/notify-error/NotifyError.js +13 -13
  308. package/src/plugins/notify-error/NotifyError.yml +11 -11
  309. package/src/plugins/notify-success/NotifySuccess.js +13 -13
  310. package/src/plugins/notify-success/NotifySuccess.yml +11 -11
  311. package/src/plugins/screen/Screen.js +35 -35
  312. package/src/plugins/screen/Screen.yml +16 -16
  313. package/src/shared/badge-config.js +29 -0
  314. package/src/shared/date-config.js +26 -26
  315. package/src/shared/fuse-config.js +4 -4
  316. package/src/shared/notify-config.js +7 -7
  317. package/src/vue-plugin/third-party-component-handler.js +29 -29
  318. package/src/vue-plugin.js +285 -285
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.27",
4
+ "version": "3.17.0-beta.28",
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.'