@bildvitta/quasar-ui-asteroid 3.17.0-beta.18 → 3.17.0-beta.19
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.
- package/package.json +1 -1
- package/src/asteroid.js +4 -4
- package/src/components/actions/QasActions.vue +81 -81
- package/src/components/actions/QasActions.yml +34 -34
- package/src/components/actions-menu/QasActionsMenu.vue +251 -251
- package/src/components/actions-menu/QasActionsMenu.yml +89 -89
- package/src/components/actions-menu/composables/use-delete.js +30 -30
- package/src/components/actions-menu/composables/use-double-split-actions.js +42 -42
- package/src/components/actions-menu/composables/use-options-actions.js +27 -27
- package/src/components/actions-menu/composables/use-single-action.js +17 -17
- package/src/components/actions-menu/composables/use-single-split-actions.js +35 -35
- package/src/components/actions-menu/composables/use-tooltips.js +43 -43
- package/src/components/actions-menu/utils/get-label.js +3 -3
- package/src/components/actions-menu/utils/set-click-handler.js +6 -6
- package/src/components/alert/QasAlert.test.js +43 -43
- package/src/components/alert/QasAlert.vue +110 -110
- package/src/components/alert/QasAlert.yml +39 -39
- package/src/components/app-bar/QasAppBar.vue +119 -119
- package/src/components/app-bar/QasAppBar.yml +44 -44
- package/src/components/app-menu/QasAppMenu.vue +392 -387
- package/src/components/app-menu/QasAppMenu.yml +73 -73
- package/src/components/app-menu/composables/use-app-menu-dropdown.js +71 -71
- package/src/components/app-menu/composables/use-app-user.js +49 -49
- package/src/components/app-menu/composables/use-development-badge.js +23 -23
- package/src/components/app-menu/private/PvAppMenuDropdown.vue +71 -71
- package/src/components/app-menu/private/PvAppMenuHelpChat.vue +222 -222
- package/src/components/app-user/QasAppUser.vue +281 -281
- package/src/components/app-user/QasAppUser.yml +56 -56
- package/src/components/avatar/QasAvatar.vue +95 -95
- package/src/components/avatar/QasAvatar.yml +38 -38
- package/src/components/avatar/enums/AvatarColors.js +10 -10
- package/src/components/badge/QasBadge.vue +87 -87
- package/src/components/badge/QasBadge.yml +55 -55
- package/src/components/board-generator/QasBoardGenerator.vue +712 -712
- package/src/components/board-generator/QasBoardGenerator.yml +167 -167
- package/src/components/box/QasBox.vue +51 -51
- package/src/components/box/QasBox.yml +29 -29
- package/src/components/breakline/QasBreakline.vue +38 -38
- package/src/components/breakline/QasBreakline.yml +25 -25
- package/src/components/btn/QasBtn.vue +148 -148
- package/src/components/btn/QasBtn.yml +48 -48
- package/src/components/btn-dropdown/QasBtnDropdown.vue +146 -146
- package/src/components/btn-dropdown/QasBtnDropdown.yml +59 -59
- package/src/components/card/QasCard.vue +132 -132
- package/src/components/card/QasCard.yml +44 -44
- package/src/components/card-image/QasCardImage.vue +95 -95
- package/src/components/card-image/QasCardImage.yml +48 -48
- package/src/components/chart-view/QasChartView.vue +441 -441
- package/src/components/chart-view/QasChartView.yml +109 -109
- package/src/components/chart-view/config/charts/bar.js +45 -45
- package/src/components/chart-view/config/charts/doughnut.js +43 -43
- package/src/components/chart-view/config/charts/index.js +9 -9
- package/src/components/chart-view/config/charts/line.js +57 -57
- package/src/components/chart-view/config/defaults/colors.js +19 -19
- package/src/components/chart-view/config/defaults/font.js +5 -5
- package/src/components/chart-view/config/defaults/index.js +2 -2
- package/src/components/chart-view/config/index.js +3 -3
- package/src/components/chart-view/config/plugins/index.js +3 -3
- package/src/components/chart-view/config/plugins/legend.js +9 -9
- package/src/components/chart-view/config/plugins/tooltip.js +15 -15
- package/src/components/chart-view/config/plugins/zoom.js +31 -31
- package/src/components/checkbox/QasCheckbox.vue +150 -150
- package/src/components/checkbox/QasCheckbox.yml +36 -36
- package/src/components/copy/QasCopy.vue +41 -41
- package/src/components/copy/QasCopy.yml +20 -20
- package/src/components/date/QasDate.vue +600 -600
- package/src/components/date/QasDate.yml +69 -69
- package/src/components/date/enums/DateMaskOptions.js +6 -6
- package/src/components/date-time-input/QasDateTimeInput.vue +269 -269
- package/src/components/date-time-input/QasDateTimeInput.yml +64 -64
- package/src/components/debugger/QasDebugger.vue +31 -31
- package/src/components/debugger/QasDebugger.yml +10 -10
- package/src/components/delete/QasDelete.vue +100 -100
- package/src/components/delete/QasDelete.yml +60 -60
- package/src/components/dialog/QasDialog.vue +217 -217
- package/src/components/dialog/QasDialog.yml +117 -117
- package/src/components/dialog/composables/use-cancel.js +40 -40
- package/src/components/dialog/composables/use-dynamic-components.js +86 -86
- package/src/components/dialog/composables/use-ok.js +45 -45
- package/src/components/dialog-router/QasDialogRouter.vue +86 -86
- package/src/components/dialog-router/QasDialogRouter.yml +23 -23
- package/src/components/drawer/QasDrawer.vue +118 -118
- package/src/components/drawer/QasDrawer.yml +58 -58
- package/src/components/empty-result-text/QasEmptyResultText.vue +18 -18
- package/src/components/empty-result-text/QasEmptyResultText.yml +14 -14
- package/src/components/expansion-item/QasExpansionItem.vue +291 -291
- package/src/components/expansion-item/QasExpansionItem.yml +76 -76
- package/src/components/field/QasField.vue +220 -220
- package/src/components/field/QasField.yml +36 -36
- package/src/components/filters/QasFilters.vue +472 -472
- package/src/components/filters/QasFilters.yml +171 -171
- package/src/components/filters/private/PvFiltersButton.vue +101 -101
- package/src/components/form-generator/QasFormGenerator.vue +261 -261
- package/src/components/form-generator/QasFormGenerator.yml +109 -109
- package/src/components/form-view/QasFormView.vue +484 -484
- package/src/components/form-view/QasFormView.yml +253 -253
- package/src/components/gallery/QasGallery.vue +243 -243
- package/src/components/gallery/QasGallery.yml +188 -188
- package/src/components/gallery/composables/use-delete.js +54 -54
- package/src/components/gallery/private/PvGalleryCarouselDialog.vue +92 -92
- package/src/components/gallery/private/PvGalleryDeleteDialog.vue +54 -54
- package/src/components/gallery-card/QasGalleryCard.vue +153 -153
- package/src/components/gallery-card/QasGalleryCard.yml +61 -61
- package/src/components/grabbable/QasGrabbable.vue +185 -185
- package/src/components/grabbable/QasGrabbable.yml +26 -26
- package/src/components/grid-generator/QasGridGenerator.vue +210 -210
- package/src/components/grid-generator/QasGridGenerator.yml +127 -127
- package/src/components/grid-item/QasGridItem.vue +89 -89
- package/src/components/grid-item/QasGridItem.yml +22 -22
- package/src/components/header/QasHeader.vue +152 -152
- package/src/components/header/QasHeader.yml +50 -50
- package/src/components/infinite-scroll/QasInfiniteScroll.vue +168 -168
- package/src/components/infinite-scroll/QasInfiniteScroll.yml +78 -78
- package/src/components/info/QasInfo.vue +155 -155
- package/src/components/info/QasInfo.yml +34 -34
- package/src/components/input/QasInput.vue +252 -252
- package/src/components/input/QasInput.yml +65 -65
- package/src/components/label/QasLabel.vue +61 -61
- package/src/components/label/QasLabel.yml +44 -44
- package/src/components/layout/QasLayout.vue +101 -101
- package/src/components/layout/QasLayout.yml +46 -46
- package/src/components/layout/private/PvLayoutNotificationCard.vue +86 -86
- package/src/components/layout/private/PvLayoutNotificationsDrawer.vue +140 -140
- package/src/components/list-items/QasListItems.vue +125 -125
- package/src/components/list-items/QasListItems.yml +71 -71
- package/src/components/list-view/QasListView.vue +302 -302
- package/src/components/list-view/QasListView.yml +169 -169
- package/src/components/map/QasMap.vue +75 -75
- package/src/components/map/QasMap.yml +33 -33
- package/src/components/nested-fields/QasNestedFields.vue +584 -584
- package/src/components/nested-fields/QasNestedFields.yml +296 -296
- package/src/components/numeric-input/QasNumericInput.vue +206 -206
- package/src/components/numeric-input/QasNumericInput.yml +85 -85
- package/src/components/option-group/QasOptionGroup.vue +54 -54
- package/src/components/option-group/QasOptionGroup.yml +30 -30
- package/src/components/page-header/QasPageHeader.vue +143 -143
- package/src/components/page-header/QasPageHeader.yml +42 -42
- package/src/components/pagination/QasPagination.vue +71 -71
- package/src/components/pagination/QasPagination.yml +4 -4
- package/src/components/password-input/QasPasswordInput.vue +110 -110
- package/src/components/password-input/QasPasswordInput.yml +111 -111
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.vue +71 -71
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.yml +103 -103
- package/src/components/profile/QasProfile.vue +98 -98
- package/src/components/profile/QasProfile.yml +60 -60
- package/src/components/radio/QasRadio.vue +62 -62
- package/src/components/radio/QasRadio.yml +11 -11
- package/src/components/resizer/QasResizer.vue +90 -90
- package/src/components/resizer/QasResizer.yml +24 -24
- package/src/components/search-box/QasSearchBox.vue +294 -294
- package/src/components/search-box/QasSearchBox.yml +154 -154
- package/src/components/search-input/QasSearchInput.vue +106 -106
- package/src/components/search-input/QasSearchInput.yml +48 -48
- package/src/components/select/QasSelect.vue +514 -514
- package/src/components/select/QasSelect.yml +157 -157
- package/src/components/select-list/QasSelectList.vue +238 -238
- package/src/components/select-list/QasSelectList.yml +108 -108
- package/src/components/select-list/private/PvSelectListCheckbox.vue +31 -31
- package/src/components/select-list-dialog/QasSelectListDialog.vue +395 -395
- package/src/components/select-list-dialog/QasSelectListDialog.yml +108 -108
- package/src/components/signature-pad/QasSignaturePad.vue +122 -122
- package/src/components/signature-pad/QasSignaturePad.yml +53 -53
- package/src/components/signature-uploader/QasSignatureUploader.vue +164 -164
- package/src/components/signature-uploader/QasSignatureUploader.yml +37 -37
- package/src/components/single-view/QasSingleView.vue +175 -175
- package/src/components/single-view/QasSingleView.yml +131 -131
- package/src/components/sortable/QasSortable.vue +151 -151
- package/src/components/sortable/QasSortable.yml +65 -65
- package/src/components/status/QasStatus.test.js +11 -11
- package/src/components/status/QasStatus.vue +29 -29
- package/src/components/status/QasStatus.yml +10 -10
- package/src/components/stepper/QasStepper.vue +152 -152
- package/src/components/stepper/QasStepper.yml +35 -35
- package/src/components/stepper-form-view/QasStepperFormView.vue +84 -84
- package/src/components/stepper-form-view/QasStepperFormView.yml +58 -58
- package/src/components/table-generator/QasTableGenerator.vue +416 -416
- package/src/components/table-generator/QasTableGenerator.yml +94 -94
- package/src/components/tabs-generator/QasTabsGenerator.vue +196 -196
- package/src/components/tabs-generator/QasTabsGenerator.yml +53 -53
- package/src/components/text-truncate/QasTextTruncate.vue +274 -274
- package/src/components/text-truncate/QasTextTruncate.yml +60 -60
- package/src/components/timeline/QasTimeline.vue +140 -140
- package/src/components/timeline/QasTimeline.yml +36 -36
- package/src/components/toggle/QasToggle.vue +14 -14
- package/src/components/toggle/QasToggle.yml +5 -5
- package/src/components/toggle-visibility/QasToggleVisibility.vue +79 -79
- package/src/components/toggle-visibility/QasToggleVisibility.yml +30 -30
- package/src/components/transfer/QasTransfer.vue +239 -239
- package/src/components/transfer/QasTransfer.yml +60 -60
- package/src/components/tree-generator/QasTreeForm.vue +62 -62
- package/src/components/tree-generator/QasTreeGenerator.vue +488 -488
- package/src/components/tree-generator/QasTreeGenerator.yml +81 -81
- package/src/components/uploader/QasUploader.vue +645 -645
- package/src/components/uploader/QasUploader.yml +192 -192
- package/src/components/uploader/private/PvUploaderGalleryCard.vue +357 -357
- package/src/components/welcome/QasWelcome.vue +125 -125
- package/src/components/welcome/QasWelcome.yml +23 -23
- package/src/components/welcome/private/PvWelcomeShortcutCard.vue +58 -58
- package/src/components/whatsapp-link/QasWhatsappLink.vue +34 -34
- package/src/components/whatsapp-link/QasWhatsappLink.yml +18 -18
- package/src/composables/index.js +8 -8
- package/src/composables/private/index.js +3 -3
- package/src/composables/private/use-generator.js +174 -174
- package/src/composables/private/use-toggle-visibility.js +48 -48
- package/src/composables/private/use-view.js +186 -186
- package/src/composables/use-context.js +15 -15
- package/src/composables/use-form.js +32 -32
- package/src/composables/use-history.js +46 -46
- package/src/composables/use-notifications.js +114 -114
- package/src/composables/use-query-cache.js +60 -60
- package/src/composables/use-screen.js +42 -42
- package/src/css/base/font-face.scss +28 -28
- package/src/css/base/index.scss +1 -1
- package/src/css/components/base.scss +12 -12
- package/src/css/components/button.scss +116 -116
- package/src/css/components/checkbox.scss +14 -14
- package/src/css/components/editor.scss +7 -7
- package/src/css/components/field.scss +88 -88
- package/src/css/components/index.scss +10 -10
- package/src/css/components/item.scss +52 -52
- package/src/css/components/radio.scss +18 -18
- package/src/css/components/scrollbar.scss +20 -20
- package/src/css/components/tabs.scss +3 -3
- package/src/css/components/toggle.scss +13 -13
- package/src/css/mixins/index.scss +3 -3
- package/src/css/mixins/set-brand.scss +15 -15
- package/src/css/mixins/set-button.scss +26 -26
- package/src/css/mixins/set-typography.scss +8 -8
- package/src/css/plugins/index.scss +2 -2
- package/src/css/plugins/loading.scss +5 -5
- package/src/css/plugins/notify.scss +100 -100
- package/src/css/utils/background.scss +34 -34
- package/src/css/utils/border-radius.scss +29 -29
- package/src/css/utils/border.scss +42 -42
- package/src/css/utils/container.scss +36 -36
- package/src/css/utils/fonts.scss +5 -5
- package/src/css/utils/index.scss +10 -10
- package/src/css/utils/line-height.scss +19 -19
- package/src/css/utils/opacity.scss +5 -5
- package/src/css/utils/scroll.scss +21 -21
- package/src/css/utils/text.scss +15 -15
- package/src/css/utils/unset.scss +8 -8
- package/src/css/variables/button.scss +4 -4
- package/src/css/variables/index.scss +6 -6
- package/src/css/variables/scrollbar.scss +11 -11
- package/src/css/variables/separator.scss +2 -2
- package/src/css/variables/shadow.scss +3 -3
- package/src/css/variables/spacing.scss +98 -98
- package/src/css/variables/typography.scss +149 -149
- package/src/directives/Test.js +13 -13
- package/src/enums/Align.js +7 -7
- package/src/enums/Spacing.js +98 -98
- package/src/enums/Status.js +33 -33
- package/src/helpers/add-counter-suffix.js +3 -3
- package/src/helpers/base-64-to-blob.js +21 -21
- package/src/helpers/camelize-fields-name.js +15 -15
- package/src/helpers/construct-object.js +29 -29
- package/src/helpers/copy-to-clipboard.js +15 -15
- package/src/helpers/destroy-nested-children-by-key.js +33 -33
- package/src/helpers/download-file.js +21 -21
- package/src/helpers/filter-list-by-handle.js +31 -31
- package/src/helpers/filter-object-to-array.js +29 -29
- package/src/helpers/filter-object.js +34 -34
- package/src/helpers/filters.js +163 -163
- package/src/helpers/find-children-by-key.js +14 -14
- package/src/helpers/get-greatest-common-divisor.js +16 -16
- package/src/helpers/get-normalized-options.js +20 -20
- package/src/helpers/get-placeholder.js +19 -19
- package/src/helpers/get-required-label.js +3 -3
- package/src/helpers/get-slot-children-text.js +15 -15
- package/src/helpers/handle-process.js +13 -13
- package/src/helpers/images.js +28 -28
- package/src/helpers/index.js +25 -25
- package/src/helpers/is-empty.js +3 -3
- package/src/helpers/is-local-development.js +3 -3
- package/src/helpers/private/gutter-validator.js +15 -15
- package/src/helpers/private/has-parent-by-class-name.js +15 -15
- package/src/helpers/promise-handler.js +40 -40
- package/src/helpers/rules.js +7 -7
- package/src/helpers/set-scroll-on-grab.js +128 -128
- package/src/index.cjs.js +1 -1
- package/src/index.esm.js +4 -4
- package/src/index.scss +38 -38
- package/src/index.umd.js +2 -2
- package/src/mixins/context.js +8 -8
- package/src/mixins/delete.js +48 -48
- package/src/mixins/dialog-router.js +17 -17
- package/src/mixins/form.js +11 -11
- package/src/mixins/generator.js +94 -94
- package/src/mixins/index.js +17 -17
- package/src/mixins/password.js +86 -86
- package/src/mixins/search-filter.js +354 -354
- package/src/mixins/view.js +156 -156
- package/src/pages/ErrorComponent.vue +74 -74
- package/src/pages/Forbidden.vue +29 -29
- package/src/pages/NotFound.vue +29 -29
- package/src/pages/ServerError.vue +29 -29
- package/src/pages/Unauthorized.vue +29 -29
- package/src/plugins/delete/Delete.js +107 -107
- package/src/plugins/delete/Delete.yml +75 -75
- package/src/plugins/dialog/Dialog.js +14 -14
- package/src/plugins/dialog/Dialog.yml +10 -10
- package/src/plugins/index.js +13 -13
- package/src/plugins/notify-error/NotifyError.js +13 -13
- package/src/plugins/notify-error/NotifyError.yml +11 -11
- package/src/plugins/notify-success/NotifySuccess.js +13 -13
- package/src/plugins/notify-success/NotifySuccess.yml +11 -11
- package/src/plugins/screen/Screen.js +35 -35
- package/src/plugins/screen/Screen.yml +16 -16
- package/src/shared/date-config.js +26 -26
- package/src/shared/fuse-config.js +4 -4
- package/src/shared/notify-config.js +7 -7
- package/src/vue-plugin/third-party-component-handler.js +29 -29
- package/src/vue-plugin.js +282 -282
package/package.json
CHANGED
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.'
|