maz-ui 3.40.4 → 3.41.0

package/components/MazAnimatedCounter.d.ts

@@ -0,0 +1,75 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The number to animate
+     */
+    count: number;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    duration: number;
+    prefix: undefined;
+    suffix: undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The number to animate
+     */
+    count: number;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    duration: number;
+    prefix: undefined;
+    suffix: undefined;
+}>>>, {
+    duration: number;
+    prefix: string;
+    suffix: string;
+}, {}>, {
+    prefix?(_: {}): any;
+    suffix?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/components/MazAnimatedCounter.mjs

@@ -0,0 +1,91 @@
+import './assets/MazAnimatedCounter.css';
+import { defineComponent as v, useCssVars as _, useSlots as h, computed as l, ref as C, watch as $, openBlock as p, createElementBlock as m, normalizeClass as A, createElementVNode as S, renderSlot as f, createTextVNode as o, toDisplayString as a, createCommentVNode as d } from "vue";
+const b = { class: "maz-sr-only" }, g = {
+  key: 0,
+  class: "m-animated-counter__fix"
+}, k = /* @__PURE__ */ v({
+  __name: "MazAnimatedCounter",
+  props: {
+    count: {},
+    duration: { default: 1e3 },
+    prefix: { default: void 0 },
+    suffix: { default: void 0 }
+  },
+  setup(n) {
+    _((e) => ({
+      "0b7109b2": x.value,
+      e965ff72: e.count
+    }));
+    const t = n, s = h(), r = l(() => !!t.prefix || !!s.prefix), u = l(() => !!t.suffix || !!s.suffix), i = C(!0);
+    $(
+      () => t.count,
+      (e, c) => {
+        e !== c && (i.value = !1, setTimeout(() => {
+          i.value = !0;
+        }, 100));
+      }
+    );
+    const x = l(() => `${t.duration}ms`);
+    return (e, c) => (p(), m(
+      "span",
+      {
+        class: A(["m-animated-counter", {
+          "--animated": i.value,
+          "--prefixed": r.value,
+          "--suffixed": u.value
+        }])
+      },
+      [
+        S("span", b, [
+          f(e.$slots, "prefix", {}, () => [
+            o(
+              a(e.prefix),
+              1
+              /* TEXT */
+            )
+          ], !0),
+          o(
+            " " + a(e.count) + " ",
+            1
+            /* TEXT */
+          ),
+          f(e.$slots, "suffix", {}, () => [
+            o(
+              a(e.suffix),
+              1
+              /* TEXT */
+            )
+          ], !0)
+        ]),
+        r.value || u.value ? (p(), m("span", g, [
+          d(' @slot Prefix slot - Add a prefix next to the number (e.g: "$") '),
+          f(e.$slots, "prefix", {}, () => [
+            o(
+              a(e.prefix),
+              1
+              /* TEXT */
+            )
+          ], !0),
+          d(' @slot Suffix slot - Add a suffix next to the number (e.g: "%") '),
+          f(e.$slots, "suffix", {}, () => [
+            o(
+              a(e.suffix),
+              1
+              /* TEXT */
+            )
+          ], !0)
+        ])) : d("v-if", !0)
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+}), y = (n, t) => {
+  const s = n.__vccOpts || n;
+  for (const [r, u] of t)
+    s[r] = u;
+  return s;
+}, V = /* @__PURE__ */ y(k, [["__scopeId", "data-v-ca68c5dd"]]);
+export {
+  V as default
+};

package/components/MazCircularProgressBar.d.ts

@@ -0,0 +1,114 @@
+import { type Color } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The percentage value of the progress bar
+     */
+    percentage: number;
+    /**
+     * The size of the progress bar
+     * @default '10em'
+     */
+    size?: string | undefined;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * The color of the progress bar
+     */
+    color?: Color | undefined;
+    /**
+     * Auto color based on the count (danger, warning, success)
+     * @default false
+     */
+    autoColor?: boolean | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    percentage: number;
+    size: string;
+    duration: number;
+    color: undefined;
+    prefix: undefined;
+    suffix: undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The percentage value of the progress bar
+     */
+    percentage: number;
+    /**
+     * The size of the progress bar
+     * @default '10em'
+     */
+    size?: string | undefined;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * The color of the progress bar
+     */
+    color?: Color | undefined;
+    /**
+     * Auto color based on the count (danger, warning, success)
+     * @default false
+     */
+    autoColor?: boolean | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    percentage: number;
+    size: string;
+    duration: number;
+    color: undefined;
+    prefix: undefined;
+    suffix: undefined;
+}>>>, {
+    size: string;
+    color: Color;
+    duration: number;
+    prefix: string;
+    suffix: string;
+    percentage: number;
+}, {}>, {
+    default?(_: {}): any;
+    prefix?(_: {}): any;
+    suffix?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/components/MazCircularProgressBar.mjs

@@ -0,0 +1,220 @@
+import './assets/MazCircularProgressBar.css';
+import { defineComponent as $, useCssVars as y, useSlots as k, computed as r, ref as w, watch as b, openBlock as p, createElementBlock as v, normalizeClass as B, createElementVNode as n, renderSlot as l, createTextVNode as u, toDisplayString as i, createCommentVNode as m, getCurrentInstance as P, normalizeStyle as A, unref as g, createBlock as M, createSlots as I, withCtx as _ } from "vue";
+const N = { class: "maz-sr-only" }, V = {
+  key: 0,
+  class: "m-animated-counter__fix"
+}, D = /* @__PURE__ */ $({
+  __name: "MazAnimatedCounter",
+  props: {
+    count: {},
+    duration: { default: 1e3 },
+    prefix: { default: void 0 },
+    suffix: { default: void 0 }
+  },
+  setup(a) {
+    y((t) => ({
+      "0b7109b2": h.value,
+      e965ff72: t.count
+    }));
+    const e = a, o = k(), f = r(() => !!e.prefix || !!o.prefix), c = r(() => !!e.suffix || !!o.suffix), d = w(!0);
+    b(
+      () => e.count,
+      (t, x) => {
+        t !== x && (d.value = !1, setTimeout(() => {
+          d.value = !0;
+        }, 100));
+      }
+    );
+    const h = r(() => `${e.duration}ms`);
+    return (t, x) => (p(), v(
+      "span",
+      {
+        class: B(["m-animated-counter", {
+          "--animated": d.value,
+          "--prefixed": f.value,
+          "--suffixed": c.value
+        }])
+      },
+      [
+        n("span", N, [
+          l(t.$slots, "prefix", {}, () => [
+            u(
+              i(t.prefix),
+              1
+              /* TEXT */
+            )
+          ], !0),
+          u(
+            " " + i(t.count) + " ",
+            1
+            /* TEXT */
+          ),
+          l(t.$slots, "suffix", {}, () => [
+            u(
+              i(t.suffix),
+              1
+              /* TEXT */
+            )
+          ], !0)
+        ]),
+        f.value || c.value ? (p(), v("span", V, [
+          m(' @slot Prefix slot - Add a prefix next to the number (e.g: "$") '),
+          l(t.$slots, "prefix", {}, () => [
+            u(
+              i(t.prefix),
+              1
+              /* TEXT */
+            )
+          ], !0),
+          m(' @slot Suffix slot - Add a suffix next to the number (e.g: "%") '),
+          l(t.$slots, "suffix", {}, () => [
+            u(
+              i(t.suffix),
+              1
+              /* TEXT */
+            )
+          ], !0)
+        ])) : m("v-if", !0)
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+}), z = (a, e) => {
+  const o = a.__vccOpts || a;
+  for (const [f, c] of e)
+    o[f] = c;
+  return o;
+}, E = /* @__PURE__ */ z(D, [["__scopeId", "data-v-ca68c5dd"]]);
+function T({
+  componentName: a,
+  providedId: e
+}) {
+  const o = P();
+  return r(() => e ?? `${a}-${o == null ? void 0 : o.uid}`);
+}
+const j = { class: "outer" }, q = { class: "inner" }, G = { key: 0 }, O = {
+  xmlns: "http://www.w3.org/2000/svg",
+  height: "1em",
+  width: "1em",
+  viewBox: "0 0 100 100"
+}, R = ["id"], U = ["stop-color"], F = ["stop-color"], H = ["stroke"], J = /* @__PURE__ */ $({
+  __name: "MazCircularProgressBar",
+  props: {
+    percentage: { default: 0 },
+    size: { default: "10em" },
+    duration: { default: 1e3 },
+    color: { default: void 0 },
+    autoColor: { type: Boolean },
+    prefix: { default: void 0 },
+    suffix: { default: void 0 }
+  },
+  setup(a) {
+    y((s) => ({
+      "2ff460f7": C.value,
+      "181ba074": S.value
+    }));
+    const e = a, o = k(), f = r(() => !!e.prefix || !!o.prefix), c = r(() => !!e.suffix || !!o.suffix), d = T({
+      componentName: "MazCircularProgressBar"
+    }), h = r(() => e.percentage > 100 ? 100 : e.percentage <= 0 ? 0.5 : e.percentage), t = r(
+      () => e.autoColor ? x(e.percentage) : e.color
+    );
+    function x(s) {
+      return s < 50 || s > 100 ? "danger" : s < 100 ? "warning" : "success";
+    }
+    const C = r(() => `${e.duration}ms`), S = r(() => Math.round(290 - 290 * (h.value / 100)));
+    return (s, K) => (p(), v(
+      "div",
+      {
+        class: "m-circular-progress-bar",
+        style: A([
+          {
+            fontSize: s.size
+          }
+        ])
+      },
+      [
+        n("div", j, [
+          n("div", q, [
+            g(o).default ? (p(), v("span", G, [
+              m(" @slot Default slot - Replace the percaentage value "),
+              l(s.$slots, "default", {}, void 0, !0)
+            ])) : (p(), M(E, {
+              key: 1,
+              count: s.percentage,
+              duration: s.duration
+            }, I({
+              _: 2
+              /* DYNAMIC */
+            }, [
+              f.value ? {
+                name: "prefix",
+                fn: _(() => [
+                  m(' @slot Prefix slot - Add a prefix next to the number (e.g: "$") '),
+                  l(s.$slots, "prefix", {}, () => [
+                    u(
+                      i(s.prefix),
+                      1
+                      /* TEXT */
+                    )
+                  ], !0)
+                ]),
+                key: "0"
+              } : void 0,
+              c.value ? {
+                name: "suffix",
+                fn: _(() => [
+                  m(' @slot Suffix slot - Add a suffix next to the number (e.g: "%") '),
+                  l(s.$slots, "suffix", {}, () => [
+                    u(
+                      i(s.suffix),
+                      1
+                      /* TEXT */
+                    )
+                  ], !0)
+                ]),
+                key: "1"
+              } : void 0
+            ]), 1032, ["count", "duration"]))
+          ])
+        ]),
+        (p(), v("svg", O, [
+          n("defs", null, [
+            n("linearGradient", {
+              id: `${g(d)}-gradient`,
+              x1: "0",
+              x2: "0",
+              y1: "1",
+              y2: "0"
+            }, [
+              n("stop", {
+                offset: "0%",
+                "stop-color": t.value ? `var(--maz-color-${t.value}-400)` : "var(--maz-color-primary)"
+              }, null, 8, U),
+              n("stop", {
+                offset: "100%",
+                "stop-color": t.value ? `var(--maz-color-${t.value}-700)` : "var(--maz-color-secondary)"
+              }, null, 8, F)
+            ], 8, R)
+          ]),
+          n("circle", {
+            cx: "50",
+            cy: "50",
+            r: "46",
+            "stroke-width": "6",
+            "stroke-dasharray": "290",
+            "stroke-dashoffset": "290",
+            stroke: `url(#${g(d)}-gradient)`,
+            fill: "none",
+            "stroke-linecap": "round"
+          }, null, 8, H)
+        ]))
+      ],
+      4
+      /* STYLE */
+    ));
+  }
+}), Q = /* @__PURE__ */ z(J, [["__scopeId", "data-v-9b86a1a5"]]);
+export {
+  Q as default
+};

package/components/assets/MazAnimatedCounter.css

@@ -0,0 +1 @@
+.m-animated-counter[data-v-ca68c5dd]{white-space:nowrap;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.m-animated-counter.--animated[data-v-ca68c5dd]{-webkit-animation:counter-ca68c5dd var(--0b7109b2) ease-out forwards;animation:counter-ca68c5dd var(--0b7109b2) ease-out forwards;counter-set:count var(--count-end)}.m-animated-counter.--prefixed[data-v-ca68c5dd]:after{content:counter(count)}.m-animated-counter.--suffixed[data-v-ca68c5dd]:before{content:counter(count)}.m-animated-counter[data-v-ca68c5dd]:not(.--prefixed,.--suffixed):before{content:counter(count)}@property --count{syntax: "<integer>"; initial-value: 0; inherits: false;}@property --count-end{syntax: "<integer>"; initial-value: 0; inherits: false;}@-webkit-keyframes counter-ca68c5dd{0%{--count-end: 0}to{--count-end: var(--e965ff72)}}@keyframes counter-ca68c5dd{0%{--count-end: 0}to{--count-end: var(--e965ff72)}}

package/components/assets/MazCircularProgressBar.css

@@ -0,0 +1 @@
+.m-animated-counter[data-v-ca68c5dd]{white-space:nowrap;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.m-animated-counter.--animated[data-v-ca68c5dd]{-webkit-animation:counter-ca68c5dd var(--0b7109b2) ease-out forwards;animation:counter-ca68c5dd var(--0b7109b2) ease-out forwards;counter-set:count var(--count-end)}.m-animated-counter.--prefixed[data-v-ca68c5dd]:after{content:counter(count)}.m-animated-counter.--suffixed[data-v-ca68c5dd]:before{content:counter(count)}.m-animated-counter[data-v-ca68c5dd]:not(.--prefixed,.--suffixed):before{content:counter(count)}@property --count{syntax: "<integer>"; initial-value: 0; inherits: false;}@property --count-end{syntax: "<integer>"; initial-value: 0; inherits: false;}@-webkit-keyframes counter-ca68c5dd{0%{--count-end: 0}to{--count-end: var(--e965ff72)}}@keyframes counter-ca68c5dd{0%{--count-end: 0}to{--count-end: var(--e965ff72)}}.m-circular-progress-bar[data-v-9b86a1a5]{position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;height:1em;width:1em;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.m-circular-progress-bar .outer[data-v-9b86a1a5]{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;width:100%;border-radius:9999px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.m-circular-progress-bar .inner[data-v-9b86a1a5]{display:-webkit-box;display:-ms-flexbox;display:flex;height:.85em;width:.85em;border-radius:9999px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.m-circular-progress-bar .inner[data-v-9b86a1a5]>*{font-size:.25em}.m-circular-progress-bar svg[data-v-9b86a1a5]{position:absolute;--tw-rotate: -90deg;-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.m-circular-progress-bar svg circle[data-v-9b86a1a5]{-webkit-animation:animate-9b86a1a5 var(--2ff460f7) linear forwards;animation:animate-9b86a1a5 var(--2ff460f7) linear forwards}@-webkit-keyframes animate-9b86a1a5{to{stroke-dashoffset:var(--181ba074)}}@keyframes animate-9b86a1a5{to{stroke-dashoffset:var(--181ba074)}}

package/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as MazAccordion } from './MazAccordion.js';
+export { default as MazAnimatedCounter } from './MazAnimatedCounter.js';
 export { default as MazAvatar } from './MazAvatar.js';
 export { default as MazBackdrop } from './MazBackdrop.js';
 export { default as MazBadge } from './MazBadge.js';
@@ -9,6 +10,7 @@ export { default as MazCardSpotlight } from './MazCardSpotlight.js';
 export { default as MazCarousel } from './MazCarousel.js';
 export { default as MazChart } from './MazChart.js';
 export { default as MazCheckbox } from './MazCheckbox.js';
+export { default as MazCircularProgressBar } from './MazCircularProgressBar.js';
 export { default as MazDialog } from './MazDialog.js';
 export { default as MazDialogPromise } from './MazDialogPromise.js';
 export { default as MazDrawer } from './MazDrawer.js';

package/components/index.mjs

@@ -1,6 +1,7 @@
 /* Automatically generated by ./build/generate-lib-entry.js */
 
 export { default as MazAccordion } from './MazAccordion.mjs'
+export { default as MazAnimatedCounter } from './MazAnimatedCounter.mjs'
 export { default as MazAvatar } from './MazAvatar.mjs'
 export { default as MazBackdrop } from './MazBackdrop.mjs'
 export { default as MazBadge } from './MazBadge.mjs'
@@ -11,6 +12,7 @@ export { default as MazCardSpotlight } from './MazCardSpotlight.mjs'
 export { default as MazCarousel } from './MazCarousel.mjs'
 export { default as MazChart } from './MazChart.mjs'
 export { default as MazCheckbox } from './MazCheckbox.mjs'
+export { default as MazCircularProgressBar } from './MazCircularProgressBar.mjs'
 export { default as MazDialog } from './MazDialog.mjs'
 export { default as MazDialogPromise } from './MazDialogPromise.mjs'
 export { default as MazDrawer } from './MazDrawer.mjs'

package/nuxt/index.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "3.40.4"
+  "version": "3.41.0"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "maz-ui",
-  "version": "3.40.4",
+  "version": "3.41.0",
   "description": "A standalone components library for Vue.Js 3 & Nuxt.Js 3",
   "author": "Louis Mazel <me@loicmazuel.com>",
   "main": "./modules/index.cjs",

package/types/components/MazAnimatedCounter.vue.d.ts

@@ -0,0 +1,75 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The number to animate
+     */
+    count: number;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    duration: number;
+    prefix: undefined;
+    suffix: undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The number to animate
+     */
+    count: number;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    duration: number;
+    prefix: undefined;
+    suffix: undefined;
+}>>>, {
+    duration: number;
+    prefix: string;
+    suffix: string;
+}, {}>, {
+    prefix?(_: {}): any;
+    suffix?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/components/MazCircularProgressBar.vue.d.ts

@@ -0,0 +1,114 @@
+import { type Color } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The percentage value of the progress bar
+     */
+    percentage: number;
+    /**
+     * The size of the progress bar
+     * @default '10em'
+     */
+    size?: string | undefined;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * The color of the progress bar
+     */
+    color?: Color | undefined;
+    /**
+     * Auto color based on the count (danger, warning, success)
+     * @default false
+     */
+    autoColor?: boolean | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    percentage: number;
+    size: string;
+    duration: number;
+    color: undefined;
+    prefix: undefined;
+    suffix: undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
+    /**
+     * The percentage value of the progress bar
+     */
+    percentage: number;
+    /**
+     * The size of the progress bar
+     * @default '10em'
+     */
+    size?: string | undefined;
+    /**
+     * Duration of the animation in milliseconds
+     * @default 1000
+     */
+    duration?: number | undefined;
+    /**
+     * The color of the progress bar
+     */
+    color?: Color | undefined;
+    /**
+     * Auto color based on the count (danger, warning, success)
+     * @default false
+     */
+    autoColor?: boolean | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix to display next to the number
+     */
+    suffix?: string | undefined;
+}>, {
+    percentage: number;
+    size: string;
+    duration: number;
+    color: undefined;
+    prefix: undefined;
+    suffix: undefined;
+}>>>, {
+    size: string;
+    color: Color;
+    duration: number;
+    prefix: string;
+    suffix: string;
+    percentage: number;
+}, {}>, {
+    default?(_: {}): any;
+    prefix?(_: {}): any;
+    suffix?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as MazAccordion } from './MazAccordion.vue';
+export { default as MazAnimatedCounter } from './MazAnimatedCounter.vue';
 export { default as MazAvatar } from './MazAvatar.vue';
 export { default as MazBackdrop } from './MazBackdrop.vue';
 export { default as MazBadge } from './MazBadge.vue';
@@ -9,6 +10,7 @@ export { default as MazCardSpotlight } from './MazCardSpotlight.vue';
 export { default as MazCarousel } from './MazCarousel.vue';
 export { default as MazChart } from './MazChart.vue';
 export { default as MazCheckbox } from './MazCheckbox.vue';
+export { default as MazCircularProgressBar } from './MazCircularProgressBar.vue';
 export { default as MazDialog } from './MazDialog.vue';
 export { default as MazDialogPromise } from './MazDialogPromise.vue';
 export { default as MazDrawer } from './MazDrawer.vue';