@quidgest/ui 0.14.14 → 0.14.15

package/dist/ui.scss

@@ -1,5 +1,5 @@
 /*!
- * Quidgest UI v0.14.14
+ * Quidgest UI v0.14.15
  * (c) 2025 Quidgest - Consultores de Gestão, S.A.
  * Released under the MIT License.
  */
@@ -282,17 +282,20 @@ body {
   border-width: 1px;
   border-color: transparent;
   border-radius: var(--border-radius);
-  padding: 0.25em 0.5em;
-  line-height: 1rem;
+  padding: 0.4em 0.5em;
   font-size: 0.75rem;
+  line-height: 1;
   position: relative;
   color: var(--q-badge-text-color);
+  transition-property: color, background-color, border-color, box-shadow, text-decoration-color,
+    fill, stroke;
+  transition-duration: 0.15s;
   &__underlay {
     position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
+    top: -1px;
+    left: -1px;
+    width: calc(100% + 2px);
+    height: calc(100% + 2px);
     border-radius: inherit;
     background-color: var(--q-badge-color);
     opacity: 0.1;
@@ -300,34 +303,27 @@ body {
   &__content {
     display: inline-flex;
     align-items: center;
-    gap: 0.25rem;
-    min-height: 1rem;
+    gap: 0.25em;
     z-index: 1;
   }
-  &__remove.q-btn:not(:disabled) {
-    padding: 0;
-    border-radius: 9999px;
-    color: inherit;
-    &:hover {
-      background-color: var(--q-badge-color);
-    }
-  }
-  &--clickable {
-    cursor: pointer;
-    &:hover {
-      color: var(--q-badge-text-hover-color, var(--q-badge-text-color));
-      #{$this}__underlay {
-        background-color: var(--q-badge-hover-color, var(--q-badge-color));
-      }
+  &__remove {
+    .q-btn__content {
+      font-size: inherit;
     }
-    &:focus {
-      outline: $outline;
-      &:not(:focus-visible) {
-        outline: 0;
+    &.q-btn:not(:disabled) {
+      padding: 0;
+      border-radius: 9999px;
+      color: inherit;
+      &:hover {
+        background-color: var(--q-badge-color);
       }
     }
   }
   
+  &--large {
+    font-size: 0.9rem;
+  }
+  
   &--pill {
     border-radius: 9999px;
   }
@@ -355,6 +351,21 @@ body {
       }
     }
   }
+  &--clickable {
+    cursor: pointer;
+    &:hover {
+      color: var(--q-badge-text-hover-color, var(--q-badge-text-color));
+      #{$this}__underlay {
+        background-color: var(--q-badge-hover-color, var(--q-badge-color));
+      }
+    }
+    &:focus {
+      outline: $outline;
+      &:not(:focus-visible) {
+        outline: 0;
+      }
+    }
+  }
   @mixin color-variant($color) {
     &--#{$color} {
       --q-badge-color: var(--q-theme-#{$color});
@@ -384,34 +395,74 @@ body {
 }
 .q-badge-indicator {
   $this: &;
+  flex-wrap: wrap;
+  place-content: center center;
+  align-items: center;
   position: absolute;
-  padding: 0.1rem 0.5em;
-  border: 0;
+  height: 1.25rem;
+  min-width: 1.25rem;
+  padding: 0.25rem;
+  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1) 0;
   &__wrapper {
     position: relative;
     display: inline-flex;
+    vertical-align: middle;
+    flex-shrink: 0;
   }
   
   &--dot {
-    width: 1em;
-    height: 1em;
-    border-radius: 50%;
+    border-radius: 4px;
+    height: 8px;
+    min-width: 8px;
+    padding: 0;
   }
   &--top-right {
-    bottom: calc(100% - 0.5rem);
-    left: calc(100% - 0.5rem);
+    top: 0;
+    right: 0;
+    transform: scale(1) translate(50%, -50%);
+    transform-origin: 100% 0%;
   }
   &--top-left {
-    bottom: calc(100% - 0.5rem);
-    right: calc(100% - 0.5rem);
+    top: 0;
+    left: 0;
+    transform: scale(1) translate(-50%, -50%);
+    transform-origin: 0% 0%;
   }
-  &--bottom-right {
-    top: calc(100% - 0.5rem);
-    left: calc(100% - 0.5rem);
+  &--top-center {
+    top: 0;
+    left: 50%;
+    transform: scale(1) translate(-50%, -50%);
+    transform-origin: 50% 0%;
+  }
+  &--middle-left {
+    top: 50%;
+    left: 0;
+    transform: scale(1) translate(-50%, -50%);
+    transform-origin: 0% 50%;
+  }
+  &--middle-right {
+    top: 50%;
+    right: 0;
+    transform: scale(1) translate(50%, -50%);
+    transform-origin: 100% 50%;
   }
   &--bottom-left {
-    top: calc(100% - 0.5rem);
-    right: calc(100% - 0.5rem);
+    bottom: 0;
+    left: 0;
+    transform: scale(1) translate(-50%, 50%);
+    transform-origin: 0% 100%;
+  }
+  &--bottom-center {
+    bottom: 0;
+    left: 50%;
+    transform: scale(1) translate(-50%, 50%);
+    transform-origin: 50% 100%;
+  }
+  &--bottom-right {
+    bottom: 0;
+    right: 0;
+    transform: scale(1) translate(50%, 50%);
+    transform-origin: 100% 100%;
   }
 }
 $button-primary: var(--q-theme-primary);
@@ -433,7 +484,7 @@ $button-text-on-plain: var(--q-theme-on-background);
   display: flex;
   flex-direction: row;
   align-items: center;
-  padding: 0.4rem;
+  padding: 0.4em;
   border-width: 1px;
   background-color: transparent;
   user-select: none;
@@ -442,7 +493,6 @@ $button-text-on-plain: var(--q-theme-on-background);
   border-radius: var(--border-radius);
   transition-property: color, background-color, border-color, box-shadow, text-decoration-color,
     fill, stroke;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 0.15s;
   &:disabled {
     opacity: 0.6;
@@ -465,15 +515,9 @@ $button-text-on-plain: var(--q-theme-on-background);
     justify-content: center;
     font-size: $font-size-base;
     white-space: nowrap;
-    gap: 0.25rem;
+    gap: 0.25em;
     pointer-events: none;
-    @if $compact {
-      line-height: 15px;
-      min-width: 15px;
-    } @else {
-      line-height: 16px;
-      min-width: 16px;
-    }
+    line-height: 1;
   }
   .q-spinner-loader {
     color: currentcolor;
@@ -544,11 +588,9 @@ $button-text-on-plain: var(--q-theme-on-background);
   }
   
   &--small {
-    padding: 0.25rem;
-    line-height: 14px;
+    padding: 0.25em;
     span {
       font-size: 0.75rem;
-      line-height: 14px;
     }
   }
   
@@ -1647,7 +1689,7 @@ $base-border: 1px solid rgb(0 0 0 / 10%);
   display: flex;
   flex-direction: column;
   border: $base-border;
-  &-panel__container {
+  &-panel {
     padding: 0.4rem;
     display: flex;
     flex-direction: column;
@@ -1656,7 +1698,7 @@ $base-border: 1px solid rgb(0 0 0 / 10%);
   }
   &--side-panel {
     flex-direction: row;
-    .q-property-list-panel__container {
+    .q-property-list-panel {
       border-left: $base-border;
       width: 20%;
     }

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

@@ -1 +1 @@
-{"version":3,"file":"QAccordion.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/QAccordion.vue"],"names":[],"mappings":"AAKA;AAoCC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAK9C,KAAK,WAAW,GAAG,eAAe,CAAC;AAgBpC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WAwBT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AASD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;6FAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"QAccordion.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/QAccordion.vue"],"names":[],"mappings":"AAOA;AA+CC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAK9C,KAAK,WAAW,GAAG,eAAe,CAAC;AAyBpC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WAyBT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AASD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;6FAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QAccordion/QAccordion.vue.js

@@ -1,27 +1,40 @@
-import { defineComponent as r, mergeModels as a, toRef as l, useModel as s, createElementBlock as n, openBlock as d, renderSlot as i } from "vue";
-import { provideDefaults as m } from "../../composables/defaults.js";
-import { useGroup as c } from "../../composables/group.js";
-const p = { class: "q-accordion" }, V = /* @__PURE__ */ r({
+import { defineComponent as l, mergeModels as c, toRef as t, useModel as n, watch as r, createElementBlock as d, openBlock as m, normalizeClass as p, renderSlot as u } from "vue";
+import { provideDefaults as f } from "../../composables/defaults.js";
+import { useGroup as v } from "../../composables/group.js";
+const g = ["id"], B = /* @__PURE__ */ l({
   __name: "QAccordion",
-  props: /* @__PURE__ */ a({
+  props: /* @__PURE__ */ c({
+    id: {},
+    class: {},
+    iconRight: { type: Boolean },
+    spacing: {},
     variant: {}
   }, {
     modelValue: {},
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(e) {
-    m({
+  setup(i) {
+    const e = i;
+    f({
       QCollapsible: {
-        variant: l(e, "variant")
+        iconRight: t(e, "iconRight"),
+        spacing: t(e, "spacing"),
+        variant: t(e, "variant"),
+        width: "block"
       }
     });
-    const o = s(e, "modelValue");
-    return c({ active: o }), (t, f) => (d(), n("div", p, [
-      i(t.$slots, "default")
-    ]));
+    const a = n(i, "modelValue"), { active: s } = v({ active: a });
+    return r(s, (o) => {
+      a.value = o;
+    }), (o, h) => (m(), d("div", {
+      id: e.id,
+      class: p(["q-accordion", e.class])
+    }, [
+      u(o.$slots, "default")
+    ], 10, g));
   }
 });
 export {
-  V as default
+  B as default
 };

package/esm/components/QAccordion/index.d.ts

@@ -1,7 +1,11 @@
 declare const QAccordion: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
         modelValue?: string;
-    } & import('./types').QAccordionProps> & Readonly<{
+    } & import('../../types/component').QBaseComponentProps & {
+        iconRight?: boolean;
+        spacing?: import('../QCollapsible/types').QCollapsibleSpacing;
+        variant?: import('../QCollapsible/types').QCollapsibleVariant;
+    }> & Readonly<{
         "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
         "update:modelValue": (value: string) => any;
@@ -14,7 +18,11 @@ declare const QAccordion: {
         Defaults: {};
     }, Readonly<{
         modelValue?: string;
-    } & import('./types').QAccordionProps> & Readonly<{
+    } & import('../../types/component').QBaseComponentProps & {
+        iconRight?: boolean;
+        spacing?: import('../QCollapsible/types').QCollapsibleSpacing;
+        variant?: import('../QCollapsible/types').QCollapsibleVariant;
+    }> & Readonly<{
         "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     }>, {}, {}, {}, {}, {}>;
     __isFragment?: never;
@@ -22,7 +30,11 @@ declare const QAccordion: {
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<{
     modelValue?: string;
-} & import('./types').QAccordionProps> & Readonly<{
+} & import('../../types/component').QBaseComponentProps & {
+    iconRight?: boolean;
+    spacing?: import('../QCollapsible/types').QCollapsibleSpacing;
+    variant?: import('../QCollapsible/types').QCollapsibleVariant;
+}> & Readonly<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: string) => any;

package/esm/components/QAccordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+B,CAAA;AAG/C,OAAO,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA+B,CAAA;AAG/C,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/esm/components/QAccordion/types.d.ts

@@ -1,7 +1,17 @@
-export type QAccordionProps = {
+import { QCollapsibleSpacing, QCollapsibleVariant } from '../QCollapsible/types';
+import { QBaseComponentProps } from '../../types/component';
+export type QAccordionProps = QBaseComponentProps & {
     /**
-     * The variant of the collapsibles.
+     * If true, positions the expand/collapse icon on the right.
      */
-    variant?: 'default' | 'border-bottom';
+    iconRight?: boolean;
+    /**
+     * Defines the spacing around the title of each collapsible panel.
+     */
+    spacing?: QCollapsibleSpacing;
+    /**
+     * Specifies the visual style of the collapsible sections.
+     */
+    variant?: QCollapsibleVariant;
 };
 //# sourceMappingURL=types.d.ts.map

package/esm/components/QAccordion/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,eAAe,GAAG;IAC7B;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,eAAe,CAAA;CACrC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QAccordion/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAA;AAC/F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAE5D,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAA;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAA;CAC7B,CAAA"}

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

@@ -13,7 +13,8 @@ declare const __VLS_component: import('vue').DefineComponent<QBadgeProps, {}, {}
 }, string, import('vue').PublicProps, Readonly<QBadgeProps> & Readonly<{
     "onClick:remove"?: (() => any) | undefined;
 }>, {
-    variant: "tonal" | "bold" | "outlined";
+    size: import('./types').QBadgeSize;
+    variant: import('./types').QBadgeVariant;
     color: string;
     icons: typeof DEFAULT_ICONS;
     texts: typeof DEFAULT_TEXTS;

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":"AAsBA;AAiHC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1C,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAoFvD,iBAAS,cAAc;WAqET,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;yFASnB,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":"AAuBA;AA2HC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAK1C,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AA4FvD,iBAAS,cAAc;WAsET,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;yFASnB,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

@@ -1,39 +1,44 @@
-import { defineComponent as q, useAttrs as h, computed as r, createElementBlock as B, openBlock as d, withKeys as T, normalizeStyle as w, normalizeClass as E, withModifiers as N, createElementVNode as u, renderSlot as S, createBlock as z, createCommentVNode as A, unref as m, withCtx as H, createVNode as I, normalizeProps as K, guardReactiveProps as P } from "vue";
-import { QButton as Q } from "../QButton/index.js";
-import { QIcon as U } from "../QIcon/index.js";
-import { DEFAULT_TEXTS as V, DEFAULT_ICONS as $ } from "./types.js";
-import { parseColor as D, rgbToHsl as F, colorToHex as L, darken as R, getContrastingColor as M } from "../../utils/color.js";
-const O = ["role", "tabindex", "onKeydown"], X = { class: "q-badge__content" }, Z = /* @__PURE__ */ q({
+import { defineComponent as y, useAttrs as h, computed as n, createElementBlock as z, openBlock as c, withKeys as B, normalizeStyle as T, normalizeClass as w, withModifiers as E, createElementVNode as u, renderSlot as N, createBlock as S, createCommentVNode as $, unref as m, withCtx as A, createVNode as H, normalizeProps as I, guardReactiveProps as K } from "vue";
+import { QButton as P } from "../QButton/index.js";
+import { QIcon as Q } from "../QIcon/index.js";
+import { parseColor as U, rgbToHsl as V, colorToHex as D, darken as F, getContrastingColor as L } from "../../utils/color.js";
+import { DEFAULT_TEXTS as R, DEFAULT_ICONS as M } from "./types.js";
+const O = ["id", "role", "tabindex", "onKeydown"], X = { class: "q-badge__content" }, Z = /* @__PURE__ */ y({
   __name: "QBadge",
   props: {
+    id: {},
+    class: {},
     color: { default: "primary" },
     variant: { default: "tonal" },
     removable: { type: Boolean },
     pill: { type: Boolean },
-    icons: { default: () => $ },
-    texts: { default: () => V }
+    size: { default: "default" },
+    icons: { default: () => M },
+    texts: { default: () => R }
   },
   emits: ["click:remove"],
   setup(f, { emit: p }) {
-    const e = f, v = p, b = h(), l = r(() => !!b.onClick), n = r(
+    const e = f, v = p, b = h(), l = n(() => !!b.onClick), r = n(
       () => ["primary", "info", "success", "warning", "danger", "highlight"].includes(e.color)
-    ), g = r(() => {
-      const o = n.value ? `q-badge--${e.color}` : void 0;
+    ), g = n(() => {
+      const o = r.value ? `q-badge--${e.color}` : void 0, t = e.size !== "default" ? `q-badge--${e.size}` : void 0;
       return [
         "q-badge",
         `q-badge--${e.variant}`,
         o,
+        t,
         {
           "q-badge--pill": e.pill,
           "q-badge--clickable": l.value
-        }
+        },
+        e.class
       ];
-    }), C = r(() => {
+    }), C = n(() => {
       let o, t, a, i;
-      if (!n.value) {
+      if (!r.value) {
         o = e.color;
-        const s = D(o), x = F(s), c = M(x.l), y = L(R(s, 25));
-        e.variant === "tonal" || e.variant === "outlined" ? (t = o, l.value && (i = c)) : (t = c, l.value && (a = y));
+        const s = U(o), q = V(s), d = L(q.l), x = D(F(s, 25));
+        e.variant === "tonal" || e.variant === "outlined" ? (t = o, l.value && (i = d)) : (t = d, l.value && (a = x));
       }
       return {
         "--q-badge-color": o,
@@ -48,12 +53,13 @@ const O = ["role", "tabindex", "onKeydown"], X = { class: "q-badge__content" },
     function k(o) {
       o.stopImmediatePropagation();
     }
-    return (o, t) => (d(), B("span", {
-      class: E(g.value),
+    return (o, t) => (c(), z("span", {
+      id: e.id,
+      class: w(g.value),
       role: l.value ? "button" : "presentation",
-      style: w(C.value),
+      style: T(C.value),
       tabindex: l.value ? 0 : void 0,
-      onKeydown: T(N(k, ["stop", "prevent"]), ["enter"])
+      onKeydown: B(E(k, ["stop", "prevent"]), ["enter"])
     }, [
       t[0] || (t[0] = u(
         "div",
@@ -63,8 +69,8 @@ const O = ["role", "tabindex", "onKeydown"], X = { class: "q-badge__content" },
         /* HOISTED */
       )),
       u("div", X, [
-        S(o.$slots, "default"),
-        e.removable ? (d(), z(m(Q), {
+        N(o.$slots, "default"),
+        e.removable ? (c(), S(m(P), {
           key: 0,
           class: "q-badge__remove",
           borderless: "",
@@ -72,10 +78,10 @@ const O = ["role", "tabindex", "onKeydown"], X = { class: "q-badge__content" },
           onClick: _,
           "aria-label": e.texts.removeText
         }, {
-          default: H(() => [
-            I(
-              m(U),
-              K(P(e.icons.remove)),
+          default: A(() => [
+            H(
+              m(Q),
+              I(K(e.icons.remove)),
               null,
               16
               /* FULL_PROPS */
@@ -83,7 +89,7 @@ const O = ["role", "tabindex", "onKeydown"], X = { class: "q-badge__content" },
           ]),
           _: 1
           /* STABLE */
-        }, 8, ["aria-label"])) : A("v-if", !0)
+        }, 8, ["aria-label"])) : $("v-if", !0)
       ])
     ], 46, O));
   }

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

@@ -4,7 +4,8 @@ declare const QBadge: {
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
         "click:remove": () => any;
     }, import('vue').PublicProps, {
-        variant: "tonal" | "bold" | "outlined";
+        size: import('./types').QBadgeSize;
+        variant: import('./types').QBadgeVariant;
         color: string;
         icons: typeof import('./types').DEFAULT_ICONS;
         texts: typeof import('./types').DEFAULT_TEXTS;
@@ -18,7 +19,8 @@ declare const QBadge: {
     }, Readonly<import('./types').QBadgeProps> & Readonly<{
         "onClick:remove"?: (() => any) | undefined;
     }>, {}, {}, {}, {}, {
-        variant: "tonal" | "bold" | "outlined";
+        size: import('./types').QBadgeSize;
+        variant: import('./types').QBadgeVariant;
         color: string;
         icons: typeof import('./types').DEFAULT_ICONS;
         texts: typeof import('./types').DEFAULT_TEXTS;
@@ -31,7 +33,8 @@ declare const QBadge: {
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     "click:remove": () => any;
 }, string, {
-    variant: "tonal" | "bold" | "outlined";
+    size: import('./types').QBadgeSize;
+    variant: import('./types').QBadgeVariant;
     color: string;
     icons: typeof import('./types').DEFAULT_ICONS;
     texts: typeof import('./types').DEFAULT_TEXTS;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA2B,CAAA;AAGvC,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA2B,CAAA;AAGvC,OAAO,EAAE,MAAM,EAAE,CAAA"}

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

@@ -1,21 +1,29 @@
-export type QBadgeProps = {
+import { QBaseComponentProps } from '../../types/component';
+export type QBadgeVariant = 'tonal' | 'bold' | 'outlined';
+export type QBadgeSize = 'default' | 'large';
+export type QBadgeProps = QBaseComponentProps & {
     /**
      * The color of the badge.
-     * Can be chosen from utility colors like 'success' or 'danger', or specified using CSS color codes.
+     * Can be chosen from utility colors like 'success' or 'danger',
+     * or specified using CSS color codes.
      */
     color?: string;
     /**
-     * The visual style variant of the badge.
+     * Specifies the visual style of the badge.
      */
-    variant?: 'tonal' | 'bold' | 'outlined';
+    variant?: QBadgeVariant;
     /**
-     * Indicates if the badge can be removed.
+     * Whether the badge can be removed.
      */
     removable?: boolean;
     /**
      * Whether to convey a pill shape to the badge.
      */
     pill?: boolean;
+    /**
+     * The size of the badge.
+     */
+    size?: QBadgeSize;
     /**
      * Custom icon configurations.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/types.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,WAAW,GAAG;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,CAAA;IAEvC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;CAC5B,CAAA;AAGD,eAAO,MAAM,aAAa;;;;CAIM,CAAA;AAEhC,eAAO,MAAM,aAAa;;CAEQ,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QBadge/types.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAE5D,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,CAAA;AAEzD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,CAAA;AAE5C,MAAM,MAAM,WAAW,GAAG,mBAAmB,GAAG;IAC/C;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IAEd;;OAEG;IACH,IAAI,CAAC,EAAE,UAAU,CAAA;IAEjB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;CAC5B,CAAA;AAGD,eAAO,MAAM,aAAa;;;;CAIM,CAAA;AAEhC,eAAO,MAAM,aAAa;;CAEQ,CAAA"}

package/esm/components/QBadgeIndicator/QBadgeIndicator.d.ts

@@ -10,7 +10,7 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<QBadgeIndicatorProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<QBadgeIndicatorProps> & Readonly<{}>, {
-    position: import('./types').QBadgeIndicatorPosition;
+    placement: import('./types').QBadgeIndicatorPlacement;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"file":"QBadgeIndicator.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QBadgeIndicator/QBadgeIndicator.vue"],"names":[],"mappings":"AAcA;AAgDC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AA4BpD,iBAAS,cAAc;WA8CT,OAAO,IAA6B;;yBAXrB,GAAG;yBACH,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;wFAQnB,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":"QBadgeIndicator.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QBadgeIndicator/QBadgeIndicator.vue"],"names":[],"mappings":"AAgBA;AAmDC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AA6BpD,iBAAS,cAAc;WA+CT,OAAO,IAA6B;;yBAXrB,GAAG;yBACH,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;wFAQnB,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"}