@quidgest/ui 0.16.59 → 0.16.61

package/dist/ui.scss

@@ -1,9 +1,10 @@
 /*!
- * Quidgest UI v0.16.59
+ * Quidgest UI v0.16.61
  * (c) 2026 Quidgest - Consultores de Gestão, S.A.
  * Released under the MIT License.
  */
 @use 'sass:math';
+@use 'sass:map';
 
 *,
 ::before,
@@ -499,6 +500,9 @@ $transition-duration: 0.2s !default;
   &__content.q-button {
     padding: calc(0.483em + 1px) calc(0.5em + 1px);
   }
+  &--removable &__content {
+    padding-right: 0;
+  }
   .q-icon {
     color: currentcolor;
   }
@@ -513,7 +517,7 @@ $transition-duration: 0.2s !default;
       border-bottom-left-radius: 0;
       border-color: transparent;
       .q-button__content {
-        padding: 1px;
+        padding: 0.08rem;
         border-radius: 9999px;
       }
       &:not(:disabled):hover {
@@ -1990,7 +1994,7 @@ $q-carousel-height-md: 300px;
 .q-col-auto {
   flex: 0 0 auto;
   width: auto;
-  max-width: none;
+  max-width: 100%;
 }
 @mixin generate-cols($infix: '') {
   @for $i from 1 through 12 {
@@ -2017,9 +2021,6 @@ $q-carousel-height-md: 300px;
 @media (min-width: $breakpoint-xxl) {
   @include generate-cols('-xxl');
 }
-.q-spacer {
-  flex: 1 1 0;
-}
 .q-group-box {
   $this: &;
   display: inline-block;
@@ -3559,3 +3560,111 @@ $q-toast-slide-distance: clamp(1rem, 3vw, 1.5rem) !default;
     max-width: 200px;
   }
 }
+
+.q-spacer {
+  flex: 1 1 0;
+}
+$q-spacers: (
+  0: 0,
+  1: $space-base * 0.25,
+  2: $space-base * 0.5,
+  3: $space-base,
+  4: $space-base * 1.5,
+  5: $space-base * 3
+) !default;
+$q-breakpoints: (
+  sm: $breakpoint-sm,
+  md: $breakpoint-md,
+  lg: $breakpoint-lg,
+  xl: $breakpoint-xl,
+  xxl: $breakpoint-xxl
+) !default;
+$q-spacing-sides: (
+  null: '',
+  
+  t: 't',
+  
+  b: 'b',
+  
+  l: 'l',
+  
+  r: 'r',
+  
+  x: 'x',
+  
+  y: 'y' 
+) !default;
+@mixin q-media-up($breakpoint) {
+  $value: map.get($q-breakpoints, $breakpoint);
+  @if $value {
+    @media (min-width: $value) {
+      @content;
+    }
+  } @else {
+    @warn "Breakpoint `#{$breakpoint}` not found in $q-breakpoints.";
+  }
+}
+@mixin q-emit-spacing($property, $side, $value) {
+  @if not $side {
+    #{$property}: $value;
+  } @else if $side == t {
+    #{$property}-top: $value;
+  } @else if $side == b {
+    #{$property}-bottom: $value;
+  } @else if $side == l {
+    #{$property}-left: $value;
+  } @else if $side == r {
+    #{$property}-right: $value;
+  } @else if $side == x {
+    #{$property}-left: $value;
+    #{$property}-right: $value;
+  } @else if $side == y {
+    #{$property}-top: $value;
+    #{$property}-bottom: $value;
+  } @else {
+    @warn "Unknown side `#{$side}` used for spacing generation.";
+  }
+}
+@mixin q-generate-responsive-spacing($property, $short) {
+  
+  @each $size, $length in $q-spacers {
+    @each $sideKey, $sideSuffix in $q-spacing-sides {
+      .q-#{$short}#{$sideSuffix}-#{$size} {
+        @include q-emit-spacing($property, $sideKey, $length);
+      }
+    }
+  }
+  
+  @each $breakpoint, $bpValue in $q-breakpoints {
+    @include q-media-up($breakpoint) {
+      @each $size, $length in $q-spacers {
+        @each $sideKey, $sideSuffix in $q-spacing-sides {
+          .q-#{$short}#{$sideSuffix}-#{$breakpoint}-#{$size} {
+            @include q-emit-spacing($property, $sideKey, $length);
+          }
+        }
+      }
+    }
+  }
+}
+@mixin q-generate-margin-auto() {
+  
+  @each $sideKey, $sideSuffix in $q-spacing-sides {
+    .q-m#{$sideSuffix}-auto {
+      @include q-emit-spacing(margin, $sideKey, auto);
+    }
+  }
+  
+  @each $breakpoint, $bpValue in $q-breakpoints {
+    @include q-media-up($breakpoint) {
+      @each $sideKey, $sideSuffix in $q-spacing-sides {
+        .q-m#{$sideSuffix}-#{$breakpoint}-auto {
+          @include q-emit-spacing(margin, $sideKey, auto);
+        }
+      }
+    }
+  }
+}
+@include q-generate-responsive-spacing(margin, m);
+@include q-generate-responsive-spacing(padding, p);
+@include q-generate-margin-auto;

