@bildvitta/quasar-ui-asteroid 3.16.0-beta.1 → 3.16.0-beta.3

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bildvitta/quasar-ui-asteroid",
   "description": "Asteroid",
-  "version": "3.16.0-beta.1",
+  "version": "3.16.0-beta.3",
   "author": "Bild & Vitta <systemteam@bild.com.br>",
   "license": "MIT",
   "main": "dist/asteroid.cjs.min.js",

package/src/components/actions-menu/QasActionsMenu.vue

@@ -3,7 +3,7 @@
     <qas-btn-dropdown v-bind="btnDropdownProps">
       <q-list data-cy="actions-menu-list">
         <slot v-for="(item, key) in formattedList.dropdownList" :item="item" :name="key">
-          <q-item v-bind="getItemProps(item)" :key="key" clickable data-cy="actions-menu-list-item" @click="setClickHandler(item)">
+          <q-item v-bind="getItemProps(item)" :key="key" active-class="primary" clickable data-cy="actions-menu-list-item" @click="setClickHandler(item)">
             <q-item-section avatar>
               <q-icon :name="item.icon" />
             </q-item-section>
@@ -240,10 +240,11 @@ const { showTooltip, tooltipLabels } = useTooltips({ formattedList, fullList, pr
 
 // functions
 function getItemProps (item) {
-  const { disable, props: itemProps } = item
+  const { disable, props: itemProps, to } = item
 
   return {
     disable,
+    to,
     ...itemProps
   }
 }

package/src/components/app-menu/private/PvAppMenuHelpChat.vue

@@ -106,10 +106,12 @@ onUnmounted(() => {
  * Define o estilo do iframe de acordo com a posição do "chatContent" dentro
  * do QMenu.
  */
-function setIframeStyle () {
+async function setIframeStyle () {
+  await nextTick()
+
   const iframe = getIframe()
 
-  if (!iframe) return
+  if (!iframe || !chatContent.value) return
 
   const { bottom, left, top } = chatContent.value.getBoundingClientRect()
 

package/src/components/header-actions/QasHeaderActions.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="justify-between no-wrap q-col-gutter-x-md q-mb-xl row text-body1 text-grey-8" :class="containerClass">
+  <div class="justify-between no-wrap q-col-gutter-x-md row text-body1 text-grey-8" :class="containerClass">
     <div :class="leftClass">
       <slot name="left">
         {{ props.text }}
@@ -18,6 +18,8 @@
 
 <script setup>
 import { FlexAlign } from '../../enums/Align'
+import { Spacing } from '../../enums/Spacing'
+import { gutterValidator } from '../../helpers/private/gutter-validator'
 
 import { computed, useSlots } from 'vue'
 
@@ -43,13 +45,20 @@ const props = defineProps({
   text: {
     type: String,
     default: ''
+  },
+
+  spacing: {
+    default: Spacing.Xl,
+    type: String,
+    validator: gutterValidator
   }
 })
 
 const slots = useSlots()
 
 // computed
-const containerClass = computed(() => `items-${props.alignColumns}`)
+const containerClass = computed(() => `items-${props.alignColumns} q-mb-${props.spacing}`)
+
 const leftClass = computed(() => hasRightSide.value ? 'col-9 col-md-9 col-sm-8' : 'col-12')
 
 const hasDefaultButton = computed(() => !!Object.keys(props.buttonProps).length)

package/src/components/header-actions/QasHeaderActions.yml

@@ -24,6 +24,12 @@ props:
     desc: Descrição da seção a esquerda.
     type: String
 
+  spacing:
+    desc: Espaçamento entre o componente e o conteúdo abaixo.
+    default: xl
+    type: String
+    examples: [none, xs, sm, md, lg, xl, '2xl', '3xl', '4xl', '5xl']
+
 slots:
   left:
     desc: slot para acessar seção da esquerda (descrição).