@bildvitta/quasar-ui-asteroid 3.17.0-beta.17 → 3.17.0-beta.18

package/package.json

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

package/src/components/card/QasCard.vue

@@ -2,14 +2,14 @@
   <div class="qas-card">
     <qas-box class="rounded-borders-right" v-bind="boxProps">
       <q-card class="column full-height overflow-hidden shadow-0">
-        <div class="items-center justify-between row">
-          <component :is="titleComponent" class="text-h5 text-no-decoration" :class="titleClasses" :to="route">
+        <div class="full-width items-center justify-between no-wrap row">
+          <component :is="titleComponent" class="ellipsis text-h5 text-no-decoration" :class="titleClasses" :to="route">
             <slot name="title">
               {{ props.title }}
             </slot>
           </component>
 
-          <qas-actions-menu v-if="hasActions" :list="props.actionsMenuProps" :use-label="false" />
+          <qas-actions-menu v-if="hasActions" v-bind="formattedActionsMenuProps" />
         </div>
 
         <div class="q-my-sm qas-card__content">
@@ -66,8 +66,10 @@ const props = defineProps({
   }
 })
 
+// consts
 const isInsideBox = inject('isBox', false)
 
+// computeds
 const boxProps = computed(() => {
   return {
     outlined: isInsideBox,
@@ -106,6 +108,13 @@ const slots = useSlots()
 const hasFooterSlot = computed(() => !!slots.footer)
 
 const hasFooter = computed(() => hasFooterSlot.value || hasExpansion.value)
+
+const formattedActionsMenuProps = computed(() => {
+  return {
+    ...props.actionsMenuProps,
+    useLabel: false
+  }
+})
 </script>
 
 <style lang="scss">

package/src/components/expansion-item/QasExpansionItem.vue

@@ -1,7 +1,7 @@
 <template>
   <div ref="expansionItem" class="full-width qas-expansion-item" :class="classes" v-bind="expansionProps.parent">
     <component :is="component.is" class="qas-expansion-item__box" v-bind="boxProps">
-      <q-expansion-item v-model="modelValue" v-bind="expansionProps.item" header-class="text-bold q-mt-sm q-pa-none qas-expansion-item__header">
+      <q-expansion-item v-model="modelValue" v-bind="expansionProps.item" header-class="text-bold q-mt-sm q-pa-none qas-expansion-item__header" @show="setShowContent">
         <template #header>
           <div class="full-width justify-between no-wrap row">
             <div class="full-width">
@@ -31,7 +31,7 @@
         <q-separator v-if="hasHeaderSeparator" class="q-my-md" />
 
         <div :class="contentClasses">
-          <slot name="content">
+          <slot v-if="showContent" name="content">
             <qas-grid-generator v-if="hasGridGenerator" use-inline v-bind="gridGeneratorProps" />
           </slot>
         </div>
@@ -117,6 +117,7 @@ const slots = defineSlots()
 // refs
 const expansionItem = ref(null)
 const hasNextSibling = ref(false)
+const showContent = ref(false)
 
 onMounted(setHasNextSibling)
 
@@ -216,7 +217,7 @@ const isDisabled = computed(() => props.disable || props.disableButton)
  * Caso o componente esteja dentro de um QasExpansionItem, verifica se existe um próximo irmão
  * para adicionar um separador.
  */
-function setHasNextSibling (value) {
+function setHasNextSibling () {
   if (!isNestedExpansionItem) return
 
   const hasTextContentSibling = !!expansionItem.value.nextSibling?.textContent?.trim?.()
@@ -224,6 +225,10 @@ function setHasNextSibling (value) {
 
   hasNextSibling.value = hasElementSibling || hasTextContentSibling
 }
+
+function setShowContent () {
+  showContent.value = true
+}
 </script>
 
 <style lang="scss">
@@ -244,7 +249,7 @@ function setHasNextSibling (value) {
 
   &--error {
     #{$root}__box {
-      border: 2px solid $negative;
+      border: 2px solid $negative !important;
     }
 
     #{$root}__error-message {