package/esm/components/QBadge/QBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QBadge.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/QBadge.vue"],"names":[],"mappings":"AAyCA;AAiJC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAW1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAkG3C,iBAAS,cAAc;WAuIT,OAAO,IAA6B;;yBAXrB,GAAG;yBACF,GAAG;;;;EAehC;AAoBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;6EAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"QBadge.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/QBadge.vue"],"names":[],"mappings":"AAyCA;AAkJC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAW1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAmG3C,iBAAS,cAAc;WAuIT,OAAO,IAA6B;;yBAXrB,GAAG;yBACF,GAAG;;;;EAehC;AAoBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;6EAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QBadge/QBadge.vue.js

@@ -33,26 +33,27 @@ const G = ["id"], H = {
         e.class
       ];
     }), P = a(() => {
-      const o = f.value ? `q-badge--${e.color}` : void 0;
+      const o = b.value ? `q-badge--${e.color}` : void 0;
       return [
         "q-badge",
         `q-badge--${e.variant}`,
         {
+          "q-badge--removable": e.removable,
           "q-badge--disabled": e.disabled
         },
         o,
         v.value
       ];
-    }), { isUtilityColor: f, style: r } = w(D(e, "color")), Q = a(() => {
+    }), { isUtilityColor: b, style: r } = w(D(e, "color")), Q = a(() => {
       var o, s, C, _;
-      if (!f.value)
+      if (!b.value)
         return {
           "--q-badge-main-color": (o = r.value) == null ? void 0 : o.mainColor,
           "--q-badge-on-main-color": (s = r.value) == null ? void 0 : s.onMainColor,
           "--q-badge-hover-color": (C = r.value) == null ? void 0 : C.hoverColor,
           "--q-badge-on-hover-color": (_ = r.value) == null ? void 0 : _.onHoverColor
         };
-    }), S = a(() => m.onClick), b = a(() => ({
+    }), S = a(() => m.onClick), f = a(() => ({
       class: "q-badge__remove",
       variant: e.variant,
       color: e.color,
@@ -83,7 +84,7 @@ const G = ["id"], H = {
         }, 8, ["variant", "color", "disabled", "onClick"]),
         e.removable ? (t(), i(
           l(u),
-          B({ key: 0 }, b.value, { onClick: p }),
+          B({ key: 0 }, f.value, { onClick: p }),
           {
             default: n(() => [
               d(
@@ -116,7 +117,7 @@ const G = ["id"], H = {
         ]),
         e.removable ? (t(), i(
           l(u),
-          B({ key: 0 }, b.value, { onClick: p }),
+          B({ key: 0 }, f.value, { onClick: p }),
           {
             default: n(() => [
               d(

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@quidgest/ui",
   "description": "Quidgest's UI framework",
-  "version": "0.16.59",
+  "version": "0.16.61",
   "private": false,
   "type": "module",
   "author": "Quidgest